@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');

:root {
  
  
  
  
  --color-bg-dark-primary: #111827;
  --color-bg-dark-secondary: #1f2937;
  --color-bg-dark-tertiary: #374151;
  --color-bg-light-primary: #ffffff;
  --color-bg-light-secondary: #f8fafc;
  --color-bg-light-tertiary: #f1f5f9;
  --color-bg-card-dark: rgba(6, 182, 212, 0.08);
  --color-bg-card-light: rgba(17, 24, 39, 0.04);
  
  
  --color-text-dark-primary: #ffffff;
  --color-text-dark-secondary: #9ca3af;
  --color-text-dark-muted: #6b7280;
  --color-text-light-primary: #111827;
  --color-text-light-secondary: #4b5563;
  --color-text-light-muted: #9ca3af;
  
  
  --color-primary: #06b6d4;
  --color-primary-hover: #22d3ee;
  --color-primary-dark: #0891b2;
  --color-secondary: #3b82f6;
  --color-secondary-hover: #60a5fa;
  
  
  --font-primary: 'Inter', sans-serif;
  --font-heading: 'Playfair Display', serif;
  
  
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  
  
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  
  
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.15);
  --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.2);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-primary);
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

h1 {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h2 {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  letter-spacing: -0.01em;
}

h3 {
  font-size: clamp(1.25rem, 3vw + 0.5rem, 2rem);
  line-height: 1.25;
}

h4 {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.5rem);
  line-height: 1.3;
}

p {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

a {
  text-decoration: none;
  transition: all 0.3s ease;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section"] {
  width: 100%;
  overflow: hidden;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: var(--radius-lg);
  transition: all 0.3s ease;
  border: 2px solid transparent;
  cursor: pointer;
}

.btn-primary {
  background: var(--color-primary);
  color: #000000;
}

.btn-primary:hover {
  background: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary {
  background: var(--color-secondary);
  color: #ffffff;
}

.btn-secondary:hover {
  background: var(--color-secondary-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(59, 130, 246, 0.3);
}

.btn-outline-dark {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: transparent;
}

.btn-outline-dark:hover {
  background: rgba(6, 182, 212, 0.1);
  transform: translateY(-2px);
}

.btn-outline-light {
  border-color: #ffffff;
  color: #ffffff;
  background: transparent;
}

.btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.hero-section {
  background: linear-gradient(135deg, var(--color-bg-dark-primary) 0%, var(--color-bg-dark-secondary) 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: var(--space-lg);
}

.hero-section h1 {
  color: var(--color-text-dark-primary);
  background: linear-gradient(135deg, #ffffff 0%, var(--color-primary-hover) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-section p {
  color: var(--color-text-dark-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.hero-buttons {
  display: flex;
  flex-direction: row;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

.features-section {
  background: var(--color-bg-light-primary);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.features-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
}

.features-header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.features-section h2 {
  color: var(--color-text-light-primary);
  margin-bottom: var(--space-md);
}

.features-section .section-subtitle {
  color: var(--color-text-light-secondary);
  font-size: clamp(1rem, 2vw, 1.125rem);
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--space-2xl);
}

.feature-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: var(--color-bg-light-secondary);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: var(--color-primary);
}

.feature-icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: var(--radius-lg);
  font-size: 1.5rem;
  color: var(--color-primary);
}

.feature-card h3 {
  color: var(--color-text-light-primary);
}

.feature-card p {
  color: var(--color-text-light-secondary);
  margin: 0;
}

.benefits-section {
  background: var(--color-bg-dark-primary);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.benefits-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.benefits-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
}

.benefits-intro {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.benefits-section h2 {
  color: var(--color-text-dark-primary);
  margin-bottom: var(--space-md);
}

.benefits-section .section-subtitle {
  color: var(--color-text-dark-secondary);
  font-size: clamp(1rem, 2vw, 1.125rem);
}

.benefits-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-xl);
}

.benefit-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: var(--color-bg-card-dark);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.benefit-item:hover {
  border-color: var(--color-primary);
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
}

.benefit-number {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-item h3 {
  color: var(--color-text-dark-primary);
}

.benefit-item p {
  color: var(--color-text-dark-secondary);
  margin: 0;
}

.learning-section {
  background: var(--color-bg-light-secondary);
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.learning-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
}

.learning-header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.learning-section h2 {
  color: var(--color-text-light-primary);
  margin-bottom: var(--space-md);
}

.learning-section .section-subtitle {
  color: var(--color-text-light-secondary);
}

.paths-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: var(--space-2xl);
}

.path-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-xl);
  background: var(--color-bg-light-primary);
  border-radius: var(--radius-xl);
  border: 2px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.path-card:hover {
  border-color: var(--color-primary);
  box-shadow: 0 16px 32px rgba(6, 182, 212, 0.2);
  transform: translateY(-6px);
}

.path-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  width: fit-content;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: var(--color-primary);
  border-radius: var(--radius-md);
  font-size: 0.875rem;
  font-weight: 600;
}

.path-card h3 {
  color: var(--color-text-light-primary);
}

.path-description {
  color: var(--color-text-light-secondary);
  margin: 0;
}

.path-modules {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding-top: var(--space-md);
  border-top: 1px solid rgba(6, 182, 212, 0.1);
}

.module-item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  color: var(--color-text-light-secondary);
  font-size: 0.9375rem;
}

.module-item i {
  color: var(--color-primary);
  font-size: 1rem;
}

.path-cta {
  margin-top: var(--space-md);
}

.insights-section {
  background: var(--color-bg-dark-secondary);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.insights-section::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.insights-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 1;
}

.insights-header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.insights-section h2 {
  color: var(--color-text-dark-primary);
  margin-bottom: var(--space-md);
}

.insights-section .section-subtitle {
  color: var(--color-text-dark-secondary);
}

.insights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--space-2xl);
}

.insight-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: var(--radius-xl);
  transition: all 0.3s ease;
}

.insight-card:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: var(--color-primary);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.insight-icon {
  font-size: 2rem;
  color: var(--color-primary);
}

.insight-card h3 {
  color: var(--color-text-dark-primary);
}

.insight-card p {
  color: var(--color-text-dark-secondary);
  margin: 0;
}

.insight-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: var(--space-sm);
}

.insight-link i {
  transition: transform 0.3s ease;
}

.insight-card:hover .insight-link i {
  transform: translateX(4px);
}

.stats-section {
  background: var(--color-bg-light-primary);
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.stats-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
}

.stats-header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.stats-section h2 {
  color: var(--color-text-light-primary);
  margin-bottom: var(--space-md);
}

.stats-section .section-subtitle {
  color: var(--color-text-light-secondary);
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--space-2xl);
}

.stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-xl);
  text-align: center;
  background: var(--color-bg-light-secondary);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.stat-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
}

.stat-number {
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label {
  color: var(--color-text-light-primary);
  font-size: 1rem;
  font-weight: 600;
}

.stat-description {
  color: var(--color-text-light-secondary);
  font-size: 0.9375rem;
  margin: 0;
}

.cta-section {
  background: linear-gradient(135deg, var(--color-bg-dark-primary) 0%, var(--color-bg-dark-secondary) 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
}

.cta-section::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.cta-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-xl);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-section h2 {
  color: var(--color-text-dark-primary);
}

.cta-section p {
  color: var(--color-text-dark-secondary);
  margin: 0;
}

.cta-buttons {
  display: flex;
  flex-direction: row;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

.footer-section {
  background: var(--color-bg-dark-primary);
  padding: clamp(3rem, 6vw, 5rem) 0 var(--space-2xl);
  border-top: 1px solid rgba(6, 182, 212, 0.15);
}

.footer-content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--space-2xl);
  margin-bottom: var(--space-2xl);
}

.footer-section h4 {
  color: var(--color-text-dark-primary);
  margin-bottom: var(--space-md);
}

.footer-links {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.footer-link {
  color: var(--color-text-dark-secondary);
  font-size: 0.9375rem;
  transition: color 0.3s ease;
}

.footer-link:hover {
  color: var(--color-primary);
}

.footer-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  padding-top: var(--space-xl);
  border-top: 1px solid rgba(6, 182, 212, 0.1);
  text-align: center;
}

.footer-copyright {
  color: var(--color-text-dark-secondary);
  font-size: 0.875rem;
}

.footer-social {
  display: flex;
  gap: var(--space-md);
  justify-content: center;
}

.footer-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: rgba(6, 182, 212, 0.1);
  border-radius: var(--radius-md);
  color: var(--color-primary);
  transition: all 0.3s ease;
}

.footer-social-link:hover {
  background: var(--color-primary);
  color: var(--color-bg-dark-primary);
  transform: translateY(-3px);
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.form-label {
  font-weight: 600;
  font-size: 0.9375rem;
}

.form-input,
.form-textarea,
.form-select {
  padding: var(--space-md);
  border: 2px solid transparent;
  border-radius: var(--radius-lg);
  font-family: var(--font-primary);
  font-size: 1rem;
  transition: all 0.3s ease;
}

.form-input:focus,
.form-textarea:focus,
.form-select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.1);
}

.form-textarea {
  resize: vertical;
  min-height: 120px;
}

.form-submit-btn {
  padding: var(--space-md) var(--space-lg);
  font-weight: 600;
  border: none;
  border-radius: var(--radius-lg);
  font-family: var(--font-primary);
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

@media (max-width: 768px) {
  .hero-buttons,
  .cta-buttons {
    flex-direction: column;
    width: 100%;
  }

  .hero-buttons .btn,
  .cta-buttons .btn {
    width: 100%;
  }

  .features-grid,
  .paths-grid,
  .insights-grid,
  .stats-grid {
    grid-template-columns: 1fr;
  }

  .footer-content {
    grid-template-columns: 1fr;
  }

  .footer-bottom {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  h1 {
    font-size: 1.5rem;
  }

  h2 {
    font-size: 1.25rem;
  }

  .stat-number {
    font-size: 2rem;
  }
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }

.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.mb-xl { margin-bottom: var(--space-xl); }

.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }
.gap-lg { gap: var(--space-lg); }
.gap-xl { gap: var(--space-xl); }
.header-trading-hub {
    position: static;
    background: var(--color-bg-dark-primary);
    border-bottom: 1px solid var(--color-bg-dark-secondary);
    width: 100%;
    z-index: 100;
  }

  .header-trading-hub-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 5vw, 2rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: clamp(4rem, 8vh, 5rem);
  }

  .header-trading-hub-logo {
    flex-shrink: 0;
    margin-right: auto;
  }

  .header-trading-hub-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    font-size: clamp(1.125rem, 2vw, 1.5rem);
    font-weight: 700;
    color: #ffffff;
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: -0.5px;
  }

  .header-trading-hub-brand:hover {
    color: var(--color-primary);
    transform: translateY(-2px);
  }

  .header-trading-hub-brand i {
    font-size: 1.5rem;
    color: var(--color-primary);
  }

  .header-trading-hub-desktop-nav {
    display: none;
    align-items: center;
    gap: 2rem;
    margin-right: 2rem;
  }

  .header-trading-hub-nav-link {
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--color-text-dark-secondary);
    text-decoration: none;
    transition: color 300ms cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
  }

  .header-trading-hub-nav-link::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--color-primary);
    transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .header-trading-hub-nav-link:hover {
    color: var(--color-text-dark-primary);
  }

  .header-trading-hub-nav-link:hover::after {
    width: 100%;
  }

  .header-trading-hub-cta-button {
    padding: clamp(0.625rem, 1.5vw, 0.875rem) clamp(1.25rem, 3vw, 1.75rem);
    background: var(--color-primary);
    color: #0f172a;
    border: none;
    border-radius: var(--radius-md);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .header-trading-hub-cta-button:hover {
    background: var(--color-primary-hover);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(6, 182, 212, 0.25);
  }

  .header-trading-hub-cta-button:active {
    transform: translateY(-1px);
  }

  .header-trading-hub-mobile-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--color-text-dark-primary);
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
    transition: color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .header-trading-hub-mobile-toggle:hover {
    color: var(--color-primary);
  }

  .header-trading-hub-mobile-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    background: var(--color-bg-dark-primary);
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);
    transition: all 350ms cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 99;
    padding-top: clamp(4rem, 8vh, 5rem);
  }

  .header-trading-hub-mobile-menu.active {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
  }

  .header-trading-hub-mobile-header {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: clamp(4rem, 8vh, 5rem);
    background: var(--color-bg-dark-primary);
    border-bottom: 1px solid var(--color-bg-dark-secondary);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: clamp(1rem, 5vw, 2rem);
    z-index: 100;
  }

  .header-trading-hub-mobile-close {
    background: none;
    border: none;
    color: var(--color-text-dark-primary);
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
    transition: color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  .header-trading-hub-mobile-close:hover {
    color: var(--color-primary);
  }

  .header-trading-hub-mobile-links {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
    padding: 2rem clamp(1rem, 5vw, 2rem);
  }

  .header-trading-hub-mobile-link {
    padding: 1rem 0;
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-text-dark-secondary);
    text-decoration: none;
    border-bottom: 1px solid var(--color-bg-dark-secondary);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
  }

  .header-trading-hub-mobile-link:hover {
    color: var(--color-primary);
    padding-left: 0.5rem;
  }

  .header-trading-hub-mobile-cta {
    margin: 2rem clamp(1rem, 5vw, 2rem) clamp(2rem, 6vw, 3rem);
    padding: clamp(0.875rem, 2vw, 1rem) clamp(1.5rem, 4vw, 2rem);
    background: var(--color-primary);
    color: #0f172a;
    border: none;
    border-radius: var(--radius-md);
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
  }

  .header-trading-hub-mobile-cta:hover {
    background: var(--color-primary-hover);
    transform: translateY(-2px);
  }

  @media (min-width: 768px) {
    .header-trading-hub-desktop-nav {
      display: flex;
    }

    .header-trading-hub-mobile-toggle {
      display: none;
    }

    .header-trading-hub-mobile-menu {
      display: none;
    }
  }

  @media (max-width: 767px) {
    .header-trading-hub-cta-button {
      display: none;
    }
  }

    .trade-portal {
  width: 100%;
}

.hero-section-index {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-glow-top-index {
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(80px);
  z-index: 1;
  pointer-events: none;
}

.hero-section-gradient-mesh-index {
  position: absolute;
  top: 10%;
  left: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(60px);
  z-index: 1;
  pointer-events: none;
}

.hero-section-accent-orb-left-index {
  position: absolute;
  bottom: 10%;
  left: 5%;
  width: 250px;
  height: 250px;
  background: rgba(34, 211, 238, 0.08);
  border-radius: 50%;
  filter: blur(50px);
  z-index: 1;
  pointer-events: none;
}

.hero-section-accent-orb-right-index {
  position: absolute;
  bottom: -20%;
  right: 10%;
  width: 300px;
  height: 300px;
  background: rgba(139, 92, 246, 0.06);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.hero-section-floating-card-index {
  position: absolute;
  top: 30%;
  left: 8%;
  width: 180px;
  height: 140px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transform: rotate(-8deg);
  z-index: 2;
  pointer-events: none;
}

.hero-section-line-accent-index {
  position: absolute;
  top: 50%;
  right: 5%;
  width: 200px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.3), transparent);
  z-index: 2;
  pointer-events: none;
}

.hero-section-corner-shape-index {
  position: absolute;
  bottom: 15%;
  left: 15%;
  width: 280px;
  height: 320px;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 60% 40% 70% 30% / 40% 60% 30% 70%;
  z-index: 2;
  pointer-events: none;
}

.hero-content-index {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 10;
  gap: var(--space-lg);
}

.hero-title-index {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-index {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.125rem);
  color: #cbd5e1;
  max-width: 650px;
  margin: 0 auto;
}

.hero-buttons-index {
  display: flex;
  flex-direction: row;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

.hero-buttons-index .btn {
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: var(--radius-lg);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-buttons-index .btn-primary {
  background: #06b6d4;
  color: #0f172a;
}

.hero-buttons-index .btn-primary:hover {
  background: #22d3ee;
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(6, 182, 212, 0.35);
}

.hero-buttons-index .btn-outline-light {
  border: 2px solid #ffffff;
  color: #ffffff;
  background: transparent;
}

.hero-buttons-index .btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-3px);
}

.hero-stats-index {
  display: flex;
  gap: clamp(2rem, 6vw, 4rem);
  margin-top: var(--space-lg);
  flex-wrap: wrap;
  justify-content: center;
}

.hero-stat-item-index {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-sm);
}

.hero-stat-number-index {
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.hero-stat-label-index {
  font-size: 0.875rem;
  color: #94a3b8;
  font-weight: 500;
}

.features-section-index {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.features-section-accent-glow-index {
  position: absolute;
  top: -20%;
  left: 10%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.features-section-shape-left-index {
  position: absolute;
  bottom: 10%;
  left: 5%;
  width: 280px;
  height: 280px;
  background: rgba(6, 182, 212, 0.04);
  border-radius: 45% 55% 60% 40% / 55% 45% 40% 60%;
  z-index: 2;
  pointer-events: none;
}

.features-section-shape-right-index {
  position: absolute;
  top: 15%;
  right: 8%;
  width: 250px;
  height: 250px;
  background: rgba(59, 130, 246, 0.05);
  border-radius: 40% 60% 50% 50% / 60% 40% 60% 40%;
  z-index: 2;
  pointer-events: none;
}

.features-section-line-index {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.15), transparent);
  z-index: 1;
  pointer-events: none;
}

.features-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.features-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.features-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #0891b2;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.features-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: var(--space-md);
}

.features-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #475569;
}

.features-cards-index {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.features-card-index {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid rgba(6, 182, 212, 0.1);
  border-radius: var(--radius-xl);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.features-card-index:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.features-card-icon-index {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.15), rgba(59, 130, 246, 0.15));
  border-radius: var(--radius-lg);
  color: #0891b2;
  font-size: 1.5rem;
}

.features-card-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
}

.features-card-text-index {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.benefits-section-index {
  background: #1f2937;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-glow-top-index {
  position: absolute;
  top: -30%;
  right: 10%;
  width: 450px;
  height: 450px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(80px);
  z-index: 1;
  pointer-events: none;
}

.benefits-section-glow-bottom-index {
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.benefits-section-gradient-index {
  position: absolute;
  top: 30%;
  left: 20%;
  width: 300px;
  height: 300px;
  background: rgba(139, 92, 246, 0.06);
  border-radius: 50% 40% 60% 40% / 60% 50% 40% 50%;
  z-index: 2;
  pointer-events: none;
}

.benefits-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.benefits-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.benefits-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #22d3ee;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.benefits-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: var(--space-md);
}

.benefits-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #cbd5e1;
}

.benefits-list-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.benefits-item-index {
  display: flex;
  align-items: flex-start;
  gap: var(--space-lg);
  padding: var(--space-lg);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: var(--radius-xl);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.benefits-item-index:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.benefits-number-index {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  min-width: 60px;
}

.benefits-content-wrapper-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.benefits-item-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #ffffff;
}

.benefits-item-text-index {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.insights-section-index {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-section-glow-index {
  position: absolute;
  top: 15%;
  left: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.insights-section-shape-index {
  position: absolute;
  bottom: 10%;
  right: 5%;
  width: 320px;
  height: 320px;
  background: rgba(6, 182, 212, 0.06);
  border-radius: 60% 40% 50% 50% / 40% 60% 50% 40%;
  z-index: 2;
  pointer-events: none;
}

.insights-section-accent-index {
  position: absolute;
  top: 50%;
  right: 10%;
  width: 200px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.2), transparent);
  z-index: 2;
  pointer-events: none;
}

.insights-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.insights-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.insights-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #22d3ee;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.insights-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: var(--space-md);
}

.insights-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #cbd5e1;
}

.insights-grid-index {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.insights-card-index {
  flex: 1 1 300px;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: var(--radius-xl);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.insights-card-index:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(6, 182, 212, 0.2);
}

.insights-icon-index {
  font-size: 2rem;
  color: #06b6d4;
}

.insights-card-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #ffffff;
}

.insights-card-text-index {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.insights-link-index {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: var(--space-sm);
  transition: all 0.3s ease;
}

.insights-link-index i {
  transition: transform 0.3s ease;
}

.insights-card-index:hover .insights-link-index i {
  transform: translateX(4px);
}

.featured-section-index {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.featured-section-accent-top-index {
  position: absolute;
  top: -25%;
  right: 8%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.featured-section-accent-bottom-index {
  position: absolute;
  bottom: -15%;
  left: 5%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.07) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(60px);
  z-index: 1;
  pointer-events: none;
}

.featured-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.featured-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.featured-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #0891b2;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.featured-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: var(--space-md);
}

.featured-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #475569;
}

.featured-cards-index {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.featured-card-index {
  flex: 1 1 320px;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: 0;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.featured-card-index:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.featured-card-image-index {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

.featured-card-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
}

.featured-card-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
}

.featured-card-text-index {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.featured-card-link-index {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: var(--space-sm);
  transition: all 0.3s ease;
}

.featured-card-link-index:hover {
  color: #0891b2;
  transform: translateX(4px);
}

.featured-cta-index {
  text-align: center;
  margin-top: var(--space-lg);
}

.featured-cta-link-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  background: linear-gradient(135deg, #06b6d4, #22d3ee);
  color: #0f172a;
  font-weight: 700;
  border-radius: var(--radius-lg);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none;
}

.featured-cta-link-index:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(6, 182, 212, 0.35);
}

.stats-section-index {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.stats-section-glow-left-index {
  position: absolute;
  top: 20%;
  left: -10%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.07) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(60px);
  z-index: 1;
  pointer-events: none;
}

.stats-section-glow-right-index {
  position: absolute;
  bottom: 15%;
  right: 5%;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.06) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(65px);
  z-index: 1;
  pointer-events: none;
}

.stats-section-line-index {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.1), transparent);
  z-index: 1;
  pointer-events: none;
}

.stats-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.stats-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.stats-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #0891b2;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.stats-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: var(--space-md);
}

.stats-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #475569;
}

.stats-grid-index {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.stats-item-index {
  flex: 1 1 240px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-xl);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-xl);
  text-align: center;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.stats-item-index:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.stats-number-index {
  font-size: clamp(2.25rem, 4vw, 3rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #0891b2);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stats-label-index {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.stats-description-index {
  font-size: 0.875rem;
  color: #475569;
  margin: 0;
}

.cta-section-index {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 7rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-glow-index {
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(80px);
  z-index: 1;
  pointer-events: none;
}

.cta-section-shape-index {
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.cta-section-accent-index {
  position: absolute;
  top: 30%;
  left: 20%;
  width: 220px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.25), transparent);
  z-index: 2;
  pointer-events: none;
}

.cta-content-index {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-xl);
  position: relative;
  z-index: 10;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-index {
  font-size: clamp(1.75rem, 5vw + 0.5rem, 3rem);
  line-height: 1.2;
  color: #ffffff;
}

.cta-text-index {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  margin: 0;
}

.cta-buttons-index {
  display: flex;
  flex-direction: row;
  gap: var(--space-md);
  justify-content: center;
  flex-wrap: wrap;
}

.cta-buttons-index .btn {
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: var(--radius-lg);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.cta-buttons-index .btn-primary {
  background: #06b6d4;
  color: #0f172a;
}

.cta-buttons-index .btn-primary:hover {
  background: #22d3ee;
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(6, 182, 212, 0.35);
}

.cta-buttons-index .btn-outline-light {
  border: 2px solid #ffffff;
  color: #ffffff;
  background: transparent;
}

.cta-buttons-index .btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-3px);
}

.contact-section-index {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.contact-section-accent-index {
  position: absolute;
  top: -25%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(70px);
  z-index: 1;
  pointer-events: none;
}

.contact-section-glow-index {
  position: absolute;
  bottom: 10%;
  right: 8%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.07) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(65px);
  z-index: 1;
  pointer-events: none;
}

.contact-content-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xl);
  position: relative;
  z-index: 10;
}

.contact-header-index {
  text-align: center;
  max-width: 700px;
  margin: 0 auto var(--space-2xl);
}

.contact-tag-index {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #0891b2;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: var(--space-md);
}

.contact-title-index {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: var(--space-md);
}

.contact-subtitle-index {
  font-size: clamp(1rem, 2vw, 1.0625rem);
  color: #475569;
}

.contact-wrapper-index {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
}

.contact-form-wrapper-index {
  flex: 1 1 400px;
  min-width: 300px;
}

.contact-form-index {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.contact-form-row-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.contact-label-index {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
}

.contact-input-index,
.contact-textarea-index {
  width: 100%;
  padding: 0.875rem 1rem;
  background: #f8fafc;
  border: 2px solid #e2e8f0;
  border-radius: var(--radius-lg);
  color: #0f172a;
  font-size: 1rem;
  font-family: var(--font-primary);
  transition: all 0.3s ease;
}

.contact-input-index:focus,
.contact-textarea-index:focus {
  outline: none;
  border-color: #06b6d4;
  box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.1);
}

.contact-textarea-index {
  min-height: 140px;
  resize: vertical;
}

.contact-privacy-index {
  margin: var(--space-sm) 0;
}

.contact-privacy-text-index {
  font-size: 0.875rem;
  color: #475569;
  margin: 0;
}

.contact-privacy-link-index {
  color: #06b6d4;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.3s ease;
}

.contact-privacy-link-index:hover {
  color: #0891b2;
  text-decoration: underline;
}

.contact-submit-index {
  padding: 1rem 2rem;
  background: linear-gradient(135deg, #06b6d4, #22d3ee);
  color: #0f172a;
  border: none;
  border-radius: var(--radius-lg);
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-submit-index:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(6, 182, 212, 0.35);
}

.contact-submit-index:active {
  transform: translateY(-1px);
}

.contact-info-index {
  flex: 1 1 400px;
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}

.contact-info-block-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.contact-info-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
}

.contact-info-list-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  list-style: none;
  padding: 0;
  margin: 0;
}

.contact-info-item-index {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.contact-info-item-index::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.contact-faq-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-lg);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-xl);
}

.contact-faq-title-index {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 var(--space-md);
}

.contact-faq-item-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.contact-faq-question-index {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0;
}

.contact-faq-answer-index {
  font-size: 0.875rem;
  color: #475569;
  margin: 0;
  line-height: 1.6;
}

.cookie-banner-index {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  padding: clamp(1rem, 3vw, 1.5rem);
  background: #1e293b;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(1rem, 2vw, 1.5rem);
  border-top: 1px solid rgba(6, 182, 212, 0.2);
}

.cookie-banner-index.hidden {
  display: none;
}

.cookie-banner-text-index {
  color: #cbd5e1;
  margin: 0;
  font-size: clamp(0.875rem, 1vw, 1rem);
  line-height: 1.5;
  max-width: 600px;
}

.cookie-banner-buttons-index {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: center;
}

.cookie-btn-accept-index,
.cookie-btn-decline-index {
  padding: 0.625rem 1.25rem;
  border: none;
  border-radius: var(--radius-md);
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.3s ease;
  font-family: var(--font-primary);
}

.cookie-btn-accept-index {
  background: #06b6d4;
  color: #0f172a;
}

.cookie-btn-accept-index:hover {
  background: #22d3ee;
  transform: translateY(-2px);
}

.cookie-btn-decline-index {
  background: transparent;
  color: #cbd5e1;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.cookie-btn-decline-index:hover {
  border-color: #cbd5e1;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.05);
}

@media (max-width: 768px) {
  .hero-buttons-index,
  .cta-buttons-index {
    flex-direction: column;
    width: 100%;
  }

  .hero-buttons-index .btn,
  .cta-buttons-index .btn {
    width: 100%;
  }

  .features-cards-index,
  .insights-grid-index,
  .stats-grid-index,
  .featured-cards-index {
    flex-direction: column;
  }

  .features-card-index,
  .insights-card-index,
  .stats-item-index,
  .featured-card-index {
    flex: 1 1 100%;
    max-width: none;
  }

  .benefits-item-index {
    flex-direction: column;
    align-items: flex-start;
  }

  .contact-wrapper-index {
    flex-direction: column;
  }

  .contact-form-wrapper-index,
  .contact-info-index {
    flex: 1 1 100%;
  }

  .hero-stats-index {
    gap: clamp(1.5rem, 4vw, 2.5rem);
  }

  .contact-form-row-index input,
  .contact-form-row-index textarea {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .hero-title-index {
    font-size: 1.5rem;
  }

  .features-title-index,
  .benefits-title-index,
  .insights-title-index,
  .featured-title-index,
  .stats-title-index,
  .cta-title-index,
  .contact-title-index {
    font-size: 1.25rem;
  }

  .stat-number-index {
    font-size: 2rem;
  }

  .benefits-number-index {
    font-size: 1.75rem;
  }

  .cookie-banner-index {
    flex-direction: column;
    text-align: center;
  }

  .cookie-banner-buttons-index {
    width: 100%;
    justify-content: center;
  }

  .cookie-btn-accept-index,
  .cookie-btn-decline-index {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

    
.footer {
  position: relative;
  background: var(--color-bg-dark-primary);
  padding: clamp(3rem, 8vw, 5rem) 0 clamp(2rem, 5vw, 3rem);
  border-top: 1px solid var(--color-bg-dark-secondary);
  overflow: hidden;
}

.footer .container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 5vw, 2rem);
}

.footer-content {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: clamp(2.5rem, 6vw, 4rem);
}

.footer-about {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-bottom: clamp(1.5rem, 4vw, 2.5rem);
  border-bottom: 1px solid var(--color-bg-dark-secondary);
}

.footer-about-title {
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  font-family: var(--font-heading);
  letter-spacing: -0.5px;
}

.footer-about-text {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.7;
  color: var(--color-text-dark-secondary);
  max-width: 500px;
}

.footer-sections {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 5vw, 3.5rem);
}

.footer-section-title {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  font-weight: 600;
  color: var(--color-text-dark-primary);
  margin-bottom: 1.25rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.footer-nav-section {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
}

.footer-nav {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.footer-nav-link {
  font-size: 0.9375rem;
  color: var(--color-text-dark-secondary);
  text-decoration: none;
  transition: color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  padding-left: 0.5rem;
}

.footer-nav-link::before {
  content: '';
  position: absolute;
  left: 0;
  width: 3px;
  height: 100%;
  background: var(--color-primary);
  opacity: 0;
  transition: opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.footer-nav-link:hover {
  color: var(--color-primary);
}

.footer-nav-link:hover::before {
  opacity: 1;
}

.footer-contact-section {
  flex: 1 1 250px;
  display: flex;
  flex-direction: column;
}

.footer-contact-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.footer-contact-item {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--color-text-dark-secondary);
  margin: 0;
}

.footer-contact-label {
  display: block;
  color: var(--color-text-dark-primary);
  font-weight: 500;
  margin-bottom: 0.25rem;
}

.footer-legal-section {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
}

.footer-legal-nav {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.footer-legal-link {
  font-size: 0.875rem;
  color: var(--color-text-dark-secondary);
  text-decoration: none;
  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

.footer-legal-link:hover {
  color: var(--color-primary);
  transform: translateX(3px);
}

.footer-copyright {
  padding-top: clamp(1.5rem, 4vw, 2.5rem);
  border-top: 1px solid var(--color-bg-dark-secondary);
  text-align: center;
}

.footer-copyright-text {
  font-size: 0.875rem;
  color: var(--color-text-dark-muted);
  margin: 0;
}

.footer-deco-accent-1 {
  position: absolute;
  top: 10%;
  right: -100px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  filter: blur(70px);
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
}

.footer-deco-accent-2 {
  position: absolute;
  bottom: -80px;
  left: -120px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.06) 0%, transparent 70%);
  filter: blur(65px);
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
}

.footer-deco-line {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.3), transparent);
  z-index: 2;
  pointer-events: none;
}

@media (min-width: 768px) {
  .footer {
    padding: clamp(4rem, 10vw, 6rem) 0 clamp(2.5rem, 6vw, 4rem);
  }

  .footer-content {
    gap: clamp(3rem, 8vw, 5rem);
  }

  .footer-sections {
    gap: clamp(2.5rem, 6vw, 4.5rem);
    justify-content: space-between;
  }

  .footer-nav-section,
  .footer-contact-section,
  .footer-legal-section {
    flex: 0 1 auto;
  }

  .footer-about {
    padding-bottom: clamp(2rem, 5vw, 3rem);
  }
}

@media (min-width: 1024px) {
  .footer-sections {
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  .footer-nav-section,
  .footer-contact-section,
  .footer-legal-section {
    flex: 1;
  }
}

.footer-nav-link:focus-visible,
.footer-legal-link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .footer-nav-link,
  .footer-legal-link {
    transition: none;
  }

  .footer-nav-link:hover::before,
  .footer-legal-link:hover {
    transform: none;
  }
}
    

.category-page-digital-trading-education {
  width: 100%;
}

.hero-section-trading-de {
  background: linear-gradient(135deg, #0a0f1e 0%, #0d1526 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-glow-accent-1 {
  position: absolute;
  top: -10%;
  right: -5%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
}

.hero-glow-accent-2 {
  position: absolute;
  bottom: -15%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
}

.hero-shape-accent {
  position: absolute;
  top: 50%;
  left: -10%;
  width: 300px;
  height: 300px;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 60% 40% 70% 30% / 40% 60% 30% 70%;
  pointer-events: none;
  z-index: 1;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-content-trading-de {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.hero-title-trading-de {
  font-size: clamp(2rem, 6vw + 1rem, 4rem);
  font-weight: 700;
  line-height: 1.1;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-trading-de {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.125rem);
  color: #94a3b8;
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.7;
}

.hero-stats-trading-de {
  display: flex;
  gap: clamp(2rem, 5vw, 4rem);
  flex-wrap: wrap;
  justify-content: center;
  margin-top: clamp(1rem, 2vw, 2rem);
}

.stat-item-trading-de {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
}

.stat-number-trading-de {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-trading-de {
  font-size: 0.875rem;
  color: #64748b;
  font-weight: 500;
}

.hero-buttons-trading-de {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.featured-section-trading-de {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.featured-content-trading-de {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 5vw, 4rem);
  align-items: center;
}

.featured-quote-block-trading-de {
  order: 1;
}

.featured-quote-text-trading-de {
  padding: clamp(2rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: 0;
  font-style: italic;
  border-radius: 8px;
}

.featured-quote-text-trading-de p {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.featured-quote-author-trading-de {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.featured-insights-trading-de {
  order: 2;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.featured-title-trading-de {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  line-height: 1.2;
}

.featured-text-trading-de {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.8;
  margin: 0;
}

@media (max-width: 768px) {
  .featured-content-trading-de {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .featured-quote-block-trading-de {
    order: 2;
  }

  .featured-insights-trading-de {
    order: 1;
  }
}

.posts-section-trading-de {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.posts-section-trading-de::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
}

.posts-header-trading-de {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
  position: relative;
  z-index: 1;
}

.posts-title-trading-de {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.posts-subtitle-trading-de {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.125rem);
  color: #94a3b8;
  max-width: 700px;
  margin: 0 auto;
}

.posts-grid-trading-de {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
  position: relative;
  z-index: 1;
}

.card-trading-de {
  flex: 1 1 320px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  background: rgba(30, 41, 59, 0.8);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.card-trading-de:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.1);
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
}

.card-trading-de img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
}

.card-title-trading-de {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
  margin: 0;
}

.card-description-trading-de {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.card-link-trading-de {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.card-link-trading-de:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

.insights-section-trading-de {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-header-trading-de {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.insights-title-trading-de {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  color: #1e293b;
  margin-bottom: 1rem;
}

.insights-subtitle-trading-de {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.125rem);
  color: #64748b;
  max-width: 700px;
  margin: 0 auto;
}

.insights-grid-trading-de {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(1.5rem, 3vw, 2rem);
}

.insight-card-trading-de {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.insight-card-trading-de:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 25px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.insight-icon-trading-de {
  font-size: 2rem;
  color: #06b6d4;
}

.insight-title-trading-de {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
}

.insight-text-trading-de {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.cta-section-trading-de {
  background: linear-gradient(135deg, #0a0f1e 0%, #1a1a2e 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-trading-de::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
}

.cta-section-trading-de::after {
  content: '';
  position: absolute;
  bottom: -20%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
}

.cta-content-trading-de {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-trading-de {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  line-height: 1.2;
}

.cta-text-trading-de {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.125rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-trading-de {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: 8px;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  text-decoration: none;
  cursor: pointer;
}

.btn-primary {
  background: #06b6d4;
  color: #0f172a;
}

.btn-primary:hover {
  background: #22d3ee;
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.3);
}

.btn-outline-light {
  border-color: #ffffff;
  color: #ffffff;
  background: transparent;
}

.btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-3px);
}

@media (max-width: 768px) {
  .posts-grid-trading-de {
    flex-direction: column;
  }

  .card-trading-de {
    flex: 1 1 100%;
    max-width: none;
  }

  .insights-grid-trading-de {
    grid-template-columns: 1fr;
  }

  .hero-stats-trading-de {
    gap: 2rem;
  }
}

@media (max-width: 480px) {
  .hero-title-trading-de {
    font-size: 1.5rem;
  }

  .stat-number-trading-de {
    font-size: 1.75rem;
  }

  .hero-buttons-trading-de {
    flex-direction: column;
    width: 100%;
  }

  .hero-buttons-trading-de .btn {
    width: 100%;
  }

  .cta-buttons-trading-de {
    flex-direction: column;
    width: 100%;
  }

  .cta-buttons-trading-de .btn {
    width: 100%;
  }
}

.btn:focus-visible,
.card-link-trading-de:focus-visible {
  outline: 2px solid #06b6d4;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

.main-marktanalyse-anfaenger {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-marktanalyse-anfaenger"] {
  width: 100%;
  overflow: hidden;
}

.hero-section-marktanalyse-anfaenger {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-marktanalyse-anfaenger::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-marktanalyse-anfaenger::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-marktanalyse-anfaenger {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.9375rem;
}

.breadcrumb-link-marktanalyse-anfaenger {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-marktanalyse-anfaenger:hover {
  color: #06b6d4;
}

.breadcrumb-separator-marktanalyse-anfaenger {
  color: #475569;
}

.breadcrumb-current-marktanalyse-anfaenger {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: 2rem;
}

.hero-title-marktanalyse-anfaenger {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: #ffffff;
}

.hero-subtitle-marktanalyse-anfaenger {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 700px;
  margin: 0;
  line-height: 1.7;
}

.hero-meta-marktanalyse-anfaenger {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-marktanalyse-anfaenger {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-marktanalyse-anfaenger i {
  font-size: 0.875rem;
}

.hero-image-marktanalyse-anfaenger {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin-top: 2rem;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.introduction-section-marktanalyse-anfaenger {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.introduction-wrapper-marktanalyse-anfaenger {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-image-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.introduction-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.introduction-content-marktanalyse-anfaenger {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.introduction-content-marktanalyse-anfaenger:last-child {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .introduction-wrapper-marktanalyse-anfaenger {
    flex-direction: column;
  }

  .introduction-text-marktanalyse-anfaenger,
  .introduction-image-marktanalyse-anfaenger {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.fundamentals-section-marktanalyse-anfaenger {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.fundamentals-section-marktanalyse-anfaenger::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.fundamentals-header-marktanalyse-anfaenger {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.section-tag-marktanalyse-anfaenger {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 1rem;
}

.fundamentals-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.fundamentals-subtitle-marktanalyse-anfaenger {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  margin: 0;
  line-height: 1.6;
}

.fundamentals-steps-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.fundamentals-step-marktanalyse-anfaenger {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 2rem;
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.fundamentals-step-marktanalyse-anfaenger:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.fundamentals-step-number-marktanalyse-anfaenger {
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 800;
  line-height: 1;
  color: #06b6d4;
  flex-shrink: 0;
  min-width: 70px;
}

.fundamentals-step-content-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fundamentals-step-title-marktanalyse-anfaenger {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
  line-height: 1.3;
}

.fundamentals-step-text-marktanalyse-anfaenger {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .fundamentals-step-marktanalyse-anfaenger {
    flex-direction: column;
    padding: 1.5rem;
  }

  .fundamentals-step-number-marktanalyse-anfaenger {
    min-width: auto;
  }
}

.methods-section-marktanalyse-anfaenger {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.methods-wrapper-marktanalyse-anfaenger {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.methods-image-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.methods-text-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
}

.methods-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.methods-content-marktanalyse-anfaenger {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.methods-list-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.method-item-marktanalyse-anfaenger {
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 10px;
  border-left: 4px solid #06b6d4;
  transition: all 0.3s ease;
}

.method-item-marktanalyse-anfaenger:hover {
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.1);
  transform: translateX(4px);
}

.method-item-title-marktanalyse-anfaenger {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.method-item-text-marktanalyse-anfaenger {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .methods-wrapper-marktanalyse-anfaenger {
    flex-direction: column;
  }

  .methods-image-marktanalyse-anfaenger,
  .methods-text-marktanalyse-anfaenger {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.insights-section-marktanalyse-anfaenger {
  background: #1f2937;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.insights-section-marktanalyse-anfaenger::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.insights-header-marktanalyse-anfaenger {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.insights-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.insights-subtitle-marktanalyse-anfaenger {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  margin: 0;
  line-height: 1.6;
}

.insights-cards-marktanalyse-anfaenger {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.insight-card-marktanalyse-anfaenger {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.insight-card-marktanalyse-anfaenger:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.insight-icon-marktanalyse-anfaenger {
  font-size: 2rem;
  color: #06b6d4;
  height: auto;
}

.insight-card-title-marktanalyse-anfaenger {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
  line-height: 1.3;
}

.insight-card-text-marktanalyse-anfaenger {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .insight-card-marktanalyse-anfaenger {
    flex: 1 1 100%;
    max-width: none;
  }
}

.framework-section-marktanalyse-anfaenger {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.framework-wrapper-marktanalyse-anfaenger {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.framework-text-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
}

.framework-image-marktanalyse-anfaenger {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.framework-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.framework-content-marktanalyse-anfaenger {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.featured-quote-marktanalyse-anfaenger {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: 2rem 0;
  border-radius: 8px;
}

.quote-text-marktanalyse-anfaenger {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #1e293b;
  font-style: italic;
  line-height: 1.7;
  margin-bottom: 1rem;
  margin: 0 0 1rem 0;
}

.quote-cite-marktanalyse-anfaenger {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
  display: block;
}

@media (max-width: 768px) {
  .framework-wrapper-marktanalyse-anfaenger {
    flex-direction: column;
  }

  .framework-text-marktanalyse-anfaenger,
  .framework-image-marktanalyse-anfaenger {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-marktanalyse-anfaenger {
  background: linear-gradient(135deg, #0f172a 0%, #1a1a2e 100%);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-marktanalyse-anfaenger::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
}

.conclusion-content-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.conclusion-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  margin: 0;
}

.conclusion-text-marktanalyse-anfaenger {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.conclusion-cta-marktanalyse-anfaenger {
  margin-top: 1rem;
}

.cta-button-marktanalyse-anfaenger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #06b6d4;
  color: #0f172a;
  font-weight: 600;
  border-radius: 8px;
  font-size: clamp(0.9375rem, 1vw, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-marktanalyse-anfaenger:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-marktanalyse-anfaenger {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.related-title-marktanalyse-anfaenger {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  text-align: center;
  margin-bottom: 3rem;
  line-height: 1.2;
}

.related-cards-marktanalyse-anfaenger {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-marktanalyse-anfaenger {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
}

.related-card-content-marktanalyse-anfaenger {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  height: 100%;
}

.related-card-marktanalyse-anfaenger:hover .related-card-content-marktanalyse-anfaenger {
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.related-card-title-marktanalyse-anfaenger {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  line-height: 1.3;
}

.related-card-text-marktanalyse-anfaenger {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-marktanalyse-anfaenger {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: auto;
}

.related-card-link-marktanalyse-anfaenger:hover {
  color: #0891b2;
  gap: 0.75rem;
}

.related-card-link-marktanalyse-anfaenger i {
  transition: transform 0.3s ease;
}

.related-card-marktanalyse-anfaenger:hover .related-card-link-marktanalyse-anfaenger i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-marktanalyse-anfaenger {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-marktanalyse-anfaenger {
  background: #ffffff;
  padding: clamp(4rem, 6vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-marktanalyse-anfaenger {
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #94a3b8;
}

.disclaimer-title-marktanalyse-anfaenger {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.3;
}

.disclaimer-text-marktanalyse-anfaenger {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.disclaimer-text-marktanalyse-anfaenger:last-child {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .hero-meta-marktanalyse-anfaenger {
    flex-direction: column;
    gap: 0.5rem;
  }

  .fundamentals-step-marktanalyse-anfaenger {
    padding: 1.5rem;
  }

  .method-item-marktanalyse-anfaenger {
    padding: 1rem;
  }
}

@media (max-width: 480px) {
  .hero-title-marktanalyse-anfaenger {
    font-size: 1.75rem;
  }

  .introduction-title-marktanalyse-anfaenger,
  .methods-title-marktanalyse-anfaenger,
  .framework-title-marktanalyse-anfaenger,
  .fundamentals-title-marktanalyse-anfaenger,
  .insights-title-marktanalyse-anfaenger,
  .conclusion-title-marktanalyse-anfaenger,
  .related-title-marktanalyse-anfaenger {
    font-size: 1.25rem;
  }

  .fundamentals-step-number-marktanalyse-anfaenger {
    font-size: 1.75rem;
    min-width: 50px;
  }
}

.main-e-commerce-grundlagen {
  width: 100%;
  background: #ffffff;
  font-family: var(--font-primary);
  color: var(--color-text-light-primary);
  line-height: 1.7;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section {
  width: 100%;
  overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

p {
  margin: 0;
}

a {
  text-decoration: none;
  transition: all 0.3s ease;
}

.hero-section-e-commerce-grundlagen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-e-commerce-grundlagen::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-e-commerce-grundlagen::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-e-commerce-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  align-items: center;
}

.breadcrumb-link-e-commerce-grundlagen {
  color: #9ca3af;
  transition: color 0.2s ease;
}

.breadcrumb-link-e-commerce-grundlagen:hover {
  color: #06b6d4;
}

.breadcrumb-separator-e-commerce-grundlagen {
  color: #6b7280;
}

.breadcrumb-current-e-commerce-grundlagen {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 2;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.hero-title-e-commerce-grundlagen {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-e-commerce-grundlagen {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0;
}

.hero-meta-e-commerce-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.meta-badge-e-commerce-grundlagen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-e-commerce-grundlagen i {
  font-size: 0.875rem;
}

.hero-stats-e-commerce-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 3rem);
  margin-top: clamp(1.5rem, 3vw, 2rem);
}

.stat-item-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.stat-number-e-commerce-grundlagen {
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  display: block;
}

.stat-label-e-commerce-grundlagen {
  font-size: 0.875rem;
  color: #9ca3af;
  font-weight: 500;
}

.hero-image-wrapper-e-commerce-grundlagen {
  position: relative;
  z-index: 2;
  margin-top: clamp(2rem, 4vw, 3rem);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.hero-image-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 450px;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}

.intro-section-e-commerce-grundlagen {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.intro-content-wrapper-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-title-e-commerce-grundlagen {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  line-height: 1.2;
}

.intro-description-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.intro-image-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-content-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-wrapper-e-commerce-grundlagen {
    flex-direction: column;
  }

  .intro-text-e-commerce-grundlagen,
  .intro-image-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.foundations-section-e-commerce-grundlagen {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.section-header-e-commerce-grundlagen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.section-tag-e-commerce-grundlagen {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 1rem;
}

.foundations-title-e-commerce-grundlagen,
.customer-title-e-commerce-grundlagen,
.marketing-title-e-commerce-grundlagen,
.challenges-title-e-commerce-grundlagen,
.related-title-e-commerce-grundlagen {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.section-subtitle-e-commerce-grundlagen {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

.foundations-content-wrapper-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.foundations-text-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.foundations-subheading-e-commerce-grundlagen {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: #0f172a;
  margin: 0;
}

.foundations-description-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  margin: 0;
  line-height: 1.7;
}

.foundations-highlight-e-commerce-grundlagen {
  padding: 1.5rem;
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.highlight-title-e-commerce-grundlagen {
  font-size: 1rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.highlight-list-e-commerce-grundlagen {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.list-item-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0;
}

.list-item-e-commerce-grundlagen::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.foundations-image-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.foundations-image-content-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .foundations-content-wrapper-e-commerce-grundlagen {
    flex-direction: column;
  }

  .foundations-text-e-commerce-grundlagen,
  .foundations-image-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.operations-section-e-commerce-grundlagen {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.operations-content-wrapper-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.operations-image-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.operations-image-content-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.operations-text-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.operations-subheading-e-commerce-grundlagen {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: #0f172a;
  margin: 0;
}

.operations-description-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  margin: 0;
  line-height: 1.7;
}

.featured-quote-e-commerce-grundlagen {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: #f1f5f9;
  border-radius: 8px;
  margin: 1rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.quote-text-e-commerce-grundlagen {
  font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
  color: #0f172a;
  font-style: italic;
  font-weight: 500;
  margin: 0;
  line-height: 1.6;
}

.quote-author-e-commerce-grundlagen {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
  margin: 0;
}

@media (max-width: 768px) {
  .operations-content-wrapper-e-commerce-grundlagen {
    flex-direction: column;
  }

  .operations-image-e-commerce-grundlagen,
  .operations-text-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.customer-section-e-commerce-grundlagen {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.customer-content-wrapper-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.customer-text-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.customer-subheading-e-commerce-grundlagen {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: #0f172a;
  margin: 0;
}

.customer-description-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  margin: 0;
  line-height: 1.7;
}

.customer-steps-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 1rem;
}

.step-item-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  align-items: flex-start;
}

.step-number-e-commerce-grundlagen {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.step-content-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-e-commerce-grundlagen {
  font-size: 1rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.step-description-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

.customer-image-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.customer-image-content-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .customer-content-wrapper-e-commerce-grundlagen {
    flex-direction: column;
  }

  .customer-text-e-commerce-grundlagen,
  .customer-image-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.marketing-section-e-commerce-grundlagen {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.marketing-cards-e-commerce-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.marketing-card-e-commerce-grundlagen {
  flex: 1 1 calc(33.333% - 1.5rem);
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.marketing-card-e-commerce-grundlagen:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.card-icon-e-commerce-grundlagen {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.card-title-e-commerce-grundlagen {
  font-size: 1.125rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
}

.card-text-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .marketing-card-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: none;
  }
}

.challenges-section-e-commerce-grundlagen {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.challenges-content-wrapper-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.challenges-image-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-image-content-e-commerce-grundlagen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.challenges-text-e-commerce-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.challenges-description-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  margin: 0;
  line-height: 1.7;
}

.challenges-list-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 0.5rem;
}

.challenge-item-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 10px;
  border-left: 4px solid #06b6d4;
}

.challenge-heading-e-commerce-grundlagen {
  font-size: 1rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.challenge-text-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .challenges-content-wrapper-e-commerce-grundlagen {
    flex-direction: column;
  }

  .challenges-image-e-commerce-grundlagen,
  .challenges-text-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-e-commerce-grundlagen {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.conclusion-content-e-commerce-grundlagen {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.conclusion-title-e-commerce-grundlagen {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  text-align: center;
  margin: 0;
  line-height: 1.2;
}

.conclusion-text-e-commerce-grundlagen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  text-align: center;
  margin: 0;
  line-height: 1.7;
}

.conclusion-highlight-e-commerce-grundlagen {
  padding: 2rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.highlight-heading-e-commerce-grundlagen {
  font-size: 1.125rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.highlight-checklist-e-commerce-grundlagen {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.checklist-item-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0;
}

.checklist-item-e-commerce-grundlagen::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.cta-section-e-commerce-grundlagen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-e-commerce-grundlagen::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-e-commerce-grundlagen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  position: relative;
  z-index: 2;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-e-commerce-grundlagen {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.cta-description-e-commerce-grundlagen {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  margin: 0;
  line-height: 1.6;
}

.cta-buttons-e-commerce-grundlagen {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 0.5rem;
}

.btn-primary-e-commerce-grundlagen,
.btn-secondary-e-commerce-grundlagen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 10px;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.btn-primary-e-commerce-grundlagen {
  background: #06b6d4;
  color: #0f172a;
}

.btn-primary-e-commerce-grundlagen:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-e-commerce-grundlagen {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.btn-secondary-e-commerce-grundlagen:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-e-commerce-grundlagen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.disclaimer-box-e-commerce-grundlagen {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem;
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.disclaimer-title-e-commerce-grundlagen {
  font-size: 1.125rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.disclaimer-text-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.7;
}

.related-section-e-commerce-grundlagen {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.related-cards-e-commerce-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-e-commerce-grundlagen {
  flex: 1 1 calc(33.333% - 1.5rem);
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  color: #0f172a;
}

.related-card-e-commerce-grundlagen:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.related-card-icon-e-commerce-grundlagen {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.related-card-title-e-commerce-grundlagen {
  font-size: 1.125rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
}

.related-card-text-e-commerce-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

.related-card-link-e-commerce-grundlagen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  transition: all 0.2s ease;
}

.related-card-link-e-commerce-grundlagen i {
  transition: transform 0.2s ease;
  font-size: 0.75rem;
}

.related-card-e-commerce-grundlagen:hover .related-card-link-e-commerce-grundlagen i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: none;
  }

  .marketing-card-e-commerce-grundlagen {
    flex: 1 1 100%;
    max-width: none;
  }

  .cta-buttons-e-commerce-grundlagen {
    flex-direction: column;
    width: 100%;
  }

  .btn-primary-e-commerce-grundlagen,
  .btn-secondary-e-commerce-grundlagen {
    width: 100%;
  }
}

@media (min-width: 769px) and (max-width: 1023px) {
  .marketing-card-e-commerce-grundlagen {
    flex: 1 1 calc(50% - 0.75rem);
  }

  .related-card-e-commerce-grundlagen {
    flex: 1 1 calc(50% - 0.75rem);
  }
}

.main-kundenbindung-strategien {
  width: 100%;
  overflow: hidden;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

p {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

a {
  text-decoration: none;
  transition: all 0.3s ease;
}

strong {
  font-weight: 600;
}

.hero-section-kundenbindung-strategien {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-kundenbindung-strategien::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-kundenbindung-strategien::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.breadcrumbs-kundenbindung-strategien {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.breadcrumb-link-kundenbindung-strategien {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-kundenbindung-strategien:hover {
  color: #06b6d4;
}

.breadcrumb-separator-kundenbindung-strategien {
  color: #6b7280;
  margin: 0 0.25rem;
}

.breadcrumb-current-kundenbindung-strategien {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-kundenbindung-strategien {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-kundenbindung-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-kundenbindung-strategien {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-kundenbindung-strategien i {
  font-size: 1rem;
}

.hero-image-kundenbindung-strategien {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.25);
  display: block;
  object-fit: cover;
}

.intro-section-kundenbindung-strategien {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-kundenbindung-strategien {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
  flex-wrap: wrap;
}

.intro-text-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
}

.intro-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.intro-paragraph-kundenbindung-strategien {
  color: #4b5563;
  margin-bottom: 1.5rem;
  line-height: 1.8;
}

.intro-image-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
  object-fit: cover;
}

@media (max-width: 768px) {
  .intro-content-kundenbindung-strategien {
    flex-direction: column;
  }

  .intro-text-kundenbindung-strategien,
  .intro-image-kundenbindung-strategien {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.foundations-section-kundenbindung-strategien {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.section-header-kundenbindung-strategien {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.section-tag-kundenbindung-strategien {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.foundations-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.foundations-subtitle-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.foundations-grid-kundenbindung-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.foundation-card-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.foundation-card-kundenbindung-strategien:hover {
  background: rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.foundation-number-kundenbindung-strategien {
  font-size: clamp(2.5rem, 4vw, 3.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.foundation-content-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.foundation-title-kundenbindung-strategien {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #ffffff;
  line-height: 1.3;
}

.foundation-text-kundenbindung-strategien {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.7;
}

.strategies-section-kundenbindung-strategien {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.strategies-content-kundenbindung-strategien {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
  flex-wrap: wrap;
}

.strategies-text-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
}

.strategies-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: 1.5rem;
}

.strategies-intro-kundenbindung-strategien {
  color: #4b5563;
  margin-bottom: 2rem;
  font-size: 1rem;
  line-height: 1.7;
}

.strategies-list-kundenbindung-strategien {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.strategy-item-kundenbindung-strategien {
  color: #374151;
  font-size: 0.9375rem;
  line-height: 1.7;
  padding-left: 1.5rem;
  position: relative;
}

.strategy-item-kundenbindung-strategien::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
  font-size: 1.125rem;
}

.strategy-item-kundenbindung-strategien strong {
  color: #111827;
}

.strategies-image-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
  object-fit: cover;
}

@media (max-width: 768px) {
  .strategies-content-kundenbindung-strategien {
    flex-direction: column;
  }

  .strategies-text-kundenbindung-strategien,
  .strategies-image-kundenbindung-strategien {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-kundenbindung-strategien {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-kundenbindung-strategien .section-header-kundenbindung-strategien {
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.implementation-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.implementation-subtitle-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.steps-wrapper-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.step-card-kundenbindung-strategien {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2rem);
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.step-card-kundenbindung-strategien:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateX(8px);
}

.step-number-kundenbindung-strategien {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
  text-align: center;
}

.step-content-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex-grow: 1;
}

.step-title-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.step-text-kundenbindung-strategien {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

.benefits-highlight-kundenbindung-strategien {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-wrapper-kundenbindung-strategien {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
  flex-wrap: wrap;
}

.benefits-image-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
  object-fit: cover;
}

.benefits-text-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 50%;
}

.benefits-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: 2rem;
}

.benefits-quote-kundenbindung-strategien {
  padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 2vw, 1.5rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: 2rem 0;
  border-radius: 8px;
}

.quote-text-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #1e293b;
  line-height: 1.8;
  margin-bottom: 1rem;
  font-style: italic;
}

.quote-author-kundenbindung-strategien {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
  display: block;
}

.benefits-paragraph-kundenbindung-strategien {
  color: #4b5563;
  font-size: 0.9375rem;
  line-height: 1.8;
  margin: 0;
}

@media (max-width: 768px) {
  .benefits-wrapper-kundenbindung-strategien {
    flex-direction: column;
  }

  .benefits-image-kundenbindung-strategien,
  .benefits-text-kundenbindung-strategien {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.metrics-section-kundenbindung-strategien {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.metrics-section-kundenbindung-strategien .section-header-kundenbindung-strategien {
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.metrics-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.metrics-grid-kundenbindung-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.metric-card-kundenbindung-strategien {
  flex: 1 1 250px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.metric-card-kundenbindung-strategien:hover {
  background: rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.metric-name-kundenbindung-strategien {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.metric-description-kundenbindung-strategien {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

.conclusion-section-kundenbindung-strategien {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  gap: 1.5rem;
}

.conclusion-title-kundenbindung-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
}

.conclusion-text-kundenbindung-strategien {
  color: #4b5563;
  font-size: 0.9375rem;
  line-height: 1.8;
  margin: 0;
}

.conclusion-cta-kundenbindung-strategien {
  margin-top: 1.5rem;
}

.cta-button-kundenbindung-strategien {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #06b6d4;
  color: #000000;
  border-radius: 12px;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw, 1rem);
  transition: all 0.3s ease;
}

.cta-button-kundenbindung-strategien:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(6, 182, 212, 0.3);
}

.related-section-kundenbindung-strategien {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.related-title-kundenbindung-strategien {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.related-grid-kundenbindung-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.related-card-kundenbindung-strategien {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-kundenbindung-strategien:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-6px);
  box-shadow: 0 15px 30px rgba(6, 182, 212, 0.2);
}

.related-image-kundenbindung-strategien {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  object-fit: cover;
  display: block;
}

.related-card-title-kundenbindung-strategien {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
  margin: 0;
}

.related-card-text-kundenbindung-strategien {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

.related-link-kundenbindung-strategien {
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.related-link-kundenbindung-strategien:hover {
  color: #22d3ee;
  gap: 0.75rem;
}

.disclaimer-section-kundenbindung-strategien {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  position: relative;
  overflow: hidden;
}

.disclaimer-content-kundenbindung-strategien {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.disclaimer-title-kundenbindung-strategien {
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #111827;
}

.disclaimer-text-kundenbindung-strategien {
  color: #4b5563;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-section-kundenbindung-strategien {
    padding: clamp(3rem, 6vw, 5rem) 0;
  }

  .breadcrumbs-kundenbindung-strategien {
    margin-bottom: 1.5rem;
  }

  .foundations-grid-kundenbindung-strategien,
  .metrics-grid-kundenbindung-strategien,
  .related-grid-kundenbindung-strategien {
    gap: 1rem;
  }

  .foundation-card-kundenbindung-strategien,
  .metric-card-kundenbindung-strategien,
  .related-card-kundenbindung-strategien {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .hero-title-kundenbindung-strategien {
    font-size: 1.5rem;
  }

  .implementations-title-kundenbindung-strategien,
  .strategies-title-kundenbindung-strategien,
  .benefits-title-kundenbindung-strategien,
  .conclusion-title-kundenbindung-strategien {
    font-size: 1.25rem;
  }

  .step-card-kundenbindung-strategien {
    flex-direction: column;
  }

  .step-number-kundenbindung-strategien {
    text-align: left;
  }
}

.main-shop-plattformen-anleitung {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-shop-plattformen-anleitung"] {
  width: 100%;
  overflow: hidden;
}

.hero-section-shop-plattformen-anleitung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
}

.hero-section-shop-plattformen-anleitung::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-shop-plattformen-anleitung::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-shop-plattformen-anleitung {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.breadcrumbs-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-shop-plattformen-anleitung {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-shop-plattformen-anleitung:hover {
  color: #06b6d4;
}

.breadcrumb-separator-shop-plattformen-anleitung {
  color: #475569;
}

.breadcrumb-current-shop-plattformen-anleitung {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-shop-plattformen-anleitung {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  max-width: 900px;
}

.hero-subtitle-shop-plattformen-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.7;
  color: #cbd5e1;
  max-width: 700px;
}

.hero-meta-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: clamp(1.5rem, 3vw, 2rem);
}

.meta-badge-shop-plattformen-anleitung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  border: 1px solid rgba(6, 182, 212, 0.3);
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #06b6d4;
}

.meta-badge-shop-plattformen-anleitung i {
  font-size: 1rem;
}

.hero-image-shop-plattformen-anleitung {
  max-width: 100%;
  height: auto;
  max-height: 450px;
  border-radius: 16px;
  display: block;
  margin-top: clamp(2rem, 4vw, 3rem);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.intro-section-shop-plattformen-anleitung {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.intro-content-shop-plattformen-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.intro-description-shop-plattformen-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #64748b;
  margin-bottom: 1.5rem;
}

.intro-image-shop-plattformen-anleitung img {
  max-width: 100%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  display: block;
}

.features-section-shop-plattformen-anleitung {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.features-header-shop-plattformen-anleitung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.features-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1rem;
}

.features-subtitle-shop-plattformen-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.features-grid-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.feature-card-shop-plattformen-anleitung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.feature-card-shop-plattformen-anleitung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.feature-icon-shop-plattformen-anleitung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  font-size: 1.5rem;
  color: #06b6d4;
}

.feature-card-title-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
}

.feature-card-text-shop-plattformen-anleitung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
}

.content-section-shop-plattformen-anleitung {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.content-wrapper-shop-plattformen-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.content-description-shop-plattformen-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #64748b;
  margin-bottom: 1.5rem;
}

.criteria-list-shop-plattformen-anleitung {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.criteria-item-shop-plattformen-anleitung {
  padding: 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid #06b6d4;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #475569;
}

.criteria-label-shop-plattformen-anleitung {
  color: #1e293b;
  display: block;
  margin-bottom: 0.25rem;
}

.content-image-shop-plattformen-anleitung img {
  max-width: 100%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  display: block;
}

.benefits-section-shop-plattformen-anleitung {
  background: #1f2937;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.benefits-section-shop-plattformen-anleitung::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.benefits-header-shop-plattformen-anleitung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.benefits-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.benefits-subtitle-shop-plattformen-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-grid-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-item-shop-plattformen-anleitung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-item-shop-plattformen-anleitung:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
}

.benefit-number-shop-plattformen-anleitung {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-title-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.benefit-text-shop-plattformen-anleitung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
}

.comparison-section-shop-plattformen-anleitung {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.comparison-wrapper-shop-plattformen-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.comparison-text-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.comparison-image-shop-plattformen-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
}

.comparison-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.comparison-description-shop-plattformen-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #64748b;
  margin-bottom: 2rem;
}

.quote-block-shop-plattformen-anleitung {
  padding: clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
  margin: 2rem 0;
}

.quote-text-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  line-height: 1.6;
  color: #1e293b;
  font-style: italic;
  margin-bottom: 1rem;
}

.quote-author-shop-plattformen-anleitung {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.comparison-image-shop-plattformen-anleitung img {
  max-width: 100%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  display: block;
}

.insights-section-shop-plattformen-anleitung {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.insights-section-shop-plattformen-anleitung::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.insights-header-shop-plattformen-anleitung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.insights-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.insights-subtitle-shop-plattformen-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.insights-grid-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.insight-card-shop-plattformen-anleitung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.insight-card-shop-plattformen-anleitung:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.insight-icon-shop-plattformen-anleitung {
  font-size: 2rem;
  color: #06b6d4;
}

.insight-card-title-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.insight-card-text-shop-plattformen-anleitung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
}

.action-section-shop-plattformen-anleitung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.action-section-shop-plattformen-anleitung::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
}

.action-section-shop-plattformen-anleitung::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.action-content-shop-plattformen-anleitung {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.action-title-shop-plattformen-anleitung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #ffffff;
}

.action-description-shop-plattformen-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #cbd5e1;
}

.action-buttons-shop-plattformen-anleitung {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.btn-primary-shop-plattformen-anleitung,
.btn-secondary-shop-plattformen-anleitung {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.btn-primary-shop-plattformen-anleitung {
  background: #06b6d4;
  color: #0f172a;
}

.btn-primary-shop-plattformen-anleitung:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-shop-plattformen-anleitung {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.btn-secondary-shop-plattformen-anleitung:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-shop-plattformen-anleitung {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-shop-plattformen-anleitung {
  background: #ffffff;
  padding: clamp(1.5rem, 3vw, 2rem);
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  max-width: 900px;
}

.disclaimer-title-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-shop-plattformen-anleitung {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 0.9375rem);
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

.related-section-shop-plattformen-anleitung {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-shop-plattformen-anleitung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.related-title-shop-plattformen-anleitung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-shop-plattformen-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.related-grid-shop-plattformen-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-shop-plattformen-anleitung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.related-card-shop-plattformen-anleitung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-content-shop-plattformen-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-shop-plattformen-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
}

.related-card-text-shop-plattformen-anleitung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
}

.related-card-link-shop-plattformen-anleitung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-shop-plattformen-anleitung:hover {
  color: #22d3ee;
}

.related-card-link-shop-plattformen-anleitung i {
  transition: transform 0.3s ease;
}

.related-card-shop-plattformen-anleitung:hover .related-card-link-shop-plattformen-anleitung i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .intro-content-shop-plattformen-anleitung,
  .content-wrapper-shop-plattformen-anleitung,
  .comparison-wrapper-shop-plattformen-anleitung {
    flex-direction: column;
  }

  .intro-text-shop-plattformen-anleitung,
  .intro-image-shop-plattformen-anleitung,
  .content-text-shop-plattformen-anleitung,
  .content-image-shop-plattformen-anleitung,
  .comparison-text-shop-plattformen-anleitung,
  .comparison-image-shop-plattformen-anleitung {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .features-grid-shop-plattformen-anleitung,
  .benefits-grid-shop-plattformen-anleitung,
  .insights-grid-shop-plattformen-anleitung,
  .related-grid-shop-plattformen-anleitung {
    flex-direction: column;
  }

  .feature-card-shop-plattformen-anleitung,
  .benefit-item-shop-plattformen-anleitung,
  .insight-card-shop-plattformen-anleitung,
  .related-card-shop-plattformen-anleitung {
    flex: 1 1 100%;
    max-width: none;
  }

  .action-buttons-shop-plattformen-anleitung {
    flex-direction: column;
    width: 100%;
  }

  .btn-primary-shop-plattformen-anleitung,
  .btn-secondary-shop-plattformen-anleitung {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .hero-title-shop-plattformen-anleitung {
    font-size: 1.5rem;
  }

  .features-title-shop-plattformen-anleitung,
  .benefits-title-shop-plattformen-anleitung,
  .comparison-title-shop-plattformen-anleitung,
  .insights-title-shop-plattformen-anleitung,
  .action-title-shop-plattformen-anleitung,
  .related-title-shop-plattformen-anleitung {
    font-size: 1.25rem;
  }

  .benefit-number-shop-plattformen-anleitung {
    font-size: 1.75rem;
  }
}

.main-digitales-marketing-grundlagen {
  width: 100%;
  position: relative;
}

.hero-section-digitales-marketing-grundlagen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-digitales-marketing-grundlagen::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-digitales-marketing-grundlagen::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-digitales-marketing-grundlagen {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 2rem;
  font-size: clamp(0.8125rem, 1vw, 0.9375rem);
}

.breadcrumb-link-digitales-marketing-grundlagen {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-digitales-marketing-grundlagen:hover {
  color: #06b6d4;
}

.breadcrumb-separator-digitales-marketing-grundlagen {
  color: #64748b;
}

.breadcrumb-current-digitales-marketing-grundlagen {
  color: #cbd5e1;
}

.hero-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.hero-title-digitales-marketing-grundlagen {
  font-size: clamp(2rem, 6vw, 3.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.1;
  word-wrap: break-word;
}

.hero-subtitle-digitales-marketing-grundlagen {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  line-height: 1.6;
}

.hero-image-digitales-marketing-grundlagen {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
  max-height: 400px;
}

.hero-meta-digitales-marketing-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.meta-badge-digitales-marketing-grundlagen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-digitales-marketing-grundlagen i {
  font-size: 0.9375rem;
}

.introduction-section-digitales-marketing-grundlagen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.introduction-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.introduction-text-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.introduction-paragraph-digitales-marketing-grundlagen {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.introduction-image-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.content-section-one-digitales-marketing-grundlagen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.content-wrapper-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.content-text-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-paragraph-digitales-marketing-grundlagen {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.content-list-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.list-item-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
}

.list-number-digitales-marketing-grundlagen {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.list-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.list-title-digitales-marketing-grundlagen {
  font-size: 1.0625rem;
  color: #1e293b;
  font-weight: 600;
}

.list-text-digitales-marketing-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.content-image-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.content-section-two-digitales-marketing-grundlagen {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-section-two-digitales-marketing-grundlagen::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.content-wrapper-alt-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.content-text-alt-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-title-alt-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-paragraph-alt-digitales-marketing-grundlagen {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.content-quote-digitales-marketing-grundlagen {
  padding: 2rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  margin: 2rem 0;
  border-radius: 8px;
}

.quote-text-digitales-marketing-grundlagen {
  font-size: clamp(1rem, 2vw, 1.1875rem);
  color: #ffffff;
  font-style: italic;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-cite-digitales-marketing-grundlagen {
  font-size: 0.875rem;
  color: #94a3b8;
  font-style: normal;
}

.content-image-alt-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

.channels-section-digitales-marketing-grundlagen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.channels-header-digitales-marketing-grundlagen {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.channels-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.channels-subtitle-digitales-marketing-grundlagen {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.channels-grid-digitales-marketing-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.channel-card-digitales-marketing-grundlagen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.channel-card-digitales-marketing-grundlagen:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 32px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.channel-icon-digitales-marketing-grundlagen {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.15), rgba(59, 130, 246, 0.15));
  border-radius: 10px;
  font-size: 1.5rem;
  color: #06b6d4;
}

.channel-title-digitales-marketing-grundlagen {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
}

.channel-text-digitales-marketing-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.channel-benefits-digitales-marketing-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
}

.benefit-tag-digitales-marketing-grundlagen {
  display: inline-block;
  padding: 0.375rem 0.875rem;
  background: rgba(6, 182, 212, 0.1);
  color: #0891b2;
  border-radius: 16px;
  font-size: 0.8125rem;
  font-weight: 500;
}

.strategy-section-digitales-marketing-grundlagen {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.strategy-section-digitales-marketing-grundlagen::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.strategy-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.strategy-text-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.strategy-paragraph-digitales-marketing-grundlagen {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.strategy-steps-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategy-step-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.06);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.15);
}

.step-number-digitales-marketing-grundlagen {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.step-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-digitales-marketing-grundlagen {
  font-size: 1.0625rem;
  color: #ffffff;
  font-weight: 600;
}

.step-text-digitales-marketing-grundlagen {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.strategy-image-digitales-marketing-grundlagen {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
}

.conclusion-section-digitales-marketing-grundlagen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-digitales-marketing-grundlagen {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.conclusion-text-digitales-marketing-grundlagen {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.conclusion-cta-digitales-marketing-grundlagen {
  margin-top: 2rem;
}

.cta-button-digitales-marketing-grundlagen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 4vw, 2.5rem);
  font-size: clamp(0.9375rem, 1vw, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-digitales-marketing-grundlagen:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-digitales-marketing-grundlagen {
  background: #ffffff;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-digitales-marketing-grundlagen {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f0f9ff;
  border-left: 4px solid #3b82f6;
  border-radius: 8px;
}

.disclaimer-title-digitales-marketing-grundlagen {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-digitales-marketing-grundlagen {
  font-size: 0.9375rem;
  color: #374151;
  line-height: 1.7;
  margin: 0;
}

.related-section-digitales-marketing-grundlagen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-title-digitales-marketing-grundlagen {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  color: #0f172a;
  font-weight: 700;
  margin-bottom: 3rem;
  text-align: center;
}

.related-grid-digitales-marketing-grundlagen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-digitales-marketing-grundlagen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-digitales-marketing-grundlagen:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 28px rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.related-card-content-digitales-marketing-grundlagen {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-digitales-marketing-grundlagen {
  font-size: 1.0625rem;
  color: #1e293b;
  font-weight: 600;
  line-height: 1.3;
}

.related-card-text-digitales-marketing-grundlagen {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-digitales-marketing-grundlagen {
  display: inline-block;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.875rem;
  margin-top: 0.5rem;
  transition: all 0.2s ease;
}

.related-card-digitales-marketing-grundlagen:hover .related-card-link-digitales-marketing-grundlagen {
  color: #0891b2;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .introduction-content-digitales-marketing-grundlagen,
  .content-wrapper-digitales-marketing-grundlagen,
  .content-wrapper-alt-digitales-marketing-grundlagen,
  .strategy-content-digitales-marketing-grundlagen {
    flex-direction: column;
  }

  .introduction-text-digitales-marketing-grundlagen,
  .introduction-image-digitales-marketing-grundlagen,
  .content-text-digitales-marketing-grundlagen,
  .content-image-digitales-marketing-grundlagen,
  .content-text-alt-digitales-marketing-grundlagen,
  .content-image-alt-digitales-marketing-grundlagen,
  .strategy-text-digitales-marketing-grundlagen,
  .strategy-image-digitales-marketing-grundlagen {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .list-item-digitales-marketing-grundlagen {
    flex-direction: column;
    gap: 1rem;
  }

  .list-number-digitales-marketing-grundlagen {
    min-width: auto;
  }

  .channels-grid-digitales-marketing-grundlagen,
  .related-grid-digitales-marketing-grundlagen {
    gap: 1.5rem;
  }

  .channel-card-digitales-marketing-grundlagen,
  .related-card-digitales-marketing-grundlagen {
    flex: 1 1 100%;
    max-width: none;
  }

  .strategy-steps-digitales-marketing-grundlagen {
    gap: 1rem;
  }

  .strategy-step-digitales-marketing-grundlagen {
    padding: 1.25rem;
  }

  .hero-meta-digitales-marketing-grundlagen {
    gap: 0.75rem;
  }

  .meta-badge-digitales-marketing-grundlagen {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-digitales-marketing-grundlagen {
    font-size: 0.75rem;
    gap: 0.5rem;
  }

  .hero-content-digitales-marketing-grundlagen {
    gap: 1.5rem;
  }

  .hero-title-digitales-marketing-grundlagen {
    font-size: 1.5rem;
  }

  .hero-subtitle-digitales-marketing-grundlagen {
    font-size: 0.9375rem;
  }

  .content-title-digitales-marketing-grundlagen,
  .content-title-alt-digitales-marketing-grundlagen,
  .strategy-title-digitales-marketing-grundlagen,
  .channels-title-digitales-marketing-grundlagen,
  .conclusion-title-digitales-marketing-grundlagen {
    font-size: 1.25rem;
  }

  .list-item-digitales-marketing-grundlagen,
  .strategy-step-digitales-marketing-grundlagen {
    padding: 1rem;
    gap: 0.75rem;
  }

  .list-number-digitales-marketing-grundlagen,
  .step-number-digitales-marketing-grundlagen {
    font-size: 1.5rem;
  }

  .channel-card-digitales-marketing-grundlagen {
    padding: 1rem;
  }
}

.main-logistik-versand-anleitung {
  width: 100%;
  overflow: hidden;
}

.hero-section-logistik-versand-anleitung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-logistik-versand-anleitung::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-logistik-versand-anleitung::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
  position: relative;
  z-index: 2;
}

.breadcrumbs-logistik-versand-anleitung {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  font-size: 0.875rem;
}

.breadcrumb-link-logistik-versand-anleitung {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-logistik-versand-anleitung:hover {
  color: #06b6d4;
}

.breadcrumb-separator-logistik-versand-anleitung {
  color: #64748b;
}

.breadcrumb-current-logistik-versand-anleitung {
  color: #cbd5e1;
}

.hero-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.hero-title-logistik-versand-anleitung {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero-subtitle-logistik-versand-anleitung {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  line-height: 1.6;
  max-width: 700px;
}

.hero-meta-logistik-versand-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-logistik-versand-anleitung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-logistik-versand-anleitung i {
  font-size: 1rem;
}

.hero-image-logistik-versand-anleitung {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  margin-top: clamp(1rem, 2vw, 2rem);
  display: block;
}

.introduction-section-logistik-versand-anleitung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.introduction-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.introduction-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-logistik-versand-anleitung {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.intro-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}

.intro-description-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.7;
}

.intro-text-secondary-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.7;
}

.intro-image-logistik-versand-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .introduction-content-logistik-versand-anleitung {
    flex-direction: column;
  }

  .intro-text-logistik-versand-anleitung,
  .intro-image-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.fundamentals-section-logistik-versand-anleitung {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.fundamentals-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.fundamentals-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.fundamentals-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 1rem;
}

.fundamentals-grid-logistik-versand-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.fundamental-card-logistik-versand-anleitung {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.fundamental-card-logistik-versand-anleitung:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.card-number-logistik-versand-anleitung {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.card-title-logistik-versand-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.card-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .fundamental-card-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategies-section-logistik-versand-anleitung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.strategies-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.strategies-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.strategies-text-logistik-versand-anleitung {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategies-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}

.strategies-description-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.7;
}

.strategies-list-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategy-item-logistik-versand-anleitung {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
}

.strategy-icon-logistik-versand-anleitung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
  flex-shrink: 0;
}

.strategy-details-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.strategy-title-logistik-versand-anleitung {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
}

.strategy-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #64748b;
  line-height: 1.6;
}

.strategies-image-logistik-versand-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .strategies-content-logistik-versand-anleitung {
    flex-direction: column;
  }

  .strategies-text-logistik-versand-anleitung,
  .strategies-image-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.optimization-section-logistik-versand-anleitung {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.optimization-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.optimization-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.optimization-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.optimization-split-logistik-versand-anleitung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.optimization-left-logistik-versand-anleitung {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.optimization-subtitle-logistik-versand-anleitung {
  font-size: clamp(1.25rem, 2vw + 0.5rem, 1.5rem);
  font-weight: 600;
  color: #06b6d4;
}

.optimization-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
}

.optimization-list-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.list-item-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #cbd5e1;
  line-height: 1.7;
  padding-left: 1.5rem;
  position: relative;
}

.list-item-logistik-versand-anleitung::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: 700;
}

.list-item-logistik-versand-anleitung strong {
  color: #ffffff;
}

.optimization-image-logistik-versand-anleitung {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .optimization-split-logistik-versand-anleitung {
    flex-direction: column;
  }

  .optimization-left-logistik-versand-anleitung,
  .optimization-image-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.best-practices-section-logistik-versand-anleitung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.best-practices-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.best-practices-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.best-practices-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
  text-align: center;
}

.featured-quote-logistik-versand-anleitung {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: clamp(1.5rem, 3vw, 2rem) 0;
  border-radius: 4px;
}

.quote-text-logistik-versand-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #111827;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-author-logistik-versand-anleitung {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.practices-grid-logistik-versand-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.practice-card-logistik-versand-anleitung {
  flex: 1 1 250px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f1f5f9;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.practice-card-logistik-versand-anleitung:hover {
  background: #ffffff;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.practice-title-logistik-versand-anleitung {
  font-size: clamp(1.0625rem, 2vw, 1.1875rem);
  font-weight: 600;
  color: #1e293b;
}

.practice-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #64748b;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .practice-card-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-logistik-versand-anleitung {
  background: linear-gradient(135deg, #0f172a 0%, #1a2332 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.conclusion-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.conclusion-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
  max-width: 800px;
}

.conclusion-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
}

.action-steps-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  border-radius: 4px;
}

.action-title-logistik-versand-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #06b6d4;
}

.action-list-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.action-item-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #cbd5e1;
  line-height: 1.7;
  padding-left: 2rem;
  position: relative;
  counter-increment: step-counter;
}

.action-item-logistik-versand-anleitung::before {
  content: counter(step-counter);
  position: absolute;
  left: 0;
  width: 1.5rem;
  height: 1.5rem;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.875rem;
}

.action-list-logistik-versand-anleitung {
  counter-reset: step-counter;
}

.action-item-logistik-versand-anleitung strong {
  color: #ffffff;
}

.cta-box-logistik-versand-anleitung {
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 12px;
  text-align: center;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
}

.cta-title-logistik-versand-anleitung {
  font-size: clamp(1.25rem, 2vw + 0.5rem, 1.5rem);
  font-weight: 700;
  color: #ffffff;
}

.cta-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  max-width: 600px;
}

.btn-primary-logistik-versand-anleitung {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  color: #06b6d4;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid #ffffff;
}

.btn-primary-logistik-versand-anleitung:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.related-section-logistik-versand-anleitung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.related-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.related-title-logistik-versand-anleitung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
  text-align: center;
}

.related-subtitle-logistik-versand-anleitung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  text-align: center;
}

.related-grid-logistik-versand-anleitung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-logistik-versand-anleitung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-logistik-versand-anleitung:hover {
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  transform: translateY(-6px);
}

.related-card-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-logistik-versand-anleitung {
  font-size: clamp(1.0625rem, 2vw, 1.1875rem);
  font-weight: 600;
  color: #1e293b;
}

.related-card-text-logistik-versand-anleitung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #64748b;
  line-height: 1.6;
  flex-grow: 1;
}

.related-link-logistik-versand-anleitung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 1rem;
  transition: all 0.3s ease;
}

.related-card-logistik-versand-anleitung:hover .related-link-logistik-versand-anleitung i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-logistik-versand-anleitung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-logistik-versand-anleitung {
  background: #0f172a;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.15);
  overflow: hidden;
}

.disclaimer-section-logistik-versand-anleitung .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.disclaimer-content-logistik-versand-anleitung {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 800px;
}

.disclaimer-title-logistik-versand-anleitung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #06b6d4;
}

.disclaimer-text-logistik-versand-anleitung {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 0.9375rem);
  color: #94a3b8;
  line-height: 1.7;
}

@media (max-width: 768px) {
  .hero-section-logistik-versand-anleitung {
    padding: clamp(2rem, 6vw, 4rem) 0;
  }

  .introduction-section-logistik-versand-anleitung,
  .fundamentals-section-logistik-versand-anleitung,
  .strategies-section-logistik-versand-anleitung,
  .optimization-section-logistik-versand-anleitung,
  .best-practices-section-logistik-versand-anleitung,
  .conclusion-section-logistik-versand-anleitung,
  .related-section-logistik-versand-anleitung {
    padding: clamp(3rem, 6vw, 4rem) 0;
  }
}

@media (max-width: 480px) {
  .hero-title-logistik-versand-anleitung {
    font-size: 1.5rem;
  }

  .fundamentals-title-logistik-versand-anleitung,
  .best-practices-title-logistik-versand-anleitung {
    font-size: 1.375rem;
  }

  .breadcrumbs-logistik-versand-anleitung {
    font-size: 0.8125rem;
  }

  .strategy-item-logistik-versand-anleitung {
    flex-direction: column;
    gap: 1rem;
  }

  .strategy-icon-logistik-versand-anleitung {
    width: 40px;
    height: 40px;
  }
}

.main-zahlungssysteme-sicherheit {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.breadcrumbs-zahlungssysteme-sicherheit {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  margin-bottom: 2rem;
}

.breadcrumb-link-zahlungssysteme-sicherheit {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-zahlungssysteme-sicherheit:hover {
  color: var(--color-primary);
}

.breadcrumb-separator-zahlungssysteme-sicherheit {
  color: #64748b;
}

.breadcrumb-current-zahlungssysteme-sicherheit {
  color: var(--color-primary);
  font-weight: 600;
}

.hero-section-zahlungssysteme-sicherheit {
  background: linear-gradient(135deg, #0a0a1a 0%, #111827 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-zahlungssysteme-sicherheit::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-zahlungssysteme-sicherheit::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #38bdf8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-zahlungssysteme-sicherheit {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-zahlungssysteme-sicherheit {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #38bdf8;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-zahlungssysteme-sicherheit i {
  font-size: 0.875rem;
}

.hero-image-zahlungssysteme-sicherheit {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.intro-section-zahlungssysteme-sicherheit {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  line-height: 1.2;
}

.intro-description-zahlungssysteme-sicherheit {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.intro-image-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-zahlungssysteme-sicherheit {
    flex-direction: column;
  }
  
  .intro-text-zahlungssysteme-sicherheit,
  .intro-image-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.encryption-section-zahlungssysteme-sicherheit {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.encryption-section-zahlungssysteme-sicherheit::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.encryption-header-zahlungssysteme-sicherheit {
  text-align: center;
  margin-bottom: 3rem;
}

.encryption-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.encryption-subtitle-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.encryption-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.encryption-text-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.encryption-subheading-zahlungssysteme-sicherheit {
  font-size: clamp(1.25rem, 3vw + 0.5rem, 1.75rem);
  color: #ffffff;
  line-height: 1.3;
}

.encryption-description-zahlungssysteme-sicherheit {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.encryption-highlight-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid var(--color-primary);
  border-radius: 8px;
  margin-top: 1rem;
}

.encryption-highlight-zahlungssysteme-sicherheit i {
  font-size: 1.5rem;
  color: var(--color-primary);
  flex-shrink: 0;
}

.highlight-text-zahlungssysteme-sicherheit {
  font-size: 0.9375rem;
  color: #e0e0e0;
  margin: 0;
  line-height: 1.6;
}

.encryption-image-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.2);
}

@media (max-width: 768px) {
  .encryption-content-zahlungssysteme-sicherheit {
    flex-direction: column;
  }
  
  .encryption-text-zahlungssysteme-sicherheit,
  .encryption-image-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.standards-section-zahlungssysteme-sicherheit {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.standards-header-zahlungssysteme-sicherheit {
  text-align: center;
  margin-bottom: 3rem;
}

.standards-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.standards-subtitle-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
}

.standards-grid-zahlungssysteme-sicherheit {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 3rem;
}

.standard-card-zahlungssysteme-sicherheit {
  flex: 1 1 250px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.standard-card-zahlungssysteme-sicherheit:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: var(--color-primary);
}

.standard-icon-zahlungssysteme-sicherheit {
  font-size: 2rem;
  color: var(--color-primary);
}

.standard-card-title-zahlungssysteme-sicherheit {
  font-size: 1.125rem;
  color: #0f172a;
  line-height: 1.3;
  font-weight: 600;
}

.standard-card-text-zahlungssysteme-sicherheit {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.standards-content-zahlungssysteme-sicherheit {
  margin-top: 2rem;
}

.standards-image-zahlungssysteme-sicherheit {
  max-width: 100%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .standard-card-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-zahlungssysteme-sicherheit {
  background: #0a0a1a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-zahlungssysteme-sicherheit::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.implementation-header-zahlungssysteme-sicherheit {
  text-align: center;
  margin-bottom: 3rem;
}

.implementation-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  line-height: 1.2;
}

.implementation-steps-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
  position: relative;
  z-index: 1;
}

.step-card-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.step-card-zahlungssysteme-sicherheit:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: var(--color-primary);
  transform: translateX(4px);
}

.step-number-zahlungssysteme-sicherheit {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #ffffff;
  line-height: 1.3;
  font-weight: 600;
}

.step-description-zahlungssysteme-sicherheit {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .step-card-zahlungssysteme-sicherheit {
    flex-direction: column;
    gap: 1rem;
  }
  
  .step-number-zahlungssysteme-sicherheit {
    min-width: auto;
  }
}

.monitoring-section-zahlungssysteme-sicherheit {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.monitoring-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.monitoring-text-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.monitoring-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  line-height: 1.2;
}

.monitoring-description-zahlungssysteme-sicherheit {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.monitoring-quote-zahlungssysteme-sicherheit {
  padding: 2rem;
  border-left: 4px solid var(--color-primary);
  background: #f8fafc;
  margin: 1rem 0 0 0;
  border-radius: 8px;
}

.quote-text-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #0f172a;
  font-style: italic;
  line-height: 1.6;
  margin: 0 0 1rem 0;
}

.quote-author-zahlungssysteme-sicherheit {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.monitoring-image-zahlungssysteme-sicherheit {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .monitoring-content-zahlungssysteme-sicherheit {
    flex-direction: column;
  }
  
  .monitoring-text-zahlungssysteme-sicherheit,
  .monitoring-image-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.cta-section-zahlungssysteme-sicherheit {
  background: linear-gradient(135deg, #0a0a1a 0%, #1a1f35 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-zahlungssysteme-sicherheit::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-zahlungssysteme-sicherheit::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.75rem, 5vw + 1rem, 3rem);
  color: #ffffff;
  line-height: 1.2;
}

.cta-description-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.cta-buttons-zahlungssysteme-sicherheit {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.cta-btn-primary-zahlungssysteme-sicherheit,
.cta-btn-secondary-zahlungssysteme-sicherheit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
  border: 2px solid transparent;
}

.cta-btn-primary-zahlungssysteme-sicherheit {
  background: var(--color-primary);
  color: #0f172a;
}

.cta-btn-primary-zahlungssysteme-sicherheit:hover {
  background: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.cta-btn-secondary-zahlungssysteme-sicherheit {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.cta-btn-secondary-zahlungssysteme-sicherheit:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

@media (max-width: 768px) {
  .cta-buttons-zahlungssysteme-sicherheit {
    flex-direction: column;
    width: 100%;
  }
  
  .cta-btn-primary-zahlungssysteme-sicherheit,
  .cta-btn-secondary-zahlungssysteme-sicherheit {
    width: 100%;
  }
}

.related-section-zahlungssysteme-sicherheit {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-zahlungssysteme-sicherheit {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.related-subtitle-zahlungssysteme-sicherheit {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.related-cards-zahlungssysteme-sicherheit {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-zahlungssysteme-sicherheit {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-zahlungssysteme-sicherheit:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: var(--color-primary);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.related-card-number-zahlungssysteme-sicherheit {
  font-size: 2rem;
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
}

.related-card-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #ffffff;
  line-height: 1.3;
  font-weight: 600;
}

.related-card-description-zahlungssysteme-sicherheit {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-zahlungssysteme-sicherheit {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-link-zahlungssysteme-sicherheit i {
  transition: transform 0.3s ease;
}

.related-card-zahlungssysteme-sicherheit:hover .related-card-link-zahlungssysteme-sicherheit i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-zahlungssysteme-sicherheit {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
  position: relative;
  overflow: hidden;
}

.disclaimer-content-zahlungssysteme-sicherheit {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
}

.disclaimer-title-zahlungssysteme-sicherheit {
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  color: #0f172a;
  line-height: 1.3;
  font-weight: 600;
}

.disclaimer-text-zahlungssysteme-sicherheit {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .related-card-zahlungssysteme-sicherheit {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  h1 {
    font-size: 1.5rem;
  }

  h2 {
    font-size: 1.25rem;
  }

  .hero-image-zahlungssysteme-sicherheit,
  .intro-image-zahlungssysteme-sicherheit,
  .encryption-image-zahlungssysteme-sicherheit,
  .monitoring-image-zahlungssysteme-sicherheit,
  .standards-image-zahlungssysteme-sicherheit {
    max-height: 250px;
  }
}

.main-seo-online-shops {
  width: 100%;
}

.hero-section-seo-online-shops {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-seo-online-shops::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-seo-online-shops::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-seo-online-shops {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.breadcrumbs-seo-online-shops {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 1.5rem;
  font-size: 0.875rem;
}

.breadcrumb-link-seo-online-shops {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-seo-online-shops:hover {
  color: #06b6d4;
}

.breadcrumb-separator-seo-online-shops {
  color: #64748b;
}

.breadcrumb-current-seo-online-shops {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-seo-online-shops {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-seo-online-shops {
  font-size: clamp(1rem, 2vw + 0.25rem, 1.25rem);
  color: #cbd5e1;
  line-height: 1.6;
  max-width: 700px;
}

.hero-meta-seo-online-shops {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem 0;
}

.meta-badge-seo-online-shops {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-seo-online-shops i {
  font-size: 0.875rem;
}

.hero-image-seo-online-shops {
  margin-top: 2rem;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.hero-featured-image-seo-online-shops {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.intro-section-seo-online-shops {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.intro-wrapper-seo-online-shops {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.intro-text-seo-online-shops {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-heading-seo-online-shops {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
}

.intro-paragraph-seo-online-shops {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin: 0;
}

.intro-image-seo-online-shops {
  flex: 1 1 50%;
  min-width: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.intro-featured-image-seo-online-shops {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .intro-wrapper-seo-online-shops {
    flex-direction: column;
  }

  .intro-text-seo-online-shops,
  .intro-image-seo-online-shops {
    flex: 1 1 100%;
  }
}

.fundamentals-section-seo-online-shops {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.fundamentals-header-seo-online-shops {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.fundamentals-title-seo-online-shops {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.fundamentals-subtitle-seo-online-shops {
  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.fundamentals-grid-seo-online-shops {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.fundamentals-card-seo-online-shops {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.fundamentals-card-seo-online-shops:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.fundamentals-card-icon-seo-online-shops {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 12px;
  color: #06b6d4;
  font-size: 1.75rem;
}

.fundamentals-card-title-seo-online-shops {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.fundamentals-card-text-seo-online-shops {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .fundamentals-card-seo-online-shops {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-seo-online-shops {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-seo-online-shops::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.implementation-wrapper-seo-online-shops {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: flex-start;
  position: relative;
  z-index: 1;
}

.implementation-content-seo-online-shops {
  flex: 1 1 45%;
}

.implementation-title-seo-online-shops {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.25;
  margin-bottom: 2rem;
}

.implementation-steps-seo-online-shops {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.implementation-step-seo-online-shops {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.implementation-step-seo-online-shops:hover {
  background: rgba(6, 182, 212, 0.12);
}

.implementation-step-number-seo-online-shops {
  font-size: 2rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  min-width: 50px;
}

.implementation-step-content-seo-online-shops {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.implementation-step-title-seo-online-shops {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.implementation-step-text-seo-online-shops {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.implementation-image-seo-online-shops {
  flex: 1 1 50%;
  min-width: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

.implementation-featured-image-seo-online-shops {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .implementation-wrapper-seo-online-shops {
    flex-direction: column;
  }

  .implementation-content-seo-online-shops,
  .implementation-image-seo-online-shops {
    flex: 1 1 100%;
  }

  .implementation-step-seo-online-shops {
    flex-direction: column;
    gap: 1rem;
  }

  .implementation-step-number-seo-online-shops {
    min-width: auto;
  }
}

.advanced-section-seo-online-shops {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.advanced-header-seo-online-shops {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.advanced-title-seo-online-shops {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.advanced-subtitle-seo-online-shops {
  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.advanced-wrapper-seo-online-shops {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.advanced-text-seo-online-shops {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.advanced-section-heading-seo-online-shops {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
  margin: 1rem 0 0 0;
}

.advanced-paragraph-seo-online-shops {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin: 0;
}

.advanced-quote-seo-online-shops {
  padding: 1.5rem 1.5rem 1.5rem 1.25rem;
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  border-radius: 8px;
  margin: 1rem 0;
}

.advanced-quote-text-seo-online-shops {
  font-size: 1rem;
  font-style: italic;
  color: #0f172a;
  line-height: 1.7;
  margin: 0 0 0.75rem 0;
}

.advanced-quote-author-seo-online-shops {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.advanced-image-seo-online-shops {
  flex: 1 1 50%;
  min-width: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.advanced-featured-image-seo-online-shops {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .advanced-wrapper-seo-online-shops {
    flex-direction: column;
  }

  .advanced-text-seo-online-shops,
  .advanced-image-seo-online-shops {
    flex: 1 1 100%;
  }
}

.monitoring-section-seo-online-shops {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.monitoring-header-seo-online-shops {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.monitoring-title-seo-online-shops {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.monitoring-subtitle-seo-online-shops {
  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.monitoring-grid-seo-online-shops {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.monitoring-item-seo-online-shops {
  flex: 1 1 280px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
  text-align: center;
}

.monitoring-item-seo-online-shops:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.monitoring-item-icon-seo-online-shops {
  font-size: 2.5rem;
  color: #06b6d4;
  line-height: 1;
}

.monitoring-item-title-seo-online-shops {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.monitoring-item-text-seo-online-shops {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .monitoring-item-seo-online-shops {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-seo-online-shops {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-seo-online-shops::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-seo-online-shops {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
  max-width: 600px;
}

.conclusion-title-seo-online-shops {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.25;
}

.conclusion-text-seo-online-shops {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin: 0;
}

.conclusion-cta-seo-online-shops {
  margin-top: 1rem;
}

.conclusion-button-seo-online-shops {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.conclusion-button-seo-online-shops:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.conclusion-image-seo-online-shops {
  flex: 1 1 50%;
  min-width: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

.conclusion-featured-image-seo-online-shops {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  display: block;
}

.conclusion-section-seo-online-shops .container > div {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

@media (max-width: 768px) {
  .conclusion-section-seo-online-shops .container > div {
    flex-direction: column;
  }

  .conclusion-content-seo-online-shops,
  .conclusion-image-seo-online-shops {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-seo-online-shops {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.1);
}

.disclaimer-content-seo-online-shops {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.disclaimer-title-seo-online-shops {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 1rem 0;
}

.disclaimer-text-seo-online-shops {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-seo-online-shops {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-header-seo-online-shops {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.related-title-seo-online-shops {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.related-subtitle-seo-online-shops {
  font-size: clamp(1rem, 1.5vw + 0.25rem, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.related-cards-seo-online-shops {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-seo-online-shops {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 2px solid rgba(6, 182, 212, 0.1);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-seo-online-shops:hover {
  border-color: #06b6d4;
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.related-card-content-seo-online-shops {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-seo-online-shops {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
  margin: 0;
}

.related-card-description-seo-online-shops {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-seo-online-shops {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-seo-online-shops:hover {
  gap: 0.75rem;
  color: #0891b2;
}

.related-card-link-seo-online-shops i {
  font-size: 0.875rem;
}

@media (max-width: 768px) {
  .related-card-seo-online-shops {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .hero-featured-image-seo-online-shops,
  .intro-featured-image-seo-online-shops,
  .implementation-featured-image-seo-online-shops,
  .advanced-featured-image-seo-online-shops,
  .conclusion-featured-image-seo-online-shops {
    max-height: 300px;
  }

  .implementation-step-seo-online-shops {
    padding: 1.25rem;
  }

  .fundamentals-card-seo-online-shops,
  .monitoring-item-seo-online-shops,
  .related-card-seo-online-shops {
    padding: clamp(1.25rem, 2vw, 1.75rem);
  }
}

@media (max-width: 480px) {
  .hero-title-seo-online-shops {
    font-size: 1.5rem;
  }

  .fundamentals-title-seo-online-shops,
  .advanced-title-seo-online-shops,
  .monitoring-title-seo-online-shops,
  .related-title-seo-online-shops {
    font-size: 1.25rem;
  }

  .hero-meta-seo-online-shops {
    flex-direction: column;
    gap: 0.75rem;
  }

  .breadcrumbs-seo-online-shops {
    font-size: 0.75rem;
  }
}

.main-mobile-commerce-optimierung {
  width: 100%;
  background: #ffffff;
}

.hero-section-mobile-commerce-optimierung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-mobile-commerce-optimierung::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-section-mobile-commerce-optimierung::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.breadcrumbs-mobile-commerce-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  position: relative;
  z-index: 1;
}

.breadcrumb-link-mobile-commerce-optimierung {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-mobile-commerce-optimierung:hover {
  color: #06b6d4;
}

.breadcrumb-separator-mobile-commerce-optimierung {
  color: #64748b;
}

.breadcrumb-current-mobile-commerce-optimierung {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-mobile-commerce-optimierung {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.hero-title-mobile-commerce-optimierung {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  color: #ffffff;
  line-height: 1.15;
  max-width: 900px;
}

.hero-subtitle-mobile-commerce-optimierung {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  line-height: 1.6;
}

.hero-meta-mobile-commerce-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1.5rem 0;
}

.meta-badge-mobile-commerce-optimierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-mobile-commerce-optimierung i {
  font-size: 0.875rem;
}

.hero-image-mobile-commerce-optimierung {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  margin-top: 2rem;
  display: block;
  object-fit: cover;
}

.intro-section-mobile-commerce-optimierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-mobile-commerce-optimierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-description-mobile-commerce-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.intro-image-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .intro-content-mobile-commerce-optimierung {
    flex-direction: column;
  }

  .intro-text-mobile-commerce-optimierung,
  .intro-image-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.platforms-section-mobile-commerce-optimierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.platforms-header-mobile-commerce-optimierung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.platforms-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.platforms-subtitle-mobile-commerce-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #4b5563;
  line-height: 1.6;
}

.platforms-grid-mobile-commerce-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.platform-card-mobile-commerce-optimierung {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.platform-card-mobile-commerce-optimierung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.platform-icon-mobile-commerce-optimierung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.platform-card-title-mobile-commerce-optimierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  line-height: 1.3;
}

.platform-card-text-mobile-commerce-optimierung {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .platform-card-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.optimization-section-mobile-commerce-optimierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.optimization-wrapper-mobile-commerce-optimierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.optimization-text-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
}

.optimization-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.optimization-description-mobile-commerce-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.optimization-steps-mobile-commerce-optimierung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.optimization-step-mobile-commerce-optimierung {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.step-number-mobile-commerce-optimierung {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  min-width: 50px;
  flex-shrink: 0;
}

.step-content-mobile-commerce-optimierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-mobile-commerce-optimierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  line-height: 1.3;
}

.step-text-mobile-commerce-optimierung {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.6;
  margin: 0;
}

.optimization-image-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .optimization-wrapper-mobile-commerce-optimierung {
    flex-direction: column;
  }

  .optimization-text-mobile-commerce-optimierung,
  .optimization-image-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.best-practices-section-mobile-commerce-optimierung {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.best-practices-section-mobile-commerce-optimierung::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.best-practices-header-mobile-commerce-optimierung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

.best-practices-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.best-practices-subtitle-mobile-commerce-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  line-height: 1.6;
}

.practices-wrapper-mobile-commerce-optimierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.practices-image-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.practices-content-mobile-commerce-optimierung {
  flex: 1 1 50%;
  max-width: 50%;
}

.practices-subtitle-title-mobile-commerce-optimierung {
  font-size: 1.25rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 1.5rem;
  line-height: 1.3;
}

.featured-quote-mobile-commerce-optimierung {
  padding: 1.5rem 2rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 8px;
  margin: 1.5rem 0;
}

.quote-text-mobile-commerce-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #f1f5f9;
  font-style: italic;
  line-height: 1.6;
  margin-bottom: 1rem;
  margin: 0 0 1rem 0;
}

.quote-author-mobile-commerce-optimierung {
  font-size: 0.875rem;
  color: #94a3af;
  font-style: normal;
}

.practices-list-mobile-commerce-optimierung {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.practice-item-mobile-commerce-optimierung {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
}

.practice-icon-mobile-commerce-optimierung {
  color: #06b6d4;
  font-weight: 700;
  min-width: 24px;
  flex-shrink: 0;
}

.practice-text-mobile-commerce-optimierung {
  margin: 0;
}

@media (max-width: 768px) {
  .practices-wrapper-mobile-commerce-optimierung {
    flex-direction: column;
  }

  .practices-image-mobile-commerce-optimierung,
  .practices-content-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.metrics-section-mobile-commerce-optimierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.metrics-header-mobile-commerce-optimierung {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.metrics-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.metrics-subtitle-mobile-commerce-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #4b5563;
  line-height: 1.6;
}

.metrics-grid-mobile-commerce-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.metric-card-mobile-commerce-optimierung {
  flex: 1 1 250px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  text-align: center;
  transition: all 0.3s ease;
}

.metric-card-mobile-commerce-optimierung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.metric-number-mobile-commerce-optimierung {
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.metric-label-mobile-commerce-optimierung {
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
}

.metric-description-mobile-commerce-optimierung {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.5;
  margin: 0;
}

@media (max-width: 768px) {
  .metric-card-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-mobile-commerce-optimierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-mobile-commerce-optimierung {
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
  text-align: center;
}

.conclusion-text-mobile-commerce-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.conclusion-highlight-mobile-commerce-optimierung {
  padding: 2rem;
  background: #f8fafc;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  margin: 2rem 0;
}

.highlight-text-mobile-commerce-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #111827;
  line-height: 1.8;
  margin: 0;
}

.conclusion-cta-mobile-commerce-optimierung {
  text-align: center;
  margin-top: 2rem;
}

.cta-button-mobile-commerce-optimierung {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-mobile-commerce-optimierung:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-mobile-commerce-optimierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-title-mobile-commerce-optimierung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 2rem;
  text-align: center;
  line-height: 1.2;
}

.related-grid-mobile-commerce-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-mobile-commerce-optimierung {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-mobile-commerce-optimierung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-header-mobile-commerce-optimierung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.related-card-title-mobile-commerce-optimierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
  line-height: 1.3;
}

.related-card-text-mobile-commerce-optimierung {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-mobile-commerce-optimierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-mobile-commerce-optimierung:hover .related-card-link-mobile-commerce-optimierung {
  gap: 1rem;
}

@media (max-width: 768px) {
  .related-card-mobile-commerce-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-mobile-commerce-optimierung {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.1);
}

.disclaimer-content-mobile-commerce-optimierung {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
}

.disclaimer-title-mobile-commerce-optimierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin-bottom: 1rem;
}

.disclaimer-text-mobile-commerce-optimierung {
  font-size: 0.875rem;
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-image-mobile-commerce-optimierung {
    max-height: 300px;
  }

  .optimization-image-mobile-commerce-optimierung,
  .practices-image-mobile-commerce-optimierung {
    max-height: 280px;
  }
}

@media (max-width: 480px) {
  .hero-title-mobile-commerce-optimierung {
    font-size: 1.5rem;
  }

  .hero-subtitle-mobile-commerce-optimierung {
    font-size: 1rem;
  }

  .platforms-title-mobile-commerce-optimierung,
  .optimization-title-mobile-commerce-optimierung {
    font-size: 1.25rem;
  }

  .step-number-mobile-commerce-optimierung {
    font-size: 1.5rem;
  }

  .metric-number-mobile-commerce-optimierung {
    font-size: 2rem;
  }
}

.main-produktfotografie-content {
    width: 100%;
  }

  .hero-section-produktfotografie-content {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    padding: clamp(3rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .hero-section-produktfotografie-content::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -15%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }

  .hero-section-produktfotografie-content::after {
    content: '';
    position: absolute;
    bottom: -20%;
    left: 5%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }

  .breadcrumbs-produktfotografie-content {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 2rem;
    font-size: clamp(0.75rem, 1vw, 0.875rem);
  }

  .breadcrumb-link-produktfotografie-content {
    color: #94a3b8;
    transition: color 0.3s ease;
  }

  .breadcrumb-link-produktfotografie-content:hover {
    color: #06b6d4;
  }

  .breadcrumb-separator-produktfotografie-content {
    color: #475569;
  }

  .breadcrumb-current-produktfotografie-content {
    color: #06b6d4;
    font-weight: 600;
  }

  .hero-content-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto;
  }

  .hero-title-produktfotografie-content {
    font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
    font-weight: 700;
    color: #ffffff;
    line-height: 1.15;
  }

  .hero-description-produktfotografie-content {
    font-size: clamp(1rem, 2vw, 1.125rem);
    color: #cbd5e1;
    line-height: 1.7;
    max-width: 650px;
  }

  .meta-badges-produktfotografie-content {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
  }

  .meta-badge-produktfotografie-content {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: rgba(6, 182, 212, 0.1);
    color: #e0e0e0;
    border-radius: 20px;
    font-size: 0.875rem;
  }

  .meta-badge-produktfotografie-content i {
    color: #06b6d4;
  }

  .hero-image-wrapper-produktfotografie-content {
    width: 100%;
    max-width: 700px;
    margin-top: 1rem;
  }

  .hero-image-produktfotografie-content {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
  }

  .intro-section-produktfotografie-content {
    background: #ffffff;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .intro-content-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center;
  }

  .intro-text-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .intro-image-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .intro-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #0f172a;
    margin-bottom: 1.5rem;
  }

  .intro-text-produktfotografie-content {
    font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
    color: #475569;
    line-height: 1.8;
    margin-bottom: 1.25rem;
  }

  .intro-image-produktfotografie-content {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }

  @media (max-width: 768px) {
    .intro-content-produktfotografie-content {
      flex-direction: column;
    }

    .intro-text-block-produktfotografie-content,
    .intro-image-block-produktfotografie-content {
      flex: 1 1 100%;
      max-width: 100%;
    }
  }

  .essentials-section-produktfotografie-content {
    background: #f8fafc;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .essentials-header-produktfotografie-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto clamp(3rem, 6vw, 4rem);
  }

  .section-tag-produktfotografie-content {
    display: inline-block;
    padding: 0.375rem 1rem;
    background: rgba(6, 182, 212, 0.1);
    color: #06b6d4;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 1rem;
  }

  .essentials-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #0f172a;
    margin-bottom: 1rem;
  }

  .essentials-subtitle-produktfotografie-content {
    font-size: clamp(1rem, 2vw, 1.125rem);
    color: #64748b;
  }

  .essentials-grid-produktfotografie-content {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1.5rem, 3vw, 2.5rem);
  }

  .essential-card-produktfotografie-content {
    flex: 1 1 300px;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: clamp(1.5rem, 3vw, 2rem);
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
  }

  .essential-card-produktfotografie-content:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
    border-color: #06b6d4;
  }

  .essential-number-produktfotografie-content {
    font-size: 2.5rem;
    font-weight: 800;
    background: linear-gradient(135deg, #06b6d4, #3b82f6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
  }

  .essential-content-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .essential-card-title-produktfotografie-content {
    font-size: 1.125rem;
    color: #0f172a;
    font-weight: 600;
  }

  .essential-card-text-produktfotografie-content {
    font-size: 0.9375rem;
    color: #475569;
    line-height: 1.7;
  }

  @media (max-width: 768px) {
    .essential-card-produktfotografie-content {
      flex: 1 1 100%;
      max-width: none;
    }
  }

  .techniques-section-produktfotografie-content {
    background: #0f172a;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .techniques-section-produktfotografie-content::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }

  .techniques-content-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center;
    position: relative;
    z-index: 1;
  }

  .techniques-text-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .techniques-image-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .techniques-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #ffffff;
    margin-bottom: 1.5rem;
  }

  .techniques-text-produktfotografie-content {
    font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
    color: #cbd5e1;
    line-height: 1.8;
    margin-bottom: 2rem;
  }

  .technique-highlight-produktfotografie-content {
    background: rgba(6, 182, 212, 0.08);
    border-left: 4px solid #06b6d4;
    padding: 1.5rem;
    border-radius: 8px;
    margin-top: 1.5rem;
  }

  .highlight-title-produktfotografie-content {
    font-size: 1rem;
    color: #ffffff;
    margin-bottom: 1rem;
    font-weight: 600;
  }

  .technique-list-produktfotografie-content {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .technique-item-produktfotografie-content {
    font-size: 0.9375rem;
    color: #e0e0e0;
    line-height: 1.6;
    padding-left: 1.5rem;
    position: relative;
  }

  .technique-item-produktfotografie-content::before {
    content: '';
    position: absolute;
    left: 0;
    color: #06b6d4;
    font-weight: bold;
  }

  .techniques-image-produktfotografie-content {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  }

  @media (max-width: 768px) {
    .techniques-content-produktfotografie-content {
      flex-direction: column;
    }

    .techniques-text-block-produktfotografie-content,
    .techniques-image-block-produktfotografie-content {
      flex: 1 1 100%;
      max-width: 100%;
    }
  }

  .editing-section-produktfotografie-content {
    background: #ffffff;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .editing-header-produktfotografie-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto clamp(3rem, 6vw, 4rem);
  }

  .editing-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #0f172a;
    margin-bottom: 1rem;
  }

  .editing-subtitle-produktfotografie-content {
    font-size: clamp(1rem, 2vw, 1.125rem);
    color: #64748b;
  }

  .editing-content-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center;
  }

  .editing-image-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .editing-text-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .editing-image-produktfotografie-content {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }

  .editing-section-title-produktfotografie-content {
    font-size: 1.25rem;
    color: #0f172a;
    margin-bottom: 2rem;
    font-weight: 600;
  }

  .editing-steps-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .step-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.25rem;
    background: #f8fafc;
    border-radius: 8px;
    border-left: 4px solid #06b6d4;
  }

  .step-number-produktfotografie-content {
    font-size: 1.25rem;
    font-weight: 700;
    color: #06b6d4;
  }

  .step-text-produktfotografie-content {
    font-size: 0.9375rem;
    color: #475569;
    line-height: 1.6;
  }

  @media (max-width: 768px) {
    .editing-content-produktfotografie-content {
      flex-direction: column;
    }

    .editing-image-block-produktfotografie-content,
    .editing-text-block-produktfotografie-content {
      flex: 1 1 100%;
      max-width: 100%;
    }
  }

  .platform-section-produktfotografie-content {
    background: #f8fafc;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .platform-content-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center;
  }

  .platform-text-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .platform-image-block-produktfotografie-content {
    flex: 1 1 50%;
    max-width: 50%;
  }

  .platform-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #0f172a;
    margin-bottom: 1.5rem;
  }

  .platform-text-produktfotografie-content {
    font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
    color: #475569;
    line-height: 1.8;
    margin-bottom: 2rem;
  }

  .featured-quote-produktfotografie-content {
    padding: 2rem 2rem 2rem 2.5rem;
    border-left: 4px solid #06b6d4;
    background: #ffffff;
    border-radius: 8px;
    margin: 2rem 0;
    font-style: italic;
  }

  .quote-text-produktfotografie-content {
    font-size: clamp(1.0625rem, 2vw, 1.25rem);
    color: #1e293b;
    margin-bottom: 1rem;
    line-height: 1.6;
  }

  .quote-author-produktfotografie-content {
    font-size: 0.875rem;
    color: #64748b;
    font-style: normal;
  }

  .platform-image-produktfotografie-content {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  }

  @media (max-width: 768px) {
    .platform-content-produktfotografie-content {
      flex-direction: column;
    }

    .platform-text-block-produktfotografie-content,
    .platform-image-block-produktfotografie-content {
      flex: 1 1 100%;
      max-width: 100%;
    }
  }

  .best-practices-section-produktfotografie-content {
    background: #0f172a;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .best-practices-section-produktfotografie-content::before {
    content: '';
    position: absolute;
    top: -30%;
    left: -15%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }

  .best-practices-header-produktfotografie-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto clamp(3rem, 6vw, 4rem);
    position: relative;
    z-index: 1;
  }

  .best-practices-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #ffffff;
    margin-bottom: 1rem;
  }

  .practices-grid-produktfotografie-content {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    position: relative;
    z-index: 1;
  }

  .practice-card-produktfotografie-content {
    flex: 1 1 300px;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: clamp(1.5rem, 3vw, 2rem);
    background: rgba(6, 182, 212, 0.08);
    border: 1px solid rgba(6, 182, 212, 0.2);
    border-radius: 12px;
    transition: all 0.3s ease;
  }

  .practice-card-produktfotografie-content:hover {
    background: rgba(6, 182, 212, 0.12);
    border-color: #06b6d4;
    transform: translateY(-4px);
  }

  .practice-icon-produktfotografie-content {
    font-size: 2rem;
    color: #06b6d4;
  }

  .practice-card-title-produktfotografie-content {
    font-size: 1.125rem;
    color: #ffffff;
    font-weight: 600;
  }

  .practice-card-text-produktfotografie-content {
    font-size: 0.9375rem;
    color: #cbd5e1;
    line-height: 1.6;
  }

  @media (max-width: 768px) {
    .practice-card-produktfotografie-content {
      flex: 1 1 100%;
      max-width: none;
    }
  }

  .conclusion-section-produktfotografie-content {
    background: #ffffff;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .conclusion-content-produktfotografie-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
  }

  .conclusion-title-produktfotografie-content {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
    color: #0f172a;
    margin-bottom: 2rem;
  }

  .conclusion-text-produktfotografie-content {
    font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
    color: #475569;
    line-height: 1.8;
    margin-bottom: 1.5rem;
  }

  .conclusion-cta-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: 1.5rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 2.5rem;
  }

  .btn-primary-produktfotografie-content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-weight: 600;
    background: #06b6d4;
    color: #0f172a;
    border-radius: 8px;
    transition: all 0.3s ease;
    text-decoration: none;
  }

  .btn-primary-produktfotografie-content:hover {
    background: #22d3ee;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(6, 182, 212, 0.3);
  }

  .btn-outline-produktfotografie-content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-weight: 600;
    background: transparent;
    color: #06b6d4;
    border: 2px solid #06b6d4;
    border-radius: 8px;
    transition: all 0.3s ease;
    text-decoration: none;
  }

  .btn-outline-produktfotografie-content:hover {
    background: rgba(6, 182, 212, 0.1);
    transform: translateY(-2px);
  }

  .disclaimer-section-produktfotografie-content {
    background: #f0f9ff;
    border-top: 2px solid #06b6d4;
    border-bottom: 2px solid #06b6d4;
    padding: clamp(2.5rem, 6vw, 4rem) 0;
    position: relative;
    overflow: hidden;
  }

  .disclaimer-content-produktfotografie-content {
    display: flex;
    flex-direction: row;
    gap: 1.5rem;
    align-items: flex-start;
  }

  .disclaimer-icon-produktfotografie-content {
    font-size: 1.5rem;
    color: #06b6d4;
    flex-shrink: 0;
    margin-top: 0.25rem;
  }

  .disclaimer-text-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex: 1;
  }

  .disclaimer-title-produktfotografie-content {
    font-size: 1rem;
    color: #0c4a6e;
    font-weight: 600;
  }

  .disclaimer-text-produktfotografie-content p {
    font-size: 0.9375rem;
    color: #0c4a6e;
    line-height: 1.6;
    margin: 0;
  }

  @media (max-width: 768px) {
    .disclaimer-content-produktfotografie-content {
      flex-direction: column;
    }

    .disclaimer-icon-produktfotografie-content {
      margin-top: 0;
    }
  }

  .related-section-produktfotografie-content {
    background: #f8fafc;
    padding: clamp(4rem, 8vw, 6rem) 0;
    position: relative;
    overflow: hidden;
  }

  .related-header-produktfotografie-content {
    text-align: center;
    max-width: 700px;
    margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
  }

  .related-title-produktfotografie-content {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    color: #0f172a;
    margin-bottom: 0.75rem;
  }

  .related-subtitle-produktfotografie-content {
    font-size: clamp(0.9375rem, 1vw, 1rem);
    color: #64748b;
  }

  .related-cards-produktfotografie-content {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(1.5rem, 3vw, 2rem);
  }

  .related-card-produktfotografie-content {
    flex: 1 1 300px;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
    overflow: hidden;
    text-decoration: none;
  }

  .related-card-produktfotografie-content:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
    border-color: #06b6d4;
  }

  .related-card-content-produktfotografie-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: clamp(1.5rem, 3vw, 2rem);
  }

  .related-card-title-produktfotografie-content {
    font-size: 1.125rem;
    color: #0f172a;
    font-weight: 600;
  }

  .related-card-text-produktfotografie-content {
    font-size: 0.9375rem;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
  }

  .related-card-link-produktfotografie-content {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #06b6d4;
    font-weight: 600;
    font-size: 0.9375rem;
    margin-top: 0.5rem;
  }

  .related-card-link-produktfotografie-content i {
    transition: transform 0.3s ease;
  }

  .related-card-produktfotografie-content:hover .related-card-link-produktfotografie-content i {
    transform: translateX(4px);
  }

  @media (max-width: 768px) {
    .related-card-produktfotografie-content {
      flex: 1 1 100%;
      max-width: none;
    }
  }

  @media (max-width: 480px) {
    .breadcrumbs-produktfotografie-content {
      font-size: 0.75rem;
    }

    .hero-title-produktfotografie-content {
      font-size: 1.5rem;
    }

    .conclusion-cta-produktfotografie-content {
      flex-direction: column;
    }

    .btn-primary-produktfotografie-content,
    .btn-outline-produktfotografie-content {
      width: 100%;
    }
  }

.main-conversion-rate-optimierung {
  width: 100%;
  background: #ffffff;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-conversion-rate-optimierung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-conversion-rate-optimierung::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-section-conversion-rate-optimierung::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-content-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.breadcrumbs-conversion-rate-optimierung {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-conversion-rate-optimierung {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-conversion-rate-optimierung:hover {
  color: #06b6d4;
}

.breadcrumb-separator-conversion-rate-optimierung {
  color: #6b7280;
}

.breadcrumb-current-conversion-rate-optimierung {
  color: #06b6d4;
  font-weight: 500;
}

.hero-title-conversion-rate-optimierung {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-conversion-rate-optimierung {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  line-height: 1.6;
}

.article-meta-conversion-rate-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1.5rem 0;
}

.meta-badge-conversion-rate-optimierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-conversion-rate-optimierung i {
  font-size: 0.875rem;
}

.hero-image-conversion-rate-optimierung {
  width: 100%;
  max-width: 700px;
  margin-top: 2rem;
  border-radius: 16px;
  overflow: hidden;
}

.hero-image-conversion-rate-optimierung img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
}

.intro-section-conversion-rate-optimierung {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-conversion-rate-optimierung {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  flex-wrap: wrap;
}

.intro-text-conversion-rate-optimierung {
  flex: 1 1 400px;
  min-width: 300px;
}

.intro-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-description-conversion-rate-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.intro-image-conversion-rate-optimierung {
  flex: 1 1 350px;
  min-width: 300px;
  border-radius: 12px;
  overflow: hidden;
}

.intro-image-conversion-rate-optimierung img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}

.steps-section-conversion-rate-optimierung {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.steps-header-conversion-rate-optimierung {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.steps-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
}

.steps-subtitle-conversion-rate-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.steps-list-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.step-item-conversion-rate-optimierung {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2rem);
  padding: clamp(1.25rem, 2vw, 1.75rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.step-number-conversion-rate-optimierung {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  flex-shrink: 0;
  min-width: 60px;
  line-height: 1;
}

.step-content-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-conversion-rate-optimierung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #111827;
}

.step-text-conversion-rate-optimierung {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.tactics-section-conversion-rate-optimierung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.tactics-section-conversion-rate-optimierung::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.tactics-header-conversion-rate-optimierung {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.tactics-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.tactics-subtitle-conversion-rate-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.tactics-grid-conversion-rate-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.tactic-card-conversion-rate-optimierung {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.tactic-card-conversion-rate-optimierung:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.tactic-icon-conversion-rate-optimierung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  font-size: 1.5rem;
  color: #06b6d4;
}

.tactic-card-title-conversion-rate-optimierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.tactic-card-text-conversion-rate-optimierung {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.optimization-section-conversion-rate-optimierung {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.optimization-wrapper-conversion-rate-optimierung {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  flex-wrap: wrap;
}

.optimization-text-conversion-rate-optimierung {
  flex: 1 1 400px;
  min-width: 300px;
}

.optimization-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.optimization-description-conversion-rate-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.optimization-list-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.list-item-conversion-rate-optimierung {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.list-number-conversion-rate-optimierung {
  font-size: 1.5rem;
  font-weight: 700;
  color: #06b6d4;
  flex-shrink: 0;
  min-width: 30px;
}

.list-content-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.list-title-conversion-rate-optimierung {
  font-size: 1rem;
  color: #111827;
  font-weight: 600;
}

.list-text-conversion-rate-optimierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.optimization-image-conversion-rate-optimierung {
  flex: 1 1 350px;
  min-width: 300px;
  border-radius: 12px;
  overflow: hidden;
}

.optimization-image-conversion-rate-optimierung img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}

.metrics-section-conversion-rate-optimierung {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.metrics-header-conversion-rate-optimierung {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.metrics-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
}

.metrics-subtitle-conversion-rate-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  line-height: 1.6;
  margin-bottom: 2rem;
}

.featured-quote-conversion-rate-optimierung {
  padding: clamp(2rem, 4vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  margin: clamp(2rem, 4vw, 3rem) 0;
  border-radius: 8px;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.quote-text-conversion-rate-optimierung {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #111827;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-author-conversion-rate-optimierung {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.metrics-grid-conversion-rate-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.metric-item-conversion-rate-optimierung {
  flex: 1 1 250px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-align: center;
  transition: all 0.3s ease;
}

.metric-item-conversion-rate-optimierung:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
}

.metric-number-conversion-rate-optimierung {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
}

.metric-label-conversion-rate-optimierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.cta-section-conversion-rate-optimierung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-conversion-rate-optimierung::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-conversion-rate-optimierung::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-conversion-rate-optimierung {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-conversion-rate-optimierung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.cta-description-conversion-rate-optimierung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
}

.cta-buttons-conversion-rate-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.btn-primary-conversion-rate-optimierung,
.btn-secondary-conversion-rate-optimierung {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
  border: 2px solid transparent;
}

.btn-primary-conversion-rate-optimierung {
  background: #06b6d4;
  color: #111827;
}

.btn-primary-conversion-rate-optimierung:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-conversion-rate-optimierung {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.btn-secondary-conversion-rate-optimierung:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-conversion-rate-optimierung {
  background: #f8fafc;
  padding: clamp(2rem, 4vw, 4rem) 0;
  position: relative;
  overflow: hidden;
}

.disclaimer-content-conversion-rate-optimierung {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-left: 4px solid #fbbf24;
  border-radius: 8px;
}

.disclaimer-title-conversion-rate-optimierung {
  font-size: 1.25rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
}

.disclaimer-text-conversion-rate-optimierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-conversion-rate-optimierung {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-conversion-rate-optimierung {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.related-title-conversion-rate-optimierung {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 0.5rem;
}

.related-subtitle-conversion-rate-optimierung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.related-grid-conversion-rate-optimierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-conversion-rate-optimierung {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-card-conversion-rate-optimierung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  background: #ffffff;
}

.related-card-title-conversion-rate-optimierung {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #111827;
  margin: 0;
}

.related-card-text-conversion-rate-optimierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-link-conversion-rate-optimierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-conversion-rate-optimierung:hover .related-link-conversion-rate-optimierung {
  gap: 0.75rem;
}

.related-link-conversion-rate-optimierung i {
  font-size: 0.75rem;
}

@media (max-width: 768px) {
  .intro-content-conversion-rate-optimierung,
  .optimization-wrapper-conversion-rate-optimierung {
    flex-direction: column;
  }

  .intro-text-conversion-rate-optimierung,
  .intro-image-conversion-rate-optimierung,
  .optimization-text-conversion-rate-optimierung,
  .optimization-image-conversion-rate-optimierung {
    flex: 1 1 100%;
    min-width: auto;
  }

  .step-item-conversion-rate-optimierung {
    flex-direction: column;
    align-items: flex-start;
  }

  .tactic-card-conversion-rate-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }

  .metric-item-conversion-rate-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }

  .cta-buttons-conversion-rate-optimierung {
    flex-direction: column;
  }

  .btn-primary-conversion-rate-optimierung,
  .btn-secondary-conversion-rate-optimierung {
    width: 100%;
  }

  .related-card-conversion-rate-optimierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .hero-title-conversion-rate-optimierung {
    font-size: 1.5rem;
  }

  .steps-title-conversion-rate-optimierung,
  .tactics-title-conversion-rate-optimierung,
  .metrics-title-conversion-rate-optimierung,
  .cta-title-conversion-rate-optimierung {
    font-size: 1.25rem;
  }

  .article-meta-conversion-rate-optimierung {
    flex-direction: column;
    align-items: center;
  }
}

.main-datenanalyse-business-intelligence {
  width: 100%;
  background: #ffffff;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-datenanalyse-business-intelligence {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-datenanalyse-business-intelligence::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-datenanalyse-business-intelligence::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-datenanalyse-business-intelligence {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-datenanalyse-business-intelligence {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-datenanalyse-business-intelligence:hover {
  color: #06b6d4;
}

.breadcrumb-separator-datenanalyse-business-intelligence {
  color: #64748b;
  margin: 0 0.25rem;
}

.breadcrumb-current-datenanalyse-business-intelligence {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 2;
}

.hero-title-datenanalyse-business-intelligence {
  font-size: clamp(2rem, 5vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #9ca3af;
  max-width: 650px;
  margin: 0;
}

.hero-meta-datenanalyse-business-intelligence {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: clamp(0.5rem, 2vw, 1rem) 0;
}

.meta-badge-datenanalyse-business-intelligence {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-datenanalyse-business-intelligence i {
  font-size: 0.875rem;
}

.hero-image-datenanalyse-business-intelligence {
  max-width: 100%;
  max-height: 400px;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  display: block;
}

.introduction-section-datenanalyse-business-intelligence {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.introduction-content-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-heading-datenanalyse-business-intelligence {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.introduction-paragraph-datenanalyse-business-intelligence {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

.introduction-image-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
}

.fundamentals-section-datenanalyse-business-intelligence {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.fundamentals-header-datenanalyse-business-intelligence {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.section-tag-datenanalyse-business-intelligence {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.fundamentals-title-datenanalyse-business-intelligence {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.fundamentals-subtitle-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 650px;
  margin: 0 auto;
}

.fundamentals-grid-datenanalyse-business-intelligence {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.fundamental-card-datenanalyse-business-intelligence {
  flex: 1 1 250px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.fundamental-card-datenanalyse-business-intelligence:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
}

.fundamental-number-datenanalyse-business-intelligence {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.fundamental-title-datenanalyse-business-intelligence {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.fundamental-text-datenanalyse-business-intelligence {
  font-size: 0.9375rem;
  color: #9ca3af;
  line-height: 1.6;
  margin: 0;
}

.practical-section-datenanalyse-business-intelligence {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.practical-wrapper-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.practical-text-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
}

.practical-title-datenanalyse-business-intelligence {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.quote-block-datenanalyse-business-intelligence {
  padding: clamp(1.5rem, 3vw, 2rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: 1.5rem 0;
  border-radius: 8px;
}

.quote-text-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #111827;
  font-style: italic;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-cite-datenanalyse-business-intelligence {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.practical-paragraph-datenanalyse-business-intelligence {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

.practical-list-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 1.5rem 0;
  padding-left: 1.5rem;
}

.practical-list-item-datenanalyse-business-intelligence {
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
  position: relative;
  padding-left: 1rem;
}

.practical-list-item-datenanalyse-business-intelligence::before {
  content: '';
  position: absolute;
  left: -1.5rem;
  color: #06b6d4;
  font-weight: bold;
  font-size: 1.125rem;
}

.practical-image-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
}

.tools-section-datenanalyse-business-intelligence {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.tools-header-datenanalyse-business-intelligence {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.tools-title-datenanalyse-business-intelligence {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.tools-subtitle-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 650px;
  margin: 0 auto;
}

.tools-grid-datenanalyse-business-intelligence {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-card-datenanalyse-business-intelligence {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.tool-card-datenanalyse-business-intelligence:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.tool-icon-datenanalyse-business-intelligence {
  font-size: 2rem;
  color: #06b6d4;
}

.tool-name-datenanalyse-business-intelligence {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.tool-description-datenanalyse-business-intelligence {
  font-size: 0.9375rem;
  color: #9ca3af;
  line-height: 1.6;
  margin: 0;
}

.strategy-section-datenanalyse-business-intelligence {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.strategy-wrapper-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.strategy-image-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 400px;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  display: block;
}

.strategy-text-datenanalyse-business-intelligence {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-title-datenanalyse-business-intelligence {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.strategy-paragraph-datenanalyse-business-intelligence {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.strategy-steps-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.strategy-step-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: flex-start;
  padding: 1rem;
  background: #ffffff;
  border-radius: 8px;
  border-left: 4px solid #06b6d4;
}

.step-number-datenanalyse-business-intelligence {
  font-size: 1.5rem;
  font-weight: 700;
  color: #06b6d4;
  min-width: 40px;
}

.step-content-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-datenanalyse-business-intelligence {
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
}

.step-text-datenanalyse-business-intelligence {
  font-size: 0.9375rem;
  color: #475569;
  margin: 0;
}

.benefits-section-datenanalyse-business-intelligence {
  background: linear-gradient(135deg, #0f172a 0%, #1a1f3a 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-datenanalyse-business-intelligence::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-datenanalyse-business-intelligence {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.benefits-title-datenanalyse-business-intelligence {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.benefits-subtitle-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 650px;
  margin: 0 auto;
}

.benefits-grid-datenanalyse-business-intelligence {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-box-datenanalyse-business-intelligence {
  flex: 1 1 250px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  text-align: center;
  transition: all 0.3s ease;
}

.benefit-box-datenanalyse-business-intelligence:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
}

.benefit-number-datenanalyse-business-intelligence {
  font-size: clamp(2.5rem, 4vw, 3.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-label-datenanalyse-business-intelligence {
  font-size: clamp(0.95rem, 1.5vw, 1.0625rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.benefit-text-datenanalyse-business-intelligence {
  font-size: 0.875rem;
  color: #9ca3af;
  line-height: 1.6;
  margin: 0;
}

.cta-section-datenanalyse-business-intelligence {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-datenanalyse-business-intelligence::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-datenanalyse-business-intelligence::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-datenanalyse-business-intelligence {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.cta-text-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-datenanalyse-business-intelligence {
  display: flex;
  flex-direction: row;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.cta-button-primary-datenanalyse-business-intelligence,
.cta-button-secondary-datenanalyse-business-intelligence {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  cursor: pointer;
}

.cta-button-primary-datenanalyse-business-intelligence {
  background: #06b6d4;
  color: #0f172a;
}

.cta-button-primary-datenanalyse-business-intelligence:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.cta-button-secondary-datenanalyse-business-intelligence {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.cta-button-secondary-datenanalyse-business-intelligence:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-datenanalyse-business-intelligence {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-datenanalyse-business-intelligence {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
}

.disclaimer-title-datenanalyse-business-intelligence {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 600;
  color: #111827;
  margin-bottom: 1rem;
}

.disclaimer-text-datenanalyse-business-intelligence {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.related-section-datenanalyse-business-intelligence {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-datenanalyse-business-intelligence {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.related-title-datenanalyse-business-intelligence {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.related-subtitle-datenanalyse-business-intelligence {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.related-grid-datenanalyse-business-intelligence {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-datenanalyse-business-intelligence {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-datenanalyse-business-intelligence:hover {
  border-color: #06b6d4;
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.related-card-title-datenanalyse-business-intelligence {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #111827;
  line-height: 1.3;
}

.related-card-text-datenanalyse-business-intelligence {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-link-datenanalyse-business-intelligence {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: auto;
  transition: all 0.3s ease;
}

.related-card-datenanalyse-business-intelligence:hover .related-link-datenanalyse-business-intelligence {
  gap: 0.75rem;
}

.related-link-datenanalyse-business-intelligence i {
  transition: transform 0.3s ease;
}

.related-card-datenanalyse-business-intelligence:hover .related-link-datenanalyse-business-intelligence i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .introduction-content-datenanalyse-business-intelligence,
  .practical-wrapper-datenanalyse-business-intelligence,
  .strategy-wrapper-datenanalyse-business-intelligence {
    flex-direction: column;
  }

  .introduction-text-datenanalyse-business-intelligence,
  .introduction-image-datenanalyse-business-intelligence,
  .practical-text-datenanalyse-business-intelligence,
  .practical-image-datenanalyse-business-intelligence,
  .strategy-image-datenanalyse-business-intelligence,
  .strategy-text-datenanalyse-business-intelligence {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .fundamentals-grid-datenanalyse-business-intelligence,
  .tools-grid-datenanalyse-business-intelligence,
  .benefits-grid-datenanalyse-business-intelligence,
  .related-grid-datenanalyse-business-intelligence {
    flex-direction: column;
  }

  .fundamental-card-datenanalyse-business-intelligence,
  .tool-card-datenanalyse-business-intelligence,
  .benefit-box-datenanalyse-business-intelligence,
  .related-card-datenanalyse-business-intelligence {
    flex: 1 1 100%;
    max-width: none;
  }

  .cta-buttons-datenanalyse-business-intelligence {
    flex-direction: column;
  }

  .cta-button-primary-datenanalyse-business-intelligence,
  .cta-button-secondary-datenanalyse-business-intelligence {
    width: 100%;
  }

  .strategy-steps-datenanalyse-business-intelligence {
    margin-top: 1.5rem;
  }

  .breadcrumbs-datenanalyse-business-intelligence {
    font-size: 0.75rem;
  }
}

@media (max-width: 480px) {
  .hero-title-datenanalyse-business-intelligence {
    font-size: 1.5rem;
  }

  .fundamentals-title-datenanalyse-business-intelligence,
  .tools-title-datenanalyse-business-intelligence,
  .benefits-title-datenanalyse-business-intelligence,
  .related-title-datenanalyse-business-intelligence {
    font-size: 1.5rem;
  }

  .hero-meta-datenanalyse-business-intelligence {
    flex-direction: column;
  }

  .meta-badge-datenanalyse-business-intelligence {
    width: 100%;
    justify-content: center;
  }
}

.main-internationaler-e-commerce {
  width: 100%;
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 5vw, 2rem);
}

.hero-section-internationaler-e-commerce {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-internationaler-e-commerce::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-section-internationaler-e-commerce::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-content-internationaler-e-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 1;
}

.breadcrumbs-internationaler-e-commerce {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: clamp(1rem, 2vw, 2rem);
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-internationaler-e-commerce {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-internationaler-e-commerce:hover {
  color: #06b6d4;
}

.breadcrumb-separator-internationaler-e-commerce {
  color: #6b7280;
}

.breadcrumb-current-internationaler-e-commerce {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-internationaler-e-commerce {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  max-width: 800px;
  margin: 0;
}

.hero-subtitle-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0;
  line-height: 1.6;
}

.hero-meta-internationaler-e-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1rem);
  justify-content: center;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-internationaler-e-commerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem clamp(0.75rem, 2vw, 1rem);
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
  white-space: nowrap;
}

.meta-badge-internationaler-e-commerce i {
  font-size: 0.9rem;
}

.hero-image-internationaler-e-commerce {
  max-width: 100%;
  height: auto;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  display: block;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.introduction-section-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.introduction-content-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-lead-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #111827;
  font-weight: 600;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
}

.introduction-body-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

.introduction-image-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.introduction-image-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.content-section-one-internationaler-e-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-one-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-one-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-one-internationaler-e-commerce {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.section-paragraph-one-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.25rem) 0;
}

.highlight-box-one-internationaler-e-commerce {
  padding: clamp(1rem, 2vw, 1.5rem);
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  margin-top: clamp(1.25rem, 2vw, 1.75rem);
}

.highlight-text-one-internationaler-e-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #0f172a;
  margin: 0;
  line-height: 1.6;
}

.content-image-one-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.content-image-one-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.content-section-two-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-two-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-image-two-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  order: -1;
}

.content-image-two-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.content-text-two-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-two-internationaler-e-commerce {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.section-paragraph-two-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.25rem) 0;
}

.logistics-list-internationaler-e-commerce {
  list-style: none;
  padding: 0;
  margin: clamp(1.5rem, 2vw, 2rem) 0 0 0;
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1vw, 1rem);
}

.list-item-internationaler-e-commerce {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #374151;
  line-height: 1.6;
  padding-left: 0;
}

.list-item-internationaler-e-commerce::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.content-section-three-internationaler-e-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-three-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-three-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-three-internationaler-e-commerce {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.section-paragraph-three-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.25rem) 0;
}

.featured-quote-internationaler-e-commerce {
  margin: clamp(1.5rem, 3vw, 2.5rem) 0;
  padding: clamp(1.5rem, 2vw, 2rem) clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
  font-style: italic;
}

.quote-text-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #111827;
  margin: 0 0 clamp(1rem, 1vw, 1.25rem) 0;
  line-height: 1.7;
}

.quote-author-internationaler-e-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #6b7280;
  font-style: normal;
  font-weight: 500;
}

.content-image-three-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.content-image-three-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.content-section-four-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-four-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-image-four-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  order: -1;
}

.content-image-four-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.content-text-four-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-four-internationaler-e-commerce {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.section-paragraph-four-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.25rem) 0;
}

.content-section-five-internationaler-e-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-five-internationaler-e-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-five-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-five-internationaler-e-commerce {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.section-paragraph-five-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.25rem) 0;
}

.compliance-checklist-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(1.5rem, 2vw, 2rem);
  border-radius: 12px;
  margin-top: clamp(1.5rem, 2vw, 2rem);
  border: 1px solid #e2e8f0;
}

.checklist-title-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #111827;
  margin: 0 0 clamp(1rem, 1.5vw, 1.25rem) 0;
}

.checklist-items-internationaler-e-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1vw, 1rem);
}

.checklist-item-internationaler-e-commerce {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #374151;
  line-height: 1.6;
}

.checklist-icon-internationaler-e-commerce {
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.content-image-five-internationaler-e-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.content-image-five-internationaler-e-commerce img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.conclusion-section-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-internationaler-e-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 2vw, 2rem);
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-internationaler-e-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
}

.conclusion-text-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

.cta-box-internationaler-e-commerce {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  margin-top: clamp(2rem, 3vw, 3rem);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cta-box-internationaler-e-commerce::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.cta-title-internationaler-e-commerce {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 clamp(0.75rem, 1vw, 1rem) 0;
  position: relative;
  z-index: 1;
}

.cta-text-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #9ca3af;
  margin: 0 0 clamp(1.25rem, 2vw, 1.75rem) 0;
  line-height: 1.6;
  position: relative;
  z-index: 1;
}

.cta-button-internationaler-e-commerce {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: clamp(0.5rem, 1vw, 0.75rem);
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
}

.cta-button-internationaler-e-commerce:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-internationaler-e-commerce {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 4rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(1.5rem, 2vw, 2rem);
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
}

.disclaimer-title-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 700;
  color: #d97706;
  margin: 0 0 clamp(0.75rem, 1vw, 1rem) 0;
}

.disclaimer-text-internationaler-e-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #374151;
  line-height: 1.7;
  margin: 0;
}

.related-section-internationaler-e-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-content-internationaler-e-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 3vw, 3rem);
}

.related-title-internationaler-e-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin: 0;
  text-align: center;
}

.related-subtitle-internationaler-e-commerce {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  text-align: center;
  margin: 0;
}

.related-cards-internationaler-e-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-top: clamp(1.5rem, 2vw, 2rem);
}

.related-card-internationaler-e-commerce {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 1.5vw, 1.25rem);
  padding: clamp(1.5rem, 2vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: clamp(0.75rem, 1vw, 1rem);
  transition: all 0.3s ease;
}

.related-card-internationaler-e-commerce:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.related-card-title-internationaler-e-commerce {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #111827;
  margin: 0;
  line-height: 1.3;
}

.related-card-description-internationaler-e-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #4b5563;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-internationaler-e-commerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: clamp(0.5rem, 1vw, 0.75rem);
}

.related-card-link-internationaler-e-commerce:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

.related-card-link-internationaler-e-commerce::after {
  content: '';
  transition: transform 0.3s ease;
}

.related-card-internationaler-e-commerce:hover .related-card-link-internationaler-e-commerce::after {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .introduction-content-internationaler-e-commerce,
  .content-wrapper-one-internationaler-e-commerce,
  .content-wrapper-two-internationaler-e-commerce,
  .content-wrapper-three-internationaler-e-commerce,
  .content-wrapper-four-internationaler-e-commerce,
  .content-wrapper-five-internationaler-e-commerce {
    flex-direction: column;
  }

  .introduction-text-internationaler-e-commerce,
  .content-text-one-internationaler-e-commerce,
  .content-text-two-internationaler-e-commerce,
  .content-text-three-internationaler-e-commerce,
  .content-text-four-internationaler-e-commerce,
  .content-text-five-internationaler-e-commerce,
  .introduction-image-internationaler-e-commerce,
  .content-image-one-internationaler-e-commerce,
  .content-image-two-internationaler-e-commerce,
  .content-image-three-internationaler-e-commerce,
  .content-image-four-internationaler-e-commerce,
  .content-image-five-internationaler-e-commerce {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .content-image-two-internationaler-e-commerce,
  .content-image-four-internationaler-e-commerce {
    order: 0;
  }

  .related-cards-internationaler-e-commerce {
    flex-direction: column;
  }

  .related-card-internationaler-e-commerce {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .hero-content-internationaler-e-commerce {
    padding: 0;
  }

  .breadcrumbs-internationaler-e-commerce {
    font-size: 0.75rem;
  }
}

@media (max-width: 480px) {
  .hero-section-internationaler-e-commerce {
    padding: clamp(2rem, 6vw, 3rem) 0;
  }

  .hero-title-internationaler-e-commerce {
    font-size: clamp(1.5rem, 4vw, 2rem);
  }

  .hero-meta-internationaler-e-commerce {
    flex-direction: column;
    align-items: center;
  }

  .meta-badge-internationaler-e-commerce {
    width: 100%;
    justify-content: center;
  }

  .section-title-one-internationaler-e-commerce,
  .section-title-two-internationaler-e-commerce,
  .section-title-three-internationaler-e-commerce,
  .section-title-four-internationaler-e-commerce,
  .section-title-five-internationaler-e-commerce,
  .conclusion-title-internationaler-e-commerce,
  .related-title-internationaler-e-commerce {
    font-size: clamp(1.25rem, 3vw, 1.5rem);
  }

  .logistics-list-internationaler-e-commerce {
    margin-top: 1rem;
  }

  .cta-box-internationaler-e-commerce {
    padding: 1.5rem;
  }

  .cta-button-internationaler-e-commerce {
    width: 100%;
  }
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

p {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.main-rechtliche-compliance-datenschutz {
  width: 100%;
  font-family: var(--font-primary);
  color: var(--color-text-dark-primary);
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-rechtliche-compliance-datenschutz {
  background: linear-gradient(135deg, #042f2e 0%, #064e4a 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-rechtliche-compliance-datenschutz::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-rechtliche-compliance-datenschutz::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(16, 185, 129, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-rechtliche-compliance-datenschutz {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}

.breadcrumb-link-rechtliche-compliance-datenschutz {
  color: #a7f3d0;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  transition: color 0.3s ease;
  text-decoration: none;
}

.breadcrumb-link-rechtliche-compliance-datenschutz:hover {
  color: #2dd4bf;
  text-decoration: underline;
}

.breadcrumb-separator-rechtliche-compliance-datenschutz {
  color: rgba(167, 243, 208, 0.5);
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
}

.breadcrumb-current-rechtliche-compliance-datenschutz {
  color: #99f6e4;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  font-weight: 500;
}

.hero-content-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.hero-text-block-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.hero-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  font-family: var(--font-heading);
}

.hero-subtitle-rechtliche-compliance-datenschutz {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #a7f3d0;
  line-height: 1.6;
  margin: 0;
}

.hero-meta-rechtliche-compliance-datenschutz {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-top: 1rem;
}

.meta-item-rechtliche-compliance-datenschutz {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  color: #99f6e4;
}

.meta-item-rechtliche-compliance-datenschutz i {
  color: #14b8a6;
  font-size: 1rem;
}

.hero-image-block-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  max-width: 50%;
}

.hero-image-rechtliche-compliance-datenschutz {
  width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
  .hero-content-rechtliche-compliance-datenschutz {
    flex-direction: column;
  }

  .hero-text-block-rechtliche-compliance-datenschutz,
  .hero-image-block-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .hero-meta-rechtliche-compliance-datenschutz {
    gap: 1rem;
  }
}

.intro-section-rechtliche-compliance-datenschutz {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
}

.intro-content-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.intro-text-block-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  font-family: var(--font-heading);
  line-height: 1.2;
}

.intro-text-rechtliche-compliance-datenschutz {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.intro-image-block-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-rechtliche-compliance-datenschutz {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-rechtliche-compliance-datenschutz {
    flex-direction: column;
  }

  .intro-text-block-rechtliche-compliance-datenschutz,
  .intro-image-block-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.requirements-section-rechtliche-compliance-datenschutz {
  background: #064e4a;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.requirements-section-rechtliche-compliance-datenschutz::before {
  content: '';
  position: absolute;
  top: -40%;
  left: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.requirements-header-rechtliche-compliance-datenschutz {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.requirements-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  font-family: var(--font-heading);
  margin-bottom: 1rem;
}

.requirements-subtitle-rechtliche-compliance-datenschutz {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #a7f3d0;
  margin: 0;
}

.requirements-list-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.requirement-item-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.requirement-item-rechtliche-compliance-datenschutz:hover {
  background: rgba(20, 184, 166, 0.1);
  border-color: rgba(20, 184, 166, 0.4);
}

.requirement-number-rechtliche-compliance-datenschutz {
  font-size: clamp(2rem, 3vw, 3rem);
  font-weight: 800;
  color: #14b8a6;
  flex-shrink: 0;
  min-width: 60px;
  line-height: 1;
}

.requirement-content-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex-grow: 1;
}

.requirement-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.requirement-text-rechtliche-compliance-datenschutz {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #a7f3d0;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .requirement-item-rechtliche-compliance-datenschutz {
    flex-direction: column;
    gap: 1rem;
  }

  .requirement-number-rechtliche-compliance-datenschutz {
    min-width: 50px;
  }
}

.implementation-section-rechtliche-compliance-datenschutz {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.implementation-wrapper-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.implementation-text-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.implementation-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  font-family: var(--font-heading);
  line-height: 1.2;
}

.implementation-intro-rechtliche-compliance-datenschutz {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.implementation-steps-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-item-rechtliche-compliance-datenschutz {
  padding: 1.5rem;
  background: #f8fafc;
  border-left: 4px solid #14b8a6;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.step-item-rechtliche-compliance-datenschutz:hover {
  background: #f1f5f9;
  border-left-color: #0d9488;
}

.step-title-rechtliche-compliance-datenschutz {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 0.75rem;
  margin-top: 0;
}

.step-text-rechtliche-compliance-datenschutz {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.implementation-image-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-image-rechtliche-compliance-datenschutz {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .implementation-wrapper-rechtliche-compliance-datenschutz {
    flex-direction: column;
  }

  .implementation-text-rechtliche-compliance-datenschutz,
  .implementation-image-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.best-practices-section-rechtliche-compliance-datenschutz {
  background: #042f2e;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.best-practices-section-rechtliche-compliance-datenschutz::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  transform: translateY(-50%);
}

.best-practices-header-rechtliche-compliance-datenschutz {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.best-practices-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  font-family: var(--font-heading);
  margin-bottom: 1rem;
}

.best-practices-subtitle-rechtliche-compliance-datenschutz {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #a7f3d0;
  margin: 0;
}

.practices-grid-rechtliche-compliance-datenschutz {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.practice-card-rechtliche-compliance-datenschutz {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(20, 184, 166, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.practice-card-rechtliche-compliance-datenschutz:hover {
  background: rgba(20, 184, 166, 0.1);
  border-color: rgba(20, 184, 166, 0.3);
  transform: translateY(-4px);
}

.practice-icon-rechtliche-compliance-datenschutz {
  font-size: 2rem;
  color: #14b8a6;
}

.practice-title-rechtliche-compliance-datenschutz {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.practice-text-rechtliche-compliance-datenschutz {
  font-size: 0.9375rem;
  color: #a7f3d0;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .practice-card-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.common-mistakes-section-rechtliche-compliance-datenschutz {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.common-mistakes-wrapper-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: flex-start;
}

.common-mistakes-image-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  max-width: 50%;
}

.common-mistakes-image-rechtliche-compliance-datenschutz {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.common-mistakes-text-rechtliche-compliance-datenschutz {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.common-mistakes-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  font-family: var(--font-heading);
  line-height: 1.2;
}

.mistake-item-rechtliche-compliance-datenschutz {
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 4px solid #ef4444;
}

.mistake-heading-rechtliche-compliance-datenschutz {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 0.75rem;
  margin-top: 0;
}

.mistake-text-rechtliche-compliance-datenschutz {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .common-mistakes-wrapper-rechtliche-compliance-datenschutz {
    flex-direction: column;
  }

  .common-mistakes-image-rechtliche-compliance-datenschutz,
  .common-mistakes-text-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.cta-section-rechtliche-compliance-datenschutz {
  background: linear-gradient(135deg, #042f2e 0%, #064e4a 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-rechtliche-compliance-datenschutz::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2rem;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  font-family: var(--font-heading);
  line-height: 1.2;
}

.cta-text-rechtliche-compliance-datenschutz {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #a7f3d0;
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.cta-button-primary-rechtliche-compliance-datenschutz,
.cta-button-secondary-rechtliche-compliance-datenschutz {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.cta-button-primary-rechtliche-compliance-datenschutz {
  background: #14b8a6;
  color: #042f2e;
}

.cta-button-primary-rechtliche-compliance-datenschutz:hover {
  background: #2dd4bf;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(20, 184, 166, 0.3);
}

.cta-button-secondary-rechtliche-compliance-datenschutz {
  background: transparent;
  color: #ffffff;
  border-color: #a7f3d0;
}

.cta-button-secondary-rechtliche-compliance-datenschutz:hover {
  background: rgba(167, 243, 208, 0.1);
  border-color: #ffffff;
  transform: translateY(-2px);
}

.disclaimer-section-rechtliche-compliance-datenschutz {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-rechtliche-compliance-datenschutz {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem;
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
}

.disclaimer-title-rechtliche-compliance-datenschutz {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
  margin-top: 0;
}

.disclaimer-text-rechtliche-compliance-datenschutz {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.related-section-rechtliche-compliance-datenschutz {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.related-header-rechtliche-compliance-datenschutz {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.related-title-rechtliche-compliance-datenschutz {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  font-family: var(--font-heading);
  margin-bottom: 1rem;
}

.related-subtitle-rechtliche-compliance-datenschutz {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  margin: 0;
}

.related-cards-rechtliche-compliance-datenschutz {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-rechtliche-compliance-datenschutz {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-card-rechtliche-compliance-datenschutz:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
  border-color: #06b6d4;
}

.related-card-image-rechtliche-compliance-datenschutz {
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.related-card-image-rechtliche-compliance-datenschutz img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-card-content-rechtliche-compliance-datenschutz {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
}

.related-card-title-rechtliche-compliance-datenschutz {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0;
  line-height: 1.3;
}

.related-card-text-rechtliche-compliance-datenschutz {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-rechtliche-compliance-datenschutz {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-rechtliche-compliance-datenschutz:hover {
  color: #0891b2;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-rechtliche-compliance-datenschutz {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .cta-buttons-rechtliche-compliance-datenschutz {
    flex-direction: column;
  }

  .cta-button-primary-rechtliche-compliance-datenschutz,
  .cta-button-secondary-rechtliche-compliance-datenschutz {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-rechtliche-compliance-datenschutz {
    font-size: 0.8125rem;
  }

  .requirement-item-rechtliche-compliance-datenschutz {
    gap: 1rem;
  }
}

.main-email-marketing-automatisierung {
  width: 100%;
}

.hero-section-email-marketing-automatisierung {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-email-marketing-automatisierung::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-email-marketing-automatisierung::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.breadcrumbs-email-marketing-automatisierung {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-email-marketing-automatisierung {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-email-marketing-automatisierung:hover {
  color: #06b6d4;
}

.breadcrumb-separator-email-marketing-automatisierung {
  color: #475569;
}

.breadcrumb-current-email-marketing-automatisierung {
  color: #cbd5e1;
  font-weight: 500;
}

.hero-title-email-marketing-automatisierung {
  font-size: clamp(2rem, 5vw + 0.5rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-email-marketing-automatisierung {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #cbd5e1;
  max-width: 600px;
  line-height: 1.6;
}

.hero-meta-email-marketing-automatisierung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.meta-badge-email-marketing-automatisierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
}

.meta-badge-email-marketing-automatisierung i {
  font-size: 0.875rem;
}

.hero-image-wrapper-email-marketing-automatisierung {
  margin-top: 2rem;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.hero-image-email-marketing-automatisierung {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.hero-stats-email-marketing-automatisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 5vw, 4rem);
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(6, 182, 212, 0.2);
}

.stat-item-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.stat-number-email-marketing-automatisierung {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
}

.stat-label-email-marketing-automatisierung {
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.introduction-section-email-marketing-automatisierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.introduction-content-email-marketing-automatisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.introduction-text-email-marketing-automatisierung {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.introduction-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.introduction-paragraph-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
}

.introduction-image-email-marketing-automatisierung {
  flex: 1 1 45%;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
}

.introduction-img-email-marketing-automatisierung {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

@media (max-width: 768px) {
  .introduction-content-email-marketing-automatisierung {
    flex-direction: column;
  }

  .introduction-text-email-marketing-automatisierung,
  .introduction-image-email-marketing-automatisierung {
    flex: 1 1 100%;
  }
}

.benefits-section-email-marketing-automatisierung {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-email-marketing-automatisierung::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.benefits-header-email-marketing-automatisierung {
  text-align: center;
  margin-bottom: 3rem;
}

.section-tag-email-marketing-automatisierung {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.benefits-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.benefits-subtitle-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 2vw, 1.125rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-grid-email-marketing-automatisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.benefit-card-email-marketing-automatisierung {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-email-marketing-automatisierung:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.benefit-number-email-marketing-automatisierung {
  font-size: 2.5rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-content-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.benefit-card-title-email-marketing-automatisierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.benefit-card-text-email-marketing-automatisierung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-email-marketing-automatisierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategies-section-email-marketing-automatisierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.strategies-wrapper-email-marketing-automatisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.strategies-text-email-marketing-automatisierung {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategies-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.strategies-intro-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
}

.strategies-list-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.strategy-item-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.strategy-item-title-email-marketing-automatisierung {
  font-size: 1rem;
  font-weight: 600;
  color: #1e293b;
}

.strategy-item-text-email-marketing-automatisierung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.strategies-image-email-marketing-automatisierung {
  flex: 1 1 45%;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.strategies-img-email-marketing-automatisierung {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

@media (max-width: 768px) {
  .strategies-wrapper-email-marketing-automatisierung {
    flex-direction: column;
  }

  .strategies-text-email-marketing-automatisierung,
  .strategies-image-email-marketing-automatisierung {
    flex: 1 1 100%;
  }
}

.implementation-section-email-marketing-automatisierung {
  background: #1e293b;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-email-marketing-automatisierung::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.implementation-header-email-marketing-automatisierung {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.implementation-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.implementation-steps-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.implementation-step-email-marketing-automatisierung {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
}

.step-number-email-marketing-automatisierung {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-email-marketing-automatisierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.step-text-email-marketing-automatisierung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .implementation-step-email-marketing-automatisierung {
    flex-direction: column;
    gap: 1rem;
  }
}

.tools-section-email-marketing-automatisierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.tools-wrapper-email-marketing-automatisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.tools-image-email-marketing-automatisierung {
  flex: 1 1 45%;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
}

.tools-img-email-marketing-automatisierung {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.tools-text-email-marketing-automatisierung {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.tools-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.tools-intro-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
}

.tools-list-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.tool-item-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid #06b6d4;
}

.tool-name-email-marketing-automatisierung {
  font-size: 1rem;
  font-weight: 600;
  color: #1e293b;
}

.tool-description-email-marketing-automatisierung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

@media (max-width: 768px) {
  .tools-wrapper-email-marketing-automatisierung {
    flex-direction: column;
  }

  .tools-image-email-marketing-automatisierung,
  .tools-text-email-marketing-automatisierung {
    flex: 1 1 100%;
  }
}

.quote-section-email-marketing-automatisierung {
  background: #0f172a;
  padding: clamp(3rem, 8vw, 5rem) 0;
}

.featured-quote-email-marketing-automatisierung {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 8px;
}

.quote-text-email-marketing-automatisierung {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-style: italic;
  line-height: 1.6;
  color: #ffffff;
  margin: 0 0 1rem 0;
}

.quote-author-email-marketing-automatisierung {
  font-size: 0.9375rem;
  color: #cbd5e1;
  font-style: normal;
}

.conclusion-section-email-marketing-automatisierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-email-marketing-automatisierung {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.conclusion-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.conclusion-text-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
}

.cta-box-email-marketing-automatisierung {
  margin-top: 2rem;
  padding: clamp(2rem, 4vw, 3rem);
  background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
  border-radius: 12px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

.cta-title-email-marketing-automatisierung {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 700;
  color: #0f172a;
}

.cta-text-email-marketing-automatisierung {
  font-size: 0.9375rem;
  color: #1e293b;
  margin: 0;
}

.cta-button-email-marketing-automatisierung {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  background: #0f172a;
  color: #06b6d4;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: 0.9375rem;
}

.cta-button-email-marketing-automatisierung:hover {
  background: #1e293b;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.disclaimer-section-email-marketing-automatisierung {
  background: #111827;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.15);
}

.disclaimer-content-email-marketing-automatisierung {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.disclaimer-title-email-marketing-automatisierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #06b6d4;
}

.disclaimer-text-email-marketing-automatisierung {
  font-size: 0.875rem;
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.related-section-email-marketing-automatisierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-email-marketing-automatisierung {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-email-marketing-automatisierung {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
  line-height: 1.2;
}

.related-subtitle-email-marketing-automatisierung {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #64748b;
}

.related-grid-email-marketing-automatisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-email-marketing-automatisierung {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  overflow: hidden;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-email-marketing-automatisierung:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-email-marketing-automatisierung {
  width: 100%;
  height: 220px;
  overflow: hidden;
  background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
}

.related-card-image-email-marketing-automatisierung img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-card-content-email-marketing-automatisierung {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1rem, 2vw, 1.5rem);
}

.related-card-title-email-marketing-automatisierung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.related-card-text-email-marketing-automatisierung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.related-card-link-email-marketing-automatisierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-link-email-marketing-automatisierung:hover {
  gap: 0.75rem;
  color: #0891b2;
}

@media (max-width: 768px) {
  .related-card-email-marketing-automatisierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .hero-stats-email-marketing-automatisierung {
    flex-direction: column;
    gap: 1.5rem;
  }

  .benefits-grid-email-marketing-automatisierung,
  .related-grid-email-marketing-automatisierung {
    flex-direction: column;
  }

  .benefit-card-email-marketing-automatisierung {
    flex: 1 1 100%;
    max-width: none;
  }

  .implementation-step-email-marketing-automatisierung {
    flex-direction: column;
  }

  .step-number-email-marketing-automatisierung {
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .hero-title-email-marketing-automatisierung {
    font-size: 1.75rem;
  }

  .benefits-title-email-marketing-automatisierung,
  .strategies-title-email-marketing-automatisierung,
  .tools-title-email-marketing-automatisierung {
    font-size: 1.25rem;
  }

  .hero-meta-email-marketing-automatisierung {
    flex-direction: column;
    gap: 0.75rem;
  }

  .meta-badge-email-marketing-automatisierung {
    width: 100%;
    justify-content: center;
  }
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.main-affiliate-marketing-partnerprogramme {
  width: 100%;
  background: #ffffff;
}

.hero-section-affiliate-marketing-partnerprogramme {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-affiliate-marketing-partnerprogramme::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-affiliate-marketing-partnerprogramme::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  font-size: clamp(0.8125rem, 1vw, 0.9375rem);
}

.breadcrumb-link-affiliate-marketing-partnerprogramme {
  color: #cbd5e1;
  transition: color 0.3s ease;
}

.breadcrumb-link-affiliate-marketing-partnerprogramme:hover {
  color: #06b6d4;
}

.breadcrumb-separator-affiliate-marketing-partnerprogramme {
  color: #64748b;
}

.breadcrumb-current-affiliate-marketing-partnerprogramme {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.hero-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-affiliate-marketing-partnerprogramme {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  max-width: 650px;
  line-height: 1.6;
}

.hero-meta-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1.5rem);
  justify-content: center;
  align-items: center;
  margin: clamp(0.5rem, 2vw, 1rem) 0;
}

.meta-badge-affiliate-marketing-partnerprogramme {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #cbd5e1;
  border-radius: 20px;
  font-size: clamp(0.8125rem, 1vw, 0.9375rem);
  font-weight: 500;
}

.meta-badge-affiliate-marketing-partnerprogramme i {
  color: #06b6d4;
}

.hero-image-affiliate-marketing-partnerprogramme {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}

.intro-section-affiliate-marketing-partnerprogramme {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0a0a0a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-description-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #334155;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.intro-text-body-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.intro-image-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-affiliate-marketing-partnerprogramme {
    flex-direction: column;
  }
  
  .intro-text-affiliate-marketing-partnerprogramme,
  .intro-image-affiliate-marketing-partnerprogramme {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.foundations-section-affiliate-marketing-partnerprogramme {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.foundations-section-affiliate-marketing-partnerprogramme::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  transform: translateY(-50%);
}

.foundations-header-affiliate-marketing-partnerprogramme {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 4rem);
  position: relative;
  z-index: 1;
}

.foundations-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(0.75rem, 2vw, 1.25rem);
  line-height: 1.2;
}

.foundations-subtitle-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.foundations-steps-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.foundations-step-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.foundations-step-affiliate-marketing-partnerprogramme:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.foundations-step-number-affiliate-marketing-partnerprogramme {
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 70px;
}

.foundations-step-content-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.foundations-step-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.foundations-step-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.875rem, 1vw + 0.4rem, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .foundations-step-affiliate-marketing-partnerprogramme {
    flex-direction: column;
    gap: 1rem;
  }
}

.strategies-section-affiliate-marketing-partnerprogramme {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.strategies-wrapper-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-direction: column;
}

.strategies-text-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategies-heading-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0a0a0a;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  line-height: 1.2;
}

.strategies-highlight-affiliate-marketing-partnerprogramme {
  padding: clamp(1rem, 2vw, 1.5rem);
  background: #f0f9ff;
  border-left: 4px solid #06b6d4;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  border-radius: 4px;
}

.strategies-highlight-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #0a0a0a;
  line-height: 1.6;
  margin: 0;
}

.strategies-body-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

.strategies-image-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .strategies-wrapper-affiliate-marketing-partnerprogramme {
    flex-direction: column;
  }
  
  .strategies-text-affiliate-marketing-partnerprogramme,
  .strategies-image-affiliate-marketing-partnerprogramme {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.platforms-section-affiliate-marketing-partnerprogramme {
  background: #1a1a1a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.platforms-section-affiliate-marketing-partnerprogramme::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.platforms-header-affiliate-marketing-partnerprogramme {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 4rem);
  position: relative;
  z-index: 1;
}

.platforms-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(0.75rem, 2vw, 1.25rem);
  line-height: 1.2;
}

.platforms-subtitle-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.platforms-grid-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.platforms-card-affiliate-marketing-partnerprogramme {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.platforms-card-affiliate-marketing-partnerprogramme:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.platforms-card-icon-affiliate-marketing-partnerprogramme {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.2);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.platforms-card-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #ffffff;
}

.platforms-card-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.875rem, 1vw + 0.4rem, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .platforms-card-affiliate-marketing-partnerprogramme {
    flex: 1 1 100%;
    max-width: none;
  }
}

.challenges-section-affiliate-marketing-partnerprogramme {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.challenges-wrapper-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
  flex-direction: column;
}

.challenges-image-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.challenges-text-affiliate-marketing-partnerprogramme {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-heading-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0a0a0a;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  line-height: 1.2;
}

.challenges-quote-affiliate-marketing-partnerprogramme {
  padding: clamp(1.5rem, 3vw, 2rem);
  border-left: 4px solid #06b6d4;
  background: #f0f9ff;
  margin: clamp(1.5rem, 3vw, 2rem) 0;
  border-radius: 4px;
}

.quote-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-style: italic;
  color: #0a0a0a;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-author-affiliate-marketing-partnerprogramme {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.challenges-body-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

@media (max-width: 768px) {
  .challenges-wrapper-affiliate-marketing-partnerprogramme {
    flex-direction: column;
  }
  
  .challenges-image-affiliate-marketing-partnerprogramme,
  .challenges-text-affiliate-marketing-partnerprogramme {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.action-section-affiliate-marketing-partnerprogramme {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.action-section-affiliate-marketing-partnerprogramme::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.action-content-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.action-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.action-description-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
}

.action-checklist-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  text-align: left;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.checklist-item-affiliate-marketing-partnerprogramme {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #e2e8f0;
}

.checklist-item-affiliate-marketing-partnerprogramme i {
  color: #06b6d4;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.action-buttons-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-direction: row;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.btn-primary-affiliate-marketing-partnerprogramme,
.btn-secondary-affiliate-marketing-partnerprogramme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
}

.btn-primary-affiliate-marketing-partnerprogramme {
  background: #06b6d4;
  color: #000000;
}

.btn-primary-affiliate-marketing-partnerprogramme:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-affiliate-marketing-partnerprogramme {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.btn-secondary-affiliate-marketing-partnerprogramme:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

@media (max-width: 768px) {
  .action-buttons-affiliate-marketing-partnerprogramme {
    flex-direction: column;
    width: 100%;
  }

  .btn-primary-affiliate-marketing-partnerprogramme,
  .btn-secondary-affiliate-marketing-partnerprogramme {
    width: 100%;
  }
}

.disclaimer-section-affiliate-marketing-partnerprogramme {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-affiliate-marketing-partnerprogramme {
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 8px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #0a0a0a;
  margin-bottom: 1rem;
}

.disclaimer-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.875rem, 1vw + 0.4rem, 1rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.related-section-affiliate-marketing-partnerprogramme {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-header-affiliate-marketing-partnerprogramme {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 4rem);
}

.related-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0a0a0a;
  margin-bottom: clamp(0.75rem, 2vw, 1.25rem);
  line-height: 1.2;
}

.related-subtitle-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
}

.related-cards-affiliate-marketing-partnerprogramme {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-affiliate-marketing-partnerprogramme {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-affiliate-marketing-partnerprogramme:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-affiliate-marketing-partnerprogramme {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  overflow: hidden;
  background: #e2e8f0;
}

.related-card-image-affiliate-marketing-partnerprogramme img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-title-affiliate-marketing-partnerprogramme {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #0a0a0a;
}

.related-card-text-affiliate-marketing-partnerprogramme {
  font-size: clamp(0.875rem, 1vw + 0.4rem, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-affiliate-marketing-partnerprogramme {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-affiliate-marketing-partnerprogramme:hover {
  color: #0891b2;
  gap: 0.75rem;
}

.related-card-link-affiliate-marketing-partnerprogramme i {
  transition: transform 0.3s ease;
}

.related-card-affiliate-marketing-partnerprogramme:hover .related-card-link-affiliate-marketing-partnerprogramme i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-affiliate-marketing-partnerprogramme {
    flex: 1 1 100%;
    max-width: none;
  }
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

@media (max-width: 768px) {
  .hero-meta-affiliate-marketing-partnerprogramme {
    gap: 0.5rem;
  }

  .meta-badge-affiliate-marketing-partnerprogramme {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
  }
}

@media (max-width: 480px) {
  .hero-title-affiliate-marketing-partnerprogramme {
    font-size: 1.5rem;
  }

  .breadcrumbs-affiliate-marketing-partnerprogramme {
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .foundations-step-affiliate-marketing-partnerprogramme {
    flex-direction: column;
    gap: 1rem;
  }

  .action-checklist-affiliate-marketing-partnerprogramme {
    text-align: center;
  }

  .checklist-item-affiliate-marketing-partnerprogramme {
    justify-content: center;
  }
}

.main-content-marketing-seo-texte {
  width: 100%;
}

:root {
  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 1.5rem;
  --spacing-lg: 2rem;
  --spacing-xl: 3rem;
  --spacing-2xl: 4rem;
  --spacing-3xl: 6rem;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-content-marketing-seo-texte {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-content-marketing-seo-texte::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-content-marketing-seo-texte::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  font-size: 0.875rem;
}

.breadcrumb-link-content-marketing-seo-texte {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-content-marketing-seo-texte:hover {
  color: #06b6d4;
}

.breadcrumb-separator-content-marketing-seo-texte {
  color: #64748b;
}

.breadcrumb-current-content-marketing-seo-texte {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-content-marketing-seo-texte {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 900px;
}

.hero-title-content-marketing-seo-texte {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero-subtitle-content-marketing-seo-texte {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  line-height: 1.6;
  max-width: 700px;
}

.hero-meta-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.meta-badge-content-marketing-seo-texte {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-content-marketing-seo-texte i {
  font-size: 0.875rem;
}

.hero-image-wrapper-content-marketing-seo-texte {
  margin-top: clamp(2rem, 4vw, 3rem);
}

.hero-image-content-marketing-seo-texte {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
}

.introduction-section-content-marketing-seo-texte {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.intro-wrapper-content-marketing-seo-texte {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.intro-text-content-marketing-seo-texte {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.intro-image-content-marketing-seo-texte {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
}

.strategy-section-content-marketing-seo-texte {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.strategy-header-content-marketing-seo-texte {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.strategy-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.strategy-subtitle-content-marketing-seo-texte {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
}

.pillars-container-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.pillar-card-content-marketing-seo-texte {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.pillar-card-content-marketing-seo-texte:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.pillar-number-content-marketing-seo-texte {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.pillar-title-content-marketing-seo-texte {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
}

.pillar-text-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.practical-section-content-marketing-seo-texte {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.practical-section-content-marketing-seo-texte::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.practical-wrapper-content-marketing-seo-texte {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.practical-text-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.practical-image-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.practical-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.practical-text-content-marketing-seo-texte {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.highlight-box-content-marketing-seo-texte {
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  padding: clamp(1rem, 2vw, 1.5rem);
  border-radius: 8px;
  margin: 1.5rem 0;
}

.highlight-text-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #e2e8f0;
  line-height: 1.6;
  margin: 0;
}

.practical-image-content-marketing-seo-texte {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
}

.tools-section-content-marketing-seo-texte {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.tools-header-content-marketing-seo-texte {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.tools-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.tools-subtitle-content-marketing-seo-texte {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
}

.tools-grid-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-item-content-marketing-seo-texte {
  flex: 1 1 300px;
  max-width: 400px;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.tool-name-content-marketing-seo-texte {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.75rem;
}

.tool-description-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.results-section-content-marketing-seo-texte {
  background: #1e293b;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.results-section-content-marketing-seo-texte::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.results-wrapper-content-marketing-seo-texte {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.results-text-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.results-image-block-content-marketing-seo-texte {
  flex: 1 1 50%;
  max-width: 50%;
}

.results-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.results-text-content-marketing-seo-texte {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.stats-row-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 2rem;
}

.stat-box-content-marketing-seo-texte {
  flex: 1 1 150px;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 12px;
  text-align: center;
}

.stat-number-content-marketing-seo-texte {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  margin-bottom: 0.5rem;
}

.stat-label-content-marketing-seo-texte {
  font-size: 0.875rem;
  color: #cbd5e1;
  line-height: 1.4;
  margin: 0;
}

.results-image-content-marketing-seo-texte {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
}

.faq-section-content-marketing-seo-texte {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.faq-header-content-marketing-seo-texte {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.faq-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
}

.faq-list-content-marketing-seo-texte {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 800px;
  margin: 0 auto;
}

.faq-item-content-marketing-seo-texte {
  padding: 1.5rem;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.faq-item-content-marketing-seo-texte:hover {
  border-color: #06b6d4;
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.1);
}

.faq-item-content-marketing-seo-texte[open] {
  background: #f1f5f9;
  border-color: #06b6d4;
}

.faq-question-content-marketing-seo-texte {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #1e293b;
  cursor: pointer;
  user-select: none;
}

.faq-question-content-marketing-seo-texte:hover {
  color: #06b6d4;
}

.faq-answer-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin-top: 1rem;
  margin-bottom: 0;
}

.faq-answer-content-answer-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin-top: 1rem;
  margin-bottom: 0;
}

.cta-section-content-marketing-seo-texte {
  background: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-content-marketing-seo-texte::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-content-marketing-seo-texte {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
}

.cta-text-content-marketing-seo-texte {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: rgba(255, 255, 255, 0.95);
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}

.cta-btn-primary-content-marketing-seo-texte {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  color: #06b6d4;
  font-weight: 600;
  border-radius: 12px;
  font-size: clamp(0.875rem, 1vw, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-btn-primary-content-marketing-seo-texte:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.cta-btn-secondary-content-marketing-seo-texte {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
  font-weight: 600;
  border-radius: 12px;
  font-size: clamp(0.875rem, 1vw, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-btn-secondary-content-marketing-seo-texte:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.related-section-content-marketing-seo-texte {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-header-content-marketing-seo-texte {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.related-title-content-marketing-seo-texte {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.related-subtitle-content-marketing-seo-texte {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
}

.related-cards-content-marketing-seo-texte {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-content-marketing-seo-texte {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-content-marketing-seo-texte:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.related-card-title-content-marketing-seo-texte {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
}

.related-card-text-content-marketing-seo-texte {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  flex-grow: 1;
  margin: 0;
}

.related-card-link-content-marketing-seo-texte {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  width: fit-content;
}

.related-card-link-content-marketing-seo-texte:hover {
  gap: 0.75rem;
}

.related-card-link-content-marketing-seo-texte i {
  font-size: 0.75rem;
}

.disclaimer-section-content-marketing-seo-texte {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-content-marketing-seo-texte {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-content-marketing-seo-texte {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-content-marketing-seo-texte {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .intro-wrapper-content-marketing-seo-texte,
  .practical-wrapper-content-marketing-seo-texte,
  .results-wrapper-content-marketing-seo-texte {
    flex-direction: column;
  }

  .intro-text-block-content-marketing-seo-texte,
  .intro-image-block-content-marketing-seo-texte,
  .practical-text-block-content-marketing-seo-texte,
  .practical-image-block-content-marketing-seo-texte,
  .results-text-block-content-marketing-seo-texte,
  .results-image-block-content-marketing-seo-texte {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .pillars-container-content-marketing-seo-texte,
  .tools-grid-content-marketing-seo-texte,
  .related-cards-content-marketing-seo-texte {
    flex-direction: column;
  }

  .pillar-card-content-marketing-seo-texte,
  .tool-item-content-marketing-seo-texte,
  .related-card-content-marketing-seo-texte {
    flex: 1 1 100%;
    max-width: none;
  }

  .cta-buttons-content-marketing-seo-texte {
    flex-direction: column;
    width: 100%;
  }

  .cta-btn-primary-content-marketing-seo-texte,
  .cta-btn-secondary-content-marketing-seo-texte {
    width: 100%;
  }

  .stats-row-content-marketing-seo-texte {
    flex-direction: column;
  }

  .stat-box-content-marketing-seo-texte {
    flex: 1 1 100%;
  }
}

@media (max-width: 480px) {
  .hero-title-content-marketing-seo-texte {
    font-size: 1.5rem;
  }

  .intro-title-content-marketing-seo-texte,
  .strategy-title-content-marketing-seo-texte,
  .practical-title-content-marketing-seo-texte,
  .tools-title-content-marketing-seo-texte,
  .results-title-content-marketing-seo-texte,
  .faq-title-content-marketing-seo-texte,
  .cta-title-content-marketing-seo-texte,
  .related-title-content-marketing-seo-texte {
    font-size: 1.25rem;
  }

  .breadcrumbs-content-marketing-seo-texte {
    font-size: 0.75rem;
  }

  .faq-question-content-marketing-seo-texte {
    font-size: 1rem;
  }
}

.main-influencer-marketing-social-commerce {
  width: 100%;
}

.hero-section-influencer-marketing-social-commerce {
  background: linear-gradient(135deg, #0c1929 0%, #162d50 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-influencer-marketing-social-commerce::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-influencer-marketing-social-commerce::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 1;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.breadcrumbs-influencer-marketing-social-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  justify-content: center;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-influencer-marketing-social-commerce {
  color: #bfdbfe;
  transition: color 0.3s ease;
}

.breadcrumb-link-influencer-marketing-social-commerce:hover {
  color: #3b82f6;
}

.breadcrumb-separator-influencer-marketing-social-commerce {
  color: #6b7280;
}

.breadcrumb-current-influencer-marketing-social-commerce {
  color: #3b82f6;
  font-weight: 600;
}

.hero-title-influencer-marketing-social-commerce {
  font-size: clamp(2rem, 5vw + 1rem, 3.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.1;
  max-width: 800px;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-influencer-marketing-social-commerce {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #bfdbfe;
  max-width: 700px;
  line-height: 1.6;
}

.hero-meta-influencer-marketing-social-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1rem);
  justify-content: center;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.meta-badge-influencer-marketing-social-commerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.75rem, 2vw, 1rem);
  background: rgba(59, 130, 246, 0.15);
  color: #bfdbfe;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
}

.meta-badge-influencer-marketing-social-commerce i {
  color: #3b82f6;
}

.hero-image-wrapper-influencer-marketing-social-commerce {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  border-radius: clamp(12px, 2vw, 20px);
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}

.hero-image-influencer-marketing-social-commerce {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.introduction-section-influencer-marketing-social-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.introduction-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.introduction-paragraph-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.introduction-image-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-img-influencer-marketing-social-commerce {
  width: 100%;
  height: auto;
  border-radius: clamp(12px, 2vw, 20px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
  display: block;
  object-fit: cover;
}

.influencer-types-section-influencer-marketing-social-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.section-header-influencer-marketing-social-commerce {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.section-tag-influencer-marketing-social-commerce {
  display: inline-block;
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.875rem, 2vw, 1.25rem);
  background: rgba(59, 130, 246, 0.1);
  color: #3b82f6;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 600;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
}

.section-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
  line-height: 1.2;
}

.section-subtitle-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
}

.types-grid-influencer-marketing-social-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.type-card-influencer-marketing-social-commerce {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-radius: clamp(12px, 2vw, 16px);
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.type-card-influencer-marketing-social-commerce:hover {
  border-color: #3b82f6;
  box-shadow: 0 16px 40px rgba(59, 130, 246, 0.15);
  transform: translateY(-6px);
}

.type-number-influencer-marketing-social-commerce {
  font-size: clamp(2.5rem, 4vw, 3.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #3b82f6, #06b6d4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.type-title-influencer-marketing-social-commerce {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #1e293b;
}

.type-description-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
}

.type-benefits-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
  padding-top: clamp(0.75rem, 1vw, 1rem);
  border-top: 1px solid #e2e8f0;
}

.benefit-item-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #475569;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.benefit-item-influencer-marketing-social-commerce::before {
  content: '';
  color: #06b6d4;
  font-weight: bold;
  font-size: 1.125rem;
  flex-shrink: 0;
}

.platform-strategy-section-influencer-marketing-social-commerce {
  background: #0c1929;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.platform-strategy-section-influencer-marketing-social-commerce::before {
  content: '';
  position: absolute;
  top: 0;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.platform-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.platform-text-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.platform-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.platform-description-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #bfdbfe;
  line-height: 1.8;
  margin-bottom: clamp(2rem, 3vw, 2.5rem);
}

.platform-list-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 2vw, 1.75rem);
}

.platform-item-influencer-marketing-social-commerce {
  padding-left: clamp(1.25rem, 2vw, 1.75rem);
  border-left: 3px solid #06b6d4;
}

.platform-item-title-influencer-marketing-social-commerce {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.platform-item-text-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.platform-image-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.platform-img-influencer-marketing-social-commerce {
  width: 100%;
  height: auto;
  border-radius: clamp(12px, 2vw, 20px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  display: block;
  object-fit: cover;
}

.campaign-execution-section-influencer-marketing-social-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.steps-container-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.step-item-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: flex-start;
  padding: clamp(1.5rem, 2vw, 2rem);
  background: #f8fafc;
  border-radius: clamp(12px, 2vw, 16px);
  border-left: 4px solid #3b82f6;
  transition: all 0.3s ease;
}

.step-item-influencer-marketing-social-commerce:hover {
  background: #eff6ff;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.12);
}

.step-number-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 800;
  color: #3b82f6;
  line-height: 1;
  flex-shrink: 0;
  min-width: clamp(60px, 10vw, 80px);
}

.step-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(0.5rem, 1vw, 0.75rem);
  flex-grow: 1;
}

.step-title-influencer-marketing-social-commerce {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #0f172a;
}

.step-description-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.social-commerce-section-influencer-marketing-social-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.social-commerce-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.social-commerce-image-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
  order: -1;
}

.social-commerce-img-influencer-marketing-social-commerce {
  width: 100%;
  height: auto;
  border-radius: clamp(12px, 2vw, 20px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
  display: block;
  object-fit: cover;
}

.social-commerce-text-influencer-marketing-social-commerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.social-commerce-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.social-commerce-paragraph-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: clamp(1.5rem, 2vw, 2rem);
}

.social-commerce-features-influencer-marketing-social-commerce {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1rem, 2vw, 1.5rem);
}

.feature-item-influencer-marketing-social-commerce {
  padding: clamp(1rem, 2vw, 1.5rem);
  background: #ffffff;
  border-radius: clamp(10px, 1.5vw, 14px);
  border: 1px solid #e2e8f0;
}

.feature-title-influencer-marketing-social-commerce {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.feature-text-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.success-metrics-section-influencer-marketing-social-commerce {
  background: #0c1929;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.success-metrics-section-influencer-marketing-social-commerce::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.metrics-header-influencer-marketing-social-commerce {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

.metrics-tag-influencer-marketing-social-commerce {
  display: inline-block;
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.875rem, 2vw, 1.25rem);
  background: rgba(59, 130, 246, 0.15);
  color: #bfdbfe;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 600;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
}

.metrics-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
  line-height: 1.2;
}

.metrics-subtitle-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #bfdbfe;
  line-height: 1.6;
}

.metrics-grid-influencer-marketing-social-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.metric-card-influencer-marketing-social-commerce {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
  padding: clamp(1.5rem, 2vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: clamp(12px, 2vw, 16px);
  transition: all 0.3s ease;
}

.metric-card-influencer-marketing-social-commerce:hover {
  border-color: #3b82f6;
  background: rgba(59, 130, 246, 0.12);
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(59, 130, 246, 0.2);
}

.metric-icon-influencer-marketing-social-commerce {
  font-size: clamp(2rem, 3vw, 2.5rem);
  color: #06b6d4;
  width: fit-content;
}

.metric-name-influencer-marketing-social-commerce {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #ffffff;
}

.metric-description-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.expert-quote-section-influencer-marketing-social-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.expert-quote-influencer-marketing-social-commerce {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #3b82f6;
  background: #f8fafc;
  border-radius: clamp(8px, 1.5vw, 12px);
  font-style: italic;
}

.quote-text-influencer-marketing-social-commerce {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #1e293b;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  font-weight: 500;
}

.quote-author-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  font-style: normal;
  font-weight: 600;
}

.practical-tips-section-influencer-marketing-social-commerce {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.tips-header-influencer-marketing-social-commerce {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.tips-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
  line-height: 1.2;
}

.tips-subtitle-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
}

.tips-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.tips-image-influencer-marketing-social-commerce {
  flex: 1 1 45%;
  max-width: 45%;
}

.tips-img-influencer-marketing-social-commerce {
  width: 100%;
  height: auto;
  border-radius: clamp(12px, 2vw, 20px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
  display: block;
  object-fit: cover;
}

.tips-list-influencer-marketing-social-commerce {
  flex: 1 1 55%;
  max-width: 55%;
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 2vw, 1.75rem);
}

.tip-item-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: row;
  gap: clamp(1.25rem, 2vw, 1.75rem);
  align-items: flex-start;
}

.tip-number-influencer-marketing-social-commerce {
  font-size: clamp(1.5rem, 2vw, 2rem);
  font-weight: 800;
  color: #3b82f6;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.tip-body-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(0.5rem, 1vw, 0.75rem);
}

.tip-heading-influencer-marketing-social-commerce {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  font-weight: 700;
  color: #1e293b;
}

.tip-text-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.conclusion-section-influencer-marketing-social-commerce {
  background: #0c1929;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-influencer-marketing-social-commerce {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1.5rem, 2vw, 2rem);
  line-height: 1.2;
}

.conclusion-text-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #bfdbfe;
  line-height: 1.8;
  margin-bottom: clamp(1.5rem, 2vw, 2rem);
}

.conclusion-list-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1.5vw, 1rem);
  list-style: none;
  padding: 0;
  margin: clamp(1.5rem, 2vw, 2rem) 0;
}

.conclusion-item-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #cbd5e1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.conclusion-item-influencer-marketing-social-commerce::before {
  content: '';
  color: #06b6d4;
  font-size: 1.25rem;
}

.disclaimer-section-influencer-marketing-social-commerce {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-influencer-marketing-social-commerce {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-influencer-marketing-social-commerce {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.disclaimer-text-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.8;
  margin-bottom: clamp(1rem, 1.5vw, 1.5rem);
}

.related-posts-section-influencer-marketing-social-commerce {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  border-top: 1px solid #e2e8f0;
  position: relative;
  overflow: hidden;
}

.related-header-influencer-marketing-social-commerce {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.related-title-influencer-marketing-social-commerce {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
  line-height: 1.2;
}

.related-subtitle-influencer-marketing-social-commerce {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
}

.related-cards-influencer-marketing-social-commerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-influencer-marketing-social-commerce {
  flex: 1 1 320px;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 2vw, 2.5rem);
  background: #f8fafc;
  border-radius: clamp(12px, 2vw, 16px);
  border: 2px solid #e2e8f0;
  transition: all 0.3s ease;
  text-decoration: none;
  color: inherit;
}

.related-card-influencer-marketing-social-commerce:hover {
  border-color: #3b82f6;
  box-shadow: 0 16px 40px rgba(59, 130, 246, 0.15);
  transform: translateY(-6px);
}

.related-card-content-influencer-marketing-social-commerce {
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1.5vw, 1rem);
}

.related-card-title-influencer-marketing-social-commerce {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
}

.related-card-description-influencer-marketing-social-commerce {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-influencer-marketing-social-commerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #3b82f6;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw, 1rem);
  margin-top: auto;
  padding-top: clamp(0.75rem, 1vw, 1rem);
  border-top: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-influencer-marketing-social-commerce:hover .related-card-link-influencer-marketing-social-commerce {
  color: #06b6d4;
}

.related-card-link-influencer-marketing-social-commerce i {
  transition: transform 0.3s ease;
  font-size: 0.875rem;
}

.related-card-influencer-marketing-social-commerce:hover .related-card-link-influencer-marketing-social-commerce i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .hero-content-influencer-marketing-social-commerce {
    gap: clamp(1rem, 2vw, 1.5rem);
  }

  .introduction-content-influencer-marketing-social-commerce,
  .platform-content-influencer-marketing-social-commerce,
  .social-commerce-content-influencer-marketing-social-commerce,
  .tips-content-influencer-marketing-social-commerce {
    flex-direction: column;
  }

  .introduction-text-influencer-marketing-social-commerce,
  .introduction-image-influencer-marketing-social-commerce,
  .platform-text-influencer-marketing-social-commerce,
  .platform-image-influencer-marketing-social-commerce,
  .social-commerce-image-influencer-marketing-social-commerce,
  .social-commerce-text-influencer-marketing-social-commerce,
  .tips-image-influencer-marketing-social-commerce,
  .tips-list-influencer-marketing-social-commerce {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .social-commerce-image-influencer-marketing-social-commerce {
    order: 0;
  }

  .social-commerce-features-influencer-marketing-social-commerce {
    grid-template-columns: 1fr;
  }

  .types-grid-influencer-marketing-social-commerce {
    flex-direction: column;
  }

  .type-card-influencer-marketing-social-commerce {
    flex: 1 1 100%;
    max-width: none;
  }

  .metrics-grid-influencer-marketing-social-commerce {
    flex-direction: column;
  }

  .metric-card-influencer-marketing-social-commerce {
    flex: 1 1 100%;
    max-width: none;
  }

  .related-cards-influencer-marketing-social-commerce {
    flex-direction: column;
  }

  .related-card-influencer-marketing-social-commerce {
    flex: 1 1 100%;
    max-width: none;
  }

  .step-item-influencer-marketing-social-commerce {
    flex-direction: column;
    gap: clamp(1rem, 2vw, 1.5rem);
  }

  .step-number-influencer-marketing-social-commerce {
    min-width: auto;
  }

  .tip-item-influencer-marketing-social-commerce {
    flex-direction: row;
    gap: clamp(1rem, 2vw, 1.5rem);
  }

  .breadcrumbs-influencer-marketing-social-commerce {
    font-size: clamp(0.7rem, 1vw, 0.8rem);
  }
}

@media (max-width: 480px) {
  .hero-title-influencer-marketing-social-commerce {
    font-size: 1.5rem;
  }

  .section-title-influencer-marketing-social-commerce {
    font-size: 1.25rem;
  }

  .step-item-influencer-marketing-social-commerce {
    padding: clamp(1rem, 2vw, 1.25rem);
  }

  .breadcrumbs-influencer-marketing-social-commerce {
    gap: 0.25rem;
    font-size: 0.7rem;
  }

  .type-card-influencer-marketing-social-commerce {
    padding: clamp(1rem, 2vw, 1.25rem);
  }
}

.main-chatbots-ki-kundenservice {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-chatbots-ki-kundenservice {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-chatbots-ki-kundenservice::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-chatbots-ki-kundenservice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-chatbots-ki-kundenservice {
  color: #94a3b8;
  transition: color 0.3s ease;
  text-decoration: none;
}

.breadcrumb-link-chatbots-ki-kundenservice:hover {
  color: #06b6d4;
}

.breadcrumb-separator-chatbots-ki-kundenservice {
  color: #64748b;
}

.breadcrumb-current-chatbots-ki-kundenservice {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-chatbots-ki-kundenservice {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-chatbots-ki-kundenservice {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-chatbots-ki-kundenservice {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.meta-badge-chatbots-ki-kundenservice {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #cbd5e1;
}

.meta-badge-chatbots-ki-kundenservice i {
  color: #06b6d4;
}

.hero-image-chatbots-ki-kundenservice {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  max-height: 450px;
  object-fit: cover;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  margin-top: 1rem;
}

.intro-section-chatbots-ki-kundenservice {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-wrapper-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-text-chatbots-ki-kundenservice {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.intro-image-chatbots-ki-kundenservice {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  max-height: 400px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .intro-content-wrapper-chatbots-ki-kundenservice {
    flex-direction: column;
  }

  .intro-text-block-chatbots-ki-kundenservice,
  .intro-image-block-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.benefits-section-chatbots-ki-kundenservice {
  background: #1f2937;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-header-chatbots-ki-kundenservice {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.benefits-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.benefits-subtitle-chatbots-ki-kundenservice {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
}

.benefits-grid-chatbots-ki-kundenservice {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.benefit-card-chatbots-ki-kundenservice {
  flex: 1 1 280px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-chatbots-ki-kundenservice:hover {
  background: rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.benefit-icon-chatbots-ki-kundenservice {
  font-size: 2rem;
  color: #06b6d4;
}

.benefit-card-title-chatbots-ki-kundenservice {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.benefit-card-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-chatbots-ki-kundenservice {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.implementation-wrapper-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.implementation-image-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-text-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-image-chatbots-ki-kundenservice {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  max-height: 450px;
  object-fit: cover;
}

.implementation-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 2rem;
  line-height: 1.2;
}

.implementation-steps-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-item-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
}

.step-number-chatbots-ki-kundenservice {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}

.step-title-chatbots-ki-kundenservice {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin: 0;
}

.step-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .implementation-wrapper-chatbots-ki-kundenservice {
    flex-direction: column;
  }

  .implementation-image-block-chatbots-ki-kundenservice,
  .implementation-text-block-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.applications-section-chatbots-ki-kundenservice {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.applications-header-chatbots-ki-kundenservice {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.applications-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.applications-subtitle-chatbots-ki-kundenservice {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
}

.applications-grid-chatbots-ki-kundenservice {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.application-card-chatbots-ki-kundenservice {
  flex: 1 1 280px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.application-card-chatbots-ki-kundenservice:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.app-card-title-chatbots-ki-kundenservice {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.app-card-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .application-card-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: none;
  }
}

.quote-section-chatbots-ki-kundenservice {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.featured-quote-chatbots-ki-kundenservice {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.quote-text-chatbots-ki-kundenservice {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  color: #0f172a;
  font-style: italic;
  line-height: 1.7;
  margin: 0 0 1rem 0;
}

.quote-author-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  font-style: normal;
  display: block;
}

.strategy-section-chatbots-ki-kundenservice {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.strategy-wrapper-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.strategy-text-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-image-block-chatbots-ki-kundenservice {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.strategy-text-chatbots-ki-kundenservice {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.strategy-list-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategy-item-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid #06b6d4;
}

.strategy-item-title-chatbots-ki-kundenservice {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-weight: 600;
  color: #0f172a;
  display: block;
}

.strategy-item-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.strategy-image-chatbots-ki-kundenservice {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  max-height: 400px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .strategy-wrapper-chatbots-ki-kundenservice {
    flex-direction: column;
  }

  .strategy-text-block-chatbots-ki-kundenservice,
  .strategy-image-block-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-chatbots-ki-kundenservice {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-chatbots-ki-kundenservice::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.conclusion-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-text-chatbots-ki-kundenservice {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.conclusion-cta-chatbots-ki-kundenservice {
  margin-top: 1rem;
}

.cta-button-chatbots-ki-kundenservice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.875rem, 2vw, 1.125rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-chatbots-ki-kundenservice:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-chatbots-ki-kundenservice {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.related-title-chatbots-ki-kundenservice {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.related-grid-chatbots-ki-kundenservice {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-chatbots-ki-kundenservice {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-card-chatbots-ki-kundenservice:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-content-chatbots-ki-kundenservice {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-chatbots-ki-kundenservice {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin: 0;
}

.related-card-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-chatbots-ki-kundenservice {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-link-chatbots-ki-kundenservice i {
  transition: transform 0.3s ease;
}

.related-card-chatbots-ki-kundenservice:hover .related-card-link-chatbots-ki-kundenservice i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-chatbots-ki-kundenservice {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-chatbots-ki-kundenservice {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
}

.disclaimer-content-chatbots-ki-kundenservice {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 8px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-chatbots-ki-kundenservice {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-chatbots-ki-kundenservice {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 480px) {
  h1 {
    font-size: 1.5rem;
  }

  h2 {
    font-size: 1.25rem;
  }
}

.main-personalisierung-kundenerlebnis {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-personalisierung-kundenerlebnis {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-personalisierung-kundenerlebnis::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-personalisierung-kundenerlebnis::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 2;
}

.breadcrumbs-personalisierung-kundenerlebnis {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  justify-content: center;
}

.breadcrumb-link-personalisierung-kundenerlebnis {
  color: #94a3b8;
  font-size: 0.9375rem;
  transition: color 0.3s ease;
}

.breadcrumb-link-personalisierung-kundenerlebnis:hover {
  color: #06b6d4;
}

.breadcrumb-separator-personalisierung-kundenerlebnis {
  color: #64748b;
  margin: 0 0.25rem;
}

.breadcrumb-current-personalisierung-kundenerlebnis {
  color: #06b6d4;
  font-size: 0.9375rem;
  font-weight: 600;
}

.hero-title-personalisierung-kundenerlebnis {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  max-width: 900px;
  margin: 0;
}

.hero-description-personalisierung-kundenerlebnis {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.7;
  color: #cbd5e1;
  max-width: 700px;
  margin: 0;
}

.hero-meta-personalisierung-kundenerlebnis {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.meta-badge-personalisierung-kundenerlebnis {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-personalisierung-kundenerlebnis i {
  font-size: 0.9rem;
}

.hero-image-personalisierung-kundenerlebnis {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  margin-top: 2rem;
}

.introduction-section-personalisierung-kundenerlebnis {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.introduction-content-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.introduction-text-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
}

@media (max-width: 768px) {
  .introduction-text-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.introduction-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.introduction-paragraph-personalisierung-kundenerlebnis {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.introduction-image-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .introduction-image-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-one-section-personalisierung-kundenerlebnis {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-one-wrapper-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.content-one-text-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
}

@media (max-width: 768px) {
  .content-one-text-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-one-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.content-one-paragraph-personalisierung-kundenerlebnis {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.content-one-list-personalisierung-kundenerlebnis {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.content-one-list-item-personalisierung-kundenerlebnis {
  color: #475569;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  padding-left: 1.5rem;
  position: relative;
}

.content-one-list-item-personalisierung-kundenerlebnis::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.content-one-list-strong-personalisierung-kundenerlebnis {
  color: #0f172a;
  font-weight: 600;
}

.content-one-image-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .content-one-image-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-two-section-personalisierung-kundenerlebnis {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-two-wrapper-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.content-two-image-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
  max-height: 350px;
  border-radius: 12px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .content-two-image-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
    order: 2;
  }
}

.content-two-text-personalisierung-kundenerlebnis {
  flex: 1 1 400px;
  max-width: 50%;
}

@media (max-width: 768px) {
  .content-two-text-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: 100%;
    order: 1;
  }
}

.content-two-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.content-two-paragraph-personalisierung-kundenerlebnis {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.strategy-box-personalisierung-kundenerlebnis {
  background: #f8fafc;
  border-left: 4px solid #06b6d4;
  padding: 1.5rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
}

.strategy-box-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.strategy-box-text-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
  margin: 0;
}

.benefits-section-personalisierung-kundenerlebnis {
  background: #1f2937;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-personalisierung-kundenerlebnis::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-personalisierung-kundenerlebnis {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.benefits-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: 1rem;
}

.benefits-subtitle-personalisierung-kundenerlebnis {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-grid-personalisierung-kundenerlebnis {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.benefit-card-personalisierung-kundenerlebnis {
  flex: 1 1 250px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  text-align: center;
  transition: all 0.3s ease;
}

.benefit-card-personalisierung-kundenerlebnis:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.benefit-number-personalisierung-kundenerlebnis {
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-card-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.benefit-card-text-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-personalisierung-kundenerlebnis {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-header-personalisierung-kundenerlebnis {
  text-align: center;
  margin-bottom: 3rem;
}

.implementation-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1rem;
}

.implementation-subtitle-personalisierung-kundenerlebnis {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.steps-container-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
}

.step-item-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  align-items: flex-start;
}

.step-number-personalisierung-kundenerlebnis {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  min-width: 60px;
  line-height: 1;
}

.step-content-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.step-text-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
  margin: 0;
}

@media (max-width: 768px) {
  .step-item-personalisierung-kundenerlebnis {
    flex-direction: column;
    align-items: flex-start;
  }
}

.quote-section-personalisierung-kundenerlebnis {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.featured-quote-personalisierung-kundenerlebnis {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 8px;
}

.quote-text-personalisierung-kundenerlebnis {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  line-height: 1.6;
  color: #ffffff;
  font-style: italic;
  margin-bottom: 1.5rem;
  margin: 0 0 1.5rem 0;
}

.quote-cite-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  color: #cbd5e1;
  font-style: normal;
}

.conclusion-section-personalisierung-kundenerlebnis {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-personalisierung-kundenerlebnis {
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.conclusion-text-personalisierung-kundenerlebnis {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.conclusion-highlights-personalisierung-kundenerlebnis {
  background: #ffffff;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  padding: clamp(1.5rem, 3vw, 2rem);
  margin: 2rem 0;
}

.highlight-box-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.highlight-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.highlight-list-personalisierung-kundenerlebnis {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.highlight-item-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
  padding-left: 1.5rem;
  position: relative;
}

.highlight-item-personalisierung-kundenerlebnis::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.conclusion-cta-personalisierung-kundenerlebnis {
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 12px;
  text-align: center;
  margin-top: 2rem;
}

.cta-title-personalisierung-kundenerlebnis {
  font-size: 1.375rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.cta-text-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 1.5rem;
  margin: 0 0 1.5rem 0;
}

.cta-button-personalisierung-kundenerlebnis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  color: #06b6d4;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  transition: all 0.3s ease;
}

.cta-button-personalisierung-kundenerlebnis:hover {
  background: #f1f5f9;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

.disclaimer-section-personalisierung-kundenerlebnis {
  background: #ffffff;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
  position: relative;
  overflow: hidden;
}

.disclaimer-content-personalisierung-kundenerlebnis {
  max-width: 800px;
  margin: 0 auto;
  background: #fef3c7;
  border-left: 4px solid #f59e0b;
  padding: clamp(1.5rem, 3vw, 2rem);
  border-radius: 8px;
}

.disclaimer-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #92400e;
  margin-bottom: 0.5rem;
}

.disclaimer-text-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #78350f;
  margin: 0;
}

.related-section-personalisierung-kundenerlebnis {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-personalisierung-kundenerlebnis {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-personalisierung-kundenerlebnis {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-personalisierung-kundenerlebnis {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.related-grid-personalisierung-kundenerlebnis {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-personalisierung-kundenerlebnis {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-card-personalisierung-kundenerlebnis:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-personalisierung-kundenerlebnis {
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.related-card-image-personalisierung-kundenerlebnis img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.related-card-personalisierung-kundenerlebnis:hover .related-card-image-personalisierung-kundenerlebnis img {
  transform: scale(1.05);
}

.related-card-content-personalisierung-kundenerlebnis {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1rem, 3vw, 1.5rem);
}

.related-card-title-personalisierung-kundenerlebnis {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.related-card-description-personalisierung-kundenerlebnis {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-personalisierung-kundenerlebnis {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-personalisierung-kundenerlebnis:hover {
  color: #0891b2;
  gap: 0.75rem;
}

@media (max-width: 768px) {
  .related-card-personalisierung-kundenerlebnis {
    flex: 1 1 100%;
    max-width: none;
  }

  .hero-section-personalisierung-kundenerlebnis::before,
  .hero-section-personalisierung-kundenerlebnis::after,
  .benefits-section-personalisierung-kundenerlebnis::before {
    display: none;
  }
}

@media (min-width: 768px) {
  .steps-container-personalisierung-kundenerlebnis {
    max-width: 900px;
  }
}

@media (min-width: 1024px) {
  .hero-section-personalisierung-kundenerlebnis {
    padding: clamp(4rem, 10vw, 8rem) 0;
  }
}

.main-bestandsverwaltung-inventory {
  width: 100%;
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-bestandsverwaltung-inventory {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-bestandsverwaltung-inventory::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-bestandsverwaltung-inventory::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-bestandsverwaltung-inventory {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.breadcrumb-link-bestandsverwaltung-inventory {
  color: #94a3b8;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  transition: color 0.3s ease;
}

.breadcrumb-link-bestandsverwaltung-inventory:hover {
  color: #06b6d4;
}

.breadcrumb-separator-bestandsverwaltung-inventory {
  color: #64748b;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-current-bestandsverwaltung-inventory {
  color: #06b6d4;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 600;
}

.hero-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-bestandsverwaltung-inventory {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-bestandsverwaltung-inventory {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #94a3b8;
  max-width: 650px;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.article-meta-bestandsverwaltung-inventory {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-bestandsverwaltung-inventory {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-bestandsverwaltung-inventory i {
  font-size: 0.875rem;
}

.hero-image-bestandsverwaltung-inventory {
  width: 100%;
  max-width: 600px;
  margin: clamp(1.5rem, 3vw, 3rem) 0 0;
}

.hero-featured-image-bestandsverwaltung-inventory {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.introduction-section-bestandsverwaltung-inventory {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.introduction-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.introduction-text-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-image-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.introduction-paragraph-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.7;
  margin-bottom: 1.25rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.introduction-image-asset-bestandsverwaltung-inventory {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .introduction-content-bestandsverwaltung-inventory {
    flex-direction: column;
  }

  .introduction-text-bestandsverwaltung-inventory,
  .introduction-image-bestandsverwaltung-inventory {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.methods-section-bestandsverwaltung-inventory {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.methods-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 4rem);
}

.methods-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(1.5rem, 3vw, 2.5rem);
}

.methods-steps-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 2vw, 1.75rem);
}

.method-step-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: flex-start;
  padding: clamp(1.25rem, 2vw, 1.75rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
}

.method-number-bestandsverwaltung-inventory {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.method-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.method-title-bestandsverwaltung-inventory {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #0f172a;
}

.method-text-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.methods-image-bestandsverwaltung-inventory {
  width: 100%;
  margin-top: clamp(1.5rem, 3vw, 3rem);
}

.methods-image-asset-bestandsverwaltung-inventory {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .method-step-bestandsverwaltung-inventory {
    flex-direction: column;
    gap: 1rem;
  }

  .method-number-bestandsverwaltung-inventory {
    min-width: 40px;
  }
}

.tools-section-bestandsverwaltung-inventory {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.tools-section-bestandsverwaltung-inventory::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.tools-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}

.tools-text-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-image-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.tools-paragraph-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
  line-height: 1.7;
  margin-bottom: 1.25rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.tools-features-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: clamp(1.25rem, 2vw, 2rem);
}

.tool-item-bestandsverwaltung-inventory {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: #e5e7eb;
  font-size: clamp(0.9375rem, 1vw, 1rem);
}

.tool-item-bestandsverwaltung-inventory i {
  color: #06b6d4;
  font-size: 1.125rem;
  flex-shrink: 0;
}

.tool-text-bestandsverwaltung-inventory {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.tools-image-asset-bestandsverwaltung-inventory {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .tools-content-bestandsverwaltung-inventory {
    flex-direction: column;
  }

  .tools-text-bestandsverwaltung-inventory,
  .tools-image-bestandsverwaltung-inventory {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.optimization-section-bestandsverwaltung-inventory {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.optimization-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.optimization-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(1.5rem, 3vw, 2rem);
}

.featured-quote-bestandsverwaltung-inventory {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: clamp(1.5rem, 3vw, 2.5rem) 0;
  border-radius: 4px;
}

.quote-text-bestandsverwaltung-inventory {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #0f172a;
  font-style: italic;
  margin-bottom: 1rem;
  line-height: 1.7;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.quote-author-bestandsverwaltung-inventory {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  font-style: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.optimization-grid-bestandsverwaltung-inventory {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.optimization-card-bestandsverwaltung-inventory {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.optimization-card-bestandsverwaltung-inventory:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.optimization-card-title-bestandsverwaltung-inventory {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
}

.optimization-card-text-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.practices-section-bestandsverwaltung-inventory {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.practices-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.practices-text-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.practices-image-bestandsverwaltung-inventory {
  flex: 1 1 50%;
  max-width: 50%;
}

.practices-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.practices-paragraph-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.7;
  margin-bottom: 1.25rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.practices-image-asset-bestandsverwaltung-inventory {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .practices-content-bestandsverwaltung-inventory {
    flex-direction: column;
  }

  .practices-text-bestandsverwaltung-inventory,
  .practices-image-bestandsverwaltung-inventory {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-bestandsverwaltung-inventory {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-bestandsverwaltung-inventory::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-section-bestandsverwaltung-inventory::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-paragraph-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
  line-height: 1.7;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.conclusion-cta-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
  text-align: center;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: rgba(6, 182, 212, 0.1);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
}

.cta-heading-bestandsverwaltung-inventory {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 600;
  color: #ffffff;
}

.cta-text-bestandsverwaltung-inventory {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.cta-button-bestandsverwaltung-inventory {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #06b6d4;
  color: #0f172a;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  gap: 0.5rem;
}

.cta-button-bestandsverwaltung-inventory:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-bestandsverwaltung-inventory {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.related-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.related-title-bestandsverwaltung-inventory {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  text-align: center;
  max-width: 700px;
  margin: 0 auto;
}

.related-subtitle-bestandsverwaltung-inventory {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.related-cards-bestandsverwaltung-inventory {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-bestandsverwaltung-inventory {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-card-bestandsverwaltung-inventory:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-bestandsverwaltung-inventory {
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.related-card-image-bestandsverwaltung-inventory img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-card-content-bestandsverwaltung-inventory {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1rem, 2vw, 1.5rem);
}

.related-card-title-bestandsverwaltung-inventory {
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
}

.related-card-text-bestandsverwaltung-inventory {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.6;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.related-card-link-bestandsverwaltung-inventory {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-bestandsverwaltung-inventory:hover {
  gap: 0.75rem;
  color: #22d3ee;
}

.related-card-link-bestandsverwaltung-inventory i {
  font-size: 0.875rem;
}

@media (max-width: 768px) {
  .related-card-bestandsverwaltung-inventory {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-bestandsverwaltung-inventory {
  background: #f8fafc;
  padding: clamp(2.5rem, 5vw, 5rem) 0;
}

.disclaimer-content-bestandsverwaltung-inventory {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  border-left: 4px solid #06b6d4;
}

.disclaimer-title-bestandsverwaltung-inventory {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-bestandsverwaltung-inventory {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

@media (max-width: 768px) {
  .optimization-grid-bestandsverwaltung-inventory {
    flex-direction: column;
  }

  .optimization-card-bestandsverwaltung-inventory {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .article-meta-bestandsverwaltung-inventory {
    flex-direction: column;
    gap: 0.5rem;
  }

  .meta-badge-bestandsverwaltung-inventory {
    width: 100%;
    justify-content: center;
  }
}

.main-voice-commerce-neue-kanale {
  width: 100%;
  position: relative;
}

.hero-section-voice-commerce-neue-kanale {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-voice-commerce-neue-kanale::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-voice-commerce-neue-kanale::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-voice-commerce-neue-kanale {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-voice-commerce-neue-kanale {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-voice-commerce-neue-kanale:hover {
  color: #06b6d4;
}

.breadcrumb-separator-voice-commerce-neue-kanale {
  color: #6b7280;
}

.breadcrumb-current-voice-commerce-neue-kanale {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
  text-align: center;
}

.hero-title-voice-commerce-neue-kanale {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-voice-commerce-neue-kanale {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-voice-commerce-neue-kanale {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-voice-commerce-neue-kanale {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border: 1px solid rgba(6, 182, 212, 0.2);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.hero-image-voice-commerce-neue-kanale {
  width: 100%;
  max-width: 700px;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
  display: block;
  margin: 0 auto;
}

.intro-section-voice-commerce-neue-kanale {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-wrapper-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-voice-commerce-neue-kanale {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.intro-paragraph-voice-commerce-neue-kanale {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #374151;
  margin-bottom: 1.5rem;
}

.intro-image-voice-commerce-neue-kanale img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .intro-content-wrapper-voice-commerce-neue-kanale {
    flex-direction: column;
  }

  .intro-text-voice-commerce-neue-kanale,
  .intro-image-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-one-voice-commerce-neue-kanale {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.section-header-voice-commerce-neue-kanale {
  text-align: center;
  margin-bottom: 3rem;
}

.section-tag-voice-commerce-neue-kanale {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.content-title-voice-commerce-neue-kanale {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.75rem;
}

.section-subtitle-voice-commerce-neue-kanale {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.content-wrapper-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-paragraph-voice-commerce-neue-kanale {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #374151;
  margin-bottom: 1.5rem;
}

.content-subheading-voice-commerce-neue-kanale {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.375rem);
  font-weight: 600;
  color: #1e293b;
  margin: 1.5rem 0 1rem;
}

.content-list-voice-commerce-neue-kanale {
  list-style: none;
  margin-bottom: 1.5rem;
}

.list-item-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  color: #374151;
  padding-left: 1.5rem;
  margin-bottom: 0.75rem;
  position: relative;
}

.list-item-voice-commerce-neue-kanale::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.content-image-voice-commerce-neue-kanale img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .content-wrapper-voice-commerce-neue-kanale {
    flex-direction: column;
  }

  .content-text-voice-commerce-neue-kanale,
  .content-image-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-two-voice-commerce-neue-kanale {
  background: #111827;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.content-wrapper-reverse-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-wrapper-reverse-voice-commerce-neue-kanale .content-text-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
  order: 2;
}

.content-wrapper-reverse-voice-commerce-neue-kanale .content-image-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
  order: 1;
}

.content-section-two-voice-commerce-neue-kanale .section-header-voice-commerce-neue-kanale {
  margin-bottom: 2rem;
}

.content-section-two-voice-commerce-neue-kanale .section-tag-voice-commerce-neue-kanale {
  background: rgba(6, 182, 212, 0.15);
}

.content-section-two-voice-commerce-neue-kanale .content-title-voice-commerce-neue-kanale {
  color: #ffffff;
}

.content-section-two-voice-commerce-neue-kanale .section-subtitle-voice-commerce-neue-kanale {
  color: #9ca3af;
}

.content-section-two-voice-commerce-neue-kanale .content-paragraph-voice-commerce-neue-kanale {
  color: #cbd5e1;
}

.content-section-two-voice-commerce-neue-kanale .content-subheading-voice-commerce-neue-kanale {
  color: #ffffff;
}

.highlight-box-voice-commerce-neue-kanale {
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  padding: 1.5rem;
  border-radius: 8px;
  margin: 1.5rem 0;
}

.highlight-text-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  color: #e0e0e0;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .content-wrapper-reverse-voice-commerce-neue-kanale {
    flex-direction: column;
  }

  .content-wrapper-reverse-voice-commerce-neue-kanale .content-text-voice-commerce-neue-kanale,
  .content-wrapper-reverse-voice-commerce-neue-kanale .content-image-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: 100%;
    order: unset;
  }
}

.platforms-section-voice-commerce-neue-kanale {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.platforms-grid-voice-commerce-neue-kanale {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-top: 3rem;
}

.platform-card-voice-commerce-neue-kanale {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.platform-card-voice-commerce-neue-kanale:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.platform-icon-voice-commerce-neue-kanale {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.platform-card-title-voice-commerce-neue-kanale {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.platform-card-text-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

@media (max-width: 768px) {
  .platform-card-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-voice-commerce-neue-kanale {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-title-voice-commerce-neue-kanale {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
}

.steps-container-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 2rem;
}

.step-card-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.step-number-voice-commerce-neue-kanale {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-voice-commerce-neue-kanale {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.step-text-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.insights-section-voice-commerce-neue-kanale {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-section-voice-commerce-neue-kanale .section-header-voice-commerce-neue-kanale {
  margin-bottom: 2rem;
}

.insights-section-voice-commerce-neue-kanale .section-tag-voice-commerce-neue-kanale {
  background: rgba(6, 182, 212, 0.15);
}

.insights-section-voice-commerce-neue-kanale .content-title-voice-commerce-neue-kanale {
  color: #ffffff;
}

.insights-section-voice-commerce-neue-kanale .section-subtitle-voice-commerce-neue-kanale {
  color: #9ca3af;
}

.insights-wrapper-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  margin-bottom: 3rem;
}

.insights-text-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.insight-image-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.insight-heading-voice-commerce-neue-kanale {
  font-size: 1.375rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 1rem;
}

.insight-paragraph-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
  margin-bottom: 1.5rem;
}

.insight-image-voice-commerce-neue-kanale img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  display: block;
}

.challenges-wrapper-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.challenge-image-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenge-text-voice-commerce-neue-kanale {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenge-heading-voice-commerce-neue-kanale {
  font-size: 1.375rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 1rem;
}

.challenge-paragraph-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
  margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
  .insights-wrapper-voice-commerce-neue-kanale,
  .challenges-wrapper-voice-commerce-neue-kanale {
    flex-direction: column;
  }

  .insights-text-voice-commerce-neue-kanale,
  .insight-image-voice-commerce-neue-kanale,
  .challenge-image-voice-commerce-neue-kanale,
  .challenge-text-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-voice-commerce-neue-kanale {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-voice-commerce-neue-kanale {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-voice-commerce-neue-kanale {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.conclusion-text-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #374151;
  margin-bottom: 2rem;
}

.conclusion-quote-voice-commerce-neue-kanale {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
  margin: 2rem 0;
}

.quote-text-voice-commerce-neue-kanale {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 500;
  font-style: italic;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-author-voice-commerce-neue-kanale {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.cta-box-voice-commerce-neue-kanale {
  background: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
  padding: clamp(2rem, 5vw, 3rem);
  border-radius: 12px;
  text-align: center;
  margin-top: 2rem;
}

.cta-title-voice-commerce-neue-kanale {
  font-size: 1.375rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.cta-text-voice-commerce-neue-kanale {
  font-size: 0.9375rem;
  color: #ffffff;
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.cta-button-voice-commerce-neue-kanale {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  color: #06b6d4;
  font-weight: 600;
  border-radius: 8px;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-voice-commerce-neue-kanale:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.disclaimer-section-voice-commerce-neue-kanale {
  background: #111827;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.15);
  position: relative;
  overflow: hidden;
}

.disclaimer-content-voice-commerce-neue-kanale {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-voice-commerce-neue-kanale {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 1rem;
}

.disclaimer-text-voice-commerce-neue-kanale {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.related-section-voice-commerce-neue-kanale {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-voice-commerce-neue-kanale {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-voice-commerce-neue-kanale {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.75rem;
}

.related-subtitle-voice-commerce-neue-kanale {
  font-size: 1rem;
  color: #64748b;
}

.related-cards-wrapper-voice-commerce-neue-kanale {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-voice-commerce-neue-kanale {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #f8fafc;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-voice-commerce-neue-kanale:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-voice-commerce-neue-kanale {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

.related-card-content-voice-commerce-neue-kanale {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem;
}

.related-card-title-voice-commerce-neue-kanale {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.related-card-text-voice-commerce-neue-kanale {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #64748b;
  flex-grow: 1;
}

.related-card-link-voice-commerce-neue-kanale {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.875rem;
  transition: all 0.3s ease;
  text-decoration: none;
  margin-top: 0.5rem;
}

.related-card-link-voice-commerce-neue-kanale:hover {
  color: #0891b2;
}

.related-card-link-voice-commerce-neue-kanale i {
  transition: transform 0.3s ease;
}

.related-card-voice-commerce-neue-kanale:hover .related-card-link-voice-commerce-neue-kanale i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-voice-commerce-neue-kanale {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .step-card-voice-commerce-neue-kanale {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .step-number-voice-commerce-neue-kanale {
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-voice-commerce-neue-kanale {
    font-size: 0.75rem;
  }

  .hero-title-voice-commerce-neue-kanale {
    font-size: 1.5rem;
  }

  .meta-badge-voice-commerce-neue-kanale {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
}

.main-marketplace-multi-channel-verkauf {
  width: 100%;
  background: #ffffff;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-marketplace-multi-channel-verkauf {
  background: linear-gradient(135deg, #0a0f1e 0%, #1a2332 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-marketplace-multi-channel-verkauf::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-marketplace-multi-channel-verkauf::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-marketplace-multi-channel-verkauf {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-marketplace-multi-channel-verkauf {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-marketplace-multi-channel-verkauf:hover {
  color: #06b6d4;
}

.breadcrumb-separator-marketplace-multi-channel-verkauf {
  color: #475569;
}

.breadcrumb-current-marketplace-multi-channel-verkauf {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.hero-title-marketplace-multi-channel-verkauf {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-marketplace-multi-channel-verkauf {
  font-size: clamp(1rem, 2vw + 0.25rem, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0;
  line-height: 1.6;
}

.hero-image-marketplace-multi-channel-verkauf {
  max-width: 100%;
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  margin-top: 1rem;
}

.hero-stats-marketplace-multi-channel-verkauf {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 5vw, 4rem);
  justify-content: center;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.stat-item-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.stat-number-marketplace-multi-channel-verkauf {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-marketplace-multi-channel-verkauf {
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 500;
}

.introduction-section-marketplace-multi-channel-verkauf {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.introduction-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-image-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
}

.introduction-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.introduction-paragraph-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.introduction-paragraph-marketplace-multi-channel-verkauf:last-of-type {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .introduction-content-marketplace-multi-channel-verkauf {
    flex-direction: column;
  }

  .introduction-text-marketplace-multi-channel-verkauf,
  .introduction-image-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.channels-section-marketplace-multi-channel-verkauf {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.channels-section-marketplace-multi-channel-verkauf::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.channels-header-marketplace-multi-channel-verkauf {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.channels-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.channels-subtitle-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.channels-grid-marketplace-multi-channel-verkauf {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.channel-card-marketplace-multi-channel-verkauf {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.channel-card-marketplace-multi-channel-verkauf:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.channel-number-marketplace-multi-channel-verkauf {
  font-size: 2rem;
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.channel-name-marketplace-multi-channel-verkauf {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.channel-description-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.channel-benefits-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0 0;
}

.benefit-item-marketplace-multi-channel-verkauf {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #94a3b8;
}

.benefit-item-marketplace-multi-channel-verkauf i {
  color: #06b6d4;
  font-size: 0.75rem;
}

@media (max-width: 768px) {
  .channel-card-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: none;
  }
}

.integration-section-marketplace-multi-channel-verkauf {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.integration-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.integration-image-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
}

.integration-text-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
}

.integration-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.integration-paragraph-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.integration-tools-list-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.tool-item-marketplace-multi-channel-verkauf {
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #e2e8f0;
}

.tool-item-marketplace-multi-channel-verkauf:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.tool-name-marketplace-multi-channel-verkauf {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 0.5rem 0;
}

.tool-description-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .integration-content-marketplace-multi-channel-verkauf {
    flex-direction: column;
  }

  .integration-image-marketplace-multi-channel-verkauf,
  .integration-text-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.strategy-section-marketplace-multi-channel-verkauf {
  background: #1a2332;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.strategy-header-marketplace-multi-channel-verkauf {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.strategy-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.strategy-subtitle-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.strategy-steps-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategy-step-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.strategy-step-marketplace-multi-channel-verkauf:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.step-number-marketplace-multi-channel-verkauf {
  font-size: 2rem;
  font-weight: 700;
  color: #06b6d4;
  min-width: 60px;
  line-height: 1;
  flex-shrink: 0;
}

.step-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.step-description-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .strategy-step-marketplace-multi-channel-verkauf {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-marketplace-multi-channel-verkauf {
    min-width: auto;
  }
}

.challenges-section-marketplace-multi-channel-verkauf {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.challenges-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.challenges-text-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-image-marketplace-multi-channel-verkauf {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
}

.challenges-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.challenges-intro-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.challenge-item-marketplace-multi-channel-verkauf {
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #e2e8f0;
}

.challenge-item-marketplace-multi-channel-verkauf:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.challenge-name-marketplace-multi-channel-verkauf {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 0.5rem 0;
}

.challenge-text-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.challenge-text-marketplace-multi-channel-verkauf strong {
  color: #0f172a;
  font-weight: 600;
}

@media (max-width: 768px) {
  .challenges-content-marketplace-multi-channel-verkauf {
    flex-direction: column;
  }

  .challenges-text-marketplace-multi-channel-verkauf,
  .challenges-image-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.success-section-marketplace-multi-channel-verkauf {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.success-header-marketplace-multi-channel-verkauf {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.success-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.success-subtitle-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.success-metrics-marketplace-multi-channel-verkauf {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.metric-card-marketplace-multi-channel-verkauf {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.metric-card-marketplace-multi-channel-verkauf:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.metric-title-marketplace-multi-channel-verkauf {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.metric-description-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.metric-benchmark-marketplace-multi-channel-verkauf {
  font-size: 1rem;
  font-weight: 600;
  color: #06b6d4;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(6, 182, 212, 0.2);
}

@media (max-width: 768px) {
  .metric-card-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-marketplace-multi-channel-verkauf {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-marketplace-multi-channel-verkauf {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.conclusion-text-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.conclusion-quote-marketplace-multi-channel-verkauf {
  padding: clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  margin: 1.5rem 0;
  border-radius: 8px;
}

.quote-text-marketplace-multi-channel-verkauf {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #1a1a1a;
  font-style: italic;
  margin: 0 0 1rem 0;
  line-height: 1.7;
}

.quote-author-marketplace-multi-channel-verkauf {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.conclusion-cta-marketplace-multi-channel-verkauf {
  margin-top: 1rem;
}

.cta-button-marketplace-multi-channel-verkauf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 4vw, 2.5rem);
  font-size: clamp(0.9375rem, 1vw, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #000000;
  border-radius: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-marketplace-multi-channel-verkauf:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-marketplace-multi-channel-verkauf {
  background: #0a0f1e;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-marketplace-multi-channel-verkauf {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.related-title-marketplace-multi-channel-verkauf {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.related-subtitle-marketplace-multi-channel-verkauf {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.related-cards-marketplace-multi-channel-verkauf {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-marketplace-multi-channel-verkauf {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-marketplace-multi-channel-verkauf:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.related-card-title-marketplace-multi-channel-verkauf {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.related-card-description-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-marketplace-multi-channel-verkauf {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-marketplace-multi-channel-verkauf:hover {
  color: #22d3ee;
  gap: 0.75rem;
}

.related-card-link-marketplace-multi-channel-verkauf i {
  font-size: 0.75rem;
}

@media (max-width: 768px) {
  .related-card-marketplace-multi-channel-verkauf {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-marketplace-multi-channel-verkauf {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.disclaimer-content-marketplace-multi-channel-verkauf {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
}

.disclaimer-title-marketplace-multi-channel-verkauf {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 1rem 0;
}

.disclaimer-text-marketplace-multi-channel-verkauf {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-stats-marketplace-multi-channel-verkauf {
    gap: clamp(1.5rem, 4vw, 2rem);
  }

  .channels-grid-marketplace-multi-channel-verkauf,
  .success-metrics-marketplace-multi-channel-verkauf,
  .related-cards-marketplace-multi-channel-verkauf {
    gap: clamp(1rem, 2vw, 1.5rem);
  }
}

@media (max-width: 480px) {
  .hero-title-marketplace-multi-channel-verkauf {
    font-size: 1.5rem;
  }

  .breadcrumbs-marketplace-multi-channel-verkauf {
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .hero-stats-marketplace-multi-channel-verkauf {
    flex-direction: column;
    gap: 1rem;
  }
}

.main-subscription-modelle-wiederkehrend {
  width: 100%;
  background: #ffffff;
  position: relative;
}

.breadcrumbs-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-subscription-modelle-wiederkehrend {
  color: #3b82f6;
  transition: color 0.3s ease;
}

.breadcrumb-link-subscription-modelle-wiederkehrend:hover {
  color: #1e40af;
  text-decoration: underline;
}

.breadcrumb-separator-subscription-modelle-wiederkehrend {
  color: #cbd5e1;
  margin: 0 0.25rem;
}

.breadcrumb-current-subscription-modelle-wiederkehrend {
  color: #64748b;
}

.hero-section-subscription-modelle-wiederkehrend {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-subscription-modelle-wiederkehrend::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-subscription-modelle-wiederkehrend::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero-subtitle-subscription-modelle-wiederkehrend {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  line-height: 1.5;
  max-width: 700px;
}

.hero-meta-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem 0;
}

.meta-badge-subscription-modelle-wiederkehrend {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-subscription-modelle-wiederkehrend i {
  font-size: 0.875rem;
}

.hero-image-subscription-modelle-wiederkehrend {
  margin-top: 2rem;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.hero-img-subscription-modelle-wiederkehrend {
  width: 100%;
  height: auto;
  max-height: 450px;
  object-fit: cover;
  display: block;
}

.intro-section-subscription-modelle-wiederkehrend {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.intro-content-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.intro-description-subscription-modelle-wiederkehrend {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.intro-image-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.intro-img-subscription-modelle-wiederkehrend {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.models-section-subscription-modelle-wiederkehrend {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.models-header-subscription-modelle-wiederkehrend {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.models-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.models-subtitle-subscription-modelle-wiederkehrend {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
  margin: 0;
}

.models-grid-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.model-card-subscription-modelle-wiederkehrend {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.model-card-subscription-modelle-wiederkehrend:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.model-icon-subscription-modelle-wiederkehrend {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.model-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.model-text-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.implementation-section-subscription-modelle-wiederkehrend {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-subscription-modelle-wiederkehrend::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.implementation-wrapper-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.implementation-text-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 2rem;
  line-height: 1.2;
}

.steps-container-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-item-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
}

.step-number-subscription-modelle-wiederkehrend {
  font-size: 2rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.step-text-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.implementation-image-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.implementation-img-subscription-modelle-wiederkehrend {
  width: 100%;
  height: auto;
  max-height: 450px;
  object-fit: cover;
  display: block;
}

.metrics-section-subscription-modelle-wiederkehrend {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.metrics-header-subscription-modelle-wiederkehrend {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.metrics-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.metrics-subtitle-subscription-modelle-wiederkehrend {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
  margin: 0;
}

.metrics-content-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  margin-bottom: 3rem;
}

.metrics-text-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
}

.metrics-subheading-subscription-modelle-wiederkehrend {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.metrics-description-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.7;
  margin: 1rem 0;
}

.metrics-image-subscription-modelle-wiederkehrend {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.metrics-img-subscription-modelle-wiederkehrend {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.kpi-cards-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 3vw, 2rem);
}

.kpi-card-subscription-modelle-wiederkehrend {
  flex: 1 1 200px;
  max-width: 280px;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-align: center;
  transition: all 0.3s ease;
}

.kpi-card-subscription-modelle-wiederkehrend:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.1);
}

.kpi-number-subscription-modelle-wiederkehrend {
  font-size: 1.75rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: 0.5rem;
}

.kpi-label-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.kpi-description-subscription-modelle-wiederkehrend {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.5;
  margin: 0.5rem 0 0;
}

.best-practices-section-subscription-modelle-wiederkehrend {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.best-practices-section-subscription-modelle-wiederkehrend::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.best-practices-header-subscription-modelle-wiederkehrend {
  text-align: center;
  margin-bottom: 2rem;
  position: relative;
  z-index: 1;
}

.best-practices-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.featured-quote-subscription-modelle-wiederkehrend {
  margin: 2rem 0 3rem;
  padding: 2rem 2.5rem;
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  position: relative;
  z-index: 1;
}

.quote-text-subscription-modelle-wiederkehrend {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #ffffff;
  line-height: 1.6;
  margin-bottom: 1rem;
  margin: 0 0 1rem;
}

.quote-author-subscription-modelle-wiederkehrend {
  font-size: 0.875rem;
  color: #cbd5e1;
  font-style: normal;
}

.practices-grid-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.practice-item-subscription-modelle-wiederkehrend {
  flex: 1 1 300px;
  max-width: 380px;
  padding: 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.practice-item-subscription-modelle-wiederkehrend:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.practice-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.practice-text-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.tools-section-subscription-modelle-wiederkehrend {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.tools-header-subscription-modelle-wiederkehrend {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.tools-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.tools-subtitle-subscription-modelle-wiederkehrend {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
  margin: 0;
}

.tools-grid-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-category-subscription-modelle-wiederkehrend {
  flex: 1 1 280px;
  max-width: 350px;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.tool-category-subscription-modelle-wiederkehrend:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.1);
}

.tool-category-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.tool-list-subscription-modelle-wiederkehrend {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.tool-item-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #475569;
  padding-left: 1.5rem;
  position: relative;
}

.tool-item-subscription-modelle-wiederkehrend::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: 700;
}

.cta-section-subscription-modelle-wiederkehrend {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-subscription-modelle-wiederkehrend::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-subscription-modelle-wiederkehrend::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.cta-description-subscription-modelle-wiederkehrend {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-subscription-modelle-wiederkehrend {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.btn-primary-subscription-modelle-wiederkehrend,
.btn-secondary-subscription-modelle-wiederkehrend {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
  border: 2px solid transparent;
}

.btn-primary-subscription-modelle-wiederkehrend {
  background: #06b6d4;
  color: #000000;
}

.btn-primary-subscription-modelle-wiederkehrend:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-subscription-modelle-wiederkehrend {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.btn-secondary-subscription-modelle-wiederkehrend:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-subscription-modelle-wiederkehrend {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-subscription-modelle-wiederkehrend {
  max-width: 800px;
}

.disclaimer-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-subscription-modelle-wiederkehrend {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-subscription-modelle-wiederkehrend {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-subscription-modelle-wiederkehrend {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-subscription-modelle-wiederkehrend {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  line-height: 1.2;
}

.related-grid-subscription-modelle-wiederkehrend {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-subscription-modelle-wiederkehrend {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  border-radius: 12px;
  overflow: hidden;
  background: #f8fafc;
  transition: all 0.3s ease;
  border: 1px solid #e2e8f0;
}

.related-card-subscription-modelle-wiederkehrend:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
  border-color: #06b6d4;
}

.related-image-subscription-modelle-wiederkehrend {
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.1), rgba(59, 130, 246, 0.1));
}

.related-img-subscription-modelle-wiederkehrend {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-card-title-subscription-modelle-wiederkehrend {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  padding: 0 1rem;
  padding-top: 1rem;
}

.related-card-text-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  padding: 0 1rem;
}

.related-link-subscription-modelle-wiederkehrend {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #06b6d4;
  padding: 0 1rem 1rem;
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-link-subscription-modelle-wiederkehrend:hover {
  color: #0891b2;
}

@media (max-width: 768px) {
  .intro-content-subscription-modelle-wiederkehrend,
  .implementation-wrapper-subscription-modelle-wiederkehrend,
  .metrics-content-subscription-modelle-wiederkehrend {
    flex-direction: column;
  }

  .intro-text-subscription-modelle-wiederkehrend,
  .intro-image-subscription-modelle-wiederkehrend,
  .implementation-text-subscription-modelle-wiederkehrend,
  .implementation-image-subscription-modelle-wiederkehrend,
  .metrics-text-subscription-modelle-wiederkehrend,
  .metrics-image-subscription-modelle-wiederkehrend {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .models-grid-subscription-modelle-wiederkehrend,
  .practices-grid-subscription-modelle-wiederkehrend,
  .tools-grid-subscription-modelle-wiederkehrend,
  .kpi-cards-subscription-modelle-wiederkehrend,
  .related-grid-subscription-modelle-wiederkehrend {
    flex-direction: column;
    align-items: stretch;
  }

  .model-card-subscription-modelle-wiederkehrend,
  .practice-item-subscription-modelle-wiederkehrend,
  .tool-category-subscription-modelle-wiederkehrend,
  .kpi-card-subscription-modelle-wiederkehrend,
  .related-card-subscription-modelle-wiederkehrend {
    max-width: none;
  }

  .cta-buttons-subscription-modelle-wiederkehrend {
    flex-direction: column;
    width: 100%;
  }

  .btn-primary-subscription-modelle-wiederkehrend,
  .btn-secondary-subscription-modelle-wiederkehrend {
    width: 100%;
  }

  .step-item-subscription-modelle-wiederkehrend {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-subscription-modelle-wiederkehrend {
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .hero-title-subscription-modelle-wiederkehrend {
    font-size: 1.5rem;
  }

  .models-title-subscription-modelle-wiederkehrend,
  .best-practices-title-subscription-modelle-wiederkehrend,
  .implementation-title-subscription-modelle-wiederkehrend,
  .metrics-title-subscription-modelle-wiederkehrend,
  .tools-title-subscription-modelle-wiederkehrend,
  .cta-title-subscription-modelle-wiederkehrend,
  .related-title-subscription-modelle-wiederkehrend {
    font-size: 1.25rem;
  }

  .breadcrumbs-subscription-modelle-wiederkehrend {
    font-size: 0.75rem;
  }
}

.main-kundenfeedback-bewertungsmanagement {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-kundenfeedback-bewertungsmanagement"] {
  width: 100%;
  overflow: hidden;
}

.hero-section-kundenfeedback-bewertungsmanagement {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-kundenfeedback-bewertungsmanagement::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-kundenfeedback-bewertungsmanagement::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-kundenfeedback-bewertungsmanagement {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-kundenfeedback-bewertungsmanagement:hover {
  color: #06b6d4;
}

.breadcrumb-separator-kundenfeedback-bewertungsmanagement {
  color: #64748b;
}

.breadcrumb-current-kundenfeedback-bewertungsmanagement {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.hero-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.hero-meta-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem 0;
}

.meta-badge-kundenfeedback-bewertungsmanagement {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-kundenfeedback-bewertungsmanagement i {
  font-size: 0.875rem;
}

.hero-image-wrapper-kundenfeedback-bewertungsmanagement {
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.hero-image-kundenfeedback-bewertungsmanagement {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  max-height: 450px;
}

.intro-section-kundenfeedback-bewertungsmanagement {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.intro-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.intro-image-kundenfeedback-bewertungsmanagement {
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-kundenfeedback-bewertungsmanagement {
    flex-direction: column;
  }

  .intro-text-block-kundenfeedback-bewertungsmanagement,
  .intro-image-block-kundenfeedback-bewertungsmanagement {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.benefits-section-kundenfeedback-bewertungsmanagement {
  background: linear-gradient(135deg, #0a0f1e 0%, #1a1a2e 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-kundenfeedback-bewertungsmanagement::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.benefits-header-kundenfeedback-bewertungsmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.benefits-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 1rem;
}

.benefits-subtitle-kundenfeedback-bewertungsmanagement {
  color: #94a3b8;
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
}

.benefits-grid-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-card-kundenfeedback-bewertungsmanagement {
  flex: 1 1 250px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-kundenfeedback-bewertungsmanagement:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.benefit-icon-kundenfeedback-bewertungsmanagement {
  font-size: 2rem;
  color: #06b6d4;
  height: 56px;
  display: flex;
  align-items: center;
}

.benefit-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #ffffff;
  font-weight: 600;
}

.benefit-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.process-section-kundenfeedback-bewertungsmanagement {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.process-header-kundenfeedback-bewertungsmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.process-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1rem;
}

.process-subtitle-kundenfeedback-bewertungsmanagement {
  color: #64748b;
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
}

.process-steps-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 900px;
  margin: 0 auto;
}

.process-step-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.process-step-kundenfeedback-bewertungsmanagement:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
}

.process-number-kundenfeedback-bewertungsmanagement {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.process-content-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.process-step-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
}

.process-step-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .process-step-kundenfeedback-bewertungsmanagement {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .process-number-kundenfeedback-bewertungsmanagement {
    min-width: auto;
  }
}

.implementation-section-kundenfeedback-bewertungsmanagement {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.implementation-content-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.implementation-text-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-image-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1.5rem;
}

.implementation-subtitle-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #334155;
  font-weight: 600;
  margin: 1.5rem 0 1rem;
}

.implementation-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.implementation-image-kundenfeedback-bewertungsmanagement {
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .implementation-content-kundenfeedback-bewertungsmanagement {
    flex-direction: column;
  }

  .implementation-text-block-kundenfeedback-bewertungsmanagement,
  .implementation-image-block-kundenfeedback-bewertungsmanagement {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.responses-section-kundenfeedback-bewertungsmanagement {
  background: #f1f5f9;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.responses-header-kundenfeedback-bewertungsmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.responses-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1rem;
}

.responses-subtitle-kundenfeedback-bewertungsmanagement {
  color: #64748b;
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
}

.responses-grid-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 3vw, 2rem);
}

.response-card-kundenfeedback-bewertungsmanagement {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
}

.response-card-kundenfeedback-bewertungsmanagement:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.response-card-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
}

.response-card-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.insights-section-kundenfeedback-bewertungsmanagement {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-section-kundenfeedback-bewertungsmanagement::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.insights-content-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.insights-image-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.insights-text-block-kundenfeedback-bewertungsmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.insights-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 1.5rem;
}

.insights-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.insights-image-kundenfeedback-bewertungsmanagement {
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.insights-quote-kundenfeedback-bewertungsmanagement {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.1);
  margin: 2rem 0;
  border-radius: 8px;
}

.insights-quote-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #ffffff;
  font-style: italic;
  line-height: 1.6;
  margin: 0 0 1rem 0;
}

.insights-quote-cite-kundenfeedback-bewertungsmanagement {
  font-size: 0.875rem;
  color: #94a3b8;
  font-style: normal;
}

@media (max-width: 768px) {
  .insights-content-kundenfeedback-bewertungsmanagement {
    flex-direction: column;
  }

  .insights-image-block-kundenfeedback-bewertungsmanagement,
  .insights-text-block-kundenfeedback-bewertungsmanagement {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-kundenfeedback-bewertungsmanagement {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-kundenfeedback-bewertungsmanagement {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1.5rem;
}

.conclusion-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.conclusion-cta-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 2rem;
}

.btn-primary-kundenfeedback-bewertungsmanagement,
.btn-secondary-kundenfeedback-bewertungsmanagement {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
  border: 2px solid transparent;
}

.btn-primary-kundenfeedback-bewertungsmanagement {
  background: #06b6d4;
  color: #000000;
}

.btn-primary-kundenfeedback-bewertungsmanagement:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-secondary-kundenfeedback-bewertungsmanagement {
  background: transparent;
  border-color: #06b6d4;
  color: #06b6d4;
}

.btn-secondary-kundenfeedback-bewertungsmanagement:hover {
  background: rgba(6, 182, 212, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-kundenfeedback-bewertungsmanagement {
  background: #ffffff;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-kundenfeedback-bewertungsmanagement {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
}

.related-section-kundenfeedback-bewertungsmanagement {
  background: #f1f5f9;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-header-kundenfeedback-bewertungsmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.related-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 1rem;
}

.related-subtitle-kundenfeedback-bewertungsmanagement {
  color: #64748b;
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
}

.related-cards-kundenfeedback-bewertungsmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.related-card-kundenfeedback-bewertungsmanagement {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
}

.related-card-kundenfeedback-bewertungsmanagement:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 32px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-kundenfeedback-bewertungsmanagement {
  width: 100%;
  height: 220px;
  overflow: hidden;
}

.related-card-image-kundenfeedback-bewertungsmanagement img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.related-card-kundenfeedback-bewertungsmanagement:hover .related-card-image-kundenfeedback-bewertungsmanagement img {
  transform: scale(1.05);
}

.related-card-title-kundenfeedback-bewertungsmanagement {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
  padding: 0 clamp(1rem, 2vw, 1.5rem);
  padding-top: clamp(1rem, 2vw, 1.5rem);
}

.related-card-text-kundenfeedback-bewertungsmanagement {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.6;
  padding: 0 clamp(1rem, 2vw, 1.5rem);
}

.related-card-link-kundenfeedback-bewertungsmanagement {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  padding: 0 clamp(1rem, 2vw, 1.5rem) clamp(1rem, 2vw, 1.5rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-card-link-kundenfeedback-bewertungsmanagement:hover {
  color: #0891b2;
  gap: 0.75rem;
}

.related-card-link-kundenfeedback-bewertungsmanagement i {
  font-size: 0.875rem;
  transition: transform 0.3s ease;
}

.related-card-kundenfeedback-bewertungsmanagement:hover .related-card-link-kundenfeedback-bewertungsmanagement i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-kundenfeedback-bewertungsmanagement {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .hero-title-kundenfeedback-bewertungsmanagement {
    font-size: 1.75rem;
  }

  .process-step-kundenfeedback-bewertungsmanagement {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .process-number-kundenfeedback-bewertungsmanagement {
    min-width: auto;
  }
}

.main-nachhaltigkeit-ethischer-handel {
  width: 100%;
}

.hero-section-nachhaltigkeit-ethischer-handel {
  background: linear-gradient(135deg, #0c1929 0%, #162d50 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-nachhaltigkeit-ethischer-handel::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-section-nachhaltigkeit-ethischer-handel::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-content-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 1;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.hero-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  word-wrap: break-word;
}

.hero-subtitle-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #bfdbfe;
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-nachhaltigkeit-ethischer-handel {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(59, 130, 246, 0.2);
  color: #93c5fd;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-nachhaltigkeit-ethischer-handel i {
  color: #3b82f6;
}

.hero-image-nachhaltigkeit-ethischer-handel {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 16px;
  margin-top: clamp(1rem, 3vw, 2rem);
  object-fit: cover;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.breadcrumbs-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-nachhaltigkeit-ethischer-handel {
  color: #bfdbfe;
  transition: color 0.3s ease;
}

.breadcrumb-link-nachhaltigkeit-ethischer-handel:hover {
  color: #3b82f6;
}

.breadcrumb-separator-nachhaltigkeit-ethischer-handel {
  color: #60a5fa;
  margin: 0 0.25rem;
}

.breadcrumb-current-nachhaltigkeit-ethischer-handel {
  color: #93c5fd;
  font-weight: 500;
}

.intro-section-nachhaltigkeit-ethischer-handel {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.intro-wrapper-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0c1929;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-description-nachhaltigkeit-ethischer-handel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.25rem;
}

.intro-image-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-wrapper-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
  }

  .intro-text-nachhaltigkeit-ethischer-handel,
  .intro-image-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.principles-section-nachhaltigkeit-ethischer-handel {
  background: #162d50;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.principles-section-nachhaltigkeit-ethischer-handel::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.principles-header-nachhaltigkeit-ethischer-handel {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.principles-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.principles-subtitle-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #93c5fd;
  max-width: 600px;
  margin: 0 auto;
}

.principles-grid-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.principle-card-nachhaltigkeit-ethischer-handel {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.principle-card-nachhaltigkeit-ethischer-handel:hover {
  background: rgba(59, 130, 246, 0.12);
  border-color: #3b82f6;
  transform: translateY(-4px);
}

.principle-number-nachhaltigkeit-ethischer-handel {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #3b82f6;
  line-height: 1;
}

.principle-card-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.principle-card-text-nachhaltigkeit-ethischer-handel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #bfdbfe;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .principle-card-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-nachhaltigkeit-ethischer-handel {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.implementation-wrapper-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.implementation-image-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.implementation-text-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-heading-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0c1929;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.implementation-description-nachhaltigkeit-ethischer-handel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.implementation-steps-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.step-item-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.25rem;
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #3b82f6;
  transition: all 0.3s ease;
}

.step-item-nachhaltigkeit-ethischer-handel:hover {
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.1);
  transform: translateX(4px);
}

.step-icon-nachhaltigkeit-ethischer-handel {
  font-size: 1.5rem;
  color: #3b82f6;
}

.step-title-nachhaltigkeit-ethischer-handel {
  font-size: 1rem;
  font-weight: 600;
  color: #0c1929;
}

.step-text-nachhaltigkeit-ethischer-handel {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .implementation-wrapper-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
  }

  .implementation-image-nachhaltigkeit-ethischer-handel,
  .implementation-text-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.benefits-section-nachhaltigkeit-ethischer-handel {
  background: linear-gradient(135deg, #0c1929 0%, #162d50 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-nachhaltigkeit-ethischer-handel::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-nachhaltigkeit-ethischer-handel {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.benefits-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.benefits-subtitle-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #93c5fd;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-wrapper-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.benefits-text-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.benefit-item-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(59, 130, 246, 0.2);
}

.benefit-item-nachhaltigkeit-ethischer-handel:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.benefit-title-nachhaltigkeit-ethischer-handel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.benefit-description-nachhaltigkeit-ethischer-handel {
  font-size: 0.9375rem;
  color: #bfdbfe;
  line-height: 1.6;
  margin: 0;
}

.benefits-image-nachhaltigkeit-ethischer-handel {
  flex: 1 1 50%;
  max-width: 50%;
  border-radius: 16px;
  object-fit: cover;
  display: block;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
  .benefits-wrapper-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
  }

  .benefits-text-nachhaltigkeit-ethischer-handel,
  .benefits-image-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.challenges-section-nachhaltigkeit-ethischer-handel {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.challenges-content-nachhaltigkeit-ethischer-handel {
  max-width: 850px;
  margin: 0 auto;
}

.challenges-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0c1929;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  text-align: center;
}

.challenge-block-nachhaltigkeit-ethischer-handel {
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #3b82f6;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.challenge-heading-nachhaltigkeit-ethischer-handel {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0c1929;
  margin-bottom: 0.75rem;
}

.challenge-text-nachhaltigkeit-ethischer-handel {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.challenge-solution-nachhaltigkeit-ethischer-handel {
  font-size: 0.9375rem;
  color: #0c1929;
  line-height: 1.7;
  background: rgba(59, 130, 246, 0.05);
  padding: 1rem;
  border-radius: 8px;
  margin: 0;
}

.quote-section-nachhaltigkeit-ethischer-handel {
  background: linear-gradient(135deg, #162d50 0%, #0c1929 100%);
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
}

.featured-quote-nachhaltigkeit-ethischer-handel {
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #3b82f6;
  background: rgba(59, 130, 246, 0.1);
  margin: 0;
  max-width: 700px;
}

.quote-text-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #ffffff;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-attribution-nachhaltigkeit-ethischer-handel {
  font-size: 0.9375rem;
  color: #93c5fd;
  font-style: normal;
}

.action-section-nachhaltigkeit-ethischer-handel {
  background: #1e3a5f;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.action-section-nachhaltigkeit-ethischer-handel::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.action-content-nachhaltigkeit-ethischer-handel {
  max-width: 750px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.action-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  text-align: center;
}

.action-description-nachhaltigkeit-ethischer-handel {
  font-size: 1rem;
  color: #bfdbfe;
  text-align: center;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  line-height: 1.6;
}

.action-list-nachhaltigkeit-ethischer-handel {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.action-item-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
}

.action-number-nachhaltigkeit-ethischer-handel {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  width: 48px;
  height: 48px;
  background: #3b82f6;
  color: #ffffff;
  font-weight: 700;
  font-size: 1.25rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.action-text-block-nachhaltigkeit-ethischer-handel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1rem);
  color: #bfdbfe;
  line-height: 1.6;
}

.action-text-block-nachhaltigkeit-ethischer-handel strong {
  color: #ffffff;
}

@media (max-width: 768px) {
  .action-item-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
    gap: 0.75rem;
  }

  .action-number-nachhaltigkeit-ethischer-handel {
    min-width: 40px;
    width: 40px;
    height: 40px;
    font-size: 1rem;
  }
}

.conclusion-section-nachhaltigkeit-ethischer-handel {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.conclusion-content-nachhaltigkeit-ethischer-handel {
  max-width: 750px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0c1929;
  margin-bottom: 1.5rem;
}

.conclusion-text-nachhaltigkeit-ethischer-handel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.conclusion-text-nachhaltigkeit-ethischer-handel:last-of-type {
  margin-bottom: 2rem;
}

.cta-link-nachhaltigkeit-ethischer-handel {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
  background: #3b82f6;
  color: #ffffff;
  border-radius: 12px;
  font-weight: 600;
  font-size: 1rem;
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-link-nachhaltigkeit-ethischer-handel:hover {
  background: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(59, 130, 246, 0.3);
}

.disclaimer-section-nachhaltigkeit-ethischer-handel {
  background: #0c1929;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(59, 130, 246, 0.2);
  overflow: hidden;
}

.disclaimer-content-nachhaltigkeit-ethischer-handel {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 12px;
}

.disclaimer-title-nachhaltigkeit-ethischer-handel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #93c5fd;
  margin-bottom: 1rem;
}

.disclaimer-text-nachhaltigkeit-ethischer-handel {
  font-size: 0.875rem;
  color: #bfdbfe;
  line-height: 1.7;
  margin: 0;
}

.related-section-nachhaltigkeit-ethischer-handel {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-title-nachhaltigkeit-ethischer-handel {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0c1929;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  text-align: center;
}

.related-cards-nachhaltigkeit-ethischer-handel {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.related-card-nachhaltigkeit-ethischer-handel {
  flex: 1 1 320px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-nachhaltigkeit-ethischer-handel:hover {
  border-color: #3b82f6;
  box-shadow: 0 12px 24px rgba(59, 130, 246, 0.15);
  transform: translateY(-6px);
}

.related-card-image-nachhaltigkeit-ethischer-handel {
  width: 100%;
  height: 220px;
  border-radius: 10px;
  overflow: hidden;
  background: #e2e8f0;
}

.related-card-image-nachhaltigkeit-ethischer-handel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-title-nachhaltigkeit-ethischer-handel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0c1929;
  line-height: 1.3;
}

.related-card-description-nachhaltigkeit-ethischer-handel {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-nachhaltigkeit-ethischer-handel {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #3b82f6;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  text-decoration: none;
  margin-top: 0.5rem;
}

.related-card-link-nachhaltigkeit-ethischer-handel:hover {
  color: #2563eb;
  gap: 0.75rem;
}

.related-card-link-nachhaltigkeit-ethischer-handel::after {
  content: '';
  transition: transform 0.3s ease;
}

.related-card-nachhaltigkeit-ethischer-handel:hover .related-card-link-nachhaltigkeit-ethischer-handel::after {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

@media (max-width: 768px) {
  .hero-section-nachhaltigkeit-ethischer-handel {
    padding: clamp(2rem, 6vw, 4rem) 0;
  }

  .breadcrumbs-nachhaltigkeit-ethischer-handel {
    margin-bottom: 1.5rem;
  }

  .intro-wrapper-nachhaltigkeit-ethischer-handel,
  .implementation-wrapper-nachhaltigkeit-ethischer-handel,
  .benefits-wrapper-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
    gap: 1.5rem;
  }

  .principle-card-nachhaltigkeit-ethischer-handel {
    flex: 1 1 100%;
    max-width: none;
  }

  .step-item-nachhaltigkeit-ethischer-handel {
    padding: 1rem;
  }

  .related-card-image-nachhaltigkeit-ethischer-handel {
    height: 180px;
  }
}

@media (max-width: 480px) {
  .hero-title-nachhaltigkeit-ethischer-handel {
    font-size: 1.75rem;
  }

  .principles-title-nachhaltigkeit-ethischer-handel,
  .benefits-title-nachhaltigkeit-ethischer-handel,
  .challenges-title-nachhaltigkeit-ethischer-handel,
  .action-title-nachhaltigkeit-ethischer-handel,
  .conclusion-title-nachhaltigkeit-ethischer-handel {
    font-size: 1.5rem;
  }

  .meta-badge-nachhaltigkeit-ethischer-handel {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }

  .principle-number-nachhaltigkeit-ethischer-handel {
    font-size: 1.75rem;
  }

  .action-item-nachhaltigkeit-ethischer-handel {
    flex-direction: column;
  }

  .action-number-nachhaltigkeit-ethischer-handel {
    min-width: 36px;
    width: 36px;
    height: 36px;
    font-size: 0.875rem;
  }

  .cta-link-nachhaltigkeit-ethischer-handel {
    width: 100%;
    justify-content: center;
  }
}

.main-video-marketing-live-shopping {
  width: 100%;
}

.hero-section-video-marketing-live-shopping {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-video-marketing-live-shopping::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.hero-section-video-marketing-live-shopping::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.breadcrumbs-video-marketing-live-shopping {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}

.breadcrumb-link-video-marketing-live-shopping {
  color: #94a3b8;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  transition: color 0.3s ease;
  text-decoration: none;
}

.breadcrumb-link-video-marketing-live-shopping:hover {
  color: #06b6d4;
}

.breadcrumb-separator-video-marketing-live-shopping {
  color: #64748b;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-current-video-marketing-live-shopping {
  color: #06b6d4;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
}

.hero-content-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.hero-title-video-marketing-live-shopping {
  font-size: clamp(2rem, 6vw + 1rem, 3.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-video-marketing-live-shopping {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  line-height: 1.6;
}

.hero-stats-video-marketing-live-shopping {
  display: flex;
  gap: clamp(2rem, 4vw, 3.5rem);
  margin-top: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}

.stat-item-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.stat-number-video-marketing-live-shopping {
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
}

.stat-label-video-marketing-live-shopping {
  font-size: 0.875rem;
  color: #cbd5e1;
}

.hero-image-video-marketing-live-shopping {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  object-fit: cover;
}

.intro-section-video-marketing-live-shopping {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-video-marketing-live-shopping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.intro-text-block-video-marketing-live-shopping {
  flex: 1 1 350px;
  max-width: 50%;
}

.intro-title-video-marketing-live-shopping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-description-video-marketing-live-shopping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.highlight-box-video-marketing-live-shopping {
  background: #eff6ff;
  border-left: 4px solid #06b6d4;
  padding: 1.5rem;
  border-radius: 8px;
  margin-top: 1.5rem;
}

.highlight-text-video-marketing-live-shopping {
  color: #1e293b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.intro-image-video-marketing-live-shopping {
  flex: 1 1 350px;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  object-fit: cover;
}

@media (max-width: 768px) {
  .intro-text-block-video-marketing-live-shopping,
  .intro-image-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-video-marketing-live-shopping {
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-section-1-video-marketing-live-shopping {
  background: #f8fafc;
}

.content-section-2-video-marketing-live-shopping {
  background: #ffffff;
}

.content-wrapper-video-marketing-live-shopping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-video-marketing-live-shopping {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-video-marketing-live-shopping {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-video-marketing-live-shopping img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
  object-fit: cover;
}

.content-heading-video-marketing-live-shopping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-section-1-video-marketing-live-shopping .content-heading-video-marketing-live-shopping {
  color: #1e293b;
}

.content-section-2-video-marketing-live-shopping .content-heading-video-marketing-live-shopping {
  color: #111827;
}

.content-paragraph-video-marketing-live-shopping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.content-section-1-video-marketing-live-shopping .content-paragraph-video-marketing-live-shopping {
  color: #4b5563;
}

.content-section-2-video-marketing-live-shopping .content-paragraph-video-marketing-live-shopping {
  color: #475569;
}

.numbered-steps-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 2rem;
}

.step-item-video-marketing-live-shopping {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
}

.step-number-video-marketing-live-shopping {
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-video-marketing-live-shopping {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.content-section-1-video-marketing-live-shopping .step-title-video-marketing-live-shopping {
  color: #1e293b;
}

.content-section-2-video-marketing-live-shopping .step-title-video-marketing-live-shopping {
  color: #111827;
}

.step-text-video-marketing-live-shopping {
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.content-section-1-video-marketing-live-shopping .step-text-video-marketing-live-shopping {
  color: #64748b;
}

.content-section-2-video-marketing-live-shopping .step-text-video-marketing-live-shopping {
  color: #64748b;
}

.features-list-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 2rem;
}

.feature-item-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.25rem;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 8px;
  border-left: 4px solid #06b6d4;
}

.feature-icon-video-marketing-live-shopping {
  font-size: 1.5rem;
  color: #06b6d4;
}

.feature-title-video-marketing-live-shopping {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
  color: #1e293b;
}

.feature-text-video-marketing-live-shopping {
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
  color: #64748b;
}

@media (max-width: 768px) {
  .content-text-video-marketing-live-shopping,
  .content-image-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .content-wrapper-video-marketing-live-shopping {
    flex-direction: column;
  }
}

.best-practices-section-video-marketing-live-shopping {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.best-practices-section-video-marketing-live-shopping::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.best-practices-header-video-marketing-live-shopping {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.best-practices-title-video-marketing-live-shopping {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.best-practices-subtitle-video-marketing-live-shopping {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
}

.practices-grid-video-marketing-live-shopping {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.practice-card-video-marketing-live-shopping {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.practice-card-video-marketing-live-shopping:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.practice-number-video-marketing-live-shopping {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
}

.practice-title-video-marketing-live-shopping {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.practice-text-video-marketing-live-shopping {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .practice-card-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: none;
  }
}

.platforms-section-video-marketing-live-shopping {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.platforms-content-video-marketing-live-shopping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  flex-wrap: wrap;
}

.platforms-text-video-marketing-live-shopping {
  flex: 1 1 50%;
  max-width: 50%;
}

.platforms-title-video-marketing-live-shopping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.platforms-description-video-marketing-live-shopping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 2rem;
}

.platform-list-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.platform-item-video-marketing-live-shopping {
  padding: 1.25rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 4px solid #06b6d4;
}

.platform-name-video-marketing-live-shopping {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0 0 0.5rem 0;
}

.platform-info-video-marketing-live-shopping {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.platforms-image-video-marketing-live-shopping {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  object-fit: cover;
}

@media (max-width: 768px) {
  .platforms-text-video-marketing-live-shopping,
  .platforms-image-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .platforms-content-video-marketing-live-shopping {
    flex-direction: column;
  }
}

.conclusion-section-video-marketing-live-shopping {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-video-marketing-live-shopping::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.conclusion-content-video-marketing-live-shopping {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  text-align: center;
}

.conclusion-title-video-marketing-live-shopping {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-quote-video-marketing-live-shopping {
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  padding: 2rem;
  border-radius: 8px;
  margin: 1rem 0;
}

.quote-text-video-marketing-live-shopping {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #ffffff;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-author-video-marketing-live-shopping {
  display: block;
  font-size: 0.875rem;
  color: #9ca3af;
  font-style: normal;
}

.conclusion-text-video-marketing-live-shopping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
}

.cta-box-video-marketing-live-shopping {
  background: rgba(6, 182, 212, 0.15);
  border: 2px solid #06b6d4;
  padding: 2.5rem;
  border-radius: 12px;
  margin-top: 1.5rem;
}

.cta-title-video-marketing-live-shopping {
  font-size: 1.5rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.cta-text-video-marketing-live-shopping {
  font-size: 1rem;
  color: #cbd5e1;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.cta-button-video-marketing-live-shopping {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-video-marketing-live-shopping:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-video-marketing-live-shopping {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-title-video-marketing-live-shopping {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #111827;
  text-align: center;
  margin-bottom: 0.75rem;
  line-height: 1.2;
}

.related-subtitle-video-marketing-live-shopping {
  text-align: center;
  color: #4b5563;
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  margin-bottom: 2.5rem;
}

.related-cards-video-marketing-live-shopping {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-video-marketing-live-shopping {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-video-marketing-live-shopping:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-title-video-marketing-live-shopping {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  line-height: 1.3;
}

.related-card-text-video-marketing-live-shopping {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-video-marketing-live-shopping {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.875rem;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-video-marketing-live-shopping:hover .related-card-link-video-marketing-live-shopping {
  gap: 0.75rem;
}

.related-card-link-video-marketing-live-shopping i {
  transition: transform 0.3s ease;
}

.related-card-video-marketing-live-shopping:hover .related-card-link-video-marketing-live-shopping i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-video-marketing-live-shopping {
  background: #ffffff;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-video-marketing-live-shopping {
  max-width: 900px;
  margin: 0 auto;
}

.disclaimer-title-video-marketing-live-shopping {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-video-marketing-live-shopping {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-section-video-marketing-live-shopping {
    padding: clamp(2rem, 6vw, 4rem) 0;
  }

  .hero-stats-video-marketing-live-shopping {
    gap: clamp(1.5rem, 3vw, 2rem);
  }

  .stat-number-video-marketing-live-shopping {
    font-size: clamp(1.25rem, 2vw, 1.75rem);
  }

  .content-section-video-marketing-live-shopping,
  .best-practices-section-video-marketing-live-shopping,
  .conclusion-section-video-marketing-live-shopping {
    padding: clamp(2.5rem, 6vw, 4rem) 0;
  }

  .practices-grid-video-marketing-live-shopping {
    gap: 1rem;
  }

  .practice-card-video-marketing-live-shopping {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .hero-title-video-marketing-live-shopping {
    font-size: 1.5rem;
  }

  .hero-subtitle-video-marketing-live-shopping {
    font-size: 0.9375rem;
  }

  .breadcrumbs-video-marketing-live-shopping {
    font-size: 0.75rem;
  }

  .hero-stats-video-marketing-live-shopping {
    gap: 1rem;
    flex-direction: column;
  }

  .stat-item-video-marketing-live-shopping {
    flex-direction: row;
    gap: 0.75rem;
    align-items: center;
  }

  .stat-number-video-marketing-live-shopping {
    font-size: 1.25rem;
  }

  .stat-label-video-marketing-live-shopping {
    font-size: 0.75rem;
  }
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding-inline: clamp(1rem, 4vw, 2rem);
}

.main-retargeting-remarketing-strategien {
  width: 100%;
  background: #ffffff;
}

.hero-section-retargeting-remarketing-strategien {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-retargeting-remarketing-strategien::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-retargeting-remarketing-strategien::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.breadcrumbs-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  font-size: 0.875rem;
}

.breadcrumb-link-retargeting-remarketing-strategien {
  color: #9ca3af;
  transition: color 0.2s ease;
}

.breadcrumb-link-retargeting-remarketing-strategien:hover {
  color: #06b6d4;
}

.breadcrumb-separator-retargeting-remarketing-strategien {
  color: #6b7280;
}

.breadcrumb-current-retargeting-remarketing-strategien {
  color: #06b6d4;
  font-weight: 500;
}

.hero-title-retargeting-remarketing-strategien {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-description-retargeting-remarketing-strategien {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.7;
  color: #9ca3af;
  max-width: 700px;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-meta-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1.5rem);
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.meta-badge-retargeting-remarketing-strategien {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-retargeting-remarketing-strategien i {
  font-size: 0.875rem;
}

.hero-image-retargeting-remarketing-strategien {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.intro-section-retargeting-remarketing-strategien {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.intro-content-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.intro-paragraph-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #374151;
  margin-bottom: 1.25rem;
}

.intro-paragraph-retargeting-remarketing-strategien:last-child {
  margin-bottom: 0;
}

.intro-image-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.fundamentals-section-retargeting-remarketing-strategien {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.fundamentals-header-retargeting-remarketing-strategien {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.fundamentals-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: clamp(0.75rem, 1.5vw, 1rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.fundamentals-subtitle-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #64748b;
}

.principles-grid-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.principle-card-retargeting-remarketing-strategien {
  flex: 1 1 280px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.principle-card-retargeting-remarketing-strategien:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
}

.principle-number-retargeting-remarketing-strategien {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.principle-title-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
}

.principle-text-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.strategy-section-retargeting-remarketing-strategien {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.strategy-section-retargeting-remarketing-strategien::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.strategy-wrapper-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.strategy-text-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.strategy-intro-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #9ca3af;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.steps-list-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.step-item-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(6, 182, 212, 0.2);
}

.step-item-retargeting-remarketing-strategien:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.step-title-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.step-text-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.strategy-image-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.tactics-section-retargeting-remarketing-strategien {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.tactics-header-retargeting-remarketing-strategien {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.tactics-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: clamp(0.75rem, 1.5vw, 1rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.tactics-subtitle-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #64748b;
}

.tactics-content-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.tactics-text-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
}

.tactics-subheading-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}

.tactics-subheading-retargeting-remarketing-strategien:first-child {
  margin-top: 0;
}

.tactics-paragraph-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #374151;
  margin-bottom: 1rem;
}

.tactics-image-retargeting-remarketing-strategien {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.optimization-section-retargeting-remarketing-strategien {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.optimization-content-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.optimization-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  margin-bottom: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.optimization-boxes-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.optimization-box-retargeting-remarketing-strategien {
  flex: 1 1 280px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.optimization-box-retargeting-remarketing-strategien:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
}

.optimization-box-title-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
}

.optimization-box-text-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.optimization-image-retargeting-remarketing-strategien {
  max-width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  margin-top: 1rem;
}

.quote-section-retargeting-remarketing-strategien {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.featured-quote-retargeting-remarketing-strategien {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 8px;
}

.quote-text-retargeting-remarketing-strategien {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  line-height: 1.6;
  color: #ffffff;
  font-style: italic;
  margin-bottom: 1rem;
}

.quote-author-retargeting-remarketing-strategien {
  font-size: 0.875rem;
  color: #9ca3af;
  font-style: normal;
}

.tools-section-retargeting-remarketing-strategien {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.tools-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  text-align: center;
  margin-bottom: clamp(0.75rem, 1.5vw, 1rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.tools-subtitle-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #64748b;
  text-align: center;
  max-width: 600px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.tools-grid-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.tool-card-retargeting-remarketing-strategien {
  flex: 1 1 280px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tool-card-retargeting-remarketing-strategien:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
}

.tool-name-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
}

.tool-description-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.conclusion-section-retargeting-remarketing-strategien {
  background: #1f2937;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-retargeting-remarketing-strategien::before {
  content: '';
  position: absolute;
  top: -40%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #ffffff;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.conclusion-text-retargeting-remarketing-strategien {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #9ca3af;
  margin: 0;
}

.conclusion-cta-retargeting-remarketing-strategien {
  display: flex;
  justify-content: center;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.cta-button-primary-retargeting-remarketing-strategien {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #06b6d4;
  color: #0f172a;
  font-weight: 600;
  border-radius: 8px;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  transition: all 0.2s ease;
  text-decoration: none;
}

.cta-button-primary-retargeting-remarketing-strategien:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-retargeting-remarketing-strategien {
  background: #f8fafc;
  padding: clamp(2.5rem, 6vw, 5rem) 0;
}

.disclaimer-content-retargeting-remarketing-strategien {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #94a3af;
  border-radius: 8px;
}

.disclaimer-title-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin-bottom: 1rem;
}

.disclaimer-text-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

.related-section-retargeting-remarketing-strategien {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
}

.related-title-retargeting-remarketing-strategien {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  color: #111827;
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.related-cards-retargeting-remarketing-strategien {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.related-card-retargeting-remarketing-strategien {
  flex: 1 1 280px;
  max-width: 400px;
}

.related-card-link-retargeting-remarketing-strategien {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.2s ease;
  text-decoration: none;
  height: 100%;
}

.related-card-link-retargeting-remarketing-strategien:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-title-retargeting-remarketing-strategien {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
}

.related-card-description-retargeting-remarketing-strategien {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

@media (max-width: 768px) {
  .intro-content-retargeting-remarketing-strategien,
  .strategy-wrapper-retargeting-remarketing-strategien,
  .tactics-content-retargeting-remarketing-strategien {
    flex-direction: column;
  }

  .intro-text-retargeting-remarketing-strategien,
  .intro-image-retargeting-remarketing-strategien,
  .strategy-text-retargeting-remarketing-strategien,
  .strategy-image-retargeting-remarketing-strategien,
  .tactics-text-retargeting-remarketing-strategien,
  .tactics-image-retargeting-remarketing-strategien {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .principles-grid-retargeting-remarketing-strategien,
  .optimization-boxes-retargeting-remarketing-strategien,
  .tools-grid-retargeting-remarketing-strategien,
  .related-cards-retargeting-remarketing-strategien {
    gap: clamp(1rem, 2vw, 1.5rem);
  }

  .principle-card-retargeting-remarketing-strategien,
  .optimization-box-retargeting-remarketing-strategien,
  .tool-card-retargeting-remarketing-strategien,
  .related-card-retargeting-remarketing-strategien {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .hero-title-retargeting-remarketing-strategien {
    font-size: 1.5rem;
  }

  .fundamentals-title-retargeting-remarketing-strategien,
  .strategy-title-retargeting-remarketing-strategien,
  .tactics-title-retargeting-remarketing-strategien,
  .optimization-title-retargeting-remarketing-strategien,
  .conclusion-title-retargeting-remarketing-strategien {
    font-size: 1.25rem;
  }

  .hero-meta-retargeting-remarketing-strategien {
    flex-direction: column;
    align-items: flex-start;
  }

  .meta-badge-retargeting-remarketing-strategien {
    width: 100%;
    justify-content: flex-start;
  }
}

.main-community-building-kundengemeinde {
  width: 100%;
  background: var(--color-bg-light-primary);
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.breadcrumbs-community-building-kundengemeinde {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-community-building-kundengemeinde {
  color: #3b82f6;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-community-building-kundengemeinde:hover {
  color: #2563eb;
}

.breadcrumb-separator-community-building-kundengemeinde {
  color: #9ca3af;
}

.breadcrumb-current-community-building-kundengemeinde {
  color: #64748b;
}

.hero-section-community-building-kundengemeinde {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-community-building-kundengemeinde::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-community-building-kundengemeinde::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: clamp(2rem, 4vw, 4rem);
  position: relative;
  z-index: 1;
}

.hero-title-community-building-kundengemeinde {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-community-building-kundengemeinde {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #9ca3af;
  max-width: 600px;
}

.hero-stats-community-building-kundengemeinde {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 3rem);
  margin-top: clamp(1rem, 2vw, 2rem);
}

.stat-item-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.stat-number-community-building-kundengemeinde {
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
}

.stat-label-community-building-kundengemeinde {
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #cbd5e1;
}

.hero-image-community-building-kundengemeinde {
  position: relative;
  z-index: 2;
}

.hero-img-community-building-kundengemeinde {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 16px;
  display: block;
  margin: 0 auto;
  object-fit: cover;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.3);
}

.intro-section-community-building-kundengemeinde {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.intro-content-community-building-kundengemeinde {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.intro-lead-community-building-kundengemeinde {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.7;
  color: #1e293b;
  margin-bottom: 1.5rem;
  font-weight: 500;
}

.intro-description-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.8;
  color: #475569;
}

.intro-image-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.intro-img-community-building-kundengemeinde {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.foundations-section-community-building-kundengemeinde {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.foundations-header-community-building-kundengemeinde {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.section-tag-community-building-kundengemeinde {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 1rem;
}

.foundations-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.foundations-subtitle-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
}

.foundations-grid-community-building-kundengemeinde {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.foundation-card-community-building-kundengemeinde {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.foundation-card-community-building-kundengemeinde:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.foundation-number-community-building-kundengemeinde {
  font-size: 2.5rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
}

.foundation-title-community-building-kundengemeinde {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
}

.foundation-text-community-building-kundengemeinde {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

@media (max-width: 768px) {
  .intro-text-community-building-kundengemeinde,
  .intro-image-community-building-kundengemeinde {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .intro-content-community-building-kundengemeinde {
    flex-direction: column;
  }

  .foundation-card-community-building-kundengemeinde {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategy-section-community-building-kundengemeinde {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.strategy-wrapper-community-building-kundengemeinde {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.strategy-text-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.strategy-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.strategy-description-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.strategy-list-community-building-kundengemeinde {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.strategy-item-community-building-kundengemeinde {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #334155;
}

.strategy-image-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.strategy-img-community-building-kundengemeinde {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.channels-section-community-building-kundengemeinde {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.channels-header-community-building-kundengemeinde {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.channels-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.channels-wrapper-community-building-kundengemeinde {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.channels-text-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.channels-intro-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.channels-comparison-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.comparison-item-community-building-kundengemeinde {
  padding: 1.25rem;
  background: #ffffff;
  border-radius: 8px;
  border-left: 3px solid #06b6d4;
}

.comparison-title-community-building-kundengemeinde {
  font-size: 1rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.comparison-text-community-building-kundengemeinde {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.channels-image-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.channels-img-community-building-kundengemeinde {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.engagement-section-community-building-kundengemeinde {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.engagement-header-community-building-kundengemeinde {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.engagement-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.engagement-subtitle-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
}

.engagement-steps-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.engagement-step-community-building-kundengemeinde {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.step-number-community-building-kundengemeinde {
  font-size: clamp(1.75rem, 3vw, 2rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.step-content-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-community-building-kundengemeinde {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #0f172a;
}

.step-text-community-building-kundengemeinde {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
  margin: 0;
}

.retention-section-community-building-kundengemeinde {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.retention-wrapper-community-building-kundengemeinde {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.retention-image-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
  order: -1;
}

.retention-img-community-building-kundengemeinde {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.retention-text-community-building-kundengemeinde {
  flex: 1 1 400px;
  max-width: 50%;
}

.retention-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.retention-intro-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.retention-highlights-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.highlight-box-community-building-kundengemeinde {
  padding: 1rem;
  background: #ffffff;
  border-left: 3px solid #06b6d4;
  border-radius: 4px;
}

.highlight-text-community-building-kundengemeinde {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #334155;
  margin: 0;
}

.conclusion-section-community-building-kundengemeinde {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.conclusion-content-community-building-kundengemeinde {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.conclusion-text-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.8;
  color: #475569;
}

.conclusion-quote-community-building-kundengemeinde {
  padding: 2rem;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  margin: 1rem 0;
}

.quote-text-community-building-kundengemeinde {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  font-weight: 500;
  font-style: italic;
  color: #1e293b;
  line-height: 1.6;
  margin: 0;
}

.conclusion-closing-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  line-height: 1.8;
  color: #475569;
  margin-top: 1rem;
}

.conclusion-cta-community-building-kundengemeinde {
  margin-top: 2rem;
}

.cta-button-community-building-kundengemeinde {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.9375rem, 1.5vw, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-community-building-kundengemeinde:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-section-community-building-kundengemeinde {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.related-header-community-building-kundengemeinde {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.related-title-community-building-kundengemeinde {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-community-building-kundengemeinde {
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  color: #64748b;
}

.related-cards-community-building-kundengemeinde {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-community-building-kundengemeinde {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-community-building-kundengemeinde:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.related-card-title-community-building-kundengemeinde {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.4;
}

.related-card-description-community-building-kundengemeinde {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.related-card-link-community-building-kundengemeinde {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  margin-top: 0.5rem;
  transition: color 0.3s ease;
}

.related-card-link-community-building-kundengemeinde:hover {
  color: #0891b2;
}

.disclaimer-section-community-building-kundengemeinde {
  background: #ffffff;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-community-building-kundengemeinde {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-community-building-kundengemeinde {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-community-building-kundengemeinde {
  font-size: 0.875rem;
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-section-community-building-kundengemeinde {
    text-align: center;
  }

  .strategy-text-community-building-kundengemeinde,
  .strategy-image-community-building-kundengemeinde,
  .channels-text-community-building-kundengemeinde,
  .channels-image-community-building-kundengemeinde,
  .retention-text-community-building-kundengemeinde,
  .retention-image-community-building-kundengemeinde {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .retention-wrapper-community-building-kundengemeinde {
    order: 1;
  }

  .retention-image-community-building-kundengemeinde {
    order: 0;
  }

  .engagement-step-community-building-kundengemeinde {
    flex-direction: column;
    gap: 1rem;
  }

  .related-card-community-building-kundengemeinde {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .hero-title-community-building-kundengemeinde {
    font-size: 1.5rem;
  }

  .hero-stats-community-building-kundengemeinde {
    gap: 1rem;
  }

  .stat-number-community-building-kundengemeinde {
    font-size: 1.5rem;
  }
}

.main-preisstrategien-dynamische-preise {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-preisstrategien-dynamische-preise"] {
  width: 100%;
  overflow: hidden;
}

.hero-section-preisstrategien-dynamische-preise {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
}

.hero-section-preisstrategien-dynamische-preise::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-preisstrategien-dynamische-preise::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-preisstrategien-dynamische-preise {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-preisstrategien-dynamische-preise {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-preisstrategien-dynamische-preise:hover {
  color: #06b6d4;
}

.breadcrumb-separator-preisstrategien-dynamische-preise {
  color: #6b7280;
}

.breadcrumb-current-preisstrategien-dynamische-preise {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 1;
}

.hero-title-preisstrategien-dynamische-preise {
  font-size: clamp(2rem, 5vw + 1rem, 3.75rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  letter-spacing: -0.02em;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-preisstrategien-dynamische-preise {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0;
}

.article-meta-preisstrategien-dynamische-preise {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1.5rem);
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-preisstrategien-dynamische-preise {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #06b6d4;
}

.meta-badge-preisstrategien-dynamische-preise i {
  font-size: 1rem;
}

.hero-image-preisstrategien-dynamische-preise {
  width: 100%;
  max-width: 800px;
  height: auto;
  max-height: 450px;
  border-radius: 16px;
  object-fit: cover;
  display: block;
  margin-top: 1rem;
}

.intro-section-preisstrategien-dynamische-preise {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.intro-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  color: #1e293b;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-description-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.intro-image-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .intro-content-preisstrategien-dynamische-preise {
    flex-direction: column;
  }

  .intro-text-block-preisstrategien-dynamische-preise,
  .intro-image-preisstrategien-dynamische-preise {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.pricing-models-section-preisstrategien-dynamische-preise {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.section-header-preisstrategien-dynamische-preise {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 5rem);
}

.section-tag-preisstrategien-dynamische-preise {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.section-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  color: #1e293b;
  margin-bottom: clamp(0.75rem, 1.5vw, 1.25rem);
  line-height: 1.2;
}

.section-subtitle-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.pricing-models-wrapper-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.pricing-model-item-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.15);
  transition: all 0.3s ease;
}

.pricing-model-item-preisstrategien-dynamische-preise:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
}

.model-number-preisstrategien-dynamische-preise {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.model-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.model-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #1e293b;
  font-weight: 600;
  margin: 0;
}

.model-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.models-image-preisstrategien-dynamische-preise {
  width: 100%;
  max-width: 900px;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  margin: 0 auto;
}

.dynamic-pricing-section-preisstrategien-dynamische-preise {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.dynamic-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.dynamic-image-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

.dynamic-text-block-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
}

.dynamic-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  color: #1e293b;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.dynamic-description-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.dynamic-benefits-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1.5rem;
  list-style: none;
  padding: 0;
}

.benefit-item-preisstrategien-dynamische-preise {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 0;
  color: #4b5563;
  font-size: clamp(0.9375rem, 1vw, 1rem);
}

.benefit-item-preisstrategien-dynamische-preise::before {
  content: '';
  font-weight: 700;
  color: #06b6d4;
  font-size: 1.25rem;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .dynamic-content-preisstrategien-dynamische-preise {
    flex-direction: column;
  }

  .dynamic-image-preisstrategien-dynamische-preise,
  .dynamic-text-block-preisstrategien-dynamische-preise {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-preisstrategien-dynamische-preise {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.implementation-steps-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.step-item-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2rem);
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.step-item-preisstrategien-dynamische-preise:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.08);
}

.step-number-preisstrategien-dynamische-preise {
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.step-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
  margin: 0;
}

.step-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.implementation-image-preisstrategien-dynamische-preise {
  width: 100%;
  max-width: 900px;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  margin: clamp(3rem, 6vw, 4rem) auto 0;
}

.tools-section-preisstrategien-dynamische-preise {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.tools-grid-preisstrategien-dynamische-preise {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-card-preisstrategien-dynamische-preise {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.tool-card-preisstrategien-dynamische-preise:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.tool-icon-preisstrategien-dynamische-preise {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.tool-name-preisstrategien-dynamische-preise {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
  margin: 0;
}

.tool-description-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .tool-card-preisstrategien-dynamische-preise {
    flex: 1 1 100%;
    max-width: none;
  }
}

.best-practices-section-preisstrategien-dynamische-preise {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.best-practices-content-preisstrategien-dynamische-preise {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.practices-text-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
}

.practices-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  color: #1e293b;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.practices-intro-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #4b5563;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.practice-highlight-preisstrategien-dynamische-preise {
  padding: clamp(1rem, 2vw, 1.5rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 0 8px 8px 0;
  margin-bottom: 1rem;
}

.highlight-title-preisstrategien-dynamische-preise {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.highlight-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.practices-image-preisstrategien-dynamische-preise {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  max-height: 400px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .best-practices-content-preisstrategien-dynamische-preise {
    flex-direction: column;
  }

  .practices-text-preisstrategien-dynamische-preise,
  .practices-image-preisstrategien-dynamische-preise {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-preisstrategien-dynamische-preise {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
}

.conclusion-section-preisstrategien-dynamische-preise::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-preisstrategien-dynamische-preise {
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.conclusion-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  text-align: center;
  line-height: 1.2;
}

.conclusion-highlight-preisstrategien-dynamische-preise {
  background: rgba(6, 182, 212, 0.15);
  border-left: 4px solid #06b6d4;
  padding: clamp(1.5rem, 3vw, 2rem);
  border-radius: 0 8px 8px 0;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.conclusion-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.cta-box-preisstrategien-dynamische-preise {
  background: rgba(6, 182, 212, 0.15);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 12px;
  text-align: center;
  margin-top: clamp(2rem, 4vw, 3rem);
  border: 1px solid rgba(6, 182, 212, 0.3);
}

.cta-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  color: #ffffff;
  margin-bottom: 1rem;
  font-weight: 600;
}

.cta-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  margin-bottom: 1.5rem;
}

.btn-primary-preisstrategien-dynamische-preise {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #06b6d4;
  color: #0f172a;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: clamp(0.875rem, 1vw, 1rem);
}

.btn-primary-preisstrategien-dynamische-preise:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.related-posts-section-preisstrategien-dynamische-preise {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}

.related-header-preisstrategien-dynamische-preise {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 5rem);
}

.related-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  margin-bottom: 1rem;
}

.related-subtitle-preisstrategien-dynamische-preise {
  font-size: clamp(0.9375rem, 1vw, 1.125rem);
  color: #64748b;
}

.related-cards-preisstrategien-dynamische-preise {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 3vw, 2.5rem);
}

.related-card-preisstrategien-dynamische-preise {
  flex: 1 1 300px;
  max-width: 400px;
  background: #f8fafc;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-preisstrategien-dynamische-preise:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-preisstrategien-dynamische-preise {
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}

.related-card-content-preisstrategien-dynamische-preise {
  padding: clamp(1.5rem, 3vw, 2rem);
}

.related-card-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 0.75rem;
}

.related-card-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin-bottom: 1.25rem;
}

.related-card-link-preisstrategien-dynamische-preise {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  text-decoration: none;
  font-size: clamp(0.875rem, 1vw, 1rem);
  transition: all 0.3s ease;
}

.related-card-link-preisstrategien-dynamische-preise:hover {
  gap: 1rem;
  color: #22d3ee;
}

@media (max-width: 768px) {
  .related-card-preisstrategien-dynamische-preise {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-preisstrategien-dynamische-preise {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.disclaimer-content-preisstrategien-dynamische-preise {
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 0 8px 8px 0;
}

.disclaimer-title-preisstrategien-dynamische-preise {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-preisstrategien-dynamische-preise {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .breadcrumbs-preisstrategien-dynamische-preise {
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .article-meta-preisstrategien-dynamische-preise {
    flex-direction: column;
    align-items: center;
  }

  .pricing-model-item-preisstrategien-dynamische-preise {
    flex-direction: column;
  }

  .model-number-preisstrategien-dynamische-preise {
    min-width: 50px;
  }

  .step-item-preisstrategien-dynamische-preise {
    flex-direction: column;
  }

  .step-number-preisstrategien-dynamische-preise {
    min-width: 50px;
  }
}

.main-cybersicherheit-online-bedrohungen {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-cybersicherheit-online-bedrohungen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-cybersicherheit-online-bedrohungen::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-cybersicherheit-online-bedrohungen::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.breadcrumbs-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-cybersicherheit-online-bedrohungen {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-cybersicherheit-online-bedrohungen:hover {
  color: #06b6d4;
}

.breadcrumb-separator-cybersicherheit-online-bedrohungen {
  color: #64748b;
}

.breadcrumb-current-cybersicherheit-online-bedrohungen {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-cybersicherheit-online-bedrohungen {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  line-height: 1.6;
}

.hero-meta-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}

.meta-badge-cybersicherheit-online-bedrohungen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-cybersicherheit-online-bedrohungen i {
  font-size: 0.875rem;
}

.hero-image-cybersicherheit-online-bedrohungen {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.intro-section-cybersicherheit-online-bedrohungen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-wrapper-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.intro-text-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-description-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.intro-description-cybersicherheit-online-bedrohungen:last-of-type {
  margin-bottom: 0;
}

.intro-image-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-wrapper-cybersicherheit-online-bedrohungen {
    flex-direction: column;
  }

  .intro-text-cybersicherheit-online-bedrohungen,
  .intro-image-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-one-cybersicherheit-online-bedrohungen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-one-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.content-text-one-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-heading-one-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-body-one-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.content-subheading-one-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.375rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.content-list-one-cybersicherheit-online-bedrohungen {
  list-style: none;
  padding: 0;
  margin: 0;
}

.list-item-one-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  padding-left: 1.5rem;
  margin-bottom: 1rem;
  position: relative;
}

.list-item-one-cybersicherheit-online-bedrohungen::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.content-image-one-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .content-wrapper-one-cybersicherheit-online-bedrohungen {
    flex-direction: column;
  }

  .content-text-one-cybersicherheit-online-bedrohungen,
  .content-image-one-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-two-cybersicherheit-online-bedrohungen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-two-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.content-image-two-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  order: -1;
}

.content-text-two-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-heading-two-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-body-two-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.content-subheading-two-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.375rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.content-ordered-list-two-cybersicherheit-online-bedrohungen {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: item;
}

.ordered-item-two-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  padding-left: 2.5rem;
  margin-bottom: 1rem;
  counter-increment: item;
  position: relative;
}

.ordered-item-two-cybersicherheit-online-bedrohungen::before {
  content: counter(item);
  position: absolute;
  left: 0;
  width: 1.75rem;
  height: 1.75rem;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-weight: 600;
  font-size: 0.875rem;
}

@media (max-width: 768px) {
  .content-wrapper-two-cybersicherheit-online-bedrohungen {
    flex-direction: column;
  }

  .content-text-two-cybersicherheit-online-bedrohungen,
  .content-image-two-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: 100%;
    order: unset;
  }
}

.quote-section-cybersicherheit-online-bedrohungen {
  background: #f1f5f9;
  padding: clamp(3rem, 8vw, 5rem) 0;
}

.featured-quote-cybersicherheit-online-bedrohungen {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
}

.quote-text-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #1e293b;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.quote-author-cybersicherheit-online-bedrohungen {
  font-size: 0.9375rem;
  color: #64748b;
  font-style: normal;
}

.content-section-three-cybersicherheit-online-bedrohungen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-three-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.content-text-three-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-heading-three-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-body-three-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.content-body-three-cybersicherheit-online-bedrohungen:last-of-type {
  margin-bottom: 0;
}

.content-image-three-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .content-wrapper-three-cybersicherheit-online-bedrohungen {
    flex-direction: column;
  }

  .content-text-three-cybersicherheit-online-bedrohungen,
  .content-image-three-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-four-cybersicherheit-online-bedrohungen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.content-wrapper-four-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.content-image-four-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.content-text-four-cybersicherheit-online-bedrohungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-heading-four-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.content-body-four-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.content-body-four-cybersicherheit-online-bedrohungen:last-of-type {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .content-wrapper-four-cybersicherheit-online-bedrohungen {
    flex-direction: column;
  }

  .content-text-four-cybersicherheit-online-bedrohungen,
  .content-image-four-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-cybersicherheit-online-bedrohungen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-cybersicherheit-online-bedrohungen::before {
  content: '';
  position: absolute;
  top: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-heading-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-text-cybersicherheit-online-bedrohungen {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
}

.cta-buttons-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.cta-button-primary-cybersicherheit-online-bedrohungen,
.cta-button-secondary-cybersicherheit-online-bedrohungen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-primary-cybersicherheit-online-bedrohungen {
  background: #06b6d4;
  color: #0f172a;
}

.cta-button-primary-cybersicherheit-online-bedrohungen:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.cta-button-secondary-cybersicherheit-online-bedrohungen {
  background: transparent;
  border: 2px solid #ffffff;
  color: #ffffff;
}

.cta-button-secondary-cybersicherheit-online-bedrohungen:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-cybersicherheit-online-bedrohungen {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.disclaimer-content-cybersicherheit-online-bedrohungen {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
}

.disclaimer-heading-cybersicherheit-online-bedrohungen {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-cybersicherheit-online-bedrohungen {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.8;
}

.related-section-cybersicherheit-online-bedrohungen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-header-cybersicherheit-online-bedrohungen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.related-title-cybersicherheit-online-bedrohungen {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.related-subtitle-cybersicherheit-online-bedrohungen {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  line-height: 1.6;
}

.related-cards-cybersicherheit-online-bedrohungen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-cybersicherheit-online-bedrohungen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-cybersicherheit-online-bedrohungen:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.related-card-title-cybersicherheit-online-bedrohungen {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.related-card-description-cybersicherheit-online-bedrohungen {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-cybersicherheit-online-bedrohungen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-link-cybersicherheit-online-bedrohungen:hover {
  color: #0891b2;
  transform: translateX(4px);
}

.related-card-link-cybersicherheit-online-bedrohungen i {
  font-size: 0.75rem;
  transition: transform 0.3s ease;
}

.related-card-cybersicherheit-online-bedrohungen:hover .related-card-link-cybersicherheit-online-bedrohungen i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-cybersicherheit-online-bedrohungen {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-cybersicherheit-online-bedrohungen {
    font-size: 0.75rem;
  }

  .hero-title-cybersicherheit-online-bedrohungen {
    font-size: 1.5rem;
  }

  .content-heading-one-cybersicherheit-online-bedrohungen,
  .content-heading-two-cybersicherheit-online-bedrohungen,
  .content-heading-three-cybersicherheit-online-bedrohungen,
  .content-heading-four-cybersicherheit-online-bedrohungen {
    font-size: 1.25rem;
  }
}

.main-budgetplanung-finanzmanagement {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-budgetplanung-finanzmanagement {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-budgetplanung-finanzmanagement::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-budgetplanung-finanzmanagement::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-budgetplanung-finanzmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-budgetplanung-finanzmanagement {
  color: #06b6d4;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-budgetplanung-finanzmanagement:hover {
  color: #22d3ee;
}

.breadcrumb-separator-budgetplanung-finanzmanagement,
.breadcrumb-current-budgetplanung-finanzmanagement {
  color: #9ca3af;
}

.hero-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.hero-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-weight: 700;
  color: #ffffff;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-budgetplanung-finanzmanagement {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  line-height: 1.6;
  color: #9ca3af;
  max-width: 700px;
  margin: 0;
}

.hero-meta-budgetplanung-finanzmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-budgetplanung-finanzmanagement {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
}

.meta-badge-budgetplanung-finanzmanagement i {
  font-size: 1rem;
}

.hero-image-budgetplanung-finanzmanagement {
  max-width: 100%;
  height: auto;
  max-height: 450px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
  margin-top: 2rem;
}

.introduction-section-budgetplanung-finanzmanagement {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.intro-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.intro-text-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.intro-description-budgetplanung-finanzmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #4b5563;
  margin: 0 0 1.5rem 0;
}

.intro-image-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.foundations-section-budgetplanung-finanzmanagement {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.foundations-section-budgetplanung-finanzmanagement::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.foundations-header-budgetplanung-finanzmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.foundations-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.foundations-subtitle-budgetplanung-finanzmanagement {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.steps-wrapper-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: clamp(3rem, 6vw, 4rem);
  position: relative;
  z-index: 1;
}

.step-item-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.step-item-budgetplanung-finanzmanagement:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.step-number-budgetplanung-finanzmanagement {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  line-height: 1;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.step-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.5rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.step-text-budgetplanung-finanzmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #9ca3af;
  margin: 0;
}

.foundations-image-budgetplanung-finanzmanagement {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.strategies-section-budgetplanung-finanzmanagement {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.strategies-header-budgetplanung-finanzmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.strategies-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.strategies-subtitle-budgetplanung-finanzmanagement {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.strategies-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.strategies-text-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategies-section-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.5rem);
  font-weight: 600;
  color: #1e293b;
  margin: 1.5rem 0 1rem 0;
}

.strategies-section-title-budgetplanung-finanzmanagement:first-of-type {
  margin-top: 0;
}

.strategies-text-block-budgetplanung-finanzmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #64748b;
  margin: 0 0 1.5rem 0;
}

.highlight-box-budgetplanung-finanzmanagement {
  background: #f1f5f9;
  border-left: 4px solid #06b6d4;
  padding: clamp(1rem, 2vw, 1.5rem);
  border-radius: 8px;
  margin: 1.5rem 0;
}

.highlight-text-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #334155;
  margin: 0;
}

.highlight-text-budgetplanung-finanzmanagement strong {
  color: #1e293b;
  font-weight: 600;
}

.strategies-image-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.tools-section-budgetplanung-finanzmanagement {
  background: #1a1a2e;
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.tools-section-budgetplanung-finanzmanagement::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.tools-header-budgetplanung-finanzmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.tools-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.tools-subtitle-budgetplanung-finanzmanagement {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.tools-grid-budgetplanung-finanzmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: clamp(3rem, 6vw, 4rem);
  position: relative;
  z-index: 1;
}

.tool-card-budgetplanung-finanzmanagement {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.tool-card-budgetplanung-finanzmanagement:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.tool-icon-budgetplanung-finanzmanagement {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.tool-card-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.tool-card-text-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.tools-image-budgetplanung-finanzmanagement {
  max-width: 100%;
  height: auto;
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
  position: relative;
  z-index: 1;
}

.quote-section-budgetplanung-finanzmanagement {
  background: #111827;
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
}

.featured-quote-budgetplanung-finanzmanagement {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 8px;
}

.quote-text-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.5rem);
  line-height: 1.6;
  font-style: italic;
  color: #ffffff;
  margin: 0 0 1rem 0;
}

.quote-author-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #9ca3af;
  font-style: normal;
}

.conclusion-section-budgetplanung-finanzmanagement {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  overflow: hidden;
}

.conclusion-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.conclusion-text-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
}

.conclusion-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1.5rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.conclusion-description-budgetplanung-finanzmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #4b5563;
  margin: 0 0 1.5rem 0;
}

.key-takeaways-budgetplanung-finanzmanagement {
  background: #f1f5f9;
  padding: clamp(1.5rem, 3vw, 2rem);
  border-radius: 12px;
  margin: 1.5rem 0;
}

.takeaways-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin: 0 0 1rem 0;
}

.takeaways-list-budgetplanung-finanzmanagement {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.takeaway-item-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #334155;
  padding-left: 1.5rem;
  position: relative;
}

.takeaway-item-budgetplanung-finanzmanagement::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: 700;
}

.conclusion-cta-text-budgetplanung-finanzmanagement {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #4b5563;
  margin: 1.5rem 0 0 0;
}

.conclusion-image-budgetplanung-finanzmanagement {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}

.disclaimer-section-budgetplanung-finanzmanagement {
  background: #1f2937;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.1);
  overflow: hidden;
}

.disclaimer-content-budgetplanung-finanzmanagement {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0 0 1rem 0;
}

.disclaimer-text-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.related-section-budgetplanung-finanzmanagement {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.related-header-budgetplanung-finanzmanagement {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
}

.related-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.related-subtitle-budgetplanung-finanzmanagement {
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.related-grid-budgetplanung-finanzmanagement {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-budgetplanung-finanzmanagement {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-budgetplanung-finanzmanagement:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-content-budgetplanung-finanzmanagement {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-budgetplanung-finanzmanagement {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.related-card-description-budgetplanung-finanzmanagement {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.related-link-budgetplanung-finanzmanagement {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-link-budgetplanung-finanzmanagement:hover {
  color: #22d3ee;
}

.related-link-budgetplanung-finanzmanagement i {
  transition: transform 0.3s ease;
  font-size: 0.875rem;
}

.related-card-budgetplanung-finanzmanagement:hover .related-link-budgetplanung-finanzmanagement i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .intro-content-budgetplanung-finanzmanagement,
  .strategies-content-budgetplanung-finanzmanagement,
  .conclusion-content-budgetplanung-finanzmanagement {
    flex-direction: column;
  }

  .intro-text-budgetplanung-finanzmanagement,
  .intro-image-budgetplanung-finanzmanagement,
  .strategies-text-budgetplanung-finanzmanagement,
  .strategies-image-budgetplanung-finanzmanagement,
  .conclusion-text-budgetplanung-finanzmanagement,
  .conclusion-image-budgetplanung-finanzmanagement {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .related-grid-budgetplanung-finanzmanagement {
    flex-direction: column;
  }

  .related-card-budgetplanung-finanzmanagement {
    flex: 1 1 100%;
    max-width: none;
  }

  .hero-content-budgetplanung-finanzmanagement {
    padding: 0;
  }
}

@media (max-width: 480px) {
  .hero-title-budgetplanung-finanzmanagement {
    font-size: 1.75rem;
  }

  .strategies-section-title-budgetplanung-finanzmanagement {
    font-size: 1.125rem;
  }
}

.main-markenaufbau-identitaet {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-markenaufbau-identitaet {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-markenaufbau-identitaet::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-markenaufbau-identitaet::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-markenaufbau-identitaet {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  position: relative;
  z-index: 2;
}

.breadcrumb-link-markenaufbau-identitaet {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-markenaufbau-identitaet:hover {
  color: #06b6d4;
}

.breadcrumb-separator-markenaufbau-identitaet {
  color: #64748b;
}

.breadcrumb-current-markenaufbau-identitaet {
  color: #e2e8f0;
}

.hero-content-markenaufbau-identitaet {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  position: relative;
  z-index: 2;
}

.hero-title-markenaufbau-identitaet {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  font-weight: 700;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin: 0;
}

.hero-subtitle-markenaufbau-identitaet {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  margin: 0;
  line-height: 1.6;
}

.hero-meta-markenaufbau-identitaet {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin-top: 1rem;
}

.meta-badge-markenaufbau-identitaet {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-markenaufbau-identitaet i {
  font-size: 0.875rem;
}

.hero-image-markenaufbau-identitaet {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  margin-top: 1rem;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.intro-section-markenaufbau-identitaet {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.intro-wrapper-markenaufbau-identitaet {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-markenaufbau-identitaet {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.intro-description-markenaufbau-identitaet {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1rem;
}

.intro-image-markenaufbau-identitaet img {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  max-height: 350px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .intro-wrapper-markenaufbau-identitaet {
    flex-direction: column;
  }

  .intro-text-markenaufbau-identitaet,
  .intro-image-markenaufbau-identitaet {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-markenaufbau-identitaet {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-section-markenaufbau-identitaet::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.section-header-markenaufbau-identitaet {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 2;
}

.section-tag-markenaufbau-identitaet {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.section-title-markenaufbau-identitaet {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.section-subtitle-markenaufbau-identitaet {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  margin-top: 1rem;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.content-wrapper-markenaufbau-identitaet {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 2;
}

.content-text-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-heading-markenaufbau-identitaet {
  font-size: clamp(1.25rem, 3vw + 0.5rem, 1.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.content-text-body-markenaufbau-identitaet {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #cbd5e1;
  margin-bottom: 1.5rem;
}

.featured-quote-markenaufbau-identitaet {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  margin: 2rem 0;
  border-radius: 8px;
}

.quote-text-markenaufbau-identitaet {
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-style: italic;
  color: #e2e8f0;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-author-markenaufbau-identitaet {
  font-size: 0.875rem;
  color: #94a3b8;
  font-style: normal;
}

.content-image-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-markenaufbau-identitaet img {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  max-height: 350px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .content-wrapper-markenaufbau-identitaet {
    flex-direction: column;
  }

  .content-text-markenaufbau-identitaet,
  .content-image-markenaufbau-identitaet {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.strategy-section-markenaufbau-identitaet {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.strategy-wrapper-markenaufbau-identitaet {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.strategy-image-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-image-markenaufbau-identitaet img {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  max-height: 350px;
  object-fit: cover;
}

.strategy-text-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-heading-markenaufbau-identitaet {
  font-size: clamp(1.25rem, 3vw + 0.5rem, 1.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.strategy-body-markenaufbau-identitaet {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.strategy-features-markenaufbau-identitaet {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.feature-item-markenaufbau-identitaet {
  padding: 1rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.feature-title-markenaufbau-identitaet {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.feature-text-markenaufbau-identitaet {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .strategy-wrapper-markenaufbau-identitaet {
    flex-direction: column;
  }

  .strategy-image-markenaufbau-identitaet,
  .strategy-text-markenaufbau-identitaet {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-markenaufbau-identitaet {
  background: #1a2332;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
}

.steps-container-markenaufbau-identitaet {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.step-card-markenaufbau-identitaet {
  flex: 1 1 calc(50% - 1rem);
  min-width: 300px;
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.step-card-markenaufbau-identitaet:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.step-number-markenaufbau-identitaet {
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-markenaufbau-identitaet {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-markenaufbau-identitaet {
  font-size: 1.125rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.step-text-markenaufbau-identitaet {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .step-card-markenaufbau-identitaet {
    flex: 1 1 100%;
  }
}

.consistency-section-markenaufbau-identitaet {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.consistency-wrapper-markenaufbau-identitaet {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.consistency-text-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.consistency-title-markenaufbau-identitaet {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.consistency-body-markenaufbau-identitaet {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.5rem;
}

.consistency-checklist-markenaufbau-identitaet {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.checklist-item-markenaufbau-identitaet {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.checklist-item-markenaufbau-identitaet i {
  color: #06b6d4;
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.checklist-text-markenaufbau-identitaet {
  font-size: 0.9375rem;
  color: #1e293b;
  line-height: 1.6;
}

.consistency-image-markenaufbau-identitaet {
  flex: 1 1 50%;
  max-width: 50%;
}

.consistency-image-markenaufbau-identitaet img {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  max-height: 350px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .consistency-wrapper-markenaufbau-identitaet {
    flex-direction: column;
  }

  .consistency-text-markenaufbau-identitaet,
  .consistency-image-markenaufbau-identitaet {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-markenaufbau-identitaet {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-markenaufbau-identitaet::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-section-markenaufbau-identitaet::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-markenaufbau-identitaet {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 2;
}

.conclusion-title-markenaufbau-identitaet {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.conclusion-text-markenaufbau-identitaet {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.conclusion-cta-markenaufbau-identitaet {
  margin-top: 1.5rem;
  padding: 2rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 16px;
  border: 1px solid rgba(6, 182, 212, 0.2);
}

.cta-title-markenaufbau-identitaet {
  font-size: 1.25rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.cta-text-markenaufbau-identitaet {
  font-size: 0.9375rem;
  color: #9ca3af;
  margin-bottom: 1.5rem;
}

.btn-primary-markenaufbau-identitaet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.btn-primary-markenaufbau-identitaet:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-markenaufbau-identitaet {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-box-markenaufbau-identitaet {
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  padding: 2rem;
  border-radius: 12px;
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-markenaufbau-identitaet {
  font-size: 1.125rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
}

.disclaimer-text-markenaufbau-identitaet {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

.related-section-markenaufbau-identitaet {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-header-markenaufbau-identitaet {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-markenaufbau-identitaet {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.related-subtitle-markenaufbau-identitaet {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
}

.related-cards-markenaufbau-identitaet {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-markenaufbau-identitaet {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(6, 182, 212, 0.15);
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-card-markenaufbau-identitaet:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.1);
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(6, 182, 212, 0.2);
}

.related-card-markenaufbau-identitaet img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

.related-card-content-markenaufbau-identitaet {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.related-card-title-markenaufbau-identitaet {
  font-size: 1.125rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.related-card-text-markenaufbau-identitaet {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .related-card-markenaufbau-identitaet {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .hero-section-markenaufbau-identitaet {
    padding: clamp(2rem, 6vw, 4rem) 0;
  }

  .intro-section-markenaufbau-identitaet,
  .content-section-markenaufbau-identitaet,
  .strategy-section-markenaufbau-identitaet,
  .consistency-section-markenaufbau-identitaet,
  .conclusion-section-markenaufbau-identitaet {
    padding: clamp(3rem, 6vw, 4rem) 0;
  }
}

@media (max-width: 480px) {
  .hero-title-markenaufbau-identitaet {
    font-size: 1.5rem;
  }

  .section-title-markenaufbau-identitaet {
    font-size: 1.25rem;
  }

  .step-card-markenaufbau-identitaet {
    flex-direction: column;
  }

  .step-number-markenaufbau-identitaet {
    min-width: auto;
  }
}

.main-geschaeftsplan-startup-strategie {
  width: 100%;
  overflow: hidden;
}

.hero-section-geschaeftsplan-startup-strategie {
  background: linear-gradient(135deg, #0a1628 0%, #0d1f2d 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-geschaeftsplan-startup-strategie::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-geschaeftsplan-startup-strategie::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-geschaeftsplan-startup-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  align-items: center;
}

.breadcrumb-link-geschaeftsplan-startup-strategie {
  color: #38bdf8;
  transition: color 0.3s ease;
}

.breadcrumb-link-geschaeftsplan-startup-strategie:hover {
  color: #0ea5e9;
}

.breadcrumb-separator-geschaeftsplan-startup-strategie {
  color: #64748b;
  margin: 0 0.25rem;
}

.breadcrumb-current-geschaeftsplan-startup-strategie {
  color: #cbd5e1;
}

.hero-content-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 900px;
  margin: 0 auto;
}

.hero-title-geschaeftsplan-startup-strategie {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  background: linear-gradient(135deg, #ffffff 0%, #38bdf8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-description-geschaeftsplan-startup-strategie {
  font-size: clamp(1rem, 1.5vw + 0.5rem, 1.125rem);
  color: #cbd5e1;
  line-height: 1.7;
  max-width: 700px;
  margin: 0;
}

.hero-meta-geschaeftsplan-startup-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.meta-badge-geschaeftsplan-startup-strategie {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #38bdf8;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-geschaeftsplan-startup-strategie i {
  font-size: 1rem;
}

.hero-image-wrapper-geschaeftsplan-startup-strategie {
  margin-top: 2rem;
  border-radius: 12px;
  overflow: hidden;
  max-width: 900px;
}

.hero-image-geschaeftsplan-startup-strategie {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.intro-section-geschaeftsplan-startup-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-geschaeftsplan-startup-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  margin-bottom: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
}

.intro-paragraph-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin: 0 0 1.5rem 0;
}

.intro-paragraph-geschaeftsplan-startup-strategie:last-child {
  margin-bottom: 0;
}

.intro-image-geschaeftsplan-startup-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-img-geschaeftsplan-startup-strategie {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .intro-content-geschaeftsplan-startup-strategie {
    flex-direction: column;
  }

  .intro-text-geschaeftsplan-startup-strategie,
  .intro-image-geschaeftsplan-startup-strategie {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.components-section-geschaeftsplan-startup-strategie {
  background: #0d1f2d;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.components-section-geschaeftsplan-startup-strategie::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.components-header-geschaeftsplan-startup-strategie {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.components-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  margin-bottom: 1rem;
  font-weight: 700;
}

.components-subtitle-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1.5vw + 0.5rem, 1.125rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.components-grid-geschaeftsplan-startup-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.component-card-geschaeftsplan-startup-strategie {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.component-card-geschaeftsplan-startup-strategie:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.component-icon-geschaeftsplan-startup-strategie {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.component-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #ffffff;
  font-weight: 600;
}

.component-text-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .component-card-geschaeftsplan-startup-strategie {
    flex: 1 1 100%;
    max-width: none;
  }
}

.steps-section-geschaeftsplan-startup-strategie {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.steps-header-geschaeftsplan-startup-strategie {
  text-align: center;
  margin-bottom: 3rem;
}

.steps-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  margin-bottom: 1rem;
  font-weight: 700;
}

.steps-subtitle-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1.5vw + 0.5rem, 1.125rem);
  color: #475569;
  max-width: 600px;
  margin: 0 auto;
}

.steps-content-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 3rem;
}

.step-item-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  transition: all 0.3s ease;
}

.step-item-geschaeftsplan-startup-strategie:hover {
  box-shadow: 0 8px 24px rgba(6, 182, 212, 0.15);
  transform: translateX(4px);
}

.step-number-geschaeftsplan-startup-strategie {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-text-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.step-description-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.steps-image-geschaeftsplan-startup-strategie {
  border-radius: 12px;
  overflow: hidden;
  max-width: 100%;
}

.steps-img-geschaeftsplan-startup-strategie {
  width: 100%;
  height: auto;
  max-height: 380px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .step-item-geschaeftsplan-startup-strategie {
    flex-direction: column;
  }

  .step-number-geschaeftsplan-startup-strategie {
    min-width: auto;
  }
}

.best-practices-section-geschaeftsplan-startup-strategie {
  background: #0a1628;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.best-practices-section-geschaeftsplan-startup-strategie::before {
  content: '';
  position: absolute;
  top: 50%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.best-practices-wrapper-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.best-practices-text-geschaeftsplan-startup-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.best-practices-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  margin-bottom: 2rem;
  font-weight: 700;
  line-height: 1.2;
}

.best-practices-list-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.practice-item-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.practice-name-geschaeftsplan-startup-strategie {
  font-size: 1.0625rem;
  color: #ffffff;
  font-weight: 600;
}

.practice-detail-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.best-practices-image-geschaeftsplan-startup-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.best-practices-img-geschaeftsplan-startup-strategie {
  width: 100%;
  height: auto;
  max-height: 380px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .best-practices-wrapper-geschaeftsplan-startup-strategie {
    flex-direction: column;
  }

  .best-practices-text-geschaeftsplan-startup-strategie,
  .best-practices-image-geschaeftsplan-startup-strategie {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.tools-section-geschaeftsplan-startup-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.tools-header-geschaeftsplan-startup-strategie {
  text-align: center;
  margin-bottom: 3rem;
}

.tools-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  margin-bottom: 1rem;
  font-weight: 700;
}

.tools-subtitle-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1.5vw + 0.5rem, 1.125rem);
  color: #475569;
  max-width: 600px;
  margin: 0 auto;
}

.tools-grid-geschaeftsplan-startup-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-card-geschaeftsplan-startup-strategie {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.tool-card-geschaeftsplan-startup-strategie:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 24px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.tool-name-geschaeftsplan-startup-strategie {
  font-size: 1.0625rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.tool-description-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.tool-note-geschaeftsplan-startup-strategie {
  font-size: 0.875rem;
  color: #64748b;
  font-style: italic;
  margin: 0;
}

@media (max-width: 768px) {
  .tool-card-geschaeftsplan-startup-strategie {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-geschaeftsplan-startup-strategie {
  background: linear-gradient(135deg, #0d1f2d 0%, #0a1628 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-geschaeftsplan-startup-strategie::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-geschaeftsplan-startup-strategie {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #ffffff;
  font-weight: 700;
  line-height: 1.2;
}

.conclusion-text-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin: 0;
}

.conclusion-quote-geschaeftsplan-startup-strategie {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.1);
  margin: 1rem 0;
}

.quote-text-geschaeftsplan-startup-strategie {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  color: #ffffff;
  font-style: italic;
  margin: 0 0 1rem 0;
  line-height: 1.6;
}

.quote-author-geschaeftsplan-startup-strategie {
  font-size: 0.875rem;
  color: #cbd5e1;
  font-style: normal;
  display: block;
}

.conclusion-cta-geschaeftsplan-startup-strategie {
  margin-top: 1rem;
}

.cta-button-geschaeftsplan-startup-strategie {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  transition: all 0.3s ease;
}

.cta-button-geschaeftsplan-startup-strategie:hover {
  background: #0ea5e9;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-geschaeftsplan-startup-strategie {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-geschaeftsplan-startup-strategie {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #0f172a;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.7;
  margin: 0;
}

.related-section-geschaeftsplan-startup-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-geschaeftsplan-startup-strategie {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-geschaeftsplan-startup-strategie {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  margin-bottom: 1rem;
  font-weight: 700;
}

.related-subtitle-geschaeftsplan-startup-strategie {
  font-size: clamp(0.9375rem, 1.5vw + 0.5rem, 1.125rem);
  color: #475569;
  max-width: 600px;
  margin: 0 auto;
}

.related-grid-geschaeftsplan-startup-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-geschaeftsplan-startup-strategie {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-geschaeftsplan-startup-strategie:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 24px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.related-card-title-geschaeftsplan-startup-strategie {
  font-size: 1.0625rem;
  color: #0f172a;
  font-weight: 600;
  margin: 0;
}

.related-card-text-geschaeftsplan-startup-strategie {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-link-geschaeftsplan-startup-strategie {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
}

.related-link-geschaeftsplan-startup-strategie:hover {
  color: #0ea5e9;
  gap: 0.75rem;
}

@media (max-width: 768px) {
  .related-card-geschaeftsplan-startup-strategie {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (min-width: 768px) {
  .hero-section-geschaeftsplan-startup-strategie {
    padding: clamp(4rem, 10vw, 8rem) 0;
  }

  .intro-section-geschaeftsplan-startup-strategie,
  .components-section-geschaeftsplan-startup-strategie,
  .steps-section-geschaeftsplan-startup-strategie,
  .best-practices-section-geschaeftsplan-startup-strategie,
  .tools-section-geschaeftsplan-startup-strategie,
  .conclusion-section-geschaeftsplan-startup-strategie {
    padding: clamp(5rem, 10vw, 8rem) 0;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-geschaeftsplan-startup-strategie {
    font-size: 0.75rem;
  }

  .hero-title-geschaeftsplan-startup-strategie {
    font-size: 1.75rem;
  }

  .steps-content-geschaeftsplan-startup-strategie {
    gap: 1rem;
  }

  .step-item-geschaeftsplan-startup-strategie {
    padding: 1rem;
  }
}

.main-teamaufbau-delegation {
  width: 100%;
  background: #ffffff;
}

.hero-section-teamaufbau-delegation {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-teamaufbau-delegation::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-teamaufbau-delegation::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-teamaufbau-delegation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-teamaufbau-delegation {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-teamaufbau-delegation:hover {
  color: #06b6d4;
}

.breadcrumb-separator-teamaufbau-delegation {
  color: #64748b;
}

.breadcrumb-current-teamaufbau-delegation {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-teamaufbau-delegation {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: clamp(2rem, 5vw, 4rem);
}

.hero-title-teamaufbau-delegation {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  color: #ffffff;
  font-weight: 700;
  max-width: 900px;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-teamaufbau-delegation {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0;
}

.hero-stats-teamaufbau-delegation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 4vw, 3rem);
  justify-content: center;
  margin-top: clamp(1rem, 3vw, 2rem);
}

.stat-item-teamaufbau-delegation {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.stat-number-teamaufbau-delegation {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-teamaufbau-delegation {
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  color: #94a3b8;
  font-weight: 500;
}

.hero-image-container-teamaufbau-delegation {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

.hero-image-teamaufbau-delegation {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  display: block;
}

.intro-section-teamaufbau-delegation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-wrapper-teamaufbau-delegation {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.intro-text-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
}

.intro-text-teamaufbau-delegation {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
}

.intro-image-teamaufbau-delegation {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .intro-content-wrapper-teamaufbau-delegation {
    flex-direction: column;
  }
  
  .intro-text-block-teamaufbau-delegation,
  .intro-image-block-teamaufbau-delegation {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-one-teamaufbau-delegation {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-section-one-teamaufbau-delegation::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.content-wrapper-teamaufbau-delegation {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.content-text-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
}

.content-text-teamaufbau-delegation {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
}

.content-highlight-teamaufbau-delegation {
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid #06b6d4;
  padding: clamp(1rem, 2vw, 1.5rem);
  border-radius: 8px;
  margin: clamp(1.5rem, 3vw, 2rem) 0;
}

.highlight-title-teamaufbau-delegation {
  font-size: 1.125rem;
  color: #ffffff;
  margin-bottom: 1rem;
  font-weight: 600;
}

.highlight-list-teamaufbau-delegation {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.highlight-item-teamaufbau-delegation {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.6;
  padding-left: 1.5rem;
  position: relative;
}

.highlight-item-teamaufbau-delegation::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.content-image-teamaufbau-delegation {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 15px 35px rgba(6, 182, 212, 0.25);
}

@media (max-width: 768px) {
  .content-wrapper-teamaufbau-delegation {
    flex-direction: column;
  }
  
  .content-text-block-teamaufbau-delegation,
  .content-image-block-teamaufbau-delegation {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.content-section-two-teamaufbau-delegation {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.content-section-two-teamaufbau-delegation .content-title-teamaufbau-delegation {
  color: #1e293b;
}

.content-section-two-teamaufbau-delegation .content-text-teamaufbau-delegation {
  color: #475569;
}

.content-section-two-teamaufbau-delegation .content-wrapper-teamaufbau-delegation {
  flex-direction: row-reverse;
}

.content-steps-teamaufbau-delegation {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: clamp(1.5rem, 3vw, 2rem);
}

.step-item-teamaufbau-delegation {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.15);
}

.step-number-teamaufbau-delegation {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-teamaufbau-delegation {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-teamaufbau-delegation {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
}

.step-text-teamaufbau-delegation {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.benefits-section-teamaufbau-delegation {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-teamaufbau-delegation::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.benefits-header-teamaufbau-delegation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2rem, 5vw, 3rem);
  position: relative;
  z-index: 1;
}

.benefits-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  margin-bottom: 1rem;
  font-weight: 700;
}

.benefits-subtitle-teamaufbau-delegation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  margin: 0;
}

.benefits-grid-teamaufbau-delegation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-card-teamaufbau-delegation {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-teamaufbau-delegation:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.benefit-icon-teamaufbau-delegation {
  font-size: 2rem;
  color: #06b6d4;
}

.benefit-title-teamaufbau-delegation {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.benefit-text-teamaufbau-delegation {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-teamaufbau-delegation {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategies-section-teamaufbau-delegation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.strategies-header-teamaufbau-delegation {
  text-align: center;
  margin-bottom: clamp(2rem, 5vw, 3rem);
}

.strategies-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  margin: 0;
  font-weight: 700;
}

.strategies-wrapper-teamaufbau-delegation {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.strategies-text-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategies-image-block-teamaufbau-delegation {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategies-text-teamaufbau-delegation {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
}

.strategies-subheading-teamaufbau-delegation {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin-top: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 0.75rem;
}

.strategies-image-teamaufbau-delegation {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .strategies-wrapper-teamaufbau-delegation {
    flex-direction: column;
  }
  
  .strategies-text-block-teamaufbau-delegation,
  .strategies-image-block-teamaufbau-delegation {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.quote-section-teamaufbau-delegation {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.featured-quote-teamaufbau-delegation {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 8px;
}

.quote-text-teamaufbau-delegation {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #ffffff;
  font-style: italic;
  line-height: 1.7;
  margin: 0 0 1.5rem 0;
}

.quote-author-teamaufbau-delegation {
  font-size: 0.9375rem;
  color: #cbd5e1;
  font-style: normal;
}

.conclusion-section-teamaufbau-delegation {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-teamaufbau-delegation {
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
}

.conclusion-text-teamaufbau-delegation {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.conclusion-key-points-teamaufbau-delegation {
  background: #ffffff;
  padding: clamp(1.5rem, 3vw, 2rem);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.15);
  margin: clamp(1.5rem, 3vw, 2rem) 0;
}

.conclusion-subtitle-teamaufbau-delegation {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin-bottom: 1rem;
}

.conclusion-list-teamaufbau-delegation {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.conclusion-item-teamaufbau-delegation {
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
  padding-left: 1.75rem;
  position: relative;
}

.conclusion-item-teamaufbau-delegation::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

.conclusion-closing-teamaufbau-delegation {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: clamp(1.5rem, 3vw, 2rem) 0 0 0;
}

.related-section-teamaufbau-delegation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
  position: relative;
  overflow: hidden;
}

.related-header-teamaufbau-delegation {
  text-align: center;
  margin-bottom: clamp(2rem, 5vw, 3rem);
}

.related-title-teamaufbau-delegation {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #1e293b;
  margin-bottom: 0.75rem;
  font-weight: 700;
}

.related-subtitle-teamaufbau-delegation {
  font-size: 1rem;
  color: #475569;
  margin: 0;
}

.related-cards-teamaufbau-delegation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-teamaufbau-delegation {
  flex: 1 1 320px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  overflow: hidden;
}

.related-card-image-teamaufbau-delegation {
  width: 100%;
  height: 220px;
  border-radius: 12px;
  overflow: hidden;
}

.related-image-teamaufbau-delegation {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.related-card-teamaufbau-delegation:hover .related-image-teamaufbau-delegation {
  transform: scale(1.05);
}

.related-card-content-teamaufbau-delegation {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.related-card-title-teamaufbau-delegation {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
}

.related-card-text-teamaufbau-delegation {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex: 1;
}

.related-link-teamaufbau-delegation {
  display: inline-flex;
  align-items: center;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: color 0.3s ease;
  margin-top: 0.5rem;
}

.related-link-teamaufbau-delegation:hover {
  color: #0891b2;
}

@media (max-width: 768px) {
  .related-card-teamaufbau-delegation {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-teamaufbau-delegation {
  background: #111827;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.15);
  position: relative;
  overflow: hidden;
}

.disclaimer-content-teamaufbau-delegation {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
}

.disclaimer-title-teamaufbau-delegation {
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-teamaufbau-delegation {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 768px) {
  .hero-stats-teamaufbau-delegation {
    gap: clamp(1rem, 3vw, 1.5rem);
  }

  .hero-image-container-teamaufbau-delegation {
    max-width: 100%;
  }

  .content-section-two-teamaufbau-delegation .content-wrapper-teamaufbau-delegation {
    flex-direction: column;
  }

  .benefit-card-teamaufbau-delegation {
    flex: 1 1 100%;
  }

  .step-item-teamaufbau-delegation {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-teamaufbau-delegation {
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-teamaufbau-delegation {
    font-size: 0.75rem;
  }

  .hero-title-teamaufbau-delegation {
    font-size: 1.5rem;
  }

  .intro-title-teamaufbau-delegation,
  .content-title-teamaufbau-delegation,
  .benefits-title-teamaufbau-delegation,
  .strategies-title-teamaufbau-delegation {
    font-size: 1.5rem;
  }

  .stat-number-teamaufbau-delegation {
    font-size: 1.5rem;
  }

  .hero-stats-teamaufbau-delegation {
    gap: 1rem;
  }
}

.main-wettbewerbsanalyse-marktforschung {
  width: 100%;
}

.breadcrumbs-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
}

.breadcrumb-link-wettbewerbsanalyse-marktforschung {
  color: var(--color-primary);
  transition: color 0.2s ease;
}

.breadcrumb-link-wettbewerbsanalyse-marktforschung:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}

.breadcrumb-separator-wettbewerbsanalyse-marktforschung {
  color: #cbd5e1;
}

.breadcrumb-current-wettbewerbsanalyse-marktforschung {
  color: #9ca3af;
}

.hero-section-wettbewerbsanalyse-marktforschung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-wettbewerbsanalyse-marktforschung::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-wettbewerbsanalyse-marktforschung::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-wettbewerbsanalyse-marktforschung {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero-subtitle-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.375rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0;
}

.hero-meta-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.meta-badge-wettbewerbsanalyse-marktforschung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: var(--color-primary-hover);
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-wettbewerbsanalyse-marktforschung i {
  font-size: 0.875rem;
}

.hero-image-wrapper-wettbewerbsanalyse-marktforschung {
  width: 100%;
  margin-top: 1rem;
  border-radius: 12px;
  overflow: hidden;
}

.hero-image-wettbewerbsanalyse-marktforschung {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  display: block;
}

.intro-section-wettbewerbsanalyse-marktforschung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.intro-content-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.intro-text-block-wettbewerbsanalyse-marktforschung {
  flex: 1 1 300px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-description-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: #374151;
  margin: 0;
}

.intro-highlight-box-wettbewerbsanalyse-marktforschung {
  flex: 1 1 300px;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-left: 4px solid var(--color-primary);
  border-radius: 8px;
}

.highlight-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 1rem;
}

.highlight-list-wettbewerbsanalyse-marktforschung {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.highlight-item-wettbewerbsanalyse-marktforschung {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.highlight-item-wettbewerbsanalyse-marktforschung::before {
  content: '';
  color: var(--color-primary);
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 2px;
}

.content-section-one-wettbewerbsanalyse-marktforschung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.content-wrapper-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-block-wettbewerbsanalyse-marktforschung {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.content-heading-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.25rem);
  font-weight: 700;
  color: #1e293b;
  line-height: 1.2;
}

.content-text-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
}

.content-image-block-wettbewerbsanalyse-marktforschung {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-image-wettbewerbsanalyse-marktforschung {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.content-section-two-wettbewerbsanalyse-marktforschung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.quote-block-wettbewerbsanalyse-marktforschung {
  padding: clamp(1.5rem, 3vw, 2rem);
  border-left: 4px solid var(--color-primary);
  background: #f1f5f9;
  border-radius: 8px;
  margin-top: 1rem;
}

.quote-text-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-style: italic;
  color: #1e293b;
  line-height: 1.8;
  margin: 0 0 0.75rem 0;
}

.quote-author-wettbewerbsanalyse-marktforschung {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.content-section-three-wettbewerbsanalyse-marktforschung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.features-section-wettbewerbsanalyse-marktforschung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.features-header-wettbewerbsanalyse-marktforschung {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.features-title-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.features-subtitle-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.features-grid-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.feature-card-wettbewerbsanalyse-marktforschung {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.feature-card-wettbewerbsanalyse-marktforschung:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  border-color: var(--color-primary);
}

.feature-icon-wettbewerbsanalyse-marktforschung {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 10px;
  color: var(--color-primary);
  font-size: 1.5rem;
}

.feature-card-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.feature-card-text-wettbewerbsanalyse-marktforschung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.insights-section-wettbewerbsanalyse-marktforschung {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-section-wettbewerbsanalyse-marktforschung::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.insights-header-wettbewerbsanalyse-marktforschung {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

.insights-title-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.insights-subtitle-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
  line-height: 1.6;
  margin: 0;
}

.insights-grid-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.insight-item-wettbewerbsanalyse-marktforschung {
  flex: 1 1 250px;
  max-width: 320px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.insight-item-wettbewerbsanalyse-marktforschung:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: var(--color-primary);
  transform: translateY(-4px);
}

.insight-number-wettbewerbsanalyse-marktforschung {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.insight-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.insight-text-wettbewerbsanalyse-marktforschung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

.conclusion-section-wettbewerbsanalyse-marktforschung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.conclusion-content-wettbewerbsanalyse-marktforschung {
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.conclusion-text-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin-bottom: 2.5rem;
}

.steps-container-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.step-item-wettbewerbsanalyse-marktforschung {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid var(--color-primary);
}

.step-number-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.5rem, 2vw, 2rem);
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.step-content-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
}

.step-text-wettbewerbsanalyse-marktforschung {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.conclusion-closing-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: #475569;
  margin: 0;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border-left: 4px solid var(--color-primary);
}

.disclaimer-section-wettbewerbsanalyse-marktforschung {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
}

.disclaimer-box-wettbewerbsanalyse-marktforschung {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.75rem;
}

.disclaimer-text-wettbewerbsanalyse-marktforschung {
  font-size: 0.875rem;
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

.related-section-wettbewerbsanalyse-marktforschung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-header-wettbewerbsanalyse-marktforschung {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.related-title-wettbewerbsanalyse-marktforschung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.related-subtitle-wettbewerbsanalyse-marktforschung {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-cards-wettbewerbsanalyse-marktforschung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-wettbewerbsanalyse-marktforschung {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.3s ease;
  background: #ffffff;
}

.related-card-wettbewerbsanalyse-marktforschung:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  border-color: var(--color-primary);
}

.related-card-image-wettbewerbsanalyse-marktforschung {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

.related-card-title-wettbewerbsanalyse-marktforschung {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #1e293b;
  padding: 0 1.25rem;
  padding-top: 0.5rem;
  line-height: 1.3;
}

.related-card-text-wettbewerbsanalyse-marktforschung {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #64748b;
  padding: 0 1.25rem;
  margin: 0;
}

.related-card-link-wettbewerbsanalyse-marktforschung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.5rem 1.25rem 1.25rem 1.25rem;
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.875rem;
  transition: all 0.2s ease;
  text-decoration: none;
}

.related-card-link-wettbewerbsanalyse-marktforschung:hover {
  color: var(--color-primary-hover);
  gap: 0.75rem;
}

.related-card-link-wettbewerbsanalyse-marktforschung i {
  font-size: 0.75rem;
  transition: transform 0.2s ease;
}

@media (max-width: 768px) {
  .content-wrapper-wettbewerbsanalyse-marktforschung {
    flex-direction: column;
  }

  .content-text-block-wettbewerbsanalyse-marktforschung,
  .content-image-block-wettbewerbsanalyse-marktforschung {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .intro-content-wettbewerbsanalyse-marktforschung {
    flex-direction: column;
  }

  .intro-text-block-wettbewerbsanalyse-marktforschung,
  .intro-highlight-box-wettbewerbsanalyse-marktforschung {
    flex: 1 1 100%;
  }

  .features-grid-wettbewerbsanalyse-marktforschung,
  .insights-grid-wettbewerbsanalyse-marktforschung,
  .related-cards-wettbewerbsanalyse-marktforschung {
    flex-direction: column;
  }

  .feature-card-wettbewerbsanalyse-marktforschung,
  .insight-item-wettbewerbsanalyse-marktforschung,
  .related-card-wettbewerbsanalyse-marktforschung {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .step-item-wettbewerbsanalyse-marktforschung {
    flex-direction: column;
    gap: 1rem;
  }

  .breadcrumbs-wettbewerbsanalyse-marktforschung {
    font-size: 0.75rem;
    gap: 0.5rem;
  }
}

@media (max-width: 480px) {
  .hero-title-wettbewerbsanalyse-marktforschung {
    font-size: 1.5rem;
  }

  .features-title-wettbewerbsanalyse-marktforschung,
  .insights-title-wettbewerbsanalyse-marktforschung,
  .related-title-wettbewerbsanalyse-marktforschung,
  .conclusion-title-wettbewerbsanalyse-marktforschung {
    font-size: 1.375rem;
  }

  .hero-meta-wettbewerbsanalyse-marktforschung {
    flex-direction: column;
    gap: 0.5rem;
  }

  .meta-badge-wettbewerbsanalyse-marktforschung {
    width: 100%;
    justify-content: flex-start;
  }
}

.main-prozessoptimierung-automation {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.hero-section-prozessoptimierung-automation {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-prozessoptimierung-automation::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-prozessoptimierung-automation::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-prozessoptimierung-automation {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.breadcrumbs-prozessoptimierung-automation {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.breadcrumb-link-prozessoptimierung-automation {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-prozessoptimierung-automation:hover {
  color: #06b6d4;
}

.breadcrumb-separator-prozessoptimierung-automation {
  color: #475569;
}

.breadcrumb-current-prozessoptimierung-automation {
  color: #06b6d4;
  font-weight: 600;
}

.hero-title-prozessoptimierung-automation {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  line-height: 1.6;
}

.hero-meta-prozessoptimierung-automation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1rem);
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-prozessoptimierung-automation {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: clamp(0.8rem, 1vw, 0.875rem);
  font-weight: 500;
}

.meta-badge-prozessoptimierung-automation i {
  font-size: 0.9rem;
}

.hero-image-prozessoptimierung-automation {
  margin-top: clamp(2rem, 4vw, 3rem);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
}

.hero-image-prozessoptimierung-automation img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  max-height: 450px;
}

.intro-section-prozessoptimierung-automation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.intro-content-prozessoptimierung-automation {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.intro-text-prozessoptimierung-automation {
  flex: 1 1 50%;
  min-width: 0;
}

.intro-heading-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-paragraph-prozessoptimierung-automation {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.intro-image-prozessoptimierung-automation {
  flex: 1 1 50%;
  min-width: 0;
}

.intro-image-prozessoptimierung-automation img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .intro-content-prozessoptimierung-automation {
    flex-direction: column;
  }

  .intro-text-prozessoptimierung-automation,
  .intro-image-prozessoptimierung-automation {
    flex: 1 1 100%;
  }
}

.benefits-section-prozessoptimierung-automation {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-header-prozessoptimierung-automation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.benefits-title-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 2vw, 1rem);
  line-height: 1.2;
}

.benefits-subtitle-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  line-height: 1.6;
}

.benefits-grid-prozessoptimierung-automation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.benefit-card-prozessoptimierung-automation {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.benefit-card-prozessoptimierung-automation:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.benefit-icon-prozessoptimierung-automation {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.15), rgba(59, 130, 246, 0.15));
  border-radius: 12px;
  color: #06b6d4;
  font-size: 1.75rem;
}

.benefit-card-title-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.benefit-card-text-prozessoptimierung-automation {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-prozessoptimierung-automation {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-prozessoptimierung-automation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.implementation-header-prozessoptimierung-automation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.implementation-title-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 2vw, 1rem);
  line-height: 1.2;
}

.implementation-subtitle-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  line-height: 1.6;
}

.steps-container-prozessoptimierung-automation {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
  max-width: 900px;
  margin: 0 auto;
}

.step-card-prozessoptimierung-automation {
  display: flex;
  flex-direction: row;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  transition: all 0.3s ease;
}

.step-card-prozessoptimierung-automation:hover {
  background: #f1f5f9;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
}

.step-number-prozessoptimierung-automation {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 80px;
}

.step-content-prozessoptimierung-automation {
  display: flex;
  flex-direction: column;
  gap: clamp(0.5rem, 1vw, 0.75rem);
  flex: 1;
}

.step-title-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.step-text-prozessoptimierung-automation {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .step-card-prozessoptimierung-automation {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-prozessoptimierung-automation {
    min-width: auto;
  }
}

.tools-section-prozessoptimierung-automation {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.tools-header-prozessoptimierung-automation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.tools-title-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 2vw, 1rem);
  line-height: 1.2;
}

.tools-subtitle-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  line-height: 1.6;
}

.tools-content-prozessoptimierung-automation {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.tools-text-prozessoptimierung-automation {
  flex: 1 1 50%;
  min-width: 0;
}

.tools-paragraph-prozessoptimierung-automation {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.tools-list-prozessoptimierung-automation {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.tool-item-prozessoptimierung-automation {
  display: flex;
  flex-direction: row;
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: flex-start;
}

.tool-item-prozessoptimierung-automation i {
  color: #06b6d4;
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-top: 0.25rem;
}

.tool-item-prozessoptimierung-automation span {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #475569;
  line-height: 1.6;
}

.tools-image-prozessoptimierung-automation {
  flex: 1 1 50%;
  min-width: 0;
}

.tools-image-prozessoptimierung-automation img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .tools-content-prozessoptimierung-automation {
    flex-direction: column;
  }

  .tools-text-prozessoptimierung-automation,
  .tools-image-prozessoptimierung-automation {
    flex: 1 1 100%;
  }
}

.best-practices-section-prozessoptimierung-automation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.best-practices-header-prozessoptimierung-automation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(1.5rem, 3vw, 2rem);
}

.best-practices-title-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.featured-quote-prozessoptimierung-automation {
  max-width: 800px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #f8fafc;
  border-radius: 8px;
}

.quote-text-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #1e293b;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem);
}

.quote-author-prozessoptimierung-automation {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  font-style: normal;
}

.practices-grid-prozessoptimierung-automation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.practice-item-prozessoptimierung-automation {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 2vw, 1rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.practice-item-prozessoptimierung-automation:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.practice-heading-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
}

.practice-text-prozessoptimierung-automation {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .practice-item-prozessoptimierung-automation {
    flex: 1 1 100%;
    max-width: none;
  }
}

.cta-section-prozessoptimierung-automation {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-prozessoptimierung-automation::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-prozessoptimierung-automation::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-prozessoptimierung-automation {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  max-width: 700px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.cta-title-prozessoptimierung-automation {
  font-size: clamp(1.75rem, 5vw, 3rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.cta-text-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.cta-buttons-prozessoptimierung-automation {
  display: flex;
  flex-direction: row;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.cta-btn-primary-prozessoptimierung-automation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #06b6d4;
  color: #0f172a;
  font-size: clamp(0.9375rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid #06b6d4;
}

.cta-btn-primary-prozessoptimierung-automation:hover {
  background: #22d3ee;
  border-color: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.cta-btn-secondary-prozessoptimierung-automation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: transparent;
  color: #ffffff;
  font-size: clamp(0.9375rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid #ffffff;
}

.cta-btn-secondary-prozessoptimierung-automation:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: #06b6d4;
  color: #06b6d4;
  transform: translateY(-2px);
}

@media (max-width: 768px) {
  .cta-buttons-prozessoptimierung-automation {
    flex-direction: column;
  }

  .cta-btn-primary-prozessoptimierung-automation,
  .cta-btn-secondary-prozessoptimierung-automation {
    width: 100%;
  }
}

.disclaimer-section-prozessoptimierung-automation {
  background: #f8fafc;
  padding: clamp(2.5rem, 6vw, 4rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.disclaimer-content-prozessoptimierung-automation {
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 8px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  margin-bottom: clamp(0.75rem, 1vw, 1rem);
}

.disclaimer-text-prozessoptimierung-automation {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-prozessoptimierung-automation {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-header-prozessoptimierung-automation {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.related-title-prozessoptimierung-automation {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(0.75rem, 2vw, 1rem);
  line-height: 1.2;
}

.related-subtitle-prozessoptimierung-automation {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
  line-height: 1.6;
}

.related-grid-prozessoptimierung-automation {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-prozessoptimierung-automation {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.related-card-prozessoptimierung-automation:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-prozessoptimierung-automation {
  width: 100%;
  height: 220px;
  overflow: hidden;
  background: #f1f5f9;
}

.related-card-image-prozessoptimierung-automation img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-prozessoptimierung-automation > div:not(:first-child) {
  padding: 0 clamp(1rem, 2vw, 1.5rem);
}

.related-card-title-prozessoptimierung-automation {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
  margin: clamp(1rem, 2vw, 1.5rem) 0 0;
}

.related-card-text-prozessoptimierung-automation {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #64748b;
  line-height: 1.6;
  margin: clamp(0.75rem, 1vw, 1rem) 0;
}

.related-card-link-prozessoptimierung-automation {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  text-decoration: none;
  transition: all 0.3s ease;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem);
}

.related-card-link-prozessoptimierung-automation:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-prozessoptimierung-automation {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .breadcrumbs-prozessoptimierung-automation {
    font-size: 0.75rem;
  }

  .hero-meta-prozessoptimierung-automation {
    gap: 0.5rem;
  }

  .meta-badge-prozessoptimierung-automation {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
}

@media (max-width: 480px) {
  .hero-title-prozessoptimierung-automation {
    font-size: 1.5rem;
  }

  .implementation-title-prozessoptimierung-automation,
  .benefits-title-prozessoptimierung-automation,
  .tools-title-prozessoptimierung-automation,
  .best-practices-title-prozessoptimierung-automation,
  .related-title-prozessoptimierung-automation {
    font-size: 1.25rem;
  }

  .step-number-prozessoptimierung-automation {
    font-size: 1.75rem;
    min-width: 60px;
  }
}

.main-skalierungsstrategien-wachstum {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-skalierungsstrategien-wachstum"] {
  width: 100%;
  overflow: hidden;
}

.breadcrumbs-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.9375rem;
}

.breadcrumb-link-skalierungsstrategien-wachstum {
  color: #06b6d4;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-skalierungsstrategien-wachstum:hover {
  color: #22d3ee;
}

.breadcrumb-separator-skalierungsstrategien-wachstum,
.breadcrumb-current-skalierungsstrategien-wachstum {
  color: #9ca3af;
}

.hero-section-skalierungsstrategien-wachstum {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-skalierungsstrategien-wachstum::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-skalierungsstrategien-wachstum::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-lg);
  position: relative;
  z-index: 2;
}

.hero-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  background: linear-gradient(135deg, #ffffff 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1.5rem 0;
}

.meta-badge-skalierungsstrategien-wachstum {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-skalierungsstrategien-wachstum i {
  color: #06b6d4;
}

.hero-image-container-skalierungsstrategien-wachstum {
  width: 100%;
  max-width: 700px;
  margin: 2rem auto 0;
}

.hero-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.hero-stats-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 5vw, 4rem);
  justify-content: center;
  margin-top: 2rem;
}

.stat-box-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  text-align: center;
}

.stat-number-skalierungsstrategien-wachstum {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-skalierungsstrategien-wachstum {
  font-size: 0.875rem;
  color: #9ca3af;
}

.introduction-section-skalierungsstrategien-wachstum {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.introduction-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-text-skalierungsstrategien-wachstum {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.intro-image-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .introduction-content-skalierungsstrategien-wachstum {
    flex-direction: column;
  }

  .intro-text-block-skalierungsstrategien-wachstum,
  .intro-image-block-skalierungsstrategien-wachstum {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.foundation-section-skalierungsstrategien-wachstum {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.foundation-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.foundation-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.foundation-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
}

.foundation-steps-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 3rem;
}

.foundation-step-skalierungsstrategien-wachstum {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
}

.foundation-step-number-skalierungsstrategien-wachstum {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.foundation-step-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.foundation-step-title-skalierungsstrategien-wachstum {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.foundation-step-text-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
}

.foundation-image-section-skalierungsstrategien-wachstum {
  margin-top: 2rem;
}

.foundation-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.strategies-section-skalierungsstrategien-wachstum {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.strategies-section-skalierungsstrategien-wachstum::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.strategies-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.strategies-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.strategies-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
}

.strategies-grid-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.strategy-card-skalierungsstrategien-wachstum {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.strategy-card-skalierungsstrategien-wachstum:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.strategy-icon-skalierungsstrategien-wachstum {
  font-size: 2rem;
  color: #06b6d4;
  height: 48px;
  display: flex;
  align-items: center;
}

.strategy-card-title-skalierungsstrategien-wachstum {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.strategy-card-text-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #9ca3af;
  line-height: 1.6;
}

.strategies-image-section-skalierungsstrategien-wachstum {
  margin-top: 2rem;
  position: relative;
  z-index: 1;
}

.strategies-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

.implementation-section-skalierungsstrategien-wachstum {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.implementation-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.implementation-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.implementation-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
}

.implementation-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.implementation-text-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-section-title-skalierungsstrategien-wachstum {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0f172a;
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}

.implementation-section-title-skalierungsstrategien-wachstum:first-child {
  margin-top: 0;
}

.implementation-text-skalierungsstrategien-wachstum {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #374151;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.implementation-image-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .implementation-content-skalierungsstrategien-wachstum {
    flex-direction: column;
  }

  .implementation-text-block-skalierungsstrategien-wachstum,
  .implementation-image-block-skalierungsstrategien-wachstum {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.key-metrics-section-skalierungsstrategien-wachstum {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.metrics-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.metrics-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.metrics-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
}

.metrics-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.metrics-list-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.metric-item-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.metric-label-skalierungsstrategien-wachstum {
  font-weight: 600;
  font-size: 1rem;
  color: #0f172a;
}

.metric-description-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.metrics-image-block-skalierungsstrategien-wachstum {
  flex: 1 1 50%;
  max-width: 50%;
}

.metrics-image-skalierungsstrategien-wachstum {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .metrics-content-skalierungsstrategien-wachstum {
    flex-direction: column;
  }

  .metrics-list-block-skalierungsstrategien-wachstum,
  .metrics-image-block-skalierungsstrategien-wachstum {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.quote-section-skalierungsstrategien-wachstum {
  background: #1f2937;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.featured-quote-skalierungsstrategien-wachstum {
  max-width: 800px;
  margin: 0 auto;
  padding: 2.5rem 2rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 8px;
}

.quote-text-skalierungsstrategien-wachstum {
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-style: italic;
  color: #ffffff;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.quote-attribution-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #9ca3af;
  font-style: normal;
}

.challenges-section-skalierungsstrategien-wachstum {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.challenges-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.challenges-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.challenges-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
}

.challenges-grid-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.challenge-card-skalierungsstrategien-wachstum {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.challenge-card-skalierungsstrategien-wachstum:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.challenge-title-skalierungsstrategien-wachstum {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.challenge-text-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
}

.conclusion-section-skalierungsstrategien-wachstum {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-skalierungsstrategien-wachstum::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 800px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.conclusion-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-text-skalierungsstrategien-wachstum {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
}

.conclusion-cta-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 2rem;
  background: rgba(6, 182, 212, 0.1);
  border: 1px solid rgba(6, 182, 212, 0.3);
  border-radius: 12px;
  text-align: center;
}

.cta-title-skalierungsstrategien-wachstum {
  font-size: 1.25rem;
  font-weight: 600;
  color: #ffffff;
}

.cta-text-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #9ca3af;
  margin: 0;
}

.cta-button-skalierungsstrategien-wachstum {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  transition: all 0.3s ease;
  align-self: center;
}

.cta-button-skalierungsstrategien-wachstum:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-skalierungsstrategien-wachstum {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.1);
}

.disclaimer-content-skalierungsstrategien-wachstum {
  max-width: 800px;
  margin: 0 auto;
  padding: 1.5rem;
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
}

.disclaimer-title-skalierungsstrategien-wachstum {
  font-size: 1.125rem;
  font-weight: 600;
  color: #92400e;
  margin-bottom: 1rem;
}

.disclaimer-text-skalierungsstrategien-wachstum {
  font-size: 0.875rem;
  color: #78350f;
  line-height: 1.7;
  margin: 0;
}

.related-section-skalierungsstrategien-wachstum {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.related-header-skalierungsstrategien-wachstum {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.related-title-skalierungsstrategien-wachstum {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-skalierungsstrategien-wachstum {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #475569;
}

.related-cards-skalierungsstrategien-wachstum {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-skalierungsstrategien-wachstum {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid rgba(6, 182, 212, 0.1);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-skalierungsstrategien-wachstum:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.related-card-content-skalierungsstrategien-wachstum {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.related-card-title-skalierungsstrategien-wachstum {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.related-card-text-skalierungsstrategien-wachstum {
  font-size: 0.9375rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-skalierungsstrategien-wachstum {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-link-skalierungsstrategien-wachstum i {
  transition: transform 0.3s ease;
}

.related-card-skalierungsstrategien-wachstum:hover .related-card-link-skalierungsstrategien-wachstum {
  color: #22d3ee;
}

.related-card-skalierungsstrategien-wachstum:hover .related-card-link-skalierungsstrategien-wachstum i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-skalierungsstrategien-wachstum {
    flex: 1 1 100%;
    max-width: none;
  }

  .hero-stats-skalierungsstrategien-wachstum {
    flex-direction: column;
    gap: 1.5rem;
  }

  .strategies-grid-skalierungsstrategien-wachstum,
  .challenges-grid-skalierungsstrategien-wachstum {
    flex-direction: column;
  }

  .strategy-card-skalierungsstrategien-wachstum,
  .challenge-card-skalierungsstrategien-wachstum {
    flex: 1 1 100%;
    max-width: none;
  }

  .foundation-step-skalierungsstrategien-wachstum {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (min-width: 768px) {
  .hero-section-skalierungsstrategien-wachstum {
    padding: clamp(5rem, 10vw, 10rem) 0;
  }

  .introduction-section-skalierungsstrategien-wachstum,
  .foundation-section-skalierungsstrategien-wachstum,
  .strategies-section-skalierungsstrategien-wachstum,
  .implementation-section-skalierungsstrategien-wachstum,
  .key-metrics-section-skalierungsstrategien-wachstum,
  .challenges-section-skalierungsstrategien-wachstum,
  .conclusion-section-skalierungsstrategien-wachstum,
  .related-section-skalierungsstrategien-wachstum {
    padding: clamp(6rem, 10vw, 8rem) 0;
  }
}

@media (min-width: 1024px) {
  .strategies-grid-skalierungsstrategien-wachstum {
    gap: 2rem;
  }

  .strategy-card-skalierungsstrategien-wachstum {
    flex: 1 1 calc(33.333% - 1.33rem);
  }

  .challenge-card-skalierungsstrategien-wachstum {
    flex: 1 1 calc(50% - 1rem);
  }

  .related-card-skalierungsstrategien-wachstum {
    flex: 1 1 calc(33.333% - 1.33rem);
  }
}

.main-trends-zukunft-ecommerce {
  width: 100%;
  background: #ffffff;
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding-left: clamp(1rem, 5vw, 2rem);
  padding-right: clamp(1rem, 5vw, 2rem);
}

.hero-section-trends-zukunft-ecommerce {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-trends-zukunft-ecommerce::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-trends-zukunft-ecommerce::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-trends-zukunft-ecommerce {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  align-items: center;
}

.breadcrumb-link-trends-zukunft-ecommerce {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-trends-zukunft-ecommerce:hover {
  color: #06b6d4;
}

.breadcrumb-separator-trends-zukunft-ecommerce {
  color: #6b7280;
}

.breadcrumb-current-trends-zukunft-ecommerce {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.hero-title-trends-zukunft-ecommerce {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-trends-zukunft-ecommerce {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  line-height: 1.7;
  margin: 0;
}

.hero-meta-trends-zukunft-ecommerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1.5rem);
  justify-content: center;
  margin: clamp(1rem, 2vw, 1.5rem) 0;
}

.meta-badge-trends-zukunft-ecommerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  font-weight: 500;
}

.meta-badge-trends-zukunft-ecommerce i {
  color: #06b6d4;
}

.hero-image-wrapper-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 900px;
  margin-top: clamp(2rem, 4vw, 3rem);
}

.hero-image-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  object-fit: cover;
  max-height: 400px;
}

.introduction-section-trends-zukunft-ecommerce {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.introduction-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: row;
  gap: clamp(3rem, 5vw, 4rem);
  align-items: center;
}

.introduction-text-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.introduction-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.introduction-description-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.introduction-image-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-img-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 350px;
}

@media (max-width: 768px) {
  .introduction-content-trends-zukunft-ecommerce {
    flex-direction: column;
  }

  .introduction-text-trends-zukunft-ecommerce,
  .introduction-image-trends-zukunft-ecommerce {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.trends-recognition-section-trends-zukunft-ecommerce {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.trends-recognition-section-trends-zukunft-ecommerce::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.trends-recognition-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: row;
  gap: clamp(3rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.trends-recognition-text-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.trends-recognition-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.trends-recognition-description-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #9ca3af;
  margin: 0;
}

.indicators-list-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 1rem;
}

.indicator-item-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.indicator-item-trends-zukunft-ecommerce:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
}

.indicator-number-trends-zukunft-ecommerce {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.indicator-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.indicator-title-trends-zukunft-ecommerce {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.indicator-text-trends-zukunft-ecommerce {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.trends-recognition-image-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.trends-recognition-img-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 350px;
}

@media (max-width: 768px) {
  .trends-recognition-content-trends-zukunft-ecommerce {
    flex-direction: column;
  }

  .trends-recognition-text-trends-zukunft-ecommerce,
  .trends-recognition-image-trends-zukunft-ecommerce {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .indicator-item-trends-zukunft-ecommerce {
    flex-direction: row;
  }
}

.strategic-analysis-section-trends-zukunft-ecommerce {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.strategic-analysis-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: row;
  gap: clamp(3rem, 5vw, 4rem);
  align-items: center;
}

.strategic-analysis-image-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategic-analysis-img-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 350px;
}

.strategic-analysis-text-trends-zukunft-ecommerce {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategic-analysis-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.strategic-analysis-description-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.featured-quote-trends-zukunft-ecommerce {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  margin: 1.5rem 0;
  border-radius: 8px;
  font-style: italic;
}

.quote-text-trends-zukunft-ecommerce {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.6;
  color: #0f172a;
  margin-bottom: 1rem;
  margin: 0;
}

.quote-author-trends-zukunft-ecommerce {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

@media (max-width: 768px) {
  .strategic-analysis-content-trends-zukunft-ecommerce {
    flex-direction: column;
  }

  .strategic-analysis-image-trends-zukunft-ecommerce,
  .strategic-analysis-text-trends-zukunft-ecommerce {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-trends-zukunft-ecommerce {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-trends-zukunft-ecommerce::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.implementation-header-trends-zukunft-ecommerce {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 5vw, 4rem);
  position: relative;
  z-index: 1;
}

.implementation-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.implementation-subtitle-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #9ca3af;
  margin: 0;
}

.implementation-steps-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: clamp(3rem, 5vw, 4rem);
  position: relative;
  z-index: 1;
}

.implementation-step-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.15);
  transition: all 0.3s ease;
}

.implementation-step-trends-zukunft-ecommerce:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-2px);
}

.step-number-trends-zukunft-ecommerce {
  font-size: 2.5rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-trends-zukunft-ecommerce {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.step-text-trends-zukunft-ecommerce {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #9ca3af;
  margin: 0;
}

.implementation-image-wrapper-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.implementation-image-trends-zukunft-ecommerce {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 400px;
}

@media (max-width: 768px) {
  .implementation-step-trends-zukunft-ecommerce {
    flex-direction: row;
  }
}

.conclusion-section-trends-zukunft-ecommerce {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.conclusion-text-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.conclusion-cta-trends-zukunft-ecommerce {
  margin-top: 2rem;
}

.cta-button-trends-zukunft-ecommerce {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.cta-button-trends-zukunft-ecommerce:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-trends-zukunft-ecommerce {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-trends-zukunft-ecommerce {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem;
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-trends-zukunft-ecommerce {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-trends-zukunft-ecommerce {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.related-posts-section-trends-zukunft-ecommerce {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid #e2e8f0;
}

.related-header-trends-zukunft-ecommerce {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 5vw, 4rem);
}

.related-title-trends-zukunft-ecommerce {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  margin-bottom: 1rem;
}

.related-subtitle-trends-zukunft-ecommerce {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.related-cards-trends-zukunft-ecommerce {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 3rem);
  justify-content: center;
}

.related-card-trends-zukunft-ecommerce {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-trends-zukunft-ecommerce:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-trends-zukunft-ecommerce {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  overflow: hidden;
}

.related-card-image-trends-zukunft-ecommerce img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-content-trends-zukunft-ecommerce {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-trends-zukunft-ecommerce {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
  margin: 0;
}

.related-card-description-trends-zukunft-ecommerce {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
}

.related-card-link-trends-zukunft-ecommerce {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.related-card-link-trends-zukunft-ecommerce:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .breadcrumbs-trends-zukunft-ecommerce {
    margin-bottom: 1.5rem;
  }

  .related-cards-trends-zukunft-ecommerce {
    flex-direction: column;
  }

  .related-card-trends-zukunft-ecommerce {
    flex: 1 1 100%;
    max-width: none;
  }

  .indicator-item-trends-zukunft-ecommerce {
    flex-direction: row;
  }

  .implementation-step-trends-zukunft-ecommerce {
    flex-direction: row;
  }
}

@media (max-width: 480px) {
  .hero-title-trends-zukunft-ecommerce {
    font-size: 1.5rem;
  }

  .introduction-title-trends-zukunft-ecommerce,
  .trends-recognition-title-trends-zukunft-ecommerce,
  .strategic-analysis-title-trends-zukunft-ecommerce,
  .implementation-title-trends-zukunft-ecommerce,
  .conclusion-title-trends-zukunft-ecommerce,
  .related-title-trends-zukunft-ecommerce {
    font-size: 1.25rem;
  }

  .meta-badge-trends-zukunft-ecommerce {
    padding: 0.5rem 0.875rem;
    font-size: 0.75rem;
  }
}

html {
  scroll-behavior: smooth;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

p {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

a {
  text-decoration: none;
  transition: all 0.3s ease;
}

img {
  max-width: 100%;
  height: auto;
}

.main-omnichannel-strategie {
  width: 100%;
  background: var(--color-bg-light-primary);
}

.hero-section-omnichannel-strategie {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-omnichannel-strategie::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-omnichannel-strategie::after {
  content: '';
  position: absolute;
  bottom: -25%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-omnichannel-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: clamp(2rem, 4vw, 3rem);
  font-size: 0.875rem;
}

.breadcrumb-link-omnichannel-strategie {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-omnichannel-strategie:hover {
  color: #06b6d4;
}

.breadcrumb-separator-omnichannel-strategie {
  color: #6b7280;
}

.breadcrumb-current-omnichannel-strategie {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.hero-title-omnichannel-strategie {
  font-size: clamp(2rem, 6vw + 0.5rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-omnichannel-strategie {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #9ca3af;
  line-height: 1.6;
  margin: 0;
}

.hero-meta-omnichannel-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.meta-badge-omnichannel-strategie {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-omnichannel-strategie i {
  font-size: 0.875rem;
}

.hero-image-container-omnichannel-strategie {
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.hero-featured-image-omnichannel-strategie {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.intro-section-omnichannel-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.intro-content-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-paragraph-omnichannel-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.25rem;
}

.intro-paragraph-omnichannel-strategie:last-child {
  margin-bottom: 0;
}

.intro-image-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-omnichannel-strategie {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
}

.benefits-section-omnichannel-strategie {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-omnichannel-strategie::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-omnichannel-strategie {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.benefits-title-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.benefits-subtitle-omnichannel-strategie {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-grid-omnichannel-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-card-omnichannel-strategie {
  flex: 1 1 calc(50% - 1rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-omnichannel-strategie:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.benefit-icon-omnichannel-strategie {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.2);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.benefit-title-omnichannel-strategie {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.benefit-text-omnichannel-strategie {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-omnichannel-strategie {
    flex: 1 1 100%;
  }
  
  .intro-content-omnichannel-strategie {
    flex-direction: column;
  }
  
  .intro-text-block-omnichannel-strategie,
  .intro-image-block-omnichannel-strategie {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.channels-section-omnichannel-strategie {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.channels-content-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.channels-text-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.channels-heading-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.channels-paragraph-omnichannel-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.channels-list-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.channel-item-omnichannel-strategie {
  padding: 1.25rem;
  background: #ffffff;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.channel-item-omnichannel-strategie:hover {
  border-color: #06b6d4;
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.1);
}

.channel-item-title-omnichannel-strategie {
  font-size: 1rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.channel-item-text-omnichannel-strategie {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.channels-image-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.channels-image-omnichannel-strategie {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.implementation-section-omnichannel-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.implementation-header-omnichannel-strategie {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
}

.implementation-title-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.implementation-subtitle-omnichannel-strategie {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #4b5563;
  max-width: 600px;
  margin: 0 auto;
}

.implementation-steps-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-item-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.75rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  align-items: flex-start;
}

.step-item-omnichannel-strategie:hover {
  background: #ffffff;
  border-color: #06b6d4;
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.1);
}

.step-number-omnichannel-strategie {
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 80px;
}

.step-content-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}

.step-title-omnichannel-strategie {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin: 0;
}

.step-text-omnichannel-strategie {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

.tools-section-omnichannel-strategie {
  background: linear-gradient(135deg, #042f2e 0%, #064e4a 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.tools-content-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.tools-image-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-image-omnichannel-strategie {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.tools-text-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-heading-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.tools-paragraph-omnichannel-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #a7f3d0;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.tools-list-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.tool-item-omnichannel-strategie {
  padding: 1rem;
  background: rgba(255, 255, 255, 0.05);
  border-left: 3px solid #10b981;
  border-radius: 6px;
  font-size: 0.9375rem;
  color: #ffffff;
  line-height: 1.6;
  transition: all 0.3s ease;
}

.tool-item-omnichannel-strategie:hover {
  background: rgba(255, 255, 255, 0.1);
  padding-left: 1.25rem;
}

.tool-name-omnichannel-strategie {
  color: #10b981;
  font-weight: 600;
}

.quote-section-omnichannel-strategie {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  overflow: hidden;
}

.featured-quote-omnichannel-strategie {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.quote-text-omnichannel-strategie {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-style: italic;
  color: #1e293b;
  margin-bottom: 1rem;
  line-height: 1.7;
}

.quote-author-omnichannel-strategie {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.challenges-section-omnichannel-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.challenges-content-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.challenges-text-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-heading-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.challenges-paragraph-omnichannel-strategie {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #4b5563;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.challenge-item-omnichannel-strategie {
  padding: 1.25rem;
  background: #f8fafc;
  border-radius: 10px;
  margin-bottom: 1rem;
  border-left: 3px solid #ef4444;
  transition: all 0.3s ease;
}

.challenge-item-omnichannel-strategie:hover {
  background: #fff5f5;
  padding-left: 1.5rem;
}

.challenge-title-omnichannel-strategie {
  font-size: 1rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.challenge-text-omnichannel-strategie {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.challenges-image-block-omnichannel-strategie {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-image-omnichannel-strategie {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.cta-section-omnichannel-strategie {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 5rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-omnichannel-strategie::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-omnichannel-strategie::after {
  content: '';
  position: absolute;
  bottom: -20%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-heading-omnichannel-strategie {
  font-size: clamp(1.75rem, 5vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  margin: 0;
}

.cta-paragraph-omnichannel-strategie {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.cta-buttons-omnichannel-strategie {
  display: flex;
  flex-direction: row;
  gap: clamp(1rem, 2vw, 1.5rem);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: clamp(0.5rem, 1vw, 1rem);
}

.cta-button-primary-omnichannel-strategie,
.cta-button-secondary-omnichannel-strategie {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-primary-omnichannel-strategie {
  background: #06b6d4;
  color: #0f172a;
}

.cta-button-primary-omnichannel-strategie:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.cta-button-secondary-omnichannel-strategie {
  background: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
}

.cta-button-secondary-omnichannel-strategie:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.disclaimer-section-omnichannel-strategie {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 4rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.disclaimer-content-omnichannel-strategie {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.disclaimer-title-omnichannel-strategie {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-omnichannel-strategie {
  font-size: 0.9375rem;
  color: #4b5563;
  line-height: 1.8;
  margin: 0;
}

.related-section-omnichannel-strategie {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.related-header-omnichannel-strategie {
  text-align: center;
  margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
}

.related-title-omnichannel-strategie {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-omnichannel-strategie {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #4b5563;
  max-width: 600px;
  margin: 0 auto;
}

.related-cards-omnichannel-strategie {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-omnichannel-strategie {
  flex: 1 1 calc(33.333% - 1.5rem);
  min-width: 280px;
  display: flex;
  flex-direction: column;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-card-omnichannel-strategie:hover {
  transform: translateY(-6px);
  border-color: #06b6d4;
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
}

.related-card-content-omnichannel-strategie {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
}

.related-card-title-omnichannel-strategie {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  line-height: 1.4;
}

.related-card-text-omnichannel-strategie {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-omnichannel-strategie {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  margin-top: 0.5rem;
  transition: all 0.3s ease;
}

.related-card-link-omnichannel-strategie:hover {
  gap: 0.75rem;
  color: #0891b2;
}

@media (max-width: 768px) {
  .hero-section-omnichannel-strategie::before,
  .hero-section-omnichannel-strategie::after,
  .benefits-section-omnichannel-strategie::before,
  .cta-section-omnichannel-strategie::before,
  .cta-section-omnichannel-strategie::after {
    display: none;
  }

  .intro-content-omnichannel-strategie,
  .channels-content-omnichannel-strategie,
  .tools-content-omnichannel-strategie,
  .challenges-content-omnichannel-strategie {
    flex-direction: column;
  }

  .intro-text-block-omnichannel-strategie,
  .intro-image-block-omnichannel-strategie,
  .channels-text-block-omnichannel-strategie,
  .channels-image-block-omnichannel-strategie,
  .tools-image-block-omnichannel-strategie,
  .tools-text-block-omnichannel-strategie,
  .challenges-text-block-omnichannel-strategie,
  .challenges-image-block-omnichannel-strategie {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .benefit-card-omnichannel-strategie {
    flex: 1 1 100%;
  }

  .cta-buttons-omnichannel-strategie {
    flex-direction: column;
  }

  .cta-button-primary-omnichannel-strategie,
  .cta-button-secondary-omnichannel-strategie {
    width: 100%;
  }

  .related-card-omnichannel-strategie {
    flex: 1 1 100%;
    min-width: 100%;
  }

  .step-item-omnichannel-strategie {
    gap: 1rem;
  }

  .step-number-omnichannel-strategie {
    min-width: 60px;
    font-size: 1.75rem;
  }
}

@media (max-width: 480px) {
  .hero-title-omnichannel-strategie {
    font-size: 1.5rem;
  }

  .implementation-title-omnichannel-strategie,
  .benefits-title-omnichannel-strategie,
  .channels-heading-omnichannel-strategie,
  .tools-heading-omnichannel-strategie,
  .challenges-heading-omnichannel-strategie {
    font-size: 1.25rem;
  }

  .meta-badge-omnichannel-strategie {
    font-size: 0.75rem;
    padding: 0.5rem 0.875rem;
  }

  .breadcrumbs-omnichannel-strategie {
    font-size: 0.75rem;
  }
}

.main-blockchain-kryptowaehrungen {
  width: 100%;
  background: var(--color-bg-light-primary);
}

.hero-section-blockchain-kryptowaehrungen {
  background: linear-gradient(135deg, var(--color-bg-dark-primary) 0%, var(--color-bg-dark-secondary) 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-blockchain-kryptowaehrungen::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-blockchain-kryptowaehrungen::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.breadcrumbs-blockchain-kryptowaehrungen {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  transition: color 0.3s ease;
}

.breadcrumb-link-blockchain-kryptowaehrungen:hover {
  color: var(--color-primary);
}

.breadcrumb-separator-blockchain-kryptowaehrungen {
  color: #64748b;
}

.breadcrumb-current-blockchain-kryptowaehrungen {
  color: var(--color-primary);
  font-weight: 600;
}

.hero-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.hero-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, var(--color-primary-hover) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-blockchain-kryptowaehrungen {
  color: var(--color-text-dark-secondary);
  font-size: clamp(1rem, 2vw, 1.25rem);
  max-width: 700px;
  margin: 0 auto;
  line-height: 1.6;
}

.hero-meta-blockchain-kryptowaehrungen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-blockchain-kryptowaehrungen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #cbd5e1;
  border-radius: 20px;
  font-size: 0.875rem;
}

.meta-badge-blockchain-kryptowaehrungen i {
  color: var(--color-primary);
}

.hero-image-blockchain-kryptowaehrungen {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  margin-top: 1rem;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

@media (max-width: 768px) {
  .hero-section-blockchain-kryptowaehrungen {
    padding: clamp(2rem, 6vw, 4rem) 0;
  }

  .breadcrumbs-blockchain-kryptowaehrungen {
    font-size: 0.75rem;
    margin-bottom: 1.5rem;
  }
}

.introduction-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-light-primary);
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.introduction-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.introduction-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.introduction-paragraph-blockchain-kryptowaehrungen {
  color: #475569;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.introduction-image-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 400px;
}

@media (max-width: 768px) {
  .introduction-content-blockchain-kryptowaehrungen {
    flex-direction: column;
  }

  .introduction-text-blockchain-kryptowaehrungen,
  .introduction-image-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.fundamentals-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-dark-primary);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.fundamentals-section-blockchain-kryptowaehrungen::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.fundamentals-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
  position: relative;
  z-index: 1;
}

.fundamentals-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.fundamentals-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  text-align: center;
  margin-bottom: 1rem;
}

.fundamentals-steps-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.fundamentals-step-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.fundamentals-step-blockchain-kryptowaehrungen:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: var(--color-primary);
  transform: translateX(4px);
}

.fundamentals-step-number-blockchain-kryptowaehrungen {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.fundamentals-step-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fundamentals-step-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: 1.125rem;
  font-weight: 600;
}

.fundamentals-step-text-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .fundamentals-step-blockchain-kryptowaehrungen {
    flex-direction: column;
    gap: 1rem;
  }

  .fundamentals-step-number-blockchain-kryptowaehrungen {
    min-width: auto;
  }
}

.applications-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-light-secondary);
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.applications-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.applications-wrapper-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.applications-text-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.applications-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  margin-bottom: 1.5rem;
}

.applications-paragraph-blockchain-kryptowaehrungen {
  color: #475569;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.applications-image-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 400px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .applications-wrapper-blockchain-kryptowaehrungen {
    flex-direction: column;
  }

  .applications-text-blockchain-kryptowaehrungen,
  .applications-image-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.features-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-dark-secondary);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.features-section-blockchain-kryptowaehrungen::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.features-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
  position: relative;
  z-index: 1;
}

.features-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.features-header-blockchain-kryptowaehrungen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto;
}

.features-section-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  margin-bottom: 1rem;
}

.features-section-subtitle-blockchain-kryptowaehrungen {
  color: var(--color-text-dark-secondary);
  font-size: clamp(1rem, 2vw, 1.125rem);
}

.features-grid-blockchain-kryptowaehrungen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.feature-card-blockchain-kryptowaehrungen {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.feature-card-blockchain-kryptowaehrungen:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: var(--color-primary);
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.feature-icon-blockchain-kryptowaehrungen {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(59, 130, 246, 0.2));
  border-radius: 10px;
  color: var(--color-primary);
  font-size: 1.5rem;
}

.feature-card-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: 1.125rem;
  font-weight: 600;
}

.feature-card-text-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .feature-card-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: none;
  }
}

.challenges-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-light-primary);
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.challenges-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.challenges-wrapper-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.challenges-image-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
  max-height: 400px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.challenges-text-blockchain-kryptowaehrungen {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  margin-bottom: 1.5rem;
}

.challenges-paragraph-blockchain-kryptowaehrungen {
  color: #475569;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
  .challenges-wrapper-blockchain-kryptowaehrungen {
    flex-direction: column-reverse;
  }

  .challenges-image-blockchain-kryptowaehrungen,
  .challenges-text-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.insights-section-blockchain-kryptowaehrungen {
  background: linear-gradient(135deg, var(--color-bg-dark-primary) 0%, var(--color-bg-dark-secondary) 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.insights-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
  position: relative;
  z-index: 1;
}

.insights-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}

.featured-quote-blockchain-kryptowaehrungen {
  width: 100%;
  max-width: 800px;
  padding: clamp(2rem, 4vw, 3rem);
  background: rgba(6, 182, 212, 0.1);
  border-left: 4px solid var(--color-primary);
  border-radius: 4px;
  margin: 0;
}

.quote-text-blockchain-kryptowaehrungen {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  color: #ffffff;
  font-style: italic;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-author-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  font-size: 0.875rem;
  font-style: normal;
}

@media (max-width: 768px) {
  .featured-quote-blockchain-kryptowaehrungen {
    padding: clamp(1.5rem, 3vw, 2rem);
  }
}

.future-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-light-secondary);
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.future-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.future-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.future-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  text-align: center;
}

.future-grid-blockchain-kryptowaehrungen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.future-card-blockchain-kryptowaehrungen {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  text-align: center;
  transition: all 0.3s ease;
}

.future-card-blockchain-kryptowaehrungen:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
  border-color: var(--color-primary);
}

.future-card-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: 1.125rem;
  font-weight: 600;
}

.future-card-text-blockchain-kryptowaehrungen {
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .future-card-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-dark-primary);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-blockchain-kryptowaehrungen::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
  position: relative;
  z-index: 1;
}

.conclusion-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
}

.conclusion-text-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  margin: 0;
}

.conclusion-cta-blockchain-kryptowaehrungen {
  margin-top: 1rem;
}

.btn-primary-blockchain-kryptowaehrungen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: var(--color-primary);
  color: #0f172a;
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid var(--color-primary);
}

.btn-primary-blockchain-kryptowaehrungen:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-light-secondary);
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.disclaimer-content-blockchain-kryptowaehrungen {
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-blockchain-kryptowaehrungen {
  color: #0f172a;
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.disclaimer-text-blockchain-kryptowaehrungen {
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

.related-section-blockchain-kryptowaehrungen {
  background: var(--color-bg-dark-secondary);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-section-blockchain-kryptowaehrungen .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.related-content-blockchain-kryptowaehrungen {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

.related-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  text-align: center;
}

.related-subtitle-blockchain-kryptowaehrungen {
  color: var(--color-text-dark-secondary);
  font-size: clamp(1rem, 2vw, 1.125rem);
  text-align: center;
}

.related-cards-blockchain-kryptowaehrungen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.related-card-blockchain-kryptowaehrungen {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.related-card-blockchain-kryptowaehrungen:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: var(--color-primary);
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.related-card-title-blockchain-kryptowaehrungen {
  color: #ffffff;
  font-size: 1.125rem;
  font-weight: 600;
}

.related-card-text-blockchain-kryptowaehrungen {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.related-card-link-blockchain-kryptowaehrungen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-blockchain-kryptowaehrungen i {
  transition: transform 0.3s ease;
}

.related-card-blockchain-kryptowaehrungen:hover .related-card-link-blockchain-kryptowaehrungen i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-blockchain-kryptowaehrungen {
    flex: 1 1 100%;
    max-width: none;
  }

  .related-cards-blockchain-kryptowaehrungen {
    justify-content: flex-start;
  }
}

@media (max-width: 768px) {
  .main-blockchain-kryptowaehrungen {
    background: var(--color-bg-light-primary);
  }
}

@media (max-width: 480px) {
  .hero-title-blockchain-kryptowaehrungen {
    font-size: 1.5rem;
  }

  .hero-subtitle-blockchain-kryptowaehrungen {
    font-size: 1rem;
  }

  .fundamentals-step-number-blockchain-kryptowaehrungen {
    font-size: 1.75rem;
  }
}

.main-ki-maschinelles-lernen {
  width: 100%;
  overflow: hidden;
}

.hero-section-ki-maschinelles-lernen {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-ki-maschinelles-lernen::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-ki-maschinelles-lernen::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-ki-maschinelles-lernen {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-ki-maschinelles-lernen:hover {
  color: #06b6d4;
}

.breadcrumb-separator-ki-maschinelles-lernen {
  color: #6b7280;
}

.breadcrumb-current-ki-maschinelles-lernen {
  color: #06b6d4;
}

.hero-content-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-lg);
  position: relative;
  z-index: 2;
}

.hero-title-ki-maschinelles-lernen {
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  margin: 0;
}

.hero-subtitle-ki-maschinelles-lernen {
  color: #9ca3af;
  font-size: clamp(1rem, 2vw, 1.25rem);
  max-width: 600px;
  margin: 0;
  line-height: 1.6;
}

.article-meta-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-ki-maschinelles-lernen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-ki-maschinelles-lernen i {
  font-size: 1rem;
}

.hero-image-wrapper-ki-maschinelles-lernen {
  width: 100%;
  max-width: 800px;
  margin-top: 2rem;
}

.hero-image-ki-maschinelles-lernen {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}

.intro-section-ki-maschinelles-lernen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.intro-text-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-paragraph-ki-maschinelles-lernen {
  color: #374151;
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  margin: 0;
}

.intro-image-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.intro-image-content-ki-maschinelles-lernen {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.applications-section-ki-maschinelles-lernen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.applications-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.section-tag-ki-maschinelles-lernen {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.applications-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin-bottom: 1rem;
  font-weight: 700;
}

.applications-subtitle-ki-maschinelles-lernen {
  color: #64748b;
  font-size: clamp(1rem, 2vw, 1.125rem);
  margin: 0;
}

.applications-grid-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.application-card-ki-maschinelles-lernen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  transition: all 0.3s ease;
}

.application-card-ki-maschinelles-lernen:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.app-icon-ki-maschinelles-lernen {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.app-card-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.app-card-text-ki-maschinelles-lernen {
  color: #64748b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.benefits-section-ki-maschinelles-lernen {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-ki-maschinelles-lernen::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.benefits-header-ki-maschinelles-lernen .section-tag-ki-maschinelles-lernen {
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
}

.benefits-title-ki-maschinelles-lernen {
  color: #ffffff;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.benefits-wrapper-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.benefits-left-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.benefit-step-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.2);
  transition: all 0.3s ease;
}

.benefit-step-ki-maschinelles-lernen:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.step-number-ki-maschinelles-lernen {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-ki-maschinelles-lernen {
  color: #ffffff;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.step-text-ki-maschinelles-lernen {
  color: #cbd5e1;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.benefits-right-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.benefits-image-ki-maschinelles-lernen {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.implementation-section-ki-maschinelles-lernen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.implementation-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.implementation-header-ki-maschinelles-lernen .section-tag-ki-maschinelles-lernen {
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
}

.implementation-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.implementation-subtitle-ki-maschinelles-lernen {
  color: #64748b;
  font-size: clamp(1rem, 2vw, 1.125rem);
  margin: 0;
}

.implementation-wrapper-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  margin-bottom: 3rem;
}

.implementation-text-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.impl-section-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
}

.impl-text-ki-maschinelles-lernen {
  color: #374151;
  font-size: 0.9375rem;
  line-height: 1.8;
  margin: 0;
}

.implementation-image-ki-maschinelles-lernen {
  flex: 1 1 45%;
}

.impl-image-content-ki-maschinelles-lernen {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.implementation-stats-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.stat-box-ki-maschinelles-lernen {
  flex: 1 1 200px;
  max-width: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid rgba(6, 182, 212, 0.1);
  text-align: center;
}

.stat-number-ki-maschinelles-lernen {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 0.9375rem;
  font-weight: 500;
  margin: 0;
}

.technologies-section-ki-maschinelles-lernen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.technologies-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.technologies-header-ki-maschinelles-lernen .section-tag-ki-maschinelles-lernen {
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
}

.technologies-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.tech-wrapper-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.tech-image-ki-maschinelles-lernen {
  flex: 1 1 45%;
}

.tech-image-content-ki-maschinelles-lernen {
  width: 100%;
  height: auto;
  max-height: 350px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.tech-list-ki-maschinelles-lernen {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.tech-item-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 10px;
  border-left: 4px solid #06b6d4;
  transition: all 0.3s ease;
}

.tech-item-ki-maschinelles-lernen:hover {
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateX(4px);
}

.tech-name-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.tech-desc-ki-maschinelles-lernen {
  color: #64748b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.quote-section-ki-maschinelles-lernen {
  background: linear-gradient(135deg, #111827 0%, #0f172a 100%);
  padding: clamp(3rem, 8vw, 5rem) 0;
  display: flex;
  align-items: center;
}

.featured-quote-ki-maschinelles-lernen {
  max-width: 700px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 4vw, 2.5rem);
  background: rgba(6, 182, 212, 0.08);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
}

.quote-text-ki-maschinelles-lernen {
  color: #ffffff;
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  line-height: 1.8;
  font-style: italic;
  margin: 0 0 1.5rem 0;
}

.quote-author-ki-maschinelles-lernen {
  color: #cbd5e1;
  font-size: 0.875rem;
  font-style: normal;
  display: block;
}

.challenges-section-ki-maschinelles-lernen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.challenges-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.challenges-header-ki-maschinelles-lernen .section-tag-ki-maschinelles-lernen {
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
}

.challenges-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.challenges-grid-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.challenge-card-ki-maschinelles-lernen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.challenge-card-ki-maschinelles-lernen:hover {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
  border-color: #06b6d4;
}

.challenge-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.challenge-text-ki-maschinelles-lernen {
  color: #64748b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.next-steps-section-ki-maschinelles-lernen {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.next-steps-content-ki-maschinelles-lernen {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.next-steps-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.next-steps-intro-ki-maschinelles-lernen {
  color: #64748b;
  font-size: clamp(1rem, 2vw, 1.125rem);
  line-height: 1.8;
  margin: 0;
}

.action-list-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.action-item-ki-maschinelles-lernen {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.action-item-ki-maschinelles-lernen:hover {
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.action-number-ki-maschinelles-lernen {
  font-size: 2rem;
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 50px;
}

.action-text-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.action-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
}

.action-desc-ki-maschinelles-lernen {
  color: #64748b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.cta-box-ki-maschinelles-lernen {
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 16px;
  text-align: center;
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.cta-title-ki-maschinelles-lernen {
  color: #ffffff;
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: 700;
  margin: 0;
}

.cta-text-ki-maschinelles-lernen {
  color: rgba(255, 255, 255, 0.95);
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

.btn-primary-ki-maschinelles-lernen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #ffffff;
  color: #06b6d4;
  border: none;
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.btn-primary-ki-maschinelles-lernen:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.disclaimer-section-ki-maschinelles-lernen {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-box-ki-maschinelles-lernen {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem;
  background: #ffffff;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  border: 1px solid #fed7aa;
}

.disclaimer-title-ki-maschinelles-lernen {
  color: #92400e;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 1rem 0;
}

.disclaimer-text-ki-maschinelles-lernen {
  color: #78350f;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: 0;
}

.related-posts-section-ki-maschinelles-lernen {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-ki-maschinelles-lernen {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.related-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  line-height: 1.2;
  margin: 0;
  font-weight: 700;
}

.related-subtitle-ki-maschinelles-lernen {
  color: #64748b;
  font-size: clamp(1rem, 2vw, 1.125rem);
  margin: 0;
}

.related-posts-grid-ki-maschinelles-lernen {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-post-card-ki-maschinelles-lernen {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-post-card-ki-maschinelles-lernen:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.post-card-image-ki-maschinelles-lernen {
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: #f8fafc;
}

.post-card-image-ki-maschinelles-lernen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.post-card-content-ki-maschinelles-lernen {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
}

.post-card-title-ki-maschinelles-lernen {
  color: #1e293b;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.4;
}

.post-card-text-ki-maschinelles-lernen {
  color: #64748b;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.post-card-link-ki-maschinelles-lernen {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  width: fit-content;
}

.post-card-link-ki-maschinelles-lernen:hover {
  color: #0891b2;
  gap: 0.75rem;
}

.post-card-link-ki-maschinelles-lernen i {
  transition: transform 0.3s ease;
}

.related-post-card-ki-maschinelles-lernen:hover .post-card-link-ki-maschinelles-lernen i {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .intro-content-ki-maschinelles-lernen,
  .implementation-wrapper-ki-maschinelles-lernen,
  .benefits-wrapper-ki-maschinelles-lernen,
  .tech-wrapper-ki-maschinelles-lernen {
    flex-direction: column;
  }

  .intro-text-ki-maschinelles-lernen,
  .intro-image-ki-maschinelles-lernen,
  .implementation-text-ki-maschinelles-lernen,
  .implementation-image-ki-maschinelles-lernen,
  .benefits-left-ki-maschinelles-lernen,
  .benefits-right-ki-maschinelles-lernen,
  .tech-image-ki-maschinelles-lernen,
  .tech-list-ki-maschinelles-lernen {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .applications-grid-ki-maschinelles-lernen,
  .challenges-grid-ki-maschinelles-lernen {
    flex-direction: column;
  }

  .application-card-ki-maschinelles-lernen,
  .challenge-card-ki-maschinelles-lernen,
  .related-post-card-ki-maschinelles-lernen {
    flex: 1 1 100%;
    max-width: none;
  }

  .implementation-stats-ki-maschinelles-lernen {
    flex-direction: column;
    align-items: stretch;
  }

  .stat-box-ki-maschinelles-lernen {
    flex: 1 1 100%;
    max-width: none;
  }

  .action-item-ki-maschinelles-lernen {
    flex-direction: column;
    gap: 1rem;
  }

  .action-number-ki-maschinelles-lernen {
    min-width: auto;
  }
}

@media (max-width: 480px) {
  .hero-title-ki-maschinelles-lernen {
    font-size: 1.5rem;
  }

  .applications-title-ki-maschinelles-lernen,
  .benefits-title-ki-maschinelles-lernen,
  .implementation-title-ki-maschinelles-lernen,
  .challenges-title-ki-maschinelles-lernen,
  .related-title-ki-maschinelles-lernen,
  .next-steps-title-ki-maschinelles-lernen {
    font-size: 1.25rem;
  }

  .benefit-step-ki-maschinelles-lernen {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-ki-maschinelles-lernen {
    min-width: auto;
  }
}

.main-social-listening-sentiment-analyse {
  width: 100%;
  background: #ffffff;
}

.hero-section-social-listening-sentiment-analyse {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-social-listening-sentiment-analyse::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-social-listening-sentiment-analyse::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-social-listening-sentiment-analyse {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  align-items: center;
}

.breadcrumb-link-social-listening-sentiment-analyse {
  color: #94a3b8;
  font-size: 0.875rem;
  transition: color 0.3s ease;
  text-decoration: none;
}

.breadcrumb-link-social-listening-sentiment-analyse:hover {
  color: #06b6d4;
}

.breadcrumb-separator-social-listening-sentiment-analyse {
  color: #64748b;
  font-size: 0.875rem;
}

.breadcrumb-current-social-listening-sentiment-analyse {
  color: #06b6d4;
  font-size: 0.875rem;
  font-weight: 500;
}

.hero-content-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.hero-title-social-listening-sentiment-analyse {
  font-size: clamp(2rem, 5vw + 0.5rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.hero-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw + 0.5rem, 1.375rem);
  color: #cbd5e1;
  max-width: 700px;
  line-height: 1.5;
}

.article-meta-social-listening-sentiment-analyse {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
}

.meta-badge-social-listening-sentiment-analyse {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-social-listening-sentiment-analyse i {
  font-size: 0.875rem;
}

.hero-image-wrapper-social-listening-sentiment-analyse {
  margin-top: 3rem;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.hero-image-social-listening-sentiment-analyse {
  width: 100%;
  height: auto;
  max-height: 450px;
  object-fit: cover;
  display: block;
}

.introduction-section-social-listening-sentiment-analyse {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.introduction-content-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-social-listening-sentiment-analyse {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 3vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.introduction-description-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.introduction-image-social-listening-sentiment-analyse {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-img-social-listening-sentiment-analyse {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
}

@media (max-width: 768px) {
  .introduction-content-social-listening-sentiment-analyse {
    flex-direction: column;
  }

  .introduction-text-social-listening-sentiment-analyse,
  .introduction-image-social-listening-sentiment-analyse {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.benefits-section-social-listening-sentiment-analyse {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-social-listening-sentiment-analyse::before {
  content: '';
  position: absolute;
  top: 0;
  right: -50px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-social-listening-sentiment-analyse {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.benefits-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.benefits-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-cards-social-listening-sentiment-analyse {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.benefit-card-social-listening-sentiment-analyse {
  flex: 1 1 280px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-social-listening-sentiment-analyse:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
}

.benefit-icon-social-listening-sentiment-analyse {
  font-size: 2rem;
  color: #06b6d4;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.benefit-card-title-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.benefit-card-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .benefit-card-social-listening-sentiment-analyse {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-social-listening-sentiment-analyse {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.implementation-header-social-listening-sentiment-analyse {
  text-align: center;
  margin-bottom: 3rem;
}

.implementation-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.implementation-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.steps-container-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.step-item-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.step-item-social-listening-sentiment-analyse:hover {
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateX(4px);
}

.step-number-social-listening-sentiment-analyse {
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  flex-shrink: 0;
  line-height: 1;
  min-width: 60px;
}

.step-content-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.step-title-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.step-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .step-item-social-listening-sentiment-analyse {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-social-listening-sentiment-analyse {
    min-width: auto;
  }
}

.tools-section-social-listening-sentiment-analyse {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.tools-section-social-listening-sentiment-analyse::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.tools-header-social-listening-sentiment-analyse {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.tools-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.tools-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
  max-width: 600px;
  margin: 0 auto;
}

.tools-wrapper-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.tools-text-social-listening-sentiment-analyse {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-description-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.tools-list-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 2rem;
}

.tool-item-social-listening-sentiment-analyse {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.9375rem;
  color: #cbd5e1;
}

.tool-item-social-listening-sentiment-analyse i {
  color: #06b6d4;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.tool-name-social-listening-sentiment-analyse {
  font-weight: 500;
}

.tools-image-social-listening-sentiment-analyse {
  flex: 1 1 50%;
  max-width: 50%;
}

.tools-img-social-listening-sentiment-analyse {
  width: 100%;
  height: auto;
  max-height: 400px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  box-shadow: 0 15px 35px rgba(6, 182, 212, 0.2);
}

@media (max-width: 768px) {
  .tools-wrapper-social-listening-sentiment-analyse {
    flex-direction: column;
  }

  .tools-text-social-listening-sentiment-analyse,
  .tools-image-social-listening-sentiment-analyse {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.best-practices-section-social-listening-sentiment-analyse {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.best-practices-header-social-listening-sentiment-analyse {
  text-align: center;
  margin-bottom: 3rem;
}

.best-practices-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.best-practices-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.practices-grid-social-listening-sentiment-analyse {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.practice-card-social-listening-sentiment-analyse {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.practice-card-social-listening-sentiment-analyse:hover {
  background: #ffffff;
  border-color: #06b6d4;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateY(-4px);
}

.practice-card-title-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.practice-card-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .practice-card-social-listening-sentiment-analyse {
    flex: 1 1 100%;
    max-width: none;
  }
}

.quote-section-social-listening-sentiment-analyse {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.featured-quote-social-listening-sentiment-analyse {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 8px;
  text-align: center;
}

.quote-text-social-listening-sentiment-analyse {
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 600;
  color: #ffffff;
  font-style: italic;
  line-height: 1.6;
  margin-bottom: 1rem;
}

.quote-author-social-listening-sentiment-analyse {
  font-size: 0.9375rem;
  color: #94a3b8;
  font-style: normal;
  display: block;
}

.conclusion-section-social-listening-sentiment-analyse {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-social-listening-sentiment-analyse {
  max-width: 900px;
  margin: 0 auto;
}

.conclusion-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 2rem;
  line-height: 1.2;
}

.conclusion-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.cta-box-social-listening-sentiment-analyse {
  background: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: 16px;
  text-align: center;
  margin-top: 3rem;
}

.cta-title-social-listening-sentiment-analyse {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.cta-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 1.5rem;
}

.cta-button-social-listening-sentiment-analyse {
  display: inline-block;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  color: #06b6d4;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: clamp(0.875rem, 1vw, 1rem);
}

.cta-button-social-listening-sentiment-analyse:hover {
  background: #f1f5f9;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.related-posts-section-social-listening-sentiment-analyse {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-posts-section-social-listening-sentiment-analyse::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.related-header-social-listening-sentiment-analyse {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.related-title-social-listening-sentiment-analyse {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.related-subtitle-social-listening-sentiment-analyse {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
  max-width: 600px;
  margin: 0 auto;
}

.related-cards-social-listening-sentiment-analyse {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.related-card-social-listening-sentiment-analyse {
  flex: 1 1 300px;
  max-width: 400px;
  text-decoration: none;
  display: block;
}

.related-card-content-social-listening-sentiment-analyse {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
  height: 100%;
}

.related-card-social-listening-sentiment-analyse:hover .related-card-content-social-listening-sentiment-analyse {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
}

.related-card-title-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.3;
}

.related-card-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  flex: 1;
}

.related-card-arrow-social-listening-sentiment-analyse {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #06b6d4;
  transition: transform 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-social-listening-sentiment-analyse:hover .related-card-arrow-social-listening-sentiment-analyse {
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-social-listening-sentiment-analyse {
    flex: 1 1 100%;
    max-width: none;
  }
}

.disclaimer-section-social-listening-sentiment-analyse {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-social-listening-sentiment-analyse {
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #3b82f6;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.disclaimer-title-social-listening-sentiment-analyse {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.disclaimer-title-social-listening-sentiment-analyse i {
  color: #3b82f6;
}

.disclaimer-text-social-listening-sentiment-analyse {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.disclaimer-text-social-listening-sentiment-analyse:last-child {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .breadcrumbs-social-listening-sentiment-analyse {
    margin-bottom: 1.5rem;
  }

  .article-meta-social-listening-sentiment-analyse {
    margin-top: 1rem;
  }

  .meta-badge-social-listening-sentiment-analyse {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }

  .hero-image-wrapper-social-listening-sentiment-analyse {
    margin-top: 2rem;
  }
}

@media (max-width: 480px) {
  .hero-title-social-listening-sentiment-analyse {
    font-size: 1.5rem;
  }

  .hero-subtitle-social-listening-sentiment-analyse {
    font-size: 1rem;
  }

  .breadcrumbs-social-listening-sentiment-analyse {
    flex-direction: column;
    gap: 0.25rem;
  }

  .breadcrumb-separator-social-listening-sentiment-analyse {
    display: none;
  }
}

.main-augmented-virtual-reality {
  width: 100%;
  background: #ffffff;
}

.hero-section-augmented-virtual-reality {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-augmented-virtual-reality::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-augmented-virtual-reality::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-augmented-virtual-reality {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-augmented-virtual-reality {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-augmented-virtual-reality:hover {
  color: #06b6d4;
}

.breadcrumb-separator-augmented-virtual-reality {
  color: #475569;
}

.breadcrumb-current-augmented-virtual-reality {
  color: #06b6d4;
  font-weight: 500;
}

.hero-content-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
}

.hero-title-augmented-virtual-reality {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  letter-spacing: -0.02em;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-subtitle-augmented-virtual-reality {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  line-height: 1.6;
}

.hero-meta-augmented-virtual-reality {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-augmented-virtual-reality {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #06b6d4;
}

.meta-badge-augmented-virtual-reality i {
  font-size: 1rem;
}

.hero-image-augmented-virtual-reality {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
  max-height: 450px;
  object-fit: cover;
  display: block;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .hero-section-augmented-virtual-reality {
    padding: 2rem 0;
  }

  .breadcrumbs-augmented-virtual-reality {
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .hero-image-augmented-virtual-reality {
    max-height: 300px;
  }
}

.introduction-section-augmented-virtual-reality {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.introduction-content-augmented-virtual-reality {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-augmented-virtual-reality {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.introduction-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.introduction-paragraph-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.7;
  color: #475569;
}

.introduction-image-augmented-virtual-reality {
  flex: 1 1 50%;
}

.introduction-img-augmented-virtual-reality {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .introduction-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .introduction-content-augmented-virtual-reality {
    flex-direction: column;
  }

  .introduction-text-augmented-virtual-reality,
  .introduction-image-augmented-virtual-reality {
    flex: 1 1 100%;
  }
}

.applications-section-augmented-virtual-reality {
  background: #1e293b;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.applications-section-augmented-virtual-reality::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.applications-header-augmented-virtual-reality {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.applications-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.applications-subtitle-augmented-virtual-reality {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.applications-steps-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  position: relative;
  z-index: 1;
}

.applications-step-augmented-virtual-reality {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.applications-step-augmented-virtual-reality:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateX(8px);
}

.applications-step-number-augmented-virtual-reality {
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 70px;
}

.applications-step-content-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.applications-step-title-augmented-virtual-reality {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
}

.applications-step-text-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  line-height: 1.6;
  color: #cbd5e1;
}

@media (max-width: 768px) {
  .applications-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .applications-step-augmented-virtual-reality {
    flex-direction: column;
    gap: 1rem;
  }

  .applications-step-number-augmented-virtual-reality {
    min-width: auto;
  }
}

.benefits-section-augmented-virtual-reality {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.benefits-content-augmented-virtual-reality {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.benefits-text-augmented-virtual-reality {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.benefits-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.benefits-paragraph-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.7;
  color: #475569;
}

.benefits-list-augmented-virtual-reality {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.benefits-item-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem;
  background: #f1f5f9;
  border-radius: 8px;
}

.benefits-item-icon-augmented-virtual-reality {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 8px;
  color: #06b6d4;
  font-size: 1.25rem;
}

.benefits-item-title-augmented-virtual-reality {
  font-size: 1rem;
  font-weight: 600;
  color: #0f172a;
}

.benefits-item-text-augmented-virtual-reality {
  font-size: 0.875rem;
  line-height: 1.5;
  color: #64748b;
}

.benefits-image-augmented-virtual-reality {
  flex: 1 1 50%;
}

.benefits-img-augmented-virtual-reality {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .benefits-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .benefits-content-augmented-virtual-reality {
    flex-direction: column;
  }

  .benefits-text-augmented-virtual-reality,
  .benefits-image-augmented-virtual-reality {
    flex: 1 1 100%;
  }

  .benefits-list-augmented-virtual-reality {
    grid-template-columns: 1fr;
  }
}

.implementation-section-augmented-virtual-reality {
  background: #0f172a;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-augmented-virtual-reality::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.implementation-header-augmented-virtual-reality {
  text-align: center;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
}

.implementation-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.implementation-subtitle-augmented-virtual-reality {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.implementation-steps-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.implementation-step-augmented-virtual-reality {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.implementation-step-augmented-virtual-reality:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateX(8px);
}

.implementation-step-number-augmented-virtual-reality {
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 70px;
}

.implementation-step-content-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.implementation-step-title-augmented-virtual-reality {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #ffffff;
}

.implementation-step-text-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  line-height: 1.6;
  color: #cbd5e1;
}

@media (max-width: 768px) {
  .implementation-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .implementation-step-augmented-virtual-reality {
    flex-direction: column;
    gap: 1rem;
  }
}

.technology-section-augmented-virtual-reality {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.technology-content-augmented-virtual-reality {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.technology-image-augmented-virtual-reality {
  flex: 1 1 50%;
}

.technology-img-augmented-virtual-reality {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: block;
}

.technology-text-augmented-virtual-reality {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.technology-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.technology-paragraph-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.7;
  color: #475569;
}

.technology-features-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.technology-feature-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.25rem;
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 4px;
}

.technology-feature-title-augmented-virtual-reality {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #0f172a;
}

.technology-feature-text-augmented-virtual-reality {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
}

@media (max-width: 768px) {
  .technology-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .technology-content-augmented-virtual-reality {
    flex-direction: column;
  }

  .technology-image-augmented-virtual-reality,
  .technology-text-augmented-virtual-reality {
    flex: 1 1 100%;
  }
}

.conclusion-section-augmented-virtual-reality {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-section-augmented-virtual-reality::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-section-augmented-virtual-reality::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.conclusion-content-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-augmented-virtual-reality {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  text-align: center;
}

.conclusion-quote-augmented-virtual-reality {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  border-radius: 4px;
  margin: 1rem 0;
}

.conclusion-quote-text-augmented-virtual-reality {
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-style: italic;
  line-height: 1.7;
  color: #cbd5e1;
  margin-bottom: 1rem;
}

.conclusion-quote-author-augmented-virtual-reality {
  font-size: 0.875rem;
  color: #94a3b8;
  font-style: normal;
}

.conclusion-text-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  line-height: 1.8;
  color: #cbd5e1;
}

.conclusion-cta-augmented-virtual-reality {
  background: rgba(6, 182, 212, 0.1);
  border: 1px solid rgba(6, 182, 212, 0.3);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-radius: 12px;
  text-align: center;
  margin-top: 1rem;
}

.conclusion-cta-title-augmented-virtual-reality {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 0.75rem;
}

.conclusion-cta-text-augmented-virtual-reality {
  font-size: clamp(0.9375rem, 1vw, 1rem);
  color: #cbd5e1;
  margin-bottom: 1.5rem;
}

.conclusion-cta-btn-augmented-virtual-reality {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2rem);
  background: #06b6d4;
  color: #0f172a;
  font-weight: 600;
  border-radius: 8px;
  font-size: clamp(0.875rem, 1vw, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
}

.conclusion-cta-btn-augmented-virtual-reality:hover {
  background: #22d3ee;
  transform: translateY(-3px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.4);
}

@media (max-width: 768px) {
  .conclusion-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .conclusion-quote-augmented-virtual-reality {
    padding: 1.25rem;
  }
}

.disclaimer-section-augmented-virtual-reality {
  background: #f1f5f9;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-augmented-virtual-reality {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-augmented-virtual-reality {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-augmented-virtual-reality {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  line-height: 1.7;
  color: #475569;
}

@media (max-width: 768px) {
  .disclaimer-section-augmented-virtual-reality {
    padding: 2rem 0;
  }
}

.related-section-augmented-virtual-reality {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.related-header-augmented-virtual-reality {
  text-align: center;
  margin-bottom: 3rem;
}

.related-title-augmented-virtual-reality {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.75rem;
}

.related-subtitle-augmented-virtual-reality {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #64748b;
}

.related-cards-augmented-virtual-reality {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.related-card-augmented-virtual-reality {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-augmented-virtual-reality:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-content-augmented-virtual-reality {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.related-card-title-augmented-virtual-reality {
  font-size: clamp(1.0625rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
}

.related-card-text-augmented-virtual-reality {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #64748b;
}

.related-card-link-augmented-virtual-reality {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
}

.related-card-link-augmented-virtual-reality:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-section-augmented-virtual-reality {
    padding: 2.5rem 0;
  }

  .related-card-augmented-virtual-reality {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .container {
    padding-left: clamp(1rem, 4vw, 1.5rem);
    padding-right: clamp(1rem, 4vw, 1.5rem);
  }
}

@media (max-width: 480px) {
  .hero-title-augmented-virtual-reality {
    font-size: 1.5rem;
  }

  .applications-step-number-augmented-virtual-reality,
  .implementation-step-number-augmented-virtual-reality {
    font-size: 1.75rem;
    min-width: 60px;
  }

  .hero-meta-augmented-virtual-reality {
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
  }

  .meta-badge-augmented-virtual-reality {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }
}

.main-growth-hacking-techniken {
  width: 100%;
}

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

.breadcrumbs-growth-hacking-techniken {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-growth-hacking-techniken {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-growth-hacking-techniken:hover {
  color: #06b6d4;
}

.breadcrumb-separator-growth-hacking-techniken {
  color: #64748b;
  margin: 0 0.25rem;
}

.breadcrumb-current-growth-hacking-techniken {
  color: #06b6d4;
  font-weight: 600;
}

.hero-section-growth-hacking-techniken {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-growth-hacking-techniken::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-growth-hacking-techniken::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-growth-hacking-techniken {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
  position: relative;
  z-index: 1;
}

.hero-title-growth-hacking-techniken {
  font-size: clamp(2rem, 6vw, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-growth-hacking-techniken {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  line-height: 1.6;
}

.hero-meta-growth-hacking-techniken {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1rem 0;
}

.meta-badge-growth-hacking-techniken {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-growth-hacking-techniken i {
  font-size: 1rem;
}

.hero-image-wrapper-growth-hacking-techniken {
  width: 100%;
  max-width: 100%;
  border-radius: 16px;
  overflow: hidden;
}

.hero-featured-image-growth-hacking-techniken {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
}

.intro-section-growth-hacking-techniken {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-content-growth-hacking-techniken {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-growth-hacking-techniken {
  flex: 1 1 400px;
  max-width: 600px;
}

.intro-lead-growth-hacking-techniken {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #1e293b;
  line-height: 1.8;
  font-weight: 500;
  margin-bottom: 1.5rem;
}

.intro-description-growth-hacking-techniken {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.intro-highlight-growth-hacking-techniken {
  flex: 1 1 300px;
  min-width: 300px;
}

.highlight-box-growth-hacking-techniken {
  background: #f8fafc;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.highlight-title-growth-hacking-techniken {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
}

.highlight-list-growth-hacking-techniken {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.highlight-item-growth-hacking-techniken {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  color: #475569;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.highlight-item-growth-hacking-techniken::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  font-size: 1.25rem;
}

.content-section-1-growth-hacking-techniken {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.content-wrapper-1-growth-hacking-techniken {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-1-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-1-growth-hacking-techniken {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.section-text-1-growth-hacking-techniken {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.section-text-1-growth-hacking-techniken:last-child {
  margin-bottom: 0;
}

.content-image-1-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-img-growth-hacking-techniken {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  object-fit: cover;
}

.quote-section-growth-hacking-techniken {
  background: #1f2937;
  padding: clamp(3rem, 8vw, 5rem) 0;
  position: relative;
  overflow: hidden;
}

.featured-quote-growth-hacking-techniken {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.05);
  border-radius: 8px;
}

.quote-text-growth-hacking-techniken {
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  color: #ffffff;
  line-height: 1.8;
  font-style: italic;
  margin-bottom: 1rem;
}

.quote-cite-growth-hacking-techniken {
  font-size: 0.9375rem;
  color: #9ca3af;
  font-style: normal;
  display: block;
}

.content-section-2-growth-hacking-techniken {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.content-wrapper-2-growth-hacking-techniken {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-image-2-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.content-text-2-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-2-growth-hacking-techniken {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.section-text-2-growth-hacking-techniken {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.section-text-2-growth-hacking-techniken:last-child {
  margin-bottom: 0;
}

.methods-section-growth-hacking-techniken {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.methods-section-growth-hacking-techniken::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.methods-header-growth-hacking-techniken {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 4rem);
  position: relative;
  z-index: 1;
}

.methods-title-growth-hacking-techniken {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.methods-subtitle-growth-hacking-techniken {
  font-size: clamp(0.875rem, 2vw, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.methods-grid-growth-hacking-techniken {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.method-card-growth-hacking-techniken {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.method-card-growth-hacking-techniken:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.method-icon-growth-hacking-techniken {
  font-size: 2rem;
  color: #06b6d4;
}

.method-title-growth-hacking-techniken {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
}

.method-text-growth-hacking-techniken {
  font-size: clamp(0.875rem, 1vw, 0.9375rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.content-section-3-growth-hacking-techniken {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.content-wrapper-3-growth-hacking-techniken {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.content-text-3-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.section-title-3-growth-hacking-techniken {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.section-text-3-growth-hacking-techniken {
  font-size: clamp(0.9375rem, 1vw, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin-bottom: 1.5rem;
}

.section-text-3-growth-hacking-techniken:last-child {
  margin-bottom: 0;
}

.content-image-3-growth-hacking-techniken {
  flex: 1 1 50%;
  max-width: 50%;
}

.implementation-section-growth-hacking-techniken {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.implementation-header-growth-hacking-techniken {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 4rem);
}

.implementation-title-growth-hacking-techniken {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.implementation-subtitle-growth-hacking-techniken {
  font-size: clamp(0.875rem, 2vw, 1.125rem);
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.steps-container-growth-hacking-techniken {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
}

.step-item-growth-hacking-techniken {
  display: flex;
  gap: clamp(1.5rem, 3vw, 2rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
  transition: all 0.3s ease;
}

.step-item-growth-hacking-techniken:hover {
  background: #f1f5f9;
  transform: translateX(4px);
}

.step-number-growth-hacking-techniken {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-growth-hacking-techniken {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-growth-hacking-techniken {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.step-text-growth-hacking-techniken {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.cta-section-growth-hacking-techniken {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-growth-hacking-techniken::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-section-growth-hacking-techniken::after {
  content: '';
  position: absolute;
  bottom: -30%;
  right: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-growth-hacking-techniken {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-growth-hacking-techniken {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.cta-text-growth-hacking-techniken {
  font-size: clamp(0.9375rem, 1.5vw, 1.125rem);
  color: #cbd5e1;
  line-height: 1.8;
  margin: 0;
}

.cta-buttons-growth-hacking-techniken {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.cta-btn-primary-growth-hacking-techniken,
.cta-btn-secondary-growth-hacking-techniken {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1.25rem) clamp(1.5rem, 4vw, 2.5rem);
  font-size: clamp(0.875rem, 1.5vw, 1rem);
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.cta-btn-primary-growth-hacking-techniken {
  background: #06b6d4;
  color: #0f172a;
}

.cta-btn-primary-growth-hacking-techniken:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(6, 182, 212, 0.3);
}

.cta-btn-secondary-growth-hacking-techniken {
  background: transparent;
  border-color: #ffffff;
  color: #ffffff;
}

.cta-btn-secondary-growth-hacking-techniken:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: #06b6d4;
  color: #06b6d4;
}

.disclaimer-section-growth-hacking-techniken {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-growth-hacking-techniken {
  max-width: 900px;
  margin: 0 auto;
}

.disclaimer-title-growth-hacking-techniken {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-growth-hacking-techniken {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-growth-hacking-techniken {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
  overflow: hidden;
}

.related-header-growth-hacking-techniken {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 4rem);
}

.related-title-growth-hacking-techniken {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.related-subtitle-growth-hacking-techniken {
  font-size: clamp(0.875rem, 2vw, 1.125rem);
  color: #64748b;
}

.related-cards-growth-hacking-techniken {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

.related-card-growth-hacking-techniken {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.related-card-growth-hacking-techniken:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.15);
  border-color: #06b6d4;
}

.related-card-image-growth-hacking-techniken {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  overflow: hidden;
}

.related-card-image-growth-hacking-techniken img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-content-growth-hacking-techniken {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex-grow: 1;
}

.related-card-title-growth-hacking-techniken {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.related-card-description-growth-hacking-techniken {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-growth-hacking-techniken {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-growth-hacking-techniken:hover {
  color: #0891b2;
  gap: 0.75rem;
}

@media (max-width: 768px) {
  .content-wrapper-1-growth-hacking-techniken,
  .content-wrapper-2-growth-hacking-techniken,
  .content-wrapper-3-growth-hacking-techniken {
    flex-direction: column;
  }

  .content-text-1-growth-hacking-techniken,
  .content-image-1-growth-hacking-techniken,
  .content-text-2-growth-hacking-techniken,
  .content-image-2-growth-hacking-techniken,
  .content-text-3-growth-hacking-techniken,
  .content-image-3-growth-hacking-techniken {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .intro-content-growth-hacking-techniken {
    flex-direction: column;
  }

  .intro-text-growth-hacking-techniken,
  .intro-highlight-growth-hacking-techniken {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .cta-buttons-growth-hacking-techniken {
    flex-direction: column;
    width: 100%;
  }

  .cta-btn-primary-growth-hacking-techniken,
  .cta-btn-secondary-growth-hacking-techniken {
    width: 100%;
  }

  .related-card-growth-hacking-techniken {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .method-card-growth-hacking-techniken {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .step-item-growth-hacking-techniken {
    flex-direction: column;
    align-items: flex-start;
  }
}

.main-micro-moments-mobile-first {
  width: 100%;
  overflow: hidden;
}

.breadcrumbs-micro-moments-mobile-first {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-micro-moments-mobile-first {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-micro-moments-mobile-first:hover {
  color: #06b6d4;
}

.breadcrumb-separator-micro-moments-mobile-first {
  color: #64748b;
}

.breadcrumb-current-micro-moments-mobile-first {
  color: #06b6d4;
  font-weight: 600;
}

.hero-section-micro-moments-mobile-first {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-micro-moments-mobile-first::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-micro-moments-mobile-first::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 2;
}

.hero-text-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.hero-title-micro-moments-mobile-first {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-micro-moments-mobile-first {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 600;
  color: #06b6d4;
  line-height: 1.3;
}

.hero-description-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #cbd5e1;
}

.hero-meta-micro-moments-mobile-first {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.meta-badge-micro-moments-mobile-first {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  border-radius: 20px;
  font-size: 0.875rem;
  color: #cbd5e1;
}

.meta-badge-micro-moments-mobile-first i {
  color: #06b6d4;
  font-size: 1rem;
}

.hero-buttons-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.btn-primary-micro-moments-mobile-first {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #000000;
  border-radius: 12px;
  border: 2px solid transparent;
  transition: all 0.3s ease;
  text-decoration: none;
  cursor: pointer;
}

.btn-primary-micro-moments-mobile-first:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.btn-outline-light-micro-moments-mobile-first {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  font-weight: 600;
  background: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
  border-radius: 12px;
  transition: all 0.3s ease;
  text-decoration: none;
  cursor: pointer;
}

.btn-outline-light-micro-moments-mobile-first:hover {
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-2px);
}

.hero-image-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
}

.hero-image-micro-moments-mobile-first {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

@media (max-width: 768px) {
  .hero-content-micro-moments-mobile-first {
    flex-direction: column;
  }

  .hero-text-block-micro-moments-mobile-first,
  .hero-image-block-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .hero-buttons-micro-moments-mobile-first {
    flex-direction: column;
  }

  .btn-primary-micro-moments-mobile-first,
  .btn-outline-light-micro-moments-mobile-first {
    width: 100%;
  }
}

.intro-section-micro-moments-mobile-first {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.intro-content-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.intro-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  line-height: 1.2;
  color: #0f172a;
}

.intro-paragraph-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.intro-image-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-micro-moments-mobile-first {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
}

@media (max-width: 768px) {
  .intro-content-micro-moments-mobile-first {
    flex-direction: column;
  }

  .intro-text-block-micro-moments-mobile-first,
  .intro-image-block-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.moments-section-micro-moments-mobile-first {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.moments-header-micro-moments-mobile-first {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.section-tag-micro-moments-mobile-first {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.moments-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.moments-subtitle-micro-moments-mobile-first {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.moments-grid-micro-moments-mobile-first {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.moment-card-micro-moments-mobile-first {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.moment-card-micro-moments-mobile-first:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.moment-number-micro-moments-mobile-first {
  font-size: 2.5rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.moment-card-title-micro-moments-mobile-first {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}

.moment-card-text-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

.moment-card-tip-micro-moments-mobile-first {
  font-size: 0.875rem;
  color: #06b6d4;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(6, 182, 212, 0.2);
  margin: 0;
}

@media (max-width: 768px) {
  .moment-card-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategy-section-micro-moments-mobile-first {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.strategy-content-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.strategy-text-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.strategy-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.strategy-paragraph-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.strategy-highlight-micro-moments-mobile-first {
  padding: 1.5rem;
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  margin: 1rem 0;
}

.highlight-text-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #1e293b;
  margin: 0;
  font-style: italic;
}

.strategy-subtitle-micro-moments-mobile-first {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #0f172a;
  margin-top: 1rem;
}

.strategy-list-micro-moments-mobile-first {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.strategy-list-item-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #475569;
  padding-left: 1.5rem;
  position: relative;
}

.strategy-list-item-micro-moments-mobile-first::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: 700;
}

.strategy-image-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
}

.strategy-image-micro-moments-mobile-first {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
}

@media (max-width: 768px) {
  .strategy-content-micro-moments-mobile-first {
    flex-direction: column-reverse;
  }

  .strategy-text-block-micro-moments-mobile-first,
  .strategy-image-block-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-micro-moments-mobile-first {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-header-micro-moments-mobile-first {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.implementation-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.implementation-subtitle-micro-moments-mobile-first {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.steps-container-micro-moments-mobile-first {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-item-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  align-items: flex-start;
  transition: all 0.3s ease;
  flex-direction: column;
}

.step-item-micro-moments-mobile-first:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateX(8px);
}

.step-number-micro-moments-mobile-first {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 800;
  color: #06b6d4;
  line-height: 1;
  min-width: 80px;
  text-align: center;
}

.step-title-micro-moments-mobile-first {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.step-text-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .step-item-micro-moments-mobile-first {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-micro-moments-mobile-first {
    text-align: left;
    min-width: auto;
  }
}

.success-section-micro-moments-mobile-first {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.success-content-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.success-image-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
}

.success-image-micro-moments-mobile-first {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.1);
}

.success-text-block-micro-moments-mobile-first {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.success-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.success-paragraph-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.success-metrics-micro-moments-mobile-first {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  padding: 2rem;
  background: #f8fafc;
  border-radius: 12px;
  margin: 1rem 0;
}

.metric-item-micro-moments-mobile-first {
  flex: 1 1 150px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.metric-number-micro-moments-mobile-first {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.metric-label-micro-moments-mobile-first {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.4;
  margin: 0;
}

.success-conclusion-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
  font-weight: 500;
}

@media (max-width: 768px) {
  .success-content-micro-moments-mobile-first {
    flex-direction: column;
  }

  .success-image-block-micro-moments-mobile-first,
  .success-text-block-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .success-metrics-micro-moments-mobile-first {
    flex-direction: column;
  }

  .metric-item-micro-moments-mobile-first {
    flex: 1 1 100%;
  }
}

.cta-section-micro-moments-mobile-first {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
  overflow: hidden;
}

.cta-section-micro-moments-mobile-first::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cta-content-micro-moments-mobile-first {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
  max-width: 700px;
  margin: 0 auto;
}

.cta-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.cta-text-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.cta-buttons-micro-moments-mobile-first {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1rem;
}

@media (max-width: 768px) {
  .cta-buttons-micro-moments-mobile-first {
    flex-direction: column;
    width: 100%;
  }

  .cta-buttons-micro-moments-mobile-first .btn-primary-micro-moments-mobile-first,
  .cta-buttons-micro-moments-mobile-first .btn-outline-light-micro-moments-mobile-first {
    width: 100%;
  }
}

.disclaimer-section-micro-moments-mobile-first {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-micro-moments-mobile-first {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-micro-moments-mobile-first {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-micro-moments-mobile-first {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.7;
  color: #64748b;
  margin: 0;
}

.related-section-micro-moments-mobile-first {
  background: #111827;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.related-header-micro-moments-mobile-first {
  text-align: center;
  max-width: 700px;
  margin: 0 auto clamp(3rem, 6vw, 4rem);
}

.related-title-micro-moments-mobile-first {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.related-subtitle-micro-moments-mobile-first {
  font-size: clamp(1rem, 2vw, 1.125rem);
  color: #94a3b8;
}

.related-grid-micro-moments-mobile-first {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-micro-moments-mobile-first {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-micro-moments-mobile-first:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-8px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.2);
}

.related-card-image-micro-moments-mobile-first {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  overflow: hidden;
}

.related-card-image-micro-moments-mobile-first img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.related-card-title-micro-moments-mobile-first {
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  line-height: 1.3;
}

.related-card-description-micro-moments-mobile-first {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

.related-card-link-micro-moments-mobile-first {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.related-card-link-micro-moments-mobile-first:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-card-micro-moments-mobile-first {
    flex: 1 1 100%;
    max-width: none;
  }
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

@media (max-width: 768px) {
  .hero-buttons-micro-moments-mobile-first,
  .cta-buttons-micro-moments-mobile-first {
    flex-direction: column;
  }

  .hero-buttons-micro-moments-mobile-first .btn-primary-micro-moments-mobile-first,
  .hero-buttons-micro-moments-mobile-first .btn-outline-light-micro-moments-mobile-first,
  .cta-buttons-micro-moments-mobile-first .btn-primary-micro-moments-mobile-first,
  .cta-buttons-micro-moments-mobile-first .btn-outline-light-micro-moments-mobile-first {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .hero-title-micro-moments-mobile-first {
    font-size: 1.5rem;
  }

  .moments-title-micro-moments-mobile-first,
  .strategy-title-micro-moments-mobile-first,
  .implementation-title-micro-moments-mobile-first,
  .success-title-micro-moments-mobile-first,
  .cta-title-micro-moments-mobile-first,
  .related-title-micro-moments-mobile-first {
    font-size: 1.25rem;
  }
}

.main-b2b-ecommerce-grosshandel {
  width: 100%;
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 4vw, 2rem);
}

section,
[class*="-section-b2b-ecommerce-grosshandel"] {
  width: 100%;
  overflow: hidden;
}

.hero-section-b2b-ecommerce-grosshandel {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(4rem, 8vw, 8rem) 0;
  position: relative;
}

.hero-section-b2b-ecommerce-grosshandel::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-b2b-ecommerce-grosshandel::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-b2b-ecommerce-grosshandel {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-b2b-ecommerce-grosshandel {
  color: #94a3b8;
  transition: color 0.3s ease;
}

.breadcrumb-link-b2b-ecommerce-grosshandel:hover {
  color: #06b6d4;
}

.breadcrumb-separator-b2b-ecommerce-grosshandel {
  color: #64748b;
}

.breadcrumb-current-b2b-ecommerce-grosshandel {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2rem;
  position: relative;
  z-index: 2;
}

.hero-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #ffffff;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-b2b-ecommerce-grosshandel {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 600px;
  margin: 0 auto;
}

.hero-stats-b2b-ecommerce-grosshandel {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  justify-content: center;
  margin: 1rem 0;
}

.stat-block-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
}

.stat-number-b2b-ecommerce-grosshandel {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-b2b-ecommerce-grosshandel {
  font-size: 0.875rem;
  color: #9ca3af;
}

.hero-image-b2b-ecommerce-grosshandel {
  width: 100%;
  max-width: 600px;
  margin-top: 2rem;
}

.hero-image-b2b-ecommerce-grosshandel img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
}

@media (max-width: 768px) {
  .hero-stats-b2b-ecommerce-grosshandel {
    gap: 1.5rem;
  }
}

.introduction-section-b2b-ecommerce-grosshandel {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.intro-content-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-heading-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-paragraph-b2b-ecommerce-grosshandel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #4b5563;
  margin-bottom: 1.5rem;
}

.intro-paragraph-b2b-ecommerce-grosshandel:last-child {
  margin-bottom: 0;
}

.intro-image-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-image-b2b-ecommerce-grosshandel img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .intro-content-b2b-ecommerce-grosshandel {
    flex-direction: column;
  }

  .intro-text-b2b-ecommerce-grosshandel,
  .intro-image-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.core-models-section-b2b-ecommerce-grosshandel {
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.core-models-section-b2b-ecommerce-grosshandel::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -20%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.section-header-b2b-ecommerce-grosshandel {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.section-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.section-description-b2b-ecommerce-grosshandel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
}

.models-wrapper-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.model-left-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.model-step-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.model-step-b2b-ecommerce-grosshandel:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
}

.step-number-b2b-ecommerce-grosshandel {
  font-size: 2.5rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  flex-shrink: 0;
  min-width: 60px;
  line-height: 1;
}

.step-content-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.step-text-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

.model-image-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.model-image-b2b-ecommerce-grosshandel img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .models-wrapper-b2b-ecommerce-grosshandel {
    flex-direction: column;
  }

  .model-left-b2b-ecommerce-grosshandel,
  .model-image-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategic-advantages-section-b2b-ecommerce-grosshandel {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.advantages-header-b2b-ecommerce-grosshandel {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.advantages-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.advantages-subtitle-b2b-ecommerce-grosshandel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
}

.advantages-wrapper-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.advantages-text-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.advantage-item-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.advantage-heading-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.advantage-text-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
  margin: 0;
}

.advantages-image-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.advantages-image-b2b-ecommerce-grosshandel img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .advantages-wrapper-b2b-ecommerce-grosshandel {
    flex-direction: column;
  }

  .advantages-text-b2b-ecommerce-grosshandel,
  .advantages-image-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.implementation-section-b2b-ecommerce-grosshandel {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.implementation-section-b2b-ecommerce-grosshandel::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.implementation-header-b2b-ecommerce-grosshandel {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
  position: relative;
  z-index: 1;
}

.implementation-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
}

.implementation-subtitle-b2b-ecommerce-grosshandel {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #cbd5e1;
}

.steps-container-b2b-ecommerce-grosshandel {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 1;
}

.step-card-b2b-ecommerce-grosshandel {
  flex: 1 1 calc(50% - 0.75rem);
  max-width: 450px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.step-card-b2b-ecommerce-grosshandel:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.step-number-circle-b2b-ecommerce-grosshandel {
  font-size: 2.5rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  width: fit-content;
}

.step-card-title-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #ffffff;
}

.step-card-text-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .step-card-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.challenges-section-b2b-ecommerce-grosshandel {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
}

.challenges-wrapper-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.challenges-text-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.challenges-intro-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
  margin-bottom: 2rem;
}

.challenge-block-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #e2e8f0;
}

.challenge-block-b2b-ecommerce-grosshandel:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.challenge-name-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.challenge-description-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
  margin: 0;
}

.challenges-image-b2b-ecommerce-grosshandel {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-image-b2b-ecommerce-grosshandel img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .challenges-wrapper-b2b-ecommerce-grosshandel {
    flex-direction: column;
  }

  .challenges-text-b2b-ecommerce-grosshandel,
  .challenges-image-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

.conclusion-section-b2b-ecommerce-grosshandel {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(5rem, 8vw, 8rem) 0;
  position: relative;
}

.conclusion-section-b2b-ecommerce-grosshandel::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, rgba(6, 182, 212, 0.3), transparent);
  transform: translateX(-50%);
}

.conclusion-content-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}

.conclusion-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.75rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.conclusion-text-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
}

.conclusion-quote-b2b-ecommerce-grosshandel {
  padding: 2rem 2.5rem;
  border-left: 4px solid #06b6d4;
  background: rgba(6, 182, 212, 0.08);
  margin: 1rem 0;
  border-radius: 8px;
}

.quote-text-b2b-ecommerce-grosshandel {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-style: italic;
  color: #ffffff;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.quote-source-b2b-ecommerce-grosshandel {
  font-size: 0.875rem;
  color: #9ca3af;
  font-style: normal;
}

.conclusion-final-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #cbd5e1;
}

.conclusion-cta-b2b-ecommerce-grosshandel {
  margin-top: 1.5rem;
}

.cta-button-b2b-ecommerce-grosshandel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 3vw, 2.5rem);
  font-size: clamp(0.875rem, 1vw, 1rem);
  font-weight: 600;
  background: #06b6d4;
  color: #0f172a;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.cta-button-b2b-ecommerce-grosshandel:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-b2b-ecommerce-grosshandel {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-box-b2b-ecommerce-grosshandel {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  border-left: 4px solid #f59e0b;
}

.disclaimer-title-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1rem;
}

.disclaimer-text-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
  margin: 0;
}

.related-section-b2b-ecommerce-grosshandel {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 8rem) 0;
  border-top: 1px solid #e2e8f0;
}

.related-header-b2b-ecommerce-grosshandel {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 3rem;
}

.related-title-b2b-ecommerce-grosshandel {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.related-subtitle-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  color: #64748b;
}

.related-grid-b2b-ecommerce-grosshandel {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  justify-content: center;
}

.related-card-b2b-ecommerce-grosshandel {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.related-card-b2b-ecommerce-grosshandel:hover {
  border-color: #06b6d4;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.15);
  transform: translateY(-4px);
}

.card-content-b2b-ecommerce-grosshandel {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.card-title-b2b-ecommerce-grosshandel {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0f172a;
}

.card-description-b2b-ecommerce-grosshandel {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
  margin: 0;
}

.card-link-b2b-ecommerce-grosshandel {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

.card-link-b2b-ecommerce-grosshandel:hover {
  color: #0891b2;
  gap: 0.75rem;
}

@media (max-width: 768px) {
  .related-card-b2b-ecommerce-grosshandel {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .breadcrumbs-b2b-ecommerce-grosshandel {
    font-size: 0.8125rem;
  }

  .hero-stats-b2b-ecommerce-grosshandel {
    flex-direction: column;
    gap: 1.5rem;
  }
}

@media (max-width: 480px) {
  .hero-title-b2b-ecommerce-grosshandel {
    font-size: 1.5rem;
  }

  .section-title-b2b-ecommerce-grosshandel {
    font-size: 1.25rem;
  }

  .stat-number-b2b-ecommerce-grosshandel {
    font-size: 1.5rem;
  }
}

.main-kundenlebenszyklus-retention {
  width: 100%;
}

.hero-section-kundenlebenszyklus-retention {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-kundenlebenszyklus-retention::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-kundenlebenszyklus-retention::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.hero-title-kundenlebenszyklus-retention {
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
  background: linear-gradient(135deg, #ffffff 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-kundenlebenszyklus-retention {
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  margin: 0;
}

.hero-stats-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 4rem);
  justify-content: center;
  margin-top: 1rem;
}

.stat-item-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
}

.stat-number-kundenlebenszyklus-retention {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.stat-label-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #cbd5e1;
  font-weight: 500;
}

.hero-image-kundenlebenszyklus-retention {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 12px;
  margin-top: 1rem;
  object-fit: cover;
}

.breadcrumbs-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-kundenlebenszyklus-retention {
  color: #06b6d4;
  text-decoration: none;
  transition: color 0.2s ease;
}

.breadcrumb-link-kundenlebenszyklus-retention:hover {
  color: #22d3ee;
}

.breadcrumb-separator-kundenlebenszyklus-retention {
  color: #6b7280;
}

.breadcrumb-current-kundenlebenszyklus-retention {
  color: #9ca3af;
}

.intro-section-kundenlebenszyklus-retention {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.intro-content-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
}

.intro-text-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
}

.intro-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.intro-paragraph-kundenlebenszyklus-retention {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.intro-image-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
}

.phases-section-kundenlebenszyklus-retention {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.phases-header-kundenlebenszyklus-retention {
  text-align: center;
  margin-bottom: 3rem;
}

.phases-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1rem;
}

.phases-subtitle-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.phases-grid-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.phase-card-kundenlebenszyklus-retention {
  flex: 1 1 calc(50% - 1rem);
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.phase-card-kundenlebenszyklus-retention:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
}

.phase-number-kundenlebenszyklus-retention {
  font-size: 2rem;
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.phase-title-kundenlebenszyklus-retention {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  color: #1e293b;
  margin: 0;
}

.phase-text-kundenlebenszyklus-retention {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.phase-list-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.phase-list-item-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #475569;
  padding-left: 1.5rem;
  position: relative;
}

.phase-list-item-kundenlebenszyklus-retention::before {
  content: '';
  position: absolute;
  left: 0;
  color: #06b6d4;
  font-weight: bold;
}

@media (max-width: 768px) {
  .phase-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }

  .intro-content-kundenlebenszyklus-retention {
    flex-direction: column;
  }

  .intro-text-kundenlebenszyklus-retention,
  .intro-image-kundenlebenszyklus-retention {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.optimization-section-kundenlebenszyklus-retention {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.optimization-section-kundenlebenszyklus-retention::before {
  content: '';
  position: absolute;
  top: 0;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.optimization-wrapper-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  position: relative;
  z-index: 1;
}

.optimization-image-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
}

.optimization-text-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.optimization-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.optimization-block-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.optimization-subtitle-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #06b6d4;
  margin: 0;
  font-weight: 600;
}

.optimization-paragraph-kundenlebenszyklus-retention {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .optimization-wrapper-kundenlebenszyklus-retention {
    flex-direction: column;
  }

  .optimization-image-kundenlebenszyklus-retention,
  .optimization-text-kundenlebenszyklus-retention {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.metrics-section-kundenlebenszyklus-retention {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.metrics-header-kundenlebenszyklus-retention {
  text-align: center;
  margin-bottom: 3rem;
}

.metrics-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  margin-bottom: 1rem;
}

.metrics-subtitle-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #64748b;
  max-width: 600px;
  margin: 0 auto;
}

.metrics-grid-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.metric-card-kundenlebenszyklus-retention {
  flex: 1 1 calc(50% - 1rem);
  min-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #f8fafc;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}

.metric-label-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin: 0;
}

.metric-items-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.metric-item-kundenlebenszyklus-retention {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  background: #ffffff;
  border-radius: 8px;
  border-left: 3px solid #06b6d4;
}

.metric-name-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #475569;
  font-weight: 500;
}

.metric-icon-kundenlebenszyklus-retention {
  font-size: 1.25rem;
}

@media (max-width: 768px) {
  .metric-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }
}

.implementation-section-kundenlebenszyklus-retention {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.implementation-wrapper-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: clamp(2rem, 4vw, 4rem);
}

.implementation-text-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.implementation-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  margin: 0;
  line-height: 1.2;
}

.implementation-step-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #ffffff;
  border-radius: 12px;
  border-left: 4px solid #06b6d4;
}

.step-number-kundenlebenszyklus-retention {
  font-size: 1.5rem;
  font-weight: 800;
  color: #06b6d4;
  min-width: 50px;
  text-align: center;
}

.step-content-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.step-title-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #1e293b;
  margin: 0;
  font-weight: 600;
}

.step-text-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

.implementation-image-kundenlebenszyklus-retention {
  flex: 1 1 50%;
  max-width: 50%;
  width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .implementation-wrapper-kundenlebenszyklus-retention {
    flex-direction: column;
  }

  .implementation-text-kundenlebenszyklus-retention,
  .implementation-image-kundenlebenszyklus-retention {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.tools-section-kundenlebenszyklus-retention {
  background: #111827;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.tools-header-kundenlebenszyklus-retention {
  text-align: center;
  margin-bottom: 3rem;
}

.tools-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #ffffff;
  margin-bottom: 1rem;
}

.tools-subtitle-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.tools-grid-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.tool-card-kundenlebenszyklus-retention {
  flex: 1 1 calc(50% - 1rem);
  min-width: 250px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.tool-card-kundenlebenszyklus-retention:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.tool-name-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #06b6d4;
  margin: 0;
  font-weight: 600;
}

.tool-description-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .tool-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }
}

.conclusion-section-kundenlebenszyklus-retention {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.conclusion-content-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.conclusion-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  margin: 0;
  line-height: 1.2;
}

.conclusion-text-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #475569;
  line-height: 1.8;
  margin: 0;
}

.conclusion-quote-kundenlebenszyklus-retention {
  padding: 2rem;
  background: #f8fafc;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  font-style: italic;
}

.quote-text-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #1e293b;
  line-height: 1.6;
  margin: 0 0 1rem;
}

.quote-author-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.conclusion-closing-kundenlebenszyklus-retention {
  font-size: 1rem;
  color: #475569;
  line-height: 1.8;
  margin: 0;
}

.conclusion-cta-kundenlebenszyklus-retention {
  margin-top: 1rem;
}

.cta-button-kundenlebenszyklus-retention {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
  background: #06b6d4;
  color: #000000;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-kundenlebenszyklus-retention:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-kundenlebenszyklus-retention {
  background: #f8fafc;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid #e2e8f0;
}

.disclaimer-content-kundenlebenszyklus-retention {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-left: 4px solid #fbbf24;
  border-radius: 8px;
}

.disclaimer-title-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #111827;
  margin: 0 0 1rem;
  font-weight: 600;
}

.disclaimer-text-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.related-section-kundenlebenszyklus-retention {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
}

.related-title-kundenlebenszyklus-retention {
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.5rem);
  color: #111827;
  text-align: center;
  margin-bottom: 3rem;
}

.related-grid-kundenlebenszyklus-retention {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-card-kundenlebenszyklus-retention {
  flex: 1 1 calc(33.333% - 1rem);
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: #f8fafc;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.related-card-kundenlebenszyklus-retention:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(6, 182, 212, 0.1);
}

.related-image-kundenlebenszyklus-retention {
  width: 100%;
  height: 250px;
  object-fit: cover;
}

.related-content-kundenlebenszyklus-retention {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.related-card-title-kundenlebenszyklus-retention {
  font-size: 1.125rem;
  color: #1e293b;
  margin: 0;
  font-weight: 600;
  line-height: 1.3;
}

.related-card-text-kundenlebenszyklus-retention {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-link-kundenlebenszyklus-retention {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #06b6d4;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.875rem;
  transition: all 0.2s ease;
  margin-top: 0.5rem;
}

.related-link-kundenlebenszyklus-retention:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 1024px) {
  .related-card-kundenlebenszyklus-retention {
    flex: 1 1 calc(50% - 0.75rem);
  }
}

@media (max-width: 768px) {
  .related-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }

  .metrics-grid-kundenlebenszyklus-retention,
  .tools-grid-kundenlebenszyklus-retention {
    gap: 1rem;
  }

  .metric-card-kundenlebenszyklus-retention,
  .tool-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }
}

@media (max-width: 480px) {
  .hero-title-kundenlebenszyklus-retention {
    font-size: 1.5rem;
  }

  .hero-stats-kundenlebenszyklus-retention {
    gap: 1.5rem;
  }

  .stat-number-kundenlebenszyklus-retention {
    font-size: 1.75rem;
  }

  .phases-grid-kundenlebenszyklus-retention {
    gap: 1rem;
  }

  .phase-card-kundenlebenszyklus-retention {
    flex: 1 1 100%;
  }
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding-left: clamp(1rem, 4vw, 2rem);
  padding-right: clamp(1rem, 4vw, 2rem);
}

.main-digitale-transformation-modernisierung {
  width: 100%;
}

.hero-section-digitale-transformation-modernisierung {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-digitale-transformation-modernisierung::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -15%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-digitale-transformation-modernisierung::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-content-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 3vw, 2rem);
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.breadcrumbs-digitale-transformation-modernisierung {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: clamp(0.75rem, 1vw, 0.875rem);
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}

.breadcrumb-link-digitale-transformation-modernisierung {
  color: #06b6d4;
  text-decoration: none;
  transition: color 0.3s ease;
}

.breadcrumb-link-digitale-transformation-modernisierung:hover {
  color: #22d3ee;
}

.breadcrumb-separator-digitale-transformation-modernisierung {
  color: #9ca3af;
}

.breadcrumb-current-digitale-transformation-modernisierung {
  color: #cbd5e1;
}

.hero-title-digitale-transformation-modernisierung {
  font-size: clamp(2rem, 5vw + 0.5rem, 3.5rem);
  color: #ffffff;
  line-height: 1.15;
  margin: 0;
  background: linear-gradient(135deg, #ffffff 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.hero-subtitle-digitale-transformation-modernisierung {
  font-size: clamp(1rem, 2vw + 0.25rem, 1.25rem);
  color: #9ca3af;
  max-width: 700px;
  margin: 0;
  line-height: 1.6;
}

.hero-meta-digitale-transformation-modernisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.75rem, 2vw, 1rem);
  justify-content: center;
  margin: clamp(0.5rem, 1vw, 1rem) 0;
}

.meta-badge-digitale-transformation-modernisierung {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.meta-badge-digitale-transformation-modernisierung i {
  font-size: 0.875rem;
}

.hero-image-digitale-transformation-modernisierung {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  margin-top: clamp(1rem, 2vw, 2rem);
  box-shadow: 0 20px 40px rgba(6, 182, 212, 0.2);
  display: block;
}

.intro-section-digitale-transformation-modernisierung {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.intro-wrapper-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.intro-text-digitale-transformation-modernisierung {
  flex: 1 1 45%;
  max-width: 50%;
}

.intro-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.intro-description-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.0625rem);
  color: #475569;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
}

.intro-text-block-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.0625rem);
  color: #64748b;
  line-height: 1.7;
  margin: 0;
}

.intro-image-digitale-transformation-modernisierung {
  flex: 1 1 50%;
  max-width: 50%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  display: block;
}

@media (max-width: 768px) {
  .intro-wrapper-digitale-transformation-modernisierung {
    flex-direction: column;
  }

  .intro-text-digitale-transformation-modernisierung,
  .intro-image-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.benefits-section-digitale-transformation-modernisierung {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.benefits-section-digitale-transformation-modernisierung::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.benefits-header-digitale-transformation-modernisierung {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
  position: relative;
  z-index: 1;
}

.benefits-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.benefits-subtitle-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.benefits-cards-digitale-transformation-modernisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  z-index: 1;
}

.benefit-card-digitale-transformation-modernisierung {
  flex: 1 1 280px;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.benefit-card-digitale-transformation-modernisierung:hover {
  border-color: #06b6d4;
  background: rgba(6, 182, 212, 0.12);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
}

.benefit-number-digitale-transformation-modernisierung {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.benefit-title-digitale-transformation-modernisierung {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #ffffff;
  font-weight: 600;
  margin: 0;
}

.benefit-text-digitale-transformation-modernisierung {
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .benefit-card-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.strategies-section-digitale-transformation-modernisierung {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.strategies-wrapper-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: flex-start;
}

.strategies-image-digitale-transformation-modernisierung {
  flex: 1 1 45%;
  max-width: 50%;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(6, 182, 212, 0.1);
  display: block;
  height: auto;
}

.strategies-content-digitale-transformation-modernisierung {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.strategies-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  margin: 0;
  line-height: 1.2;
}

.strategy-step-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1rem, 2vw, 1.5rem);
  background: #ffffff;
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.strategy-step-digitale-transformation-modernisierung:hover {
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
  transform: translateX(4px);
}

.step-number-digitale-transformation-modernisierung {
  font-size: 0.875rem;
  font-weight: 700;
  color: #06b6d4;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.step-title-digitale-transformation-modernisierung {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin: 0;
}

.step-text-digitale-transformation-modernisierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 768px) {
  .strategies-wrapper-digitale-transformation-modernisierung {
    flex-direction: column;
  }

  .strategies-image-digitale-transformation-modernisierung,
  .strategies-content-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.challenges-section-digitale-transformation-modernisierung {
  background: #111827;
  padding: clamp(5rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.challenges-header-digitale-transformation-modernisierung {
  text-align: center;
  margin-bottom: clamp(3rem, 6vw, 4rem);
}

.challenges-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.75rem);
  color: #ffffff;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.challenges-subtitle-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.125rem);
  color: #9ca3af;
  max-width: 600px;
  margin: 0 auto;
}

.challenges-wrapper-digitale-transformation-modernisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: clamp(3rem, 5vw, 4rem);
}

.challenge-item-digitale-transformation-modernisierung {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.challenge-item-digitale-transformation-modernisierung:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.challenge-name-digitale-transformation-modernisierung {
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 600;
  margin: 0;
}

.challenge-solution-digitale-transformation-modernisierung {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.challenges-image-digitale-transformation-modernisierung {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(6, 182, 212, 0.15);
  display: block;
}

@media (max-width: 768px) {
  .challenge-item-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

.quote-section-digitale-transformation-modernisierung {
  background: #f8fafc;
  padding: clamp(4rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.featured-quote-digitale-transformation-modernisierung {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid #06b6d4;
  background: #ffffff;
  border-radius: 8px;
  text-align: center;
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.1);
}

.quote-text-digitale-transformation-modernisierung {
  font-size: clamp(1.125rem, 2vw + 0.25rem, 1.5rem);
  color: #1e293b;
  font-style: italic;
  line-height: 1.7;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  font-weight: 500;
}

.quote-author-digitale-transformation-modernisierung {
  font-size: 0.9375rem;
  color: #64748b;
  font-style: normal;
  font-weight: 500;
}

.implementation-section-digitale-transformation-modernisierung {
  background: #0f172a;
  padding: clamp(5rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-section-digitale-transformation-modernisierung::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.implementation-wrapper-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  position: relative;
  z-index: 1;
}

.implementation-content-digitale-transformation-modernisierung {
  flex: 1 1 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.implementation-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.implementation-intro-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.0625rem);
  color: #cbd5e1;
  line-height: 1.7;
  margin: 0;
}

.implementation-list-digitale-transformation-modernisierung {
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1vw, 1.25rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.implementation-item-digitale-transformation-modernisierung {
  display: flex;
  gap: 1rem;
  font-size: clamp(0.875rem, 1vw, 1rem);
  color: #cbd5e1;
  line-height: 1.6;
}

.item-icon-digitale-transformation-modernisierung {
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.implementation-image-digitale-transformation-modernisierung {
  flex: 1 1 45%;
  max-width: 50%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(6, 182, 212, 0.15);
  display: block;
}

@media (max-width: 768px) {
  .implementation-wrapper-digitale-transformation-modernisierung {
    flex-direction: column;
  }

  .implementation-content-digitale-transformation-modernisierung,
  .implementation-image-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.conclusion-section-digitale-transformation-modernisierung {
  background: #ffffff;
  padding: clamp(5rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.conclusion-content-digitale-transformation-modernisierung {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.conclusion-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  color: #0f172a;
  margin: 0;
  line-height: 1.2;
  text-align: center;
}

.conclusion-text-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.0625rem);
  color: #475569;
  line-height: 1.8;
  margin: 0;
}

.conclusion-cta-digitale-transformation-modernisierung {
  display: flex;
  justify-content: center;
  margin-top: clamp(1rem, 2vw, 1.5rem);
}

.cta-button-digitale-transformation-modernisierung {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: clamp(0.875rem, 1.5vw, 1.125rem) clamp(1.5rem, 3vw, 2rem);
  background: #06b6d4;
  color: #000000;
  font-weight: 600;
  font-size: clamp(0.9375rem, 1vw, 1rem);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-button-digitale-transformation-modernisierung:hover {
  background: #22d3ee;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(6, 182, 212, 0.3);
}

.cta-button-digitale-transformation-modernisierung i {
  font-size: 0.875rem;
  transition: transform 0.3s ease;
}

.cta-button-digitale-transformation-modernisierung:hover i {
  transform: translateX(4px);
}

.disclaimer-section-digitale-transformation-modernisierung {
  background: #0f172a;
  padding: clamp(3rem, 6vw, 4rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.1);
  overflow: hidden;
}

.disclaimer-content-digitale-transformation-modernisierung {
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border-left: 4px solid #06b6d4;
  border-radius: 8px;
}

.disclaimer-title-digitale-transformation-modernisierung {
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 600;
  margin: 0 0 0.75rem 0;
}

.disclaimer-text-digitale-transformation-modernisierung {
  font-size: 0.9375rem;
  color: #cbd5e1;
  line-height: 1.6;
  margin: 0;
}

.related-section-digitale-transformation-modernisierung {
  background: #f8fafc;
  padding: clamp(5rem, 8vw, 6rem) 0;
  overflow: hidden;
}

.related-title-digitale-transformation-modernisierung {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 2.5rem);
  color: #0f172a;
  text-align: center;
  margin: 0 0 clamp(0.5rem, 1vw, 0.75rem) 0;
}

.related-subtitle-digitale-transformation-modernisierung {
  font-size: clamp(0.9375rem, 1vw + 0.25rem, 1.125rem);
  color: #64748b;
  text-align: center;
  margin: 0 0 clamp(2rem, 4vw, 3rem) 0;
}

.related-cards-digitale-transformation-modernisierung {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  justify-content: center;
}

.related-card-digitale-transformation-modernisierung {
  flex: 1 1 300px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: clamp(1.5rem, 3vw, 2rem);
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
  text-decoration: none;
}

.related-card-digitale-transformation-modernisierung:hover {
  border-color: #06b6d4;
  box-shadow: 0 12px 32px rgba(6, 182, 212, 0.15);
  transform: translateY(-6px);
}

.related-card-image-digitale-transformation-modernisierung {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}

.related-card-title-digitale-transformation-modernisierung {
  font-size: 1.125rem;
  color: #1e293b;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
}

.related-card-description-digitale-transformation-modernisierung {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.related-card-link-digitale-transformation-modernisierung {
  display: inline-flex;
  align-items: center;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: auto;
}

.related-card-link-digitale-transformation-modernisierung:hover {
  color: #22d3ee;
  gap: 0.5rem;
}

@media (max-width: 768px) {
  .related-card-digitale-transformation-modernisierung {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (min-width: 768px) {
  .hero-section-digitale-transformation-modernisierung {
    padding: clamp(4rem, 8vw, 8rem) 0;
  }

  .intro-section-digitale-transformation-modernisierung,
  .benefits-section-digitale-transformation-modernisierung,
  .strategies-section-digitale-transformation-modernisierung,
  .challenges-section-digitale-transformation-modernisierung,
  .implementation-section-digitale-transformation-modernisierung,
  .conclusion-section-digitale-transformation-modernisierung {
    padding: clamp(5rem, 8vw, 8rem) 0;
  }
}

@media (max-width: 480px) {
  .hero-title-digitale-transformation-modernisierung {
    font-size: 1.5rem;
  }

  .breadcrumbs-digitale-transformation-modernisierung {
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .meta-badge-digitale-transformation-modernisierung {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
  }
}

.main-white-label-dropshipping {
  width: 100%;
  background: #ffffff;
}

.hero-section-white-label-dropshipping {
  background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.hero-section-white-label-dropshipping::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-section-white-label-dropshipping::after {
  content: '';
  position: absolute;
  bottom: -20%;
  left: 10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.1) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.breadcrumbs-white-label-dropshipping {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
}

.breadcrumb-link-white-label-dropshipping {
  color: #9ca3af;
  transition: color 0.3s ease;
}

.breadcrumb-link-white-label-dropshipping:hover {
  color: #06b6d4;
}

.breadcrumb-separator-white-label-dropshipping {
  color: #6b7280;
}

.breadcrumb-current-white-label-dropshipping {
  color: #06b6d4;
  font-weight: 600;
}

.hero-content-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  z-index: 2;
  gap: 1.5rem;
}

.hero-title-white-label-dropshipping {
  font-size: clamp(2rem, 5vw + 1rem, 3.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.15;
}

.hero-subtitle-white-label-dropshipping {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #cbd5e1;
  max-width: 700px;
  margin: 0;
}

.hero-meta-white-label-dropshipping {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 1rem 0;
}

.meta-badge-white-label-dropshipping {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: rgba(6, 182, 212, 0.1);
  color: #06b6d4;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 500;
}

.hero-image-white-label-dropshipping {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  max-height: 400px;
  object-fit: cover;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
  .hero-section-white-label-dropshipping {
    padding: 2.5rem 0;
  }
  
  .hero-meta-white-label-dropshipping {
    flex-direction: column;
  }
}

.introduction-section-white-label-dropshipping {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.introduction-content-white-label-dropshipping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.introduction-text-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
}

.introduction-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.introduction-description-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0 0 1.5rem 0;
}

.introduction-image-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
}

.introduction-image-white-label-dropshipping {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .introduction-content-white-label-dropshipping {
    flex-direction: column;
  }
  
  .introduction-text-white-label-dropshipping,
  .introduction-image-white-label-dropshipping {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.advantages-section-white-label-dropshipping {
  background: #1f2937;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.advantages-header-white-label-dropshipping {
  text-align: center;
  margin-bottom: 3rem;
}

.advantages-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.advantages-subtitle-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
}

.advantages-grid-white-label-dropshipping {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.advantage-card-white-label-dropshipping {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.advantage-card-white-label-dropshipping:hover {
  background: rgba(6, 182, 212, 0.12);
  border-color: #06b6d4;
  transform: translateY(-4px);
}

.advantage-icon-white-label-dropshipping {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 10px;
  color: #06b6d4;
  font-size: 1.5rem;
}

.advantage-card-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.advantage-card-text-white-label-dropshipping {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .advantage-card-white-label-dropshipping {
    flex: 1 1 100%;
    max-width: none;
  }
}

.white-label-section-white-label-dropshipping {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.white-label-wrapper-white-label-dropshipping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.white-label-image-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
}

.white-label-image-white-label-dropshipping {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.white-label-text-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
}

.white-label-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.white-label-description-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0 0 1.5rem 0;
}

.white-label-cta-white-label-dropshipping {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: #06b6d4;
  color: #000000;
  border-radius: 10px;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  text-decoration: none;
}

.white-label-cta-white-label-dropshipping:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

@media (max-width: 768px) {
  .white-label-wrapper-white-label-dropshipping {
    flex-direction: column;
  }
  
  .white-label-image-white-label-dropshipping,
  .white-label-text-white-label-dropshipping {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.implementation-section-white-label-dropshipping {
  background: #111827;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.implementation-header-white-label-dropshipping {
  text-align: center;
  margin-bottom: 3rem;
}

.implementation-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.implementation-subtitle-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
}

.implementation-steps-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 900px;
  margin: 0 auto;
}

.implementation-step-white-label-dropshipping {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  align-items: flex-start;
  padding: 1.5rem;
  background: rgba(6, 182, 212, 0.05);
  border: 1px solid rgba(6, 182, 212, 0.15);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.implementation-step-white-label-dropshipping:hover {
  background: rgba(6, 182, 212, 0.1);
  border-color: rgba(6, 182, 212, 0.3);
}

.implementation-step-number-white-label-dropshipping {
  font-size: clamp(2rem, 3vw, 2.5rem);
  font-weight: 800;
  background: linear-gradient(135deg, #06b6d4, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.implementation-step-content-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.implementation-step-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.implementation-step-text-white-label-dropshipping {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .implementation-step-white-label-dropshipping {
    flex-direction: column;
  }
}

.challenges-section-white-label-dropshipping {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.challenges-content-white-label-dropshipping {
  display: flex;
  flex-direction: row;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}

.challenges-text-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
}

.challenges-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.challenges-description-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0 0 1.5rem 0;
}

.challenges-quote-white-label-dropshipping {
  padding: 1.5rem;
  border-left: 4px solid #06b6d4;
  background: #f1f5f9;
  border-radius: 8px;
  margin: 1.5rem 0;
}

.challenges-quote-text-white-label-dropshipping {
  font-size: clamp(1rem, 2vw, 1.125rem);
  font-style: italic;
  color: #1e293b;
  margin: 0 0 0.75rem 0;
  line-height: 1.6;
}

.challenges-quote-author-white-label-dropshipping {
  font-size: 0.875rem;
  color: #64748b;
  font-style: normal;
}

.challenges-image-white-label-dropshipping {
  flex: 1 1 50%;
  max-width: 50%;
  max-height: 350px;
}

.challenges-image-white-label-dropshipping {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
  .challenges-content-white-label-dropshipping {
    flex-direction: column;
  }
  
  .challenges-text-white-label-dropshipping,
  .challenges-image-white-label-dropshipping {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.strategy-section-white-label-dropshipping {
  background: #1f2937;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.strategy-header-white-label-dropshipping {
  text-align: center;
  margin-bottom: 3rem;
}

.strategy-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.5rem;
}

.strategy-subtitle-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #9ca3af;
}

.strategy-highlights-white-label-dropshipping {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: clamp(1.5rem, 3vw, 2rem);
}

.strategy-highlight-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: rgba(59, 130, 246, 0.08);
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.strategy-highlight-white-label-dropshipping:hover {
  background: rgba(59, 130, 246, 0.12);
  border-color: rgba(59, 130, 246, 0.4);
  transform: translateY(-4px);
}

.strategy-highlight-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

.strategy-highlight-text-white-label-dropshipping {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
}

@media (max-width: 768px) {
  .strategy-highlights-white-label-dropshipping {
    grid-template-columns: 1fr;
  }
}

.conclusion-section-white-label-dropshipping {
  background: #ffffff;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.conclusion-content-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 800px;
  margin: 0 auto;
}

.conclusion-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
}

.conclusion-description-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  color: #475569;
  margin: 0;
}

.conclusion-highlight-box-white-label-dropshipping {
  padding: 1.5rem;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  margin: 1rem 0;
}

.conclusion-box-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 1rem 0;
}

.conclusion-checklist-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.conclusion-checklist-item-white-label-dropshipping {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  color: #475569;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
}

.conclusion-checklist-item-white-label-dropshipping::before {
  content: '';
  color: #06b6d4;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.conclusion-cta-white-label-dropshipping {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 1.75rem;
  background: #06b6d4;
  color: #000000;
  border-radius: 10px;
  font-weight: 600;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  transition: all 0.3s ease;
  text-decoration: none;
  width: fit-content;
  margin-top: 1rem;
}

.conclusion-cta-white-label-dropshipping:hover {
  background: #22d3ee;
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(6, 182, 212, 0.3);
}

.disclaimer-section-white-label-dropshipping {
  background: #111827;
  padding: clamp(2rem, 6vw, 4rem) 0;
  border-top: 1px solid rgba(6, 182, 212, 0.15);
}

.disclaimer-content-white-label-dropshipping {
  max-width: 800px;
  margin: 0 auto;
}

.disclaimer-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 1rem;
}

.disclaimer-text-white-label-dropshipping {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.7;
  color: #cbd5e1;
  margin: 0;
}

.related-posts-section-white-label-dropshipping {
  background: #f8fafc;
  padding: clamp(3rem, 8vw, 6rem) 0;
  position: relative;
  overflow: hidden;
}

.related-posts-header-white-label-dropshipping {
  text-align: center;
  margin-bottom: 3rem;
}

.related-posts-title-white-label-dropshipping {
  font-size: clamp(1.5rem, 4vw + 0.5rem, 2.5rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.related-posts-subtitle-white-label-dropshipping {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  color: #64748b;
}

.related-posts-grid-white-label-dropshipping {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2rem);
}

.related-post-card-white-label-dropshipping {
  flex: 1 1 300px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  transition: all 0.3s ease;
  overflow: hidden;
}

.related-post-card-white-label-dropshipping:hover {
  border-color: #06b6d4;
  box-shadow: 0 12px 24px rgba(6, 182, 212, 0.15);
  transform: translateY(-6px);
}

.related-post-image-white-label-dropshipping {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}

.related-post-content-white-label-dropshipping {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex-grow: 1;
}

.related-post-title-white-label-dropshipping {
  font-size: clamp(1.125rem, 2vw, 1.25rem);
  font-weight: 600;
  color: #0f172a;
  margin: 0;
  line-height: 1.3;
}

.related-post-description-white-label-dropshipping {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  line-height: 1.6;
  color: #64748b;
  margin: 0;
  flex-grow: 1;
}

.related-post-link-white-label-dropshipping {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  color: #06b6d4;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all 0.3s ease;
  text-decoration: none;
  width: fit-content;
  margin-top: 0.5rem;
}

.related-post-link-white-label-dropshipping:hover {
  color: #22d3ee;
  transform: translateX(4px);
}

@media (max-width: 768px) {
  .related-post-card-white-label-dropshipping {
    flex: 1 1 100%;
    max-width: none;
  }
}

@media (max-width: 768px) {
  .container {
    padding-inline: clamp(1rem, 4vw, 2rem);
  }

  .strategy-highlights-white-label-dropshipping {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .breadcrumbs-white-label-dropshipping {
    font-size: 0.75rem;
  }

  .hero-meta-white-label-dropshipping {
    gap: 0.5rem;
  }

  .meta-badge-white-label-dropshipping {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
  }
}

:root {
  --color-bg-dark-primary: #0a0f1e;
  --color-bg-dark-secondary: #0d1526;
  --color-bg-dark-tertiary: #111d2f;
  --color-bg-light-primary: #ffffff;
  --color-bg-light-secondary: #f8fafc;
  --color-text-dark-primary: #ffffff;
  --color-text-dark-secondary: #94a3b8;
  --color-text-light-primary: #1e293b;
  --color-text-light-secondary: #64748b;
  --color-primary: #14b8a6;
  --color-primary-hover: #2dd4bf;
  --color-accent: #99f6e4;
  --font-primary: 'Inter', sans-serif;
  --font-heading: 'Playfair Display', serif;
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.15);
  --radius-md: 8px;
  --radius-lg: 12px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-primary);
  line-height: 1.6;
  overflow-x: hidden;
}

.container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(1rem, 5vw, 2rem);
}

.ecommerce-journey-about {
  background: var(--color-bg-dark-primary);
  color: var(--color-text-dark-primary);
  overflow-x: hidden;
}

.hero-section-about {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-dark-primary);
  position: relative;
  overflow: hidden;
}

.hero-content-about {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
  align-items: flex-start;
}

.hero-title-about {
  font-family: var(--font-heading);
  font-size: clamp(2.25rem, 6vw, 4rem);
  font-weight: 800;
  line-height: 1.15;
  color: var(--color-text-dark-primary);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.hero-description-about {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: var(--color-accent);
  max-width: 600px;
  line-height: 1.7;
}

.hero-stats-about {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2rem, 4vw, 3.5rem);
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(20, 184, 166, 0.2);
}

.stat-item-about {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.stat-number-about {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
}

.stat-label-about {
  font-size: 0.875rem;
  color: var(--color-text-dark-secondary);
  font-weight: 500;
}

.hero-image-about {
  width: 100%;
  max-width: 800px;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  margin-top: 1rem;
}

.mission-section-about {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-dark-secondary);
  position: relative;
  overflow: hidden;
}

.mission-content-about {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.mission-header-about {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 700px;
}

.section-tag-about {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(20, 184, 166, 0.15);
  color: var(--color-primary);
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  width: fit-content;
}

.mission-title-about {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  line-height: 1.2;
}

.mission-description-about {
  font-size: clamp(0.95rem, 1.5vw, 1.125rem);
  color: var(--color-text-dark-secondary);
  line-height: 1.8;
  max-width: 750px;
}

.mission-visual-about {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  margin-top: 1rem;
}

.expertise-section-about {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-dark-tertiary);
  position: relative;
  overflow: hidden;
}

.expertise-content-about {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.expertise-header-about {
  text-align: center;
  max-width: 700px;
  margin: 0 auto;
}

.expertise-title-about {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  margin-bottom: 1rem;
  line-height: 1.2;
}

.expertise-intro-about {
  font-size: clamp(0.95rem, 1.5vw, 1.125rem);
  color: var(--color-text-dark-secondary);
  line-height: 1.8;
}

.pillars-grid-about {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  margin-top: 2rem;
}

.pillar-card-about {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  background: rgba(20, 184, 166, 0.08);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(20, 184, 166, 0.15);
  transition: all 0.3s ease;
}

.pillar-card-about:hover {
  transform: translateY(-5px);
  background: rgba(20, 184, 166, 0.12);
  border-color: rgba(20, 184, 166, 0.25);
}

.pillar-icon-about {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(20, 184, 166, 0.2);
  border-radius: var(--radius-md);
  color: var(--color-primary);
  font-size: 1.75rem;
}

.pillar-title-about {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text-dark-primary);
}

.pillar-text-about {
  font-size: 0.9375rem;
  color: var(--color-text-dark-secondary);
  line-height: 1.7;
}

.approach-section-about {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-dark-secondary);
  position: relative;
  overflow: hidden;
}

.approach-content-about {
  display: flex;
  flex-direction: column;
  gap: clamp(2.5rem, 5vw, 4rem);
}

.approach-intro-about {
  max-width: 800px;
}

.approach-tag-about {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(20, 184, 166, 0.15);
  color: var(--color-primary);
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.approach-title-about {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.approach-description-about {
  font-size: clamp(0.95rem, 1.5vw, 1.125rem);
  color: var(--color-text-dark-secondary);
  line-height: 1.8;
}

.steps-container-about {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.step-card-about {
  display: flex;
  align-items: flex-start;
  gap: clamp(1.5rem, 3vw, 2rem);
  padding: clamp(1.5rem, 3vw, 2rem);
  background: rgba(20, 184, 166, 0.08);
  border-radius: var(--radius-lg);
  border-left: 3px solid var(--color-primary);
}

.step-number-about {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: var(--color-primary);
  line-height: 1;
  flex-shrink: 0;
  min-width: 60px;
}

.step-content-about {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.step-title-about {
  font-size: clamp(1.1rem, 2vw, 1.3rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
}

.step-text-about {
  font-size: 0.9375rem;
  color: var(--color-text-dark-secondary);
  line-height: 1.7;
}

.vision-section-about {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-dark-primary);
  position: relative;
  overflow: hidden;
}

.vision-content-about {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
  align-items: center;
  text-align: center;
}

.vision-tag-about {
  display: inline-block;
  padding: 0.375rem 1rem;
  background: rgba(20, 184, 166, 0.15);
  color: var(--color-primary);
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
}

.vision-title-about {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  max-width: 700px;
  line-height: 1.2;
}

.vision-text-about {
  font-size: clamp(0.95rem, 1.5vw, 1.125rem);
  color: var(--color-text-dark-secondary);
  max-width: 750px;
  line-height: 1.8;
}

.featured-quote-about {
  padding: clamp(2rem, 4vw, 3rem);
  border-left: 4px solid var(--color-primary);
  background: rgba(20, 184, 166, 0.08);
  margin: clamp(1.5rem, 3vw, 2.5rem) 0;
  border-radius: var(--radius-md);
}

.featured-quote-text-about {
  font-size: clamp(1.1rem, 2vw, 1.375rem);
  font-style: italic;
  color: var(--color-text-dark-primary);
  margin-bottom: 1rem;
  line-height: 1.7;
}

.featured-quote-author-about {
  font-size: 0.875rem;
  color: var(--color-accent);
  font-style: normal;
}

.cta-section-about {
  padding: clamp(2.5rem, 6vw, 4rem);
  background: linear-gradient(135deg, rgba(20, 184, 166, 0.15), rgba(153, 246, 228, 0.08));
  border-radius: var(--radius-lg);
  border: 1px solid rgba(20, 184, 166, 0.2);
  text-align: center;
}

.cta-title-about {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: var(--color-text-dark-primary);
  margin-bottom: 1rem;
}

.cta-text-about {
  font-size: 1rem;
  color: var(--color-text-dark-secondary);
  margin-bottom: 1.5rem;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.cta-link-about {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 2rem;
  background: var(--color-primary);
  color: var(--color-bg-dark-primary);
  text-decoration: none;
  border-radius: var(--radius-md);
  font-weight: 600;
  transition: all 0.3s ease;
  font-size: 1rem;
}

.cta-link-about:hover {
  background: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(20, 184, 166, 0.3);
}

.disclaimer-section-about {
  padding: clamp(2.5rem, 6vw, 4rem) 0;
  background: var(--color-bg-dark-tertiary);
  position: relative;
  overflow: hidden;
}

.disclaimer-content-about {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 800px;
  margin: 0 auto;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: rgba(20, 184, 166, 0.05);
  border-radius: var(--radius-lg);
  border-left: 3px solid var(--color-primary);
}

.disclaimer-header-about {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.disclaimer-icon-about {
  font-size: 1.5rem;
  color: var(--color-primary);
  flex-shrink: 0;
}

.disclaimer-title-about {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-dark-primary);
}

.disclaimer-text-about {
  font-size: 0.9375rem;
  color: var(--color-text-dark-secondary);
  line-height: 1.8;
}

.approach-image-about {
  width: 100%;
  max-width: 700px;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  margin-top: 1rem;
}

.vision-image-about {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: var(--radius-lg);
  display: block;
  margin-top: 1.5rem;
}

@media (max-width: 768px) {
  .hero-stats-about {
    gap: clamp(1.5rem, 3vw, 2.5rem);
  }

  .pillar-card-about {
    flex: 1 1 100%;
    max-width: none;
  }

  .step-card-about {
    flex-direction: column;
    gap: 1rem;
  }

  .step-number-about {
    font-size: 2.25rem;
  }

  .vision-content-about {
    text-align: center;
  }
}

@media (min-width: 1024px) {
  .hero-content-about {
    max-width: 900px;
  }

  .pillar-card-about {
    flex: 1 1 300px;
  }

  .step-card-about {
    align-items: flex-start;
  }
}

.legal-docs {
  width: 100%;
  background: var(--color-bg-light-primary);
  color: var(--color-text-light-primary);
  font-family: var(--font-primary);
}

.legal-docs .container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-left: clamp(1rem, 5vw, 2rem);
  padding-right: clamp(1rem, 5vw, 2rem);
}

.legal-docs-hero {
  padding: clamp(3rem, 8vw, 6rem) 0;
  background: var(--color-bg-light-primary);
  overflow: hidden;
}

.legal-docs-hero-content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.legal-docs-hero h1 {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 5vw + 0.5rem, 3.5rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-text-light-primary);
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.legal-docs-hero-meta {
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  color: var(--color-text-light-muted);
  line-height: 1.6;
}

.legal-docs-content {
  padding: clamp(2rem, 6vw, 4rem) 0;
  background: var(--color-bg-light-primary);
  overflow: hidden;
}

.legal-docs-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 4vw, 3rem);
}

.legal-docs-section {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.legal-docs-section h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-primary-dark);
}

.legal-docs-section p {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: var(--color-text-light-secondary);
}

.legal-docs-section ul {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-left: 1.5rem;
}

.legal-docs-section li {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: var(--color-text-light-secondary);
}

.legal-docs-contact {
  padding: clamp(2.5rem, 6vw, 4rem) 0;
  background: var(--color-bg-light-secondary);
  overflow: hidden;
}

.legal-docs-contact-content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.legal-docs-contact h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw + 0.5rem, 2.25rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-primary-dark);
}

.legal-docs-contact-intro {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.8;
  color: var(--color-text-light-secondary);
}

.legal-docs-contact-details {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.legal-docs-contact-item {
  font-size: clamp(0.9375rem, 1vw + 0.5rem, 1.0625rem);
  line-height: 1.6;
  color: var(--color-text-light-secondary);
}

.legal-docs-contact-item strong {
  color: var(--color-text-light-primary);
  font-weight: 600;
}

@media (min-width: 768px) {
  .legal-docs-hero {
    padding: 5rem 0;
  }

  .legal-docs-content {
    padding: 4rem 0;
  }

  .legal-docs-contact {
    padding: 4rem 0;
  }

  .legal-docs-section {
    gap: 1.25rem;
  }
}

@media (min-width: 1024px) {
  .legal-docs-hero {
    padding: 6rem 0;
  }

  .legal-docs-content {
    padding: 5rem 0;
  }

  .legal-docs-contact {
    padding: 5rem 0;
  }

  .legal-docs-content-wrapper {
    gap: 3rem;
  }
}

.thank-page {
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.thank-section {
  width: 100%;
  background: var(--color-bg-dark-primary);
  padding: clamp(2rem, 6vw, 4rem) 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

.thank-section .container {
  width: 100%;
  max-width: 1440px;
  padding: 0 clamp(1rem, 4vw, 2rem);
  margin: 0 auto;
}

.thank-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  padding: clamp(1rem, 3vw, 2rem);
}

.thank-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(80px, 15vw, 120px);
  height: clamp(80px, 15vw, 120px);
  background: rgba(6, 182, 212, 0.15);
  border-radius: var(--radius-lg);
  animation: pulse-icon 2s ease-in-out infinite;
}

.thank-icon i {
  font-size: clamp(2.5rem, 10vw, 4rem);
  color: var(--color-primary);
}

@keyframes pulse-icon {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.05);
    opacity: 0.9;
  }
}

.thank-section h1 {
  color: var(--color-text-dark-primary);
  font-size: clamp(1.75rem, 5vw + 1rem, 3.5rem);
  font-family: var(--font-heading);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.5px;
  word-wrap: break-word;
  overflow-wrap: break-word;
  margin: 0;
}

.thank-section p {
  color: var(--color-text-dark-secondary);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1.125rem);
  line-height: 1.6;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.thank-lead {
  color: var(--color-primary) !important;
  font-size: clamp(1rem, 2vw + 0.5rem, 1.25rem);
  font-weight: 600;
  letter-spacing: 0.3px;
}

.thank-message {
  max-width: 600px;
  margin: 0 auto;
  color: var(--color-text-dark-secondary);
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1.0625rem);
}

.thank-next {
  max-width: 600px;
  margin: 0 auto;
  color: var(--color-text-dark-muted);
  font-size: clamp(0.8125rem, 0.9vw + 0.4rem, 1rem);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  border-radius: var(--radius-md);
  transition: all 0.3s ease;
  border: 2px solid transparent;
  font-size: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  padding: clamp(0.625rem, 1.5vw, 1rem) clamp(1.25rem, 3vw, 2rem);
  cursor: pointer;
  white-space: nowrap;
}

.btn-primary {
  background: var(--color-primary);
  color: #000000;
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.3);
}

.btn-primary:hover {
  background: var(--color-primary-hover);
  box-shadow: 0 6px 20px rgba(6, 182, 212, 0.4);
  transform: translateY(-2px);
}

.btn-primary:active {
  transform: translateY(0);
}

@media (min-width: 768px) {
  .thank-section {
    padding: clamp(3rem, 8vw, 6rem) 0;
    min-height: 100vh;
  }

  .thank-content {
    gap: clamp(2rem, 5vw, 3rem);
    padding: clamp(1.5rem, 4vw, 3rem);
  }

  .thank-section h1 {
    font-size: clamp(2.25rem, 6vw + 1rem, 3.75rem);
  }

  .thank-message,
  .thank-next {
    font-size: clamp(0.9375rem, 1.2vw + 0.4rem, 1.125rem);
  }
}

@media (min-width: 1024px) {
  .thank-section {
    padding: 6rem 0;
  }

  .thank-content {
    gap: 2.5rem;
  }

  .thank-icon {
    width: 120px;
    height: 120px;
  }

  .thank-icon i {
    font-size: 4rem;
  }

  .thank-section h1 {
    font-size: 3.5rem;
    letter-spacing: -1px;
  }

  .thank-lead {
    font-size: 1.25rem;
  }

  .thank-message {
    font-size: 1.0625rem;
  }

  .thank-next {
    font-size: 1rem;
  }

  .btn {
    font-size: 1rem;
    padding: 1rem 2rem;
  }
}

@media (min-width: 1440px) {
  .thank-section h1 {
    font-size: 3.75rem;
  }

  .btn {
    padding: 1.125rem 2.25rem;
  }
}

@media (max-width: 480px) {
  .thank-icon {
    width: clamp(60px, 12vw, 80px);
    height: clamp(60px, 12vw, 80px);
  }

  .thank-icon i {
    font-size: clamp(2rem, 8vw, 2.5rem);
  }

  .thank-content {
    gap: clamp(1rem, 3vw, 1.5rem);
  }

  .thank-message,
  .thank-next {
    font-size: clamp(0.8125rem, 1vw + 0.4rem, 0.9375rem);
  }
}

.btn:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

@media print {
  .thank-section {
    background: white;
    color: #000;
  }

  .thank-icon {
    background: transparent;
    border: 2px solid #000;
  }

  .btn {
    border: 2px solid #000;
    background: white;
    color: #000;
  }
}

.error-page {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

.error-section {
  width: 100%;
  background: var(--color-bg-dark-primary);
  padding: clamp(2rem, 6vw, 4rem) 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

.error-section .container {
  width: 100%;
  max-width: 1440px;
  padding: 0 clamp(1rem, 4vw, 2rem);
  margin: 0 auto;
}

.error-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: clamp(2rem, 5vw, 3.5rem);
  padding: clamp(1.5rem, 4vw, 3rem) 0;
}

.error-visual {
  position: relative;
  width: 100%;
  height: clamp(200px, 50vw, 400px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: clamp(1rem, 3vw, 2rem);
}

.error-code-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.error-code {
  font-size: clamp(5rem, 15vw, 12rem);
  font-weight: 900;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-family: var(--font-heading);
  letter-spacing: -0.03em;
  line-height: 1;
  margin: 0;
  padding: 0;
}

.error-decoration {
  position: absolute;
  width: clamp(150px, 40vw, 300px);
  height: clamp(150px, 40vw, 300px);
  border: 3px solid var(--color-primary);
  border-radius: 50%;
  opacity: 0.15;
  animation: float 6s ease-in-out infinite;
  pointer-events: none;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px) scale(1);
  }
  50% {
    transform: translateY(-20px) scale(1.05);
  }
}

.error-message {
  max-width: 600px;
  width: 100%;
}

.error-section h1 {
  color: var(--color-text-dark-primary);
  font-size: clamp(1.75rem, 5vw + 1rem, 3rem);
  font-weight: 700;
  font-family: var(--font-heading);
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.error-subtitle {
  color: var(--color-primary);
  font-size: clamp(1rem, 2.5vw + 0.5rem, 1.25rem);
  font-weight: 600;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  line-height: 1.5;
}

.error-description {
  color: var(--color-text-dark-secondary);
  font-size: clamp(0.875rem, 1.5vw + 0.5rem, 1.0625rem);
  line-height: 1.7;
  margin: 0 0 clamp(1.5rem, 3vw, 2.5rem) 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.error-actions {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: var(--radius-lg);
  font-weight: 600;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  font-family: var(--font-primary);
  font-size: clamp(0.9375rem, 1.5vw + 0.5rem, 1rem);
  padding: clamp(0.875rem, 2vw, 1.125rem) clamp(1.5rem, 4vw, 2.5rem);
  white-space: nowrap;
}

.btn-primary {
  background: var(--color-primary);
  color: var(--color-bg-dark-primary);
  box-shadow: 0 4px 15px rgba(6, 182, 212, 0.3);
}

.btn-primary:hover {
  background: var(--color-primary-hover);
  box-shadow: 0 8px 25px rgba(6, 182, 212, 0.4);
  transform: translateY(-2px);
}

.btn-primary:active {
  transform: translateY(0);
}

.error-suggestions {
  background: rgba(6, 182, 212, 0.08);
  border: 1px solid rgba(6, 182, 212, 0.2);
  border-radius: var(--radius-lg);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.suggestions-label {
  color: var(--color-primary);
  font-size: clamp(0.875rem, 1.5vw + 0.5rem, 1rem);
  font-weight: 600;
  margin: 0 0 clamp(1rem, 2vw, 1.5rem) 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.suggestions-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(0.75rem, 1.5vw, 1rem);
}

.suggestions-list li {
  color: var(--color-text-dark-secondary);
  font-size: clamp(0.875rem, 1.5vw + 0.5rem, 1rem);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  line-height: 1.5;
}

.suggestions-list i {
  color: var(--color-primary);
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .error-section {
    min-height: 100vh;
    padding: 4rem 0;
  }

  .error-content {
    gap: 3rem;
    padding: 2rem 0;
  }

  .error-visual {
    height: 350px;
    margin-bottom: 1rem;
  }

  .error-message {
    max-width: 700px;
  }

  .error-section h1 {
    margin-bottom: 1.5rem;
  }

  .error-subtitle {
    margin-bottom: 1.5rem;
  }

  .error-description {
    margin-bottom: 2.5rem;
  }

  .error-actions {
    margin-bottom: 3rem;
  }

  .suggestions-label {
    margin-bottom: 1.5rem;
  }

  .suggestions-list {
    gap: 1rem;
  }
}

@media (min-width: 1024px) {
  .error-section {
    min-height: 100vh;
    padding: 6rem 0;
  }

  .error-content {
    gap: 3.5rem;
    padding: 3rem 0;
  }

  .error-visual {
    height: 400px;
    margin-bottom: 2rem;
  }

  .error-code {
    font-size: clamp(8rem, 20vw, 12rem);
  }

  .error-decoration {
    width: 350px;
    height: 350px;
  }

  .error-message {
    max-width: 800px;
  }

  .error-section h1 {
    margin-bottom: 2rem;
    font-size: 3.5rem;
  }

  .error-subtitle {
    margin-bottom: 2rem;
    font-size: 1.25rem;
  }

  .error-description {
    margin-bottom: 3rem;
    font-size: 1.0625rem;
  }

  .error-actions {
    margin-bottom: 3rem;
  }

  .btn {
    font-size: 1.0625rem;
    padding: 1.125rem 2.5rem;
  }

  .suggestions-label {
    margin-bottom: 1.5rem;
  }

  .suggestions-list {
    gap: 1rem;
  }

  .suggestions-list li {
    font-size: 1rem;
  }
}

@media (min-width: 1440px) {
  .error-section {
    min-height: 100vh;
    padding: 6rem 0;
  }

  .error-visual {
    height: 450px;
    margin-bottom: 2.5rem;
  }

  .error-code {
    font-size: 12rem;
  }

  .error-decoration {
    width: 400px;
    height: 400px;
  }

  .error-message {
    max-width: 900px;
  }

  .error-section h1 {
    font-size: 4rem;
    margin-bottom: 2rem;
  }

  .error-subtitle {
    font-size: 1.5rem;
    margin-bottom: 2rem;
  }

  .error-description {
    font-size: 1.125rem;
    margin-bottom: 3rem;
  }

  .btn {
    font-size: 1.125rem;
    padding: 1.25rem 3rem;
  }

  .error-suggestions {
    padding: 3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .error-decoration {
    animation: none;
  }

  .btn {
    transition: none;
  }
}