/* Tracking-Check (/tracking-check/, /en/tracking-check/). Ergänzt style.css. */
:root{
  --st-ok:#1F7A55;   --st-ok-bg:#E6F2EC;
  --st-warn:#9A6200; --st-warn-bg:#FBF1DE;
  --st-bad:#B3261E;  --st-bad-bg:#FBE9E7;
  --st-info:#5E6A67; --st-info-bg:#EEF2F1;
}

.tc-hero{max-width:860px;
  /* Der Hero der Startseite ist bewusst grosszuegig gepolstert. Auf der
     Werkzeugseite soll das Eingabefeld frueh sichtbar sein, deshalb hier
     deutlich knapper. */
  padding-block:clamp(32px,3.6vw,56px) clamp(40px,5vw,72px)}
/* Die Krume ist eine Orientierungszeile, keine eigene Hero-Zeile: sie rueckt
   dicht unter den Kopf, statt den vollen Zeilenabstand zu beanspruchen. */
.tc-hero .tc-crumbs{margin-bottom:calc(clamp(28px,4vw,52px) * -1 + 12px)}
.tc-hero .lead{max-width:62ch}

.tc-search{display:flex;flex-direction:column;gap:10px;width:100%;max-width:680px}
.tc-search__label{font-size:.625rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.tc-search__row{display:flex;gap:10px}
.tc-search input{
  flex:1;min-width:0;font:inherit;font-size:1.05rem;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:.85em 1em;
}
.tc-search input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.tc-search .btn{cursor:pointer}
.tc-search .btn[disabled]{opacity:.6;cursor:wait}

.tc-status{padding-block:0 40px;color:var(--ink-2)}
.tc-status--error{color:var(--st-bad)}
.tc-spinner{display:inline-block;width:14px;height:14px;margin-right:10px;vertical-align:-2px;
  border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:tcspin .8s linear infinite}
@keyframes tcspin{to{transform:rotate(360deg)}}

.tc-verdict{width:100%;display:flex;flex-direction:column;gap:12px}
.tc-verdict__url{font-size:.875rem;color:var(--muted);word-break:break-all}
.tc-verdict__counts{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}

.tc-chip{display:inline-flex;align-items:center;gap:7px;font-size:.6875rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:.45em .8em;border-radius:var(--r-sm);white-space:nowrap}
.tc-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.tc-chip--ok{color:var(--st-ok);background:var(--st-ok-bg)}
.tc-chip--warn{color:var(--st-warn);background:var(--st-warn-bg)}
.tc-chip--bad{color:var(--st-bad);background:var(--st-bad-bg)}
.tc-chip--info{color:var(--st-info);background:var(--st-info-bg)}

.tc-items{width:100%;display:grid;gap:12px}
.tc-item{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:20px 22px;
  border:1px solid var(--line);border-left-width:4px;border-radius:var(--r-lg);background:#fff}
.tc-item--ok{border-left-color:var(--st-ok)}
.tc-item--warn{border-left-color:var(--st-warn)}
.tc-item--bad{border-left-color:var(--st-bad)}
.tc-item--info{border-left-color:var(--line)}
.tc-item__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px}
.tc-item h3{font-size:1.05rem}
.tc-item p{color:var(--ink-2);font-size:.975rem;line-height:1.6;max-width:72ch}

.tc-recs{width:100%;padding:24px;border-radius:var(--r-lg);background:var(--mint-soft)}
.tc-recs h3{font-size:1.1rem;margin-bottom:12px}
.tc-recs ol{margin:0;padding-left:1.3em;display:grid;gap:8px;color:var(--ink-2)}

@media (max-width:560px){
  .tc-search__row{flex-direction:column}
  .tc-search .btn{justify-content:center}
  .tc-item{padding:16px 16px}
}

/* Brotkrumen */
.tc-crumbs{display:flex;gap:8px;font-size:.8125rem;color:var(--muted)}
.tc-crumbs a{color:var(--muted);text-decoration:none}
.tc-crumbs a:hover{color:var(--ink);text-decoration:underline}

/* Prüfumfang */
.tc-feat{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.tc-feat__item{padding:20px 22px;border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;display:flex;flex-direction:column;gap:8px}
.tc-feat__item h3{font-size:1.02rem}
.tc-feat__item p{color:var(--ink-2);font-size:.95rem;line-height:1.6}

/* FAQ */
.tc-faq{width:100%;display:grid;gap:10px}
.tc-faq__item{border:1px solid var(--line);border-radius:var(--r-lg);background:#fff}
.tc-faq__item summary{cursor:pointer;list-style:none;padding:18px 52px 18px 22px;position:relative}
.tc-faq__item summary::-webkit-details-marker{display:none}
.tc-faq__item summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:1.4rem;line-height:1;color:var(--accent)}
.tc-faq__item[open] summary::after{content:"–"}
.tc-faq__item summary h3{font-size:1.02rem;display:inline}
.tc-faq__item p{padding:0 22px 20px;color:var(--ink-2);font-size:.975rem;line-height:1.65;max-width:76ch}
.tc-faq__item summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-lg)}
