/* =======================================================
   RHEINGAU BIKES — kontakt.css (Clean Panel v5)
   Scope: .rb-kontakt5
   Präfix: rbk5-
   ======================================================= */

.rb-kontakt5{
  --line:#E2E5EA;
  --text:#121318;
  --muted:#6B7280;

  --accent:#7B3FF2;
  --accent-2:#5A2ED9;
  --accent-soft: rgba(123,63,242,.10);

  --ease:cubic-bezier(.22,.61,.36,1);

  --shadow-1: 0 12px 34px rgba(15, 23, 42, .10);
  --shadow-2: 0 22px 60px rgba(15, 23, 42, .16);

  --radius: 22px;
  --radius-sm: 16px;

  --field-bg: #F7F8FB;
  --field-border: rgba(15,23,42,.10);

  color: var(--text);
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.rb-kontakt5.rbk5-wrap{
  position: relative;
  padding-top: clamp(1.6rem, 3vw, 2.6rem);
  padding-bottom: clamp(2.1rem, 3.5vw, 3.1rem);
}

.rb-kontakt5.rbk5-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(1100px 520px at 12% 0%, rgba(123,63,242,.09), transparent 58%),
    radial-gradient(900px 520px at 100% 14%, rgba(90,46,217,.07), transparent 58%),
    linear-gradient(180deg, #FFFFFF 0%, #F6F7FB 100%);
  pointer-events:none;
}

.rb-kontakt5 .rbk5-shell{
  display:flex;
  justify-content:center;
}

.rb-kontakt5 .rbk5-panel{
  width: min(900px, 100%);
  background: #fff;
  border: 1px solid rgba(226,229,234,.92);
  border-radius: var(--radius);
  box-shadow: var(--shadow-2);
  overflow: hidden;
}

.rb-kontakt5 .rbk5-head{
  padding: 18px 18px 14px;
  border-bottom: 1px solid rgba(226,229,234,.92);
  background:
    linear-gradient(180deg, rgba(123,63,242,.08), rgba(255,255,255,0)),
    #fff;
}

.rb-kontakt5 .rbk5-title{
  margin: 0;
  font-weight: 900;
  letter-spacing: -0.02em;
  font-size: clamp(1.35rem, 2.0vw, 1.65rem);
  line-height: 1.1;
}

.rb-kontakt5 .rbk5-sub{
  margin: .45rem 0 0;
  color: var(--muted);
  font-weight: 650;
  font-size: .98rem;
}

.rb-kontakt5 .rbk5-body{
  padding: 18px;
}

/* Alerts */
.rb-kontakt5 .rbk5-alert{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 28px rgba(15,23,42,.08);
  padding: 12px 14px;
  margin-bottom: 14px;
}

.rb-kontakt5 .rbk5-alert--ok{
  border-color: rgba(22,163,74,.24);
  background: linear-gradient(180deg, rgba(22,163,74,.10), #fff);
}

.rb-kontakt5 .rbk5-alert--warn{
  border-color: rgba(245,158,11,.28);
  background: linear-gradient(180deg, rgba(245,158,11,.12), #fff);
}

.rb-kontakt5 .rbk5-alert ul{
  margin: 8px 0 0;
  padding-left: 1.1rem;
}

/* Labels + Fields */
.rb-kontakt5 .rbk5-label{
  display:inline-block;
  font-weight: 900;
  font-size: .92rem;
  color: var(--text);
  margin-bottom: 6px;
}

.rb-kontakt5 .rbk5-field{
  width: 100%;
  border: 1px solid var(--field-border);
  border-radius: 18px;
  background: var(--field-bg);
  color: var(--text);
  padding: .78rem .96rem;
  transition: border-color .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
}

.rb-kontakt5 .rbk5-field:hover{
  border-color: rgba(15,23,42,.14);
  background: #f4f6fb;
}

.rb-kontakt5 .rbk5-field:focus{
  outline: none;
  border-color: rgba(123,63,242,.35);
  box-shadow: 0 0 0 .26rem rgba(123,63,242,.14);
  background: #fff;
}

.rb-kontakt5 textarea.rbk5-field{
  min-height: 170px;
  resize: vertical;
}

.rb-kontakt5 input[type="file"].rbk5-field{
  padding: .66rem .85rem;
}

.rb-kontakt5 input[type="file"].rbk5-field::file-selector-button{
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 999px;
  padding: .40rem .76rem;
  margin-right: .7rem;
  background: #fff;
  box-shadow: 0 10px 20px rgba(15,23,42,.08);
  font-weight: 900;
  cursor: pointer;
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease);
}

.rb-kontakt5 input[type="file"].rbk5-field::file-selector-button:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(15,23,42,.12);
  border-color: rgba(123,63,242,.22);
}

/* Consent */
.rb-kontakt5 .rbk5-consent{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px dashed rgba(15,23,42,.14);
  background: rgba(255,255,255,.75);
}

.rb-kontakt5 .rbk5-consent-label{
  color: var(--muted);
  font-weight: 750;
}

/* Actions */
.rb-kontakt5 .rbk5-actions{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

@media (max-width: 992px){
  .rb-kontakt5 .rbk5-actions{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px){
  .rb-kontakt5 .rbk5-actions{ grid-template-columns: 1fr; }
}

.rb-kontakt5 .rbk5-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;

  min-height: 50px;
  width: 100%;

  font-weight: 900;
  text-decoration:none;
  font-size: .95rem;

  padding: .62rem .92rem;
  border-radius: 999px;

  border: 1px solid rgba(15,23,42,.10);
  background: #fff;
  color: var(--text);

  box-shadow: 0 10px 22px rgba(15,23,42,.08);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease), opacity .18s var(--ease);
}

.rb-kontakt5 .rbk5-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 38px rgba(15,23,42,.12);
  border-color: rgba(15,23,42,.14);
}

.rb-kontakt5 .rbk5-btn:active{
  transform: translateY(1px);
}

.rb-kontakt5 .rbk5-btn--primary{
  border-color: rgba(123,63,242,.28);
  background: linear-gradient(135deg, rgba(123,63,242,.18), rgba(123,63,242,.06));
}

.rb-kontakt5 .rbk5-btn--primary i{ color: var(--accent); }

.rb-kontakt5 .rbk5-btn--wa{
  border-color: rgba(34,197,94,.25);
  background: linear-gradient(135deg, rgba(34,197,94,.14), rgba(34,197,94,.05));
}

/* Disabled submit */
.rb-kontakt5 .rbk5-btn[disabled]{
  opacity: .55;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: 0 10px 22px rgba(15,23,42,.06);
}
.rb-kontakt5 .rbk5-btn[disabled]:hover{
  transform: none;
  box-shadow: 0 10px 22px rgba(15,23,42,.06);
  border-color: rgba(15,23,42,.10);
}

/* Hint below actions */
.rb-kontakt5 .rbk5-note{
  margin-top: 12px;
  color: var(--muted);
  font-size: .92rem;
}

/* Mobile spacing */
@media (max-width: 576px){
  .rb-kontakt5 .rbk5-body{ padding: 14px; }
  .rb-kontakt5 .rbk5-head{ padding: 14px 14px 12px; }
}

/* Motion reduction */
@media (prefers-reduced-motion: reduce){
  .rb-kontakt5 *{
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}