/* =============================================================================
   CHECK-ZEILE: die schmale Einladung zum Website-Check (Prototyp 20.10.2026)
   Sitzt auf /websites zwischen den Referenzen und der Kundenstimme, also
   genau dort, wo man gerade 92 bis 99 Punkte gesehen hat. Kein Kasten, eine
   Haarlinie oben, Knopf wie .web-btn. Kein JavaScript: schlichtes
   GET-Formular, gestartet wird erst auf /website-check/.
   Gleiche Breite wie die Kundenstimme darunter (--wrap).
   ========================================================================== */
.check-zeile{max-width:var(--wrap);margin:clamp(40px,5.5vw,72px) auto 0;padding-top:clamp(20px,2.4vw,28px);
  border-top:1px solid var(--line);display:grid;gap:12px clamp(24px,4vw,56px);align-items:center}
@media(min-width:900px){.check-zeile{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}}
.check-zeile__titel{margin:0;font-size:clamp(1.18rem,2vw,1.5rem);line-height:1.22;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.check-zeile__titel span{font-weight:560;color:var(--ink-soft)}
.check-zeile__titel b{font-weight:740}
/* "Google-Test" und der Link brechen nie am Bindestrich bzw. mittendrin. */
.check-zeile__fest{white-space:nowrap}
.check-zeile__feld{display:flex;min-width:0}
.check-zeile__feld input{flex:1;min-width:0;height:52px;margin:0;padding:0 16px;border:1px solid #cfd8e3;border-right:0;border-radius:0;
  background:#fff;color:var(--ink);font:500 1rem/1 Geist,"Geist Ersatz",system-ui,sans-serif;
  transition:border-color .15s ease,box-shadow .2s ease}
.check-zeile__feld input::placeholder{color:#8695a5}
.check-zeile__feld input:focus{outline:0;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(25,191,244,.22)}
/* .web-btn sitzt auf /websites sonst immer auf Links, die Geist erben. Ein
   <button> nimmt ohne diese Zeile die Systemschrift und sticht heraus.
   ZWEITKNOPF, nicht Cyan: Auf /websites ist Cyan die Anfrage. Der Check ist
   der zweite Weg dorthin und darf nicht gleich laut sein wie
   "Unverbindlich anfragen" (Nutzerfrage 20.10.2026: fuehrt das Tool weg?). */
.check-zeile__feld .web-btn{flex:none;white-space:nowrap;font-family:inherit;
  background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.check-zeile__feld .web-btn:hover{background:var(--ink);color:#fff;box-shadow:none;transform:none}
.check-zeile__feld .web-btn:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.check-zeile__hinweis{grid-column:1/-1;margin:0;font-size:.86rem;color:var(--muted)}
@media(min-width:900px){.check-zeile__hinweis{grid-column:2}}
.check-zeile__hinweis a{color:var(--cyan-ink);font-weight:640;text-decoration:none}
.check-zeile__hinweis a:hover{text-decoration:underline}
@media(max-width:560px){
  .check-zeile__feld{flex-direction:column}
  /* flex:none, sonst setzt flex:1 in der Spalte die Hoehe auf 0 und das
     Feld schrumpft auf seine Mindesthoehe (gemessen 390 px: 22 px). */
  .check-zeile__feld input{flex:none;height:52px;border-right:1px solid #cfd8e3;font-size:16px}
  .check-zeile__feld .web-btn{width:100%;margin-top:10px}
}