.hero-text {
      max-width: 680px;
      text-align: left;
      margin: 0 auto;
    }

.hero-sub {
      font-size: clamp(1rem, 2.2vw, 1.2rem);
      color: var(--subtext);
      max-width: 520px;
      margin: 0 0 40px;
      animation: fadeUp 0.55s ease 0.3s both;
    }

.hero-actions {
      display: flex;
      gap: 12px;
      justify-content: flex-start;
      flex-wrap: wrap;
      animation: fadeUp 0.55s ease 0.4s both;
    }

.usecase-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 32px 28px;
      transition: border-color var(--t), box-shadow var(--t), transform var(--t);
    }

.usecase-icon { font-size: 28px; margin-bottom: 16px; }

.page-cta {
      text-align: center;
      padding: 96px 0;
      border-top: 1px solid var(--border);
      background: linear-gradient(180deg, transparent 0%, rgba(21,110,71,0.06) 60%, transparent 100%);
    }

.legal { padding: calc(var(--nav-offset) + 40px) 0 96px; }

.legal-inner { max-width: 760px; margin: 0 auto; }

.legal h1 { font-size: clamp(2rem, 4vw, 2.6rem); margin-bottom: 8px; }

.legal .legal-stand { color: var(--subtext-dark); font-size: 14px; margin-bottom: 40px; }

.legal h2 { font-size: 1.15rem; font-weight: 600; margin: 32px 0 10px; }

.legal h3 { font-size: 1rem; font-weight: 600; color: var(--text); margin: 20px 0 8px; }

.legal p, .legal li { color: var(--subtext); line-height: 1.7; font-size: 1rem; margin-bottom: 10px; }

.legal ul { padding-left: 1.25rem; margin-bottom: 10px; }

.legal a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }

/* Tables (Datenschutzerklärung/AVV: Verarbeitungszwecke, Dienstleister) —
   wrapped in .legal-table-wrap for horizontal scroll on narrow screens
   instead of breaking the page layout. */
.legal-table-wrap { overflow-x: auto; margin: 10px 0 20px; }

.legal table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 0.9rem; }

.legal th, .legal td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--border); vertical-align: top; color: var(--subtext); }

.legal th { color: var(--text); font-weight: 600; background: var(--bg-card); }