/* ============================================================
   „Für Gutachter“ (/fuer-gutachter): Kopfbild neben der
   Überschrift, Bild zum Ablauf und die automatische Zustellung
   von Anfragen mit Statuskarte. Farben, Radien und Schatten
   aus dem Theme (tailwind/input.css), Präfix partner-.
   ============================================================ */

/* ---------- Kopfbereich ----------
   Smartphone: Überschrift → Platin-Hinweis → Bild, damit das Besondere
   an Platin direkt unter der Überschrift steht. Desktop: Bild rechts
   neben Überschrift und Autor, der Hinweis darunter über die volle Breite. */
.partner-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "head" "teaser" "photo";
}
.partner-intro-head { grid-area: head; }
.partner-intro-teaser { grid-area: teaser; }
.partner-intro-photo {
  grid-area: photo;
  margin-top: 1.25rem;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radius-xl2);
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 8%, transparent);
  box-shadow: var(--shadow-lift);
  background: var(--color-primary-100);
}
.partner-intro-photo img {
  display: block; width: 100%; height: 100%;
  object-fit: cover; object-position: 30% 30%;
}

@media (min-width: 64rem) {
  .partner-intro {
    grid-template-columns: minmax(0, 1fr) minmax(0, 27rem);
    grid-template-areas: "head photo" "teaser teaser";
    column-gap: 3rem;
    align-items: center;
  }
  /* Flach genug, dass Platin-Hinweis und Preiskarten im ersten Bildschirm bleiben. */
  .partner-intro-photo { margin-top: 0; aspect-ratio: 2 / 1; }
  .partner-intro-photo img { object-position: 30% 15%; }
}

/* ---------- Ablauf in drei Schritten ---------- */
.partner-ablauf-head { display: grid; gap: 1.5rem; align-items: center; }
.partner-ablauf-photo {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: var(--radius-xl2);
  box-shadow: var(--shadow-card);
  background: var(--color-primary-100);
}
.partner-ablauf-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }

@media (min-width: 48rem) {
  .partner-ablauf-head { grid-template-columns: minmax(0, 1fr) minmax(0, 24rem); gap: 2.5rem; }
}

/* ---------- Anfragen automatisch (Kurzform von „So funktioniert’s“) ----------
   Links Aussage, Bedingungen und Verweis, rechts dieselbe Statuskarte wie im
   Kopf von „So funktioniert’s“ — das Leitmotiv verbindet beide Seiten. */
.partner-auto-band { background: var(--color-sand); }
.partner-auto { display: grid; gap: 2rem; align-items: center; }
.partner-auto-facts { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 0.85rem; }
.partner-auto-facts > li {
  position: relative; padding-left: 1.6rem;
  line-height: 1.6; color: var(--color-primary-900);
}
.partner-auto-facts > li::before {
  content: ""; position: absolute; left: 0.1rem; top: 0.5rem;
  width: 0.7rem; height: 0.7rem; border-radius: 50%;
  background: var(--color-accent-500);
  box-shadow: 0 0 0 3px color-mix(in oklch, var(--color-accent-500) 30%, transparent);
}
.partner-auto-radius { display: grid; gap: 0.35rem; margin-top: 0.45rem; }
.partner-auto-radius-item { display: grid; grid-template-columns: 3.9rem minmax(0, 1fr); align-items: baseline; gap: 0.55rem; }
.partner-auto-radius-item .plan-chip { justify-content: center; }

.partner-auto-card {
  padding: 1.25rem 1.2rem 1.35rem;
  background: #fff;
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 10%, transparent);
  border-radius: var(--radius-xl2);
  box-shadow: var(--shadow-lift);
}
.partner-auto-kicker {
  padding-bottom: 0.8rem; margin-bottom: 0.9rem;
  border-bottom: 1px dashed color-mix(in oklch, var(--color-primary-700) 30%, transparent);
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-primary-700);
}
.partner-auto-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; }
.partner-auto-step {
  position: relative;
  display: grid; grid-template-columns: 2.35rem minmax(0, 1fr); gap: 0.8rem; align-items: center;
}
.partner-auto-step:not(:last-child)::after {
  content: ""; position: absolute; left: calc(1.175rem - 1px); top: 2.45rem; bottom: -0.75rem; width: 2px;
  background: var(--color-primary-600);
}
.partner-auto-dot {
  width: 2.35rem; height: 2.35rem; display: grid; place-items: center; border-radius: 50%;
  background: var(--color-primary-600); color: #fff;
}
.partner-auto-dot svg { width: 1.15rem; height: 1.15rem; stroke-width: 2; }
.partner-auto-step--now .partner-auto-dot {
  background: var(--color-accent-500); color: var(--color-primary-950);
  box-shadow: 0 0 0 4px color-mix(in oklch, var(--color-accent-500) 35%, transparent);
}
.partner-auto-text { display: grid; gap: 0.05rem; line-height: 1.3; }
.partner-auto-text strong { font-size: 0.98rem; color: var(--color-primary-950); }
.partner-auto-text span { font-size: 0.84rem; color: var(--color-primary-800); }
.partner-auto-track figcaption {
  margin-top: 0.8rem; font-size: 0.85rem; line-height: 1.5;
  color: var(--color-primary-800); text-align: center;
}

@media (min-width: 64rem) {
  .partner-auto { grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.85fr); gap: 3.5rem; }
}
