/* Country- & Line Dance-Friends Hochrhein e.V. – Handy-Feinschliff (01.11.2026)
 * Absichtlich ausschliesslich unter 801px: Desktop-Design bleibt unveraendert.
 * Zusaetzliches Stylesheet, ersetzt KEINE bestehende Styles-Datei.
 */
@media screen and (max-width: 800px) {
  /* Sichere Navigation und gut erreichbare Touch-Flaechen */
  .site-header .menu-toggle,
  .site-header .header-search {
    min-width: 44px;
    min-height: 44px;
    touch-action: manipulation;
  }
  .site-header #primary-nav {
    box-sizing: border-box;
    max-height: calc(100vh - 94px);
    max-height: calc(100dvh - 94px);
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .site-header #primary-nav a {
    min-height: 44px;
    padding-block: 12px;
    font-size: 16px;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }
  .site-header :is(.menu-toggle, .header-search, #primary-nav a):focus-visible {
    outline: 3px solid #bb7827;
    outline-offset: 2px;
  }
  /* Bilder und Dokumente passen sich dem Inhaltsbereich an. */
  .inner-main :is(img, video, iframe, canvas, object, embed) { max-width: 100%; }
  .inner-main :is(.page-panel, .detail-card, .cldf-managed-grid, .rw-track-text) { min-width: 0; }
  .inner-main :is(.detail-card, .page-panel) { overflow-wrap: anywhere; }
  .inner-main .cldf-managed-grid { gap: 16px; }
  /* Radioplayer: keine abgeschnittenen Controls oder Klickziele */
  #cldf-radio-player { max-width: 100%; min-width: 0; }
  #cldf-radio-player .rw-frame { max-width: 100%; }
  #cldf-radio-player .rw-controls { min-width: 0; }
  #cldf-radio-player .rw-now { min-width: 0; }
  #cldf-radio-player .rw-footer { min-height: 44px; overflow-wrap: anywhere; }
  #cldf-radio-player .rw-history { min-width: 0; }
  #cldf-radio-player .rw-tracklist { max-width: 100%; }
  #cldf-radio-player :is(.rw-play, .rw-volume) { touch-action: manipulation; }
  /* PDF-Vorschau auch bei schmalen Karten vollstaendig */
  .cldf-managed-grid .cldf-pdf-v2,
  .cldf-managed-grid .cldf-pdf-v2-stage,
  .cldf-managed-grid .cldf-pdf-v2-canvas { max-width: 100%; }
}

@media screen and (max-width: 700px) {
  /* Presseberichte jeweils als grosse, leicht lesbare Karte. */
  .inner-main .cldf-managed-grid,
  .inner-main .detail-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  .inner-main .cldf-managed-grid .detail-card,
  .inner-main .detail-grid .detail-card { padding: 15px; }
  .inner-main .cldf-managed-grid .detail-card h2 { font-size: 19px; line-height: 1.3; }
  .inner-main .cldf-managed-grid .detail-card p { font-size: 14px; line-height: 1.55; }
  .inner-main .cldf-managed-grid .detail-card > a { min-height: 44px; display: inline-flex; align-items: center; }
}

@media screen and (max-width: 520px) {
  /* Der Header darf Logo und zwei Bedientasten nicht uebereinander legen. */
  .site-header .brand { left: 6px; gap: 5px; max-width: calc(100% - 106px); }
  .site-header .brand img { width: 54px; height: 75px; flex: 0 0 54px; }
  .site-header .brand-text { min-width: 0; gap: 3px; }
  .site-header .brand-text strong { font-size: 12px; line-height: 1.12; letter-spacing: -.25px; }
  .site-header .brand-text small { font-size: 5.5px; line-height: 1.25; letter-spacing: .15px; white-space: normal; }
  .site-header .menu-toggle { right: 55px; top: 20px; width: 44px; height: 44px; }
  .site-header .header-search { right: 4px; top: 20px; width: 44px; height: 44px; }
  .site-header .header-forest { opacity: .35; pointer-events: none; }
  .site-header #primary-nav { top: 75px; left: 8px; right: 8px; }

  /* Platzfressende Raender verringern – ohne Inhalte abzuschneiden. */
  .inner-main { padding-inline: 9px; }
  .inner-main .page-panel { padding: 17px 14px 22px; }
  .inner-main h1 { font-size: clamp(25px, 7.5vw, 30px); line-height: 1.14; }
  .inner-main p, .inner-main li { font-size: 14px; line-height: 1.55; }

  /* Auf der Startseite sind die Infotexte bisher sehr klein. */
  .quick-card { min-height: 117px; padding: 12px 8px; }
  .quick-card strong { font-size: 15px; line-height: 1.2; }
  .quick-card small { font-size: 12px; line-height: 1.35; }
  .about-content p { font-size: 14px; line-height: 1.5; }
  .contact-card p { font-size: 13px; line-height: 1.45; }
  .info-bottom h2 { font-size: 17px; white-space: normal; }
  .event-details h3 { font-size: 14px; line-height: 1.25; }
  .event-details p { font-size: 12px; line-height: 1.35; }
  .more { font-size: 12px; white-space: normal; }
  .events { min-height: 0; }
  .event-row { min-height: 92px; }
  .action { min-height: 44px; height: auto; padding: 11px 12px; font-size: 12px; }
  .hero-intro { font-size: 14px; line-height: 1.42; }
  .site-footer .footer-links a { min-height: 44px; display: inline-flex; align-items: center; }

  /* Radio-Bedienung: gute Groesse und lesbare Songtexte. */
  #cldf-radio-player .rw-play { min-width: 50px; min-height: 50px; }
  #cldf-radio-player .rw-song { font-size: 15px; }
  #cldf-radio-player .rw-track-title { font-size: 13px; }
  #cldf-radio-player .rw-track-artist { font-size: 12px; }
  #cldf-radio-player .rw-tracklist { max-height: 300px; }
  #cldf-radio-player .rw-footer { padding: 10px 6px; font-size: 12px; }
}

@media screen and (max-width: 350px) {
  .site-header .brand img { width: 49px; flex-basis: 49px; }
  .site-header .brand-text strong { font-size: 11px; }
  .site-header .brand-text small { display: none; }
  #cldf-radio-player .rw-controls { gap: 9px; }
  #cldf-radio-player .rw-track { grid-template-columns: 34px 34px minmax(0,1fr); gap: 5px; }
  #cldf-radio-player .rw-track img { width: 33px; height: 33px; }
}