
/* === WhatsApp Button + Kontaktformular === */
/* Nach assets/site.css laden */

.contact-actions-grid{
  display:grid;
  grid-template-columns:minmax(0, .95fr) minmax(0, 1.2fr);
  gap:1.2rem;
  align-items:start;
}

.whatsapp-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.72), rgba(255,255,255,0) 34%),
    linear-gradient(180deg, #ffffff, #f8fbf2);
}

.whatsapp-card::after{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:linear-gradient(180deg, var(--primary), var(--primary-dark));
}

.whatsapp-card__meta{
  display:grid;
  gap:.8rem;
  margin:1rem 0 1.2rem;
  padding:0;
}

.whatsapp-card__meta li{
  display:grid;
  grid-template-columns:40px 1fr;
  gap:.75rem;
  align-items:start;
  padding:.75rem .85rem;
  border:1px solid var(--border);
  border-radius:18px;
  background:rgba(244,250,234,.72);
  list-style:none;
}

.whatsapp-card__icon{
  width:40px;
  height:40px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid var(--border);
  box-shadow:0 8px 18px rgba(34,48,24,.06);
  font-size:1.1rem;
}

.whatsapp-card__meta strong{
  display:block;
  margin-bottom:.16rem;
  font-size:.82rem;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--muted);
}

.whatsapp-card__hint{
  margin-top:1rem;
}

.contact-form-card{
  background:linear-gradient(180deg, #ffffff, #fbfdf7);
}

.contact-form-card form{
  display:grid;
  gap:1rem;
}

.contact-form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1rem;
}

.contact-form-card label{
  display:block;
  margin-bottom:.4rem;
  font-weight:600;
}

.contact-form-card input,
.contact-form-card select,
.contact-form-card textarea{
  width:100%;
  padding:.9rem 1rem;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  color:var(--text);
  font:inherit;
}

.contact-form-card textarea{
  min-height:150px;
  resize:vertical;
}

.form-note{
  font-size:.95rem;
  color:var(--muted);
}

.form-check{
  display:flex;
  gap:.7rem;
  align-items:flex-start;
}

.form-check input{
  width:auto;
  margin-top:.2rem;
}

.form-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
}

:root[data-theme="dark"] .whatsapp-card{
  background:
    radial-gradient(circle at top right, rgba(255,255,255,.06), rgba(255,255,255,0) 34%),
    linear-gradient(180deg, rgba(29,43,24,.98), rgba(36,53,30,.98));
}

:root[data-theme="dark"] .whatsapp-card__meta li{
  background:rgba(255,255,255,.03);
  border-color:var(--border);
}

:root[data-theme="dark"] .whatsapp-card__icon{
  background:rgba(255,255,255,.04);
  border-color:var(--border);
}

:root[data-theme="dark"] .contact-form-card input,
:root[data-theme="dark"] .contact-form-card select,
:root[data-theme="dark"] .contact-form-card textarea{
  background:var(--surface);
  border-color:var(--border);
  color:var(--text);
}

@media (max-width: 980px){
  .contact-actions-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 780px){
  .contact-form-grid{
    grid-template-columns:1fr;
  }

  .form-actions{
    flex-direction:column;
  }

  .form-actions .btn{
    width:100%;
  }
}
