/* ================================
   Intiqore – AGB Styles (SantaRosa Theme)
   Datei: agb.css
   nutzt die Farbvariablen aus layout.css:
   --bg, --text, --brand, --brand-600, --info, --border, --radius, --shadow
   ================================ */

.agb-wrapper {
  background: rgba(255, 255, 255, 0.06); /* Glaslook mit Transparenz */
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: clamp(24px, 4vw, 48px);
  box-shadow: var(--shadow);
  color: var(--text);
  line-height: 1.7;
  max-width: 900px;
  margin: 0 auto clamp(40px, 8vh, 80px);
  transition: background 0.3s ease, box-shadow 0.3s ease;
  box-sizing: border-box;
}

/* ================================
   Titel
   ================================ */

.agb-wrapper .agb-title {
  font-size: clamp(1.8rem, 2vw + 1rem, 2.4rem);
  font-weight: 800;
  text-align: center;
  margin-bottom: 2rem;
  background: var(--brand);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Optional: Untertitel / Meta-Infos (z. B. "Stand: 01.01.2025") */
.agb-wrapper .agb-meta {
  text-align: center;
  font-size: 0.9rem;
  color: var(--muted);
  margin-bottom: 1.5rem;
}

/* ================================
   Sektionen
   ================================ */

.agb-wrapper .section {
  margin-bottom: 2rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.agb-wrapper .section:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.agb-wrapper .section h2 {
  font-size: 1.25rem;
  color: var(--brand-600);
  margin-bottom: 0.6rem;
  font-weight: 700;
}

.agb-wrapper .section h3 {
  font-size: 1.1rem;
  font-weight: 600;
  margin-top: 1.2rem;
  margin-bottom: 0.4rem;
  color: var(--brand);
}

.agb-wrapper .section p {
  margin: 0.5rem 0;
  color: var(--text);
}

.agb-wrapper .section p + p {
  margin-top: 0.35rem;
}

/* Listen */
.agb-wrapper .section ul {
  margin: 0.5rem 0 0.5rem 1.3rem;
  padding: 0;
  list-style: disc;
}

.agb-wrapper .section ol {
  margin: 0.5rem 0 0.5rem 1.3rem;
  padding: 0;
  list-style: decimal;
}

.agb-wrapper .section li {
  margin-bottom: 0.4rem;
  color: var(--text);
}

.agb-wrapper .section li strong {
  color: var(--info);
  font-weight: 600;
}

/* ================================
   Inline-Text / Hervorhebungen
   ================================ */

.agb-wrapper strong {
  font-weight: 600;
}

.agb-wrapper em {
  font-style: italic;
}

/* ================================
   Links (nur innerhalb der AGB)
   ================================ */

.agb-wrapper a {
  color: var(--info);
  text-decoration: underline;
  transition: color 0.3s ease, text-decoration 0.3s ease;
  word-break: break-word;
}

.agb-wrapper a:hover {
  text-decoration: none;
  color: var(--brand);
}

/* ================================
   Tabellen (falls vorhanden)
   ================================ */

.agb-wrapper table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.95rem;
}

.agb-wrapper th,
.agb-wrapper td {
  padding: 0.55rem 0.4rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}

.agb-wrapper th {
  font-weight: 600;
  color: var(--muted);
}

/* Wrapper für horizontales Scrollen auf kleinen Screens */
.agb-wrapper .table-scroll {
  overflow-x: auto;
}

/* ================================
   Responsive Design
   ================================ */

/* Tablets / kleinere Laptops */
@media (max-width: 900px) {
  .agb-wrapper {
    margin-inline: clamp(8px, 4vw, 20px);
    padding: clamp(20px, 4vw, 32px);
  }

  .agb-wrapper .section {
    margin-bottom: 1.6rem;
    padding-bottom: 1rem;
  }
}

/* Smartphones */
@media (max-width: 700px) {
  .agb-wrapper {
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.09);
  }

  .agb-wrapper .agb-title {
    font-size: clamp(1.6rem, 5vw + 0.8rem, 2rem);
    margin-bottom: 1.5rem;
  }

  .agb-wrapper .agb-meta {
    font-size: 0.85rem;
  }

  .agb-wrapper .section h2 {
    font-size: 1.1rem;
  }

  .agb-wrapper .section h3 {
    font-size: 1rem;
  }

  .agb-wrapper .section ul,
  .agb-wrapper .section ol {
    margin-left: 1rem;
  }
}

/* Sehr kleine Smartphones */
@media (max-width: 480px) {
  .agb-wrapper {
    padding: 1.25rem 1rem;
    margin-block: 24px 40px;
  }

  .agb-wrapper .agb-title {
    font-size: 1.5rem;
  }

  .agb-wrapper .section {
    margin-bottom: 1.4rem;
    padding-bottom: 0.85rem;
  }

  .agb-wrapper .section p,
  .agb-wrapper .section li {
    font-size: 0.94rem;
  }
}
