/* a1 Tools — gemeinsame Komponenten der kostenlosen Tools (1hold.de, seit 24.10.2026)
 * Nur CI-Tokens (ci/tokens.json): navy-900 #0f172a, blue-600 #2563eb, blue-700 #1d4ed8, ink #374151, muted #64748b,
 * surface #fff, surface-50 #f8fafc, border #e2e8f0, border-input #d1d5db, green-700 #047a3a, tag-orange-text #b45309, red-600 #dc2626.
 * Geladen von Snippet 104 auf allen Tool-Seiten und den SEO-Leistungsseiten 3324/3352. Quelle: wp-sites/sites/1hold-de/tools/a1-tools.css */

/* Hinweis im Formular statt alert() */
html body .a1-tool-msg{margin:12px 0 0;padding:12px 16px;border-radius:10px;border:1px solid #e2e8f0;border-left:4px solid #dc2626;background:#fff;color:#374151;font-size:16px;line-height:1.5;text-align:left}
html body .a1-tool-msg.is-ok{border-left-color:#047a3a}

/* Vergleichstabelle (SEO vs. SEA): mobil als gestapelte Karten, ohne seitliches Wischen */
@media (max-width:640px){
  html body table.a1-cmp{font-size:16px!important;border:0}
  html body table.a1-cmp thead{display:none}
  html body table.a1-cmp,html body table.a1-cmp tbody,html body table.a1-cmp tr,html body table.a1-cmp td{display:block;width:100%!important;box-sizing:border-box}
  html body table.a1-cmp tr{border:1px solid #e2e8f0;border-radius:12px;margin:0 0 12px;overflow:hidden;background:#fff!important}
  html body table.a1-cmp td{border:0!important;border-top:1px solid #e2e8f0!important;padding:12px 16px!important;color:#374151}
  html body table.a1-cmp td:first-child{border-top:0!important;background:#f8fafc;font-weight:700;color:#0f172a}
  html body table.a1-cmp td[data-label]::before{content:attr(data-label);display:block;margin-bottom:4px;font-size:12.8px;line-height:1.7;font-weight:700;color:#64748b}
}

/* ---------- Tool-Komponenten (Paket 2, seit 24.10.2026) ---------- */
html body .a1t-stage{background:#f8fafc;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0;padding:48px 16px}
html body .a1t-stage>.a1t-stage-in{max-width:960px;margin:0 auto}
html body .a1t-stage h2.a1t-stage-title{margin:0 0 8px;color:#0f172a;font-size:27.2px;line-height:35.36px;font-weight:700}
html body .a1t-stage p.a1t-stage-lead{margin:0 0 24px;color:#64748b;font-size:17px;line-height:27.2px}
html body .a1t-app{color:#374151;font-size:17px;line-height:27.2px}
html body .a1t-app *,html body .a1t-app *::before,html body .a1t-app *::after{box-sizing:border-box}
html body .a1t-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;box-shadow:0 1px 3px #0000000f,0 8px 24px #0000000a}
html body .a1t-mt{margin-top:24px}
html body .a1t-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
html body .a1t-hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
html body .a1t-form{margin:0}
html body .a1t-field{margin:0 0 16px}
html body .a1t-field label,html body .a1t-label,html body .a1t-fieldset legend{display:block;margin:0 0 4px;color:#0f172a;font-size:15.2px;line-height:24.32px;font-weight:600}
html body .a1t-req{color:#dc2626}
html body .a1t-app input[type=text],html body .a1t-app input[type=url],html body .a1t-app input[type=tel],html body .a1t-app input[type=email],html body .a1t-app input[type=search],html body .a1t-app select,html body .a1t-app textarea{width:100%;min-height:48px;margin:0;padding:12px 16px;border:1px solid #d1d5db;border-radius:10px;background:#fff;color:#0f172a;font:inherit;font-size:16px;line-height:24px}
html body .a1t-app textarea{resize:vertical}
html body .a1t-app input:focus,html body .a1t-app select:focus,html body .a1t-app textarea:focus{outline:2px solid #2563eb;outline-offset:1px;border-color:#2563eb}
html body .a1t-fieldset{border:0;margin:0 0 8px;padding:0}
html body .a1t-fieldset legend{margin-bottom:12px;color:#64748b;font-size:12.8px;letter-spacing:1.5px;text-transform:uppercase;font-weight:700}
html body .a1t-grid2,html body .a1t-grid3{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
html body .a1t-grid3{grid-template-columns:repeat(3,1fr)}
html body .a1t-span2{grid-column:1/-1}
html body .a1t-inline{display:flex;gap:12px}
html body .a1t-inline input{flex:1}
html body .a1t-btn,html body a.a1t-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 32px;border:0;border-radius:10px;background:#2563eb;color:#fff;font:inherit;font-size:15.2px;line-height:24.32px;font-weight:700;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,transform .2s}
html body .a1t-btn:hover,html body a.a1t-btn:hover{background:#1d4ed8;color:#fff;transform:translateY(-1px)}
html body .a1t-btn[disabled]{opacity:.6;cursor:wait;transform:none}
html body .a1t-btn--ghost,html body a.a1t-btn--ghost{background:#fff;color:#0f172a;border:1px solid #e2e8f0;padding:10px 20px;min-height:44px}
html body .a1t-btn--ghost:hover,html body a.a1t-btn--ghost:hover{background:#f1f5f9;color:#0f172a}
html body .a1t-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html body .a1t-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}
html body .a1t-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
html body .a1t-chip{min-height:44px;padding:8px 16px;border:1px solid #e2e8f0;border-radius:100px;background:#fff;color:#374151;font:inherit;font-size:15.2px;cursor:pointer}
html body .a1t-chip:hover,html body .a1t-chip.is-on{border-color:#2563eb;background:#eff6ff;color:#0f172a}
html body .a1t-small{margin:12px 0 0;color:#64748b;font-size:14.4px;line-height:23.04px}
html body .a1t-count{margin:4px 0 0;color:#64748b;font-size:14.4px;line-height:23.04px}
html body .a1t-code{font-family:Monaco,Consolas,"Andale Mono","DejaVu Sans Mono",monospace!important;font-size:14.4px!important;background:#f8fafc!important;white-space:pre-wrap;word-break:break-all}
html body pre.a1t-code{margin:12px 0 0;padding:16px;border:1px solid #e2e8f0;border-radius:10px;max-height:320px;overflow:auto}
html body .a1t-out{margin-top:24px}
html body .a1t-result{outline:0}
html body .a1t-result-head{display:flex;align-items:center;gap:24px;padding:24px;background:#0f172a;border-radius:12px;color:#fff}
html body .a1t-score{position:relative;flex:0 0 120px;width:120px;height:120px}
html body .a1t-score svg{width:120px;height:120px;transform:rotate(-90deg)}
html body .a1t-ring-bg{fill:none;stroke:#ffffff26;stroke-width:10}
html body .a1t-ring{fill:none;stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .8s}
html body .a1t-score.is-good .a1t-ring{stroke:#4ade80}
html body .a1t-score.is-mid .a1t-ring{stroke:#f9ab00}
html body .a1t-score.is-bad .a1t-ring{stroke:#dc2626}
html body .a1t-score-num{position:absolute;inset:0;display:flex;align-items:baseline;justify-content:center;padding-top:38px}
html body .a1t-score-num strong{font-size:32px;line-height:1;font-weight:900;color:#fff}
html body .a1t-score-num span{font-size:12.8px;color:#94a3b8;margin-left:2px}
html body .a1t-eyebrow{margin:0;color:#4ade80;font-size:12.8px;line-height:21.76px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}
html body .a1t-grade{margin:4px 0;font-size:24px;line-height:1.3;font-weight:800;color:#fff}
html body .a1t-summary{margin:0;color:#94a3b8;font-size:16px;line-height:1.6}
html body .a1t-checks{list-style:none;margin:16px 0 0;padding:0}
html body .a1t-check{display:flex;gap:12px;margin:0 0 8px;padding:16px;background:#fff;border:1px solid #e2e8f0;border-left:4px solid #e2e8f0;border-radius:10px}
html body .a1t-check.is-pass{border-left-color:#047a3a}
html body .a1t-check.is-warn{border-left-color:#b45309}
html body .a1t-check.is-fail{border-left-color:#dc2626}
html body .a1t-check.is-info{border-left-color:#64748b}
html body .a1t-ico{flex:0 0 24px;width:24px;height:24px}
html body .a1t-ico svg,html body .a1t-lead-ok svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html body .a1t-check.is-pass .a1t-ico{color:#047a3a}
html body .a1t-check.is-warn .a1t-ico{color:#b45309}
html body .a1t-check.is-fail .a1t-ico{color:#dc2626}
html body .a1t-check.is-info .a1t-ico{color:#64748b}
html body .a1t-check strong{color:#0f172a;font-weight:600}
html body .a1t-val{display:block;color:#374151;font-weight:600;overflow-wrap:anywhere}
html body .a1t-check p{margin:4px 0 0;color:#374151;font-size:16px;line-height:1.6;overflow-wrap:anywhere}
html body .a1t-actions{margin-top:24px;padding:24px;background:#eff6ff;border:1px solid #e2e8f0;border-radius:12px}
html body .a1t-actions h3{margin:0 0 12px;color:#0f172a;font-size:17.6px;line-height:26.4px;font-weight:600}
html body .a1t-actions ol{margin:0;padding-left:24px}
html body .a1t-actions li{margin:0 0 8px;font-size:16px;line-height:1.6}
html body .a1t-app code{font-family:Monaco,Consolas,monospace;font-size:14.4px;background:#f1f5f9;padding:1px 6px;border-radius:6px}
html body .a1t-lead{margin-top:24px;padding:24px;background:#0f172a;border-radius:12px;color:#94a3b8}
html body .a1t-lead h3{margin:0 0 8px;color:#fff;font-size:17.6px;line-height:26.4px;font-weight:600}
html body .a1t-lead p{margin:0 0 16px;color:#94a3b8;font-size:16px;line-height:1.6}
html body .a1t-lead .a1t-small{margin:12px 0 0;color:#94a3b8}
html body .a1t-lead-row{display:flex;gap:12px}
html body .a1t-lead-row input{flex:1}
html body .a1t-lead-ok{display:flex;align-items:center;gap:8px;margin:0;color:#4ade80;font-weight:700}
html body .a1t-qr{display:flex;align-items:center;gap:24px;margin:24px 0 8px}
html body .a1t-qr img{width:200px;height:200px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
html body .a1t-qr-dl{display:flex;flex-direction:column;gap:12px}
html body .a1t-picks{margin-top:16px}
html body .a1t-pick{display:block;width:100%;margin:0 0 8px;padding:12px 16px;text-align:left;background:#fff;border:1px solid #e2e8f0;border-radius:10px;font:inherit;cursor:pointer;min-height:44px}
html body .a1t-pick:hover{border-color:#2563eb;background:#eff6ff}
html body .a1t-pick strong{display:block;color:#0f172a}
html body .a1t-pick span{color:#64748b;font-size:14.4px}
html body .a1t-alt{margin-top:16px}
html body .a1t-alt summary,html body details.a1t-card summary{cursor:pointer;color:#2563eb;font-weight:600;min-height:44px;display:flex;align-items:center}
html body .a1t-tabs{display:flex;gap:8px;margin:0 0 16px}
html body .a1t-tab{min-height:44px;padding:8px 20px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;color:#374151;font:inherit;font-size:15.2px;font-weight:600;cursor:pointer}
html body .a1t-tab.is-on{background:#0f172a;border-color:#0f172a;color:#fff}
/* Google-Vorschau: bildet die Google-Darstellung nach (bewusste Ausnahme von den CI-Farben, data-ci-exempt) */
html body .a1t-serp{max-width:652px;padding:16px;border:1px solid #e2e8f0;border-radius:12px;background:#fff;font-family:Arial,sans-serif}
html body .a1t-serp.is-mobile{max-width:400px}
html body .a1t-serp-site{display:flex;align-items:center;gap:12px;margin-bottom:6px}
html body .a1t-serp-fav{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#f1f3f4;color:#4d5156;font-size:14px}
html body .a1t-serp-name{display:block;color:#202124;font-size:14px;line-height:20px}
html body .a1t-serp-url{display:block;color:#4d5156;font-size:12px;line-height:18px}
html body .a1t-serp-title{color:#1a0dab;font-size:20px;line-height:26px;margin-bottom:4px}
html body .a1t-serp-desc{color:#4d5156;font-size:14px;line-height:22px}
@media (max-width:767px){
  html body .a1t-stage{padding:32px 16px}
  html body .a1t-card{padding:16px}
  html body .a1t-grid2,html body .a1t-grid3{grid-template-columns:1fr}
  html body .a1t-inline,html body .a1t-lead-row{flex-direction:column}
  html body .a1t-inline .a1t-btn,html body .a1t-lead-row .a1t-btn{width:100%}
  html body .a1t-result-head{flex-direction:column;text-align:center;gap:12px}
  html body .a1t-qr{flex-direction:column;align-items:flex-start}
  html body .a1t-small,html body .a1t-count,html body .a1t-pick span{font-size:16px}
}
/* Seitenbausteine der neuen Tool-Seiten (statt Inline-Styles) */
html body .cta-section .a1t-cta-in{max-width:520px;margin:0 auto;text-align:center}
html body .cta-section .a1t-cta-in h2{margin:0 0 12px;color:#fff;font-size:24px;line-height:1.3}
html body .cta-section .a1t-cta-in p{margin:0 0 28px}
html body .cta-section .a1t-cta-in p:last-child{margin:0}
html body .toc a.toc-tool,html body .toc a.toc-cta{color:#2563eb;font-weight:600}
/* Tools-Hub: Gruppen + Kachel-Buttons (statt Inline-Styles) */
html body .a1t-hub-group{margin:32px 0 16px;font-size:17.6px;line-height:26.4px;font-weight:600;color:#047a3a}
html body .service-card a.a1t-hub-title{color:inherit;text-decoration:none}
html body .service-card a.a1t-hub-title:hover{color:#2563eb}
html body .service-card a.a1t-hub-btn{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;padding:10px 20px;border-radius:10px;background:#2563eb;color:#fff;font-size:15.2px;line-height:24.32px;font-weight:700;text-decoration:none;transition:background .2s,transform .2s}
html body .service-card a.a1t-hub-btn:hover{background:#1d4ed8;color:#fff;transform:translateY(-1px)}
/* Quick-Check-Ring: Score 100 nicht umbrechen (absolut zentrierter Block schrumpft auf halbe Breite) */
html body #score-center{white-space:nowrap}
/* Redirect-Checker + Bild-Optimierer (seit 24.10.2026) */
html body ol.a1t-steps{margin:8px 0 0;padding-left:24px}
html body ol.a1t-steps li{margin:0 0 6px;font-size:16px;line-height:1.6;overflow-wrap:anywhere}
html body .a1t-app input[type=range]{width:100%;min-height:44px;accent-color:#2563eb}
html body .a1t-app input[type=file]{width:100%;min-height:48px;padding:10px 12px;border:1px dashed #d1d5db;border-radius:10px;background:#f8fafc;font-size:16px}
html body .a1t-imgcmp figure{margin:0}
html body .a1t-imgcmp img{display:block;max-width:100%;max-height:420px;height:auto;border:1px solid #e2e8f0;border-radius:12px;background:#f1f5f9}
html body .a1t-imgcmp figcaption{margin-top:8px;color:#64748b;font-size:14.4px}
