/*
 * Kapitalwerk – Responsive CSS
 * Breakpoints: ≤992px / ≤768px / ≤480px
 */

/* ============================================================
   TABLET ≤ 992px
   ============================================================ */
@media (max-width: 992px) {
  /* Header */
  .kw-nav-primary {
    display: none;
  }

  .kw-header-cta {
    display: none;
  }

  .kw-burger {
    display: flex;
  }

  .kw-mobile-nav {
    display: block;
  }

  /* Content-Grid */
  .kw-content-area {
    grid-template-columns: 1fr;
  }

  .kw-sidebar {
    position: static;
  }

  /* Posts */
  .kw-posts-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Steps */
  .kw-steps {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }

  /* Stats */
  .kw-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Trust-Items */
  .kw-trust-items {
    justify-content: center;
    gap: 1.25rem;
  }

  /* Formular */
  .kw-form-grid {
    grid-template-columns: 1fr;
  }

  /* Archiv-Tabelle: Scrollable */
  .kw-archive-table-wrap {
    margin-inline: -1.25rem;
    border-radius: 0;
  }

  /* Footer */
  .kw-footer-inner {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    gap: .75rem;
  }

  .kw-footer-links {
    justify-content: center;
  }

  /* Footer F6: CTA-Split — Tablet */
  .kw-footer-split {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .kw-footer-split-cta {
    padding-right: 0;
    border-right: none;
    border-bottom: 1px solid var(--kw-border);
    padding-bottom: 2rem;
  }

  /* Platform-Card: schmaler */
  .pplatt-platform-list-card {
    flex-wrap: wrap;
  }

  .pplatt-card-actions {
    flex-direction: row;
    width: 100%;
    justify-content: flex-start;
  }

  /* Review */
  .kw-review-summary {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ============================================================
   MOBIL ≤ 768px
   ============================================================ */
@media (max-width: 768px) {
  /* Hero */
  .kw-hero {
    padding: 3.5rem 0 2.5rem;
  }

  .kw-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .kw-hero-trust {
    gap: 1rem;
    padding-top: 1.25rem;
  }

  .kw-hero-trust-item {
    flex: 1 1 calc(50% - .5rem);
    justify-content: center;
    text-align: center;
    flex-direction: column;
  }

  /* Topbar: Rechts ausblenden */
  .kw-topbar-right {
    display: none;
  }

  .kw-topbar .kw-container > span {
    font-size: .72rem;
  }

  /* Steps */
  .kw-steps {
    grid-template-columns: 1fr;
  }

  /* Artikel-Grid */
  .kw-posts-grid {
    grid-template-columns: 1fr;
  }

  /* Platform-Card kompakter */
  .pplatt-platform-list-card {
    padding: .9rem 1rem;
  }

  .pplatt-card-facts {
    gap: .75rem;
  }

  .pplatt-card-rank {
    display: none;
  }

  /* Pros/Cons */
  .pplatt-proscons {
    grid-template-columns: 1fr;
  }

  /* Archiv-Tabelle: Spalten ausblenden */
  .kw-archive-table .col-gegr,
  .kw-archive-table .col-mindest {
    display: none;
  }

  /* Post-Nav */
  .kw-post-nav {
    grid-template-columns: 1fr;
  }

  /* Footer ein-zeilig wird mehrzeilig */
  .kw-footer {
    padding: 1rem 0;
  }

  /* Footer F6: Mobile */
  .kw-footer-split-links {
    flex-direction: column;
    gap: 1.5rem;
  }

  .kw-footer-bottom-bar {
    flex-direction: column;
    text-align: center;
    gap: .5rem;
  }

  /* Review-Karte */
  .pplatt-review-card {
    flex-direction: column;
    gap: .75rem;
  }

  .pplatt-review-card-score {
    flex-direction: row;
    min-width: auto;
    align-items: center;
  }

  /* Quick-Facts */
  .kw-quick-facts-grid {
    grid-template-columns: 1fr;
  }

  .kw-quick-fact {
    border-right: none;
  }

  /* Platform Overview */
  .kw-platform-overview {
    flex-wrap: wrap;
  }

  .kw-platform-overview-logo {
    width: 70px;
    height: 50px;
  }

  /* Formular */
  .kw-review-form-section {
    padding: 1.25rem;
  }

  .kw-form-submit-row {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ============================================================
   KLEIN-MOBIL ≤ 480px
   ============================================================ */
@media (max-width: 480px) {
  /* Container */
  .kw-container {
    padding-inline: .9rem;
  }

  /* Typographie */
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.4rem; }
  h3 { font-size: 1.2rem; }

  /* Hero */
  .kw-hero {
    padding: 2.5rem 0 2rem;
  }

  .kw-hero-label {
    font-size: .7rem;
  }

  .kw-hero-trust {
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
  }

  .kw-hero-trust-item {
    flex: none;
    width: 100%;
    text-align: left;
  }

  /* Topbar komplett ausblenden */
  .kw-topbar {
    display: none;
  }

  /* Header-Höhe */
  .kw-header-inner {
    height: 56px;
  }

  /* Stats */
  .kw-stats-grid {
    grid-template-columns: 1fr 1fr;
  }

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

  /* Platform-Card */
  .pplatt-platform-list-card {
    flex-wrap: wrap;
    gap: .75rem;
  }

  .pplatt-card-logo {
    width: 50px;
    height: 38px;
  }

  .pplatt-card-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .pplatt-card-actions .kw-btn {
    text-align: center;
    justify-content: center;
  }

  /* Archive-Table nur 3 Spalten */
  .kw-archive-table .col-rendite {
    display: none;
  }

  /* Formular */
  .kw-form-grid {
    grid-template-columns: 1fr;
  }

  /* Pagination */
  .kw-pagination a,
  .kw-pagination span {
    width: 32px;
    height: 32px;
    font-size: .8rem;
  }

  /* Bewertungs-Zusammenfassung */
  .kw-review-avg-number {
    font-size: 2.5rem;
  }

  /* Slider Ticks */
  .pplatt-slider-ticks {
    font-size: .6rem;
  }

  /* FAQ */
  .pplatt-faq-q {
    font-size: .88rem;
    padding: .85rem 1rem;
  }

  /* Autoren */
  .pplatt-author {
    flex-direction: column;
    text-align: center;
  }

  .pplatt-author-avatar {
    margin: 0 auto;
  }

  /* Footer: Vertikal */
  .kw-footer-inner {
    flex-direction: column;
    gap: .5rem;
  }

  .kw-footer-links {
    gap: .75rem;
  }

  /* Buttons */
  .kw-btn {
    padding: .6rem 1.1rem;
    font-size: .85rem;
  }
}