/* Amrum Landing Page - seitenspezifische Styles */

    /* Skip link */
    .skip-link {
      position: absolute; top: -100%; left: 0;
      background: #4DB8A4; color: #1a1a1a; padding: 0.5rem 1rem;
      font-weight: 600; z-index: 300; text-decoration: none;
    }
    .skip-link:focus { top: 0; }

    /* Screen-reader only */
    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    /* Sections */
    .amrum-section {
      padding: 3.5rem 0;
      border-bottom: 1px solid #404040;
    }
    .amrum-section:last-of-type { border-bottom: none; }

    /* Einstieg */
    .einstieg-text {
      max-width: 600px;
      margin: 0 auto;
      font-size: 1.25rem;
      line-height: 1.8;
      text-align: center;
    }
    .einstieg-text p { margin-bottom: 1.5rem; }
    .einstieg-schluss {
      font-weight: 700;
      font-size: 1.375rem;
      color: #4DB8A4;
      margin-top: 2rem;
    }

    /* Problem */
    .problem-text { max-width: 680px; }
    .problem-text p { margin-bottom: 1.25rem; line-height: 1.7; }

    /* Aaron */
    .aaron-header { display: flex; align-items: flex-start; gap: 1.5rem; margin-bottom: 1.5rem; }
    .aaron-photo { width: 140px; height: 140px; border-radius: 50%; object-fit: cover; object-position: top; flex-shrink: 0; }
    .aaron-intro p { margin-bottom: 0.5rem; line-height: 1.6; }
    .aaron-badges { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
    .aaron-badge {
      background: #2B2B2B; border: 1px solid #404040; border-radius: 6px;
      padding: 0.375rem 0.75rem; font-size: 0.8125rem; color: #BFBFBF;
    }
    .aaron-text p { margin-bottom: 1rem; line-height: 1.7; }
    .aaron-buttons { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }
    .aaron-buttons a {
      display: inline-flex; align-items: center; gap: 0.5rem;
      border: 1px solid #4DB8A4; border-radius: 8px; padding: 0.625rem 1.25rem;
      color: #4DB8A4; font-weight: 500; font-size: 0.9375rem; min-height: 44px;
    }
    .aaron-buttons a:hover { background: #4DB8A4; color: #1a1a1a; text-decoration: none; }

    /* Section headings */
    .section-heading {
      font-size: 1.375rem; font-weight: 700; margin-bottom: 1.25rem;
    }

    /* Baustein-Karten (Abschnitt 4) */
    .baustein-cards { display: grid; grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 2rem; }
    .baustein-card {
      background: #2B2B2B; border: 1px solid #404040; border-radius: 8px;
      padding: 1.5rem;
    }
    .baustein-card h3 { font-size: 1.125rem; font-weight: 700; color: #4DB8A4; margin-bottom: 0.5rem; }
    .baustein-card p { margin-bottom: 1rem; line-height: 1.6; font-size: 0.9375rem; }
    .baustein-card p:last-child { margin-bottom: 0; }
    .baustein-detail { font-size: 0.875rem; color: #BFBFBF; margin-bottom: 0.75rem; }
    .baustein-articles { margin: 1rem 0; }
    .baustein-articles a {
      display: block; padding: 0.625rem 0; border-top: 1px solid #404040;
      color: #EDEDED; font-size: 0.9375rem; min-height: 44px;
      display: flex; align-items: center;
    }
    .baustein-articles a:hover { color: #4DB8A4; }
    .baustein-articles a::before { content: "→ "; color: #4DB8A4; margin-right: 0.5rem; }
    .abschluss-text { margin-top: 1.5rem; line-height: 1.7; }
    .abschluss-text p { margin-bottom: 1rem; }

    /* Vier-Schichten-Grid (Abschnitt 5) */
    .schichten-grid {
      display: grid; grid-template-columns: 1fr; gap: 1rem;
      margin-bottom: 2rem;
    }
    .schicht-card {
      background: #2B2B2B; border: 1px solid #404040; border-radius: 8px;
      padding: 1.25rem; text-align: center;
      display: flex; flex-direction: column; align-items: center;
    }
    .schicht-icon { color: #4DB8A4; margin-bottom: 0.75rem; }
    .schicht-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 0.5rem; }
    .schicht-card p { font-size: 0.875rem; color: #BFBFBF; line-height: 1.5; margin-bottom: 1rem; flex-grow: 1; }
    .schicht-btn {
      display: inline-flex; align-items: center; justify-content: center;
      background: transparent; border: 1px solid #4DB8A4; border-radius: 6px;
      padding: 0.5rem 1rem; color: #4DB8A4; font-size: 0.875rem; font-weight: 500;
      min-height: 44px; width: 100%; text-decoration: none;
    }
    .schicht-btn:hover { background: #4DB8A4; color: #1a1a1a; text-decoration: none; }
    .schichten-note { text-align: center; max-width: 600px; margin: 0 auto; color: #BFBFBF; line-height: 1.7; }

    /* Schutz (Abschnitt 6) */
    .schutz-icon { text-align: center; margin-bottom: 1.5rem; color: #4DB8A4; }
    .schutz-punkte { list-style: none; padding: 0; margin-bottom: 1.5rem; }
    .schutz-punkte li {
      padding: 0.625rem 0; border-bottom: 1px solid #404040;
      padding-left: 1.5rem; position: relative; line-height: 1.6;
    }
    .schutz-punkte li::before {
      content: "✓"; position: absolute; left: 0; color: #4DB8A4; font-weight: 700;
    }
    .schutz-zitat {
      font-size: 1.125rem; font-weight: 600; color: #4DB8A4;
      text-align: center; margin: 2rem 0; line-height: 1.5;
    }
    .schutz-dsgvo { font-size: 0.875rem; color: #BFBFBF; text-align: center; }

    /* Perspektive (Abschnitt 7) */
    .perspektive-text p { margin-bottom: 1.25rem; line-height: 1.7; }
    .perspektive-einladung {
      background: #2B2B2B; border: 1px solid #404040; border-radius: 8px;
      padding: 1.5rem; margin-top: 1.5rem;
    }
    .perspektive-einladung p { margin-bottom: 1rem; line-height: 1.6; }

    /* Kontakt (Abschnitt 8) */
    .kontakt-section { text-align: center; }
    .kontakt-email {
      display: inline-block; background: #4DB8A4; color: #1a1a1a;
      font-weight: 700; font-size: 1.125rem; padding: 1rem 2.5rem;
      border-radius: 8px; min-height: 44px; text-decoration: none;
      margin-bottom: 1.5rem;
    }
    .kontakt-email:hover { filter: brightness(1.1); text-decoration: none; }
    .kontakt-text { max-width: 500px; margin: 0 auto; color: #BFBFBF; line-height: 1.7; }

    /* Legitimation (Abschnitt 9) */
    .legitimation-badges {
      display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem;
    }
    .legitimation-badge {
      background: #2B2B2B; border: 1px solid #404040; border-radius: 6px;
      padding: 0.5rem 1rem; font-size: 0.8125rem; color: #BFBFBF;
      text-decoration: none; min-height: 44px; display: inline-flex; align-items: center;
    }
    .legitimation-badge:hover { border-color: #4DB8A4; color: #EDEDED; text-decoration: none; }

    /* Responsive */
    @media (min-width: 641px) {
      .schichten-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (min-width: 901px) {
      .schichten-grid { grid-template-columns: repeat(4, 1fr); }
    }
    @media (max-width: 640px) {
      .amrum-section { padding: 2.5rem 0; }
      .einstieg-text { font-size: 1.125rem; }
      .einstieg-schluss { font-size: 1.25rem; }
      .aaron-header { flex-direction: column; align-items: center; text-align: center; }
      .aaron-photo { width: 120px; height: 120px; }
      .aaron-buttons { flex-direction: column; }
      .aaron-buttons a { width: 100%; justify-content: center; }
      .kontakt-email { display: block; width: 100%; padding: 1rem; }
    }