/* rmd-kadence-child/assets/css/support.css
   Nur auf den Support-Seiten (/support-hilfe/*): Formular-Extras im FAQ-Panel + Support-Uebersicht
   (6 Kacheln unten). NUR Tokens. */

/* FAQ-Sektion direkt unter der Breadcrumb -> deutlich weniger Abstand oben. */
.rmd-c-section.rmd-support-faqsec{padding-top:var(--space-4)}

/* ===== FAQ-Ueberschrift = dynamischer Seitentitel (einzeilig, kleiner als der grosse Default) ===== */
.rmd-c-faq__h{font-size:var(--fs-4xl);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:768px){ .rmd-c-faq__h{font-size:var(--fs-2xl);white-space:normal} }
/* Voller Titel als H1 nur fuer Screenreader/SEO (sichtbar traegt die FAQ-Box den Titel). */
.rmd-support-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ===== Formular-Extras in der rechten FAQ-Spalte (dunkles Panel) ===== */
.rmd-c-faq__hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.rmd-c-faq__row2{display:flex;gap:var(--space-3)}
.rmd-c-faq__row2 .rmd-c-faq__in{flex:1;min-width:0}
/* Select im gleichen Look wie die Inputs + eigener Pfeil (kein Browser-Default). */
.rmd-c-faq__in--select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234F5050' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-4) center;padding-right:var(--space-8)}
.rmd-c-faq__check{display:flex;gap:var(--space-2);align-items:flex-start;margin-top:var(--space-1);font-size:var(--fs-xs);line-height:1.5;color:var(--color-on-dark)}
.rmd-c-faq__check input{margin-top:3px;flex:0 0 auto;accent-color:var(--color-signal)}
.rmd-c-faq__check a{color:var(--color-on-dark);text-decoration:underline;text-underline-offset:2px}
.rmd-c-faq__msg{margin:var(--space-3) 0 0;font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-sm)}
.rmd-c-faq__msg.is-ok{color:var(--color-online)}
.rmd-c-faq__msg.is-err{color:var(--color-sale)}
.rmd-c-faq__send.is-loading{opacity:.6;pointer-events:none}

/* ===== Support-Uebersicht (unten auf jeder Seite) ===== */
.rmd-support-ov{background:transparent;padding:var(--space-section) 0} /* kein grauer Block - Karten auf Seiten-Hintergrund */
.rmd-support-ov--plain{background:transparent} /* (redundant, historisch: Hub war zuerst ohne grauen Hintergrund) */
.rmd-support-ov__title{text-align:center;font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-3xl);line-height:var(--lh-tight);letter-spacing:-.02em;color:var(--color-headline);margin:0}
.rmd-support-ov__lead{text-align:center;max-width:640px;margin:var(--space-4) auto 0;font-size:var(--fs-md);color:var(--color-text-muted)}
.rmd-support-ov__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);margin-top:var(--space-12)}
.rmd-support-ov__card{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);text-align:center;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-card);padding:var(--space-10) var(--space-6);text-decoration:none;transition:box-shadow .18s,transform .18s,border-color .18s}
.rmd-support-ov__card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--color-border-strong)}
.rmd-support-ov__card.is-current{border-color:var(--color-headline)}
.rmd-support-ov__ic{width:64px;height:64px;flex:0 0 auto;border-radius:var(--radius-pill);background:var(--color-signal);display:grid;place-items:center;color:var(--color-on-signal)}
.rmd-support-ov__ic .rmd-icon{width:28px;height:28px}
.rmd-support-ov__t{font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-base);color:var(--color-headline)}

@media(max-width:900px){
  .rmd-support-ov__grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .rmd-support-ov{padding:var(--space-16) 0}
  /* Handy: 2 Spalten (3 Reihen) - kompaktere Karten, kleinere Icons + Schrift. */
  .rmd-support-ov__grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3);margin-top:var(--space-8)}
  .rmd-support-ov__title{font-size:var(--fs-2xl)}
  .rmd-support-ov__lead{font-size:var(--fs-sm)}
  .rmd-support-ov__card{padding:var(--space-6) var(--space-3);gap:var(--space-3);border-radius:var(--radius)}
  .rmd-support-ov__ic{width:46px;height:46px}
  .rmd-support-ov__ic .rmd-icon{width:22px;height:22px}
  .rmd-support-ov__t{font-size:var(--fs-sm);line-height:var(--lh-tight)}
}
