/* TeamCheck-Teaser — gemeinsame Komponente für Startseite und Unterseiten.
   Eine Quelle, damit der TeamCheck überall gleich aussieht. Feste Markenwerte statt
   Seiten-Variablen, weil Startseite (--navy …) und Unterseiten (--c-section …) verschiedene Token-Sets haben.
   Markup-Vorlage: siehe index.html, Sektion class="tc-teaser". Logik: crew-up-tc-teaser.js */
.tc-teaser{padding:clamp(72px,8vw,96px) 0;background:linear-gradient(135deg,#fbe0d6 0%,#f6f0e8 100%);font-size:16px;line-height:normal;font-family:Inter,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:#3d4a5f}
.tc-teaser *{box-sizing:border-box}
.tc-teaser-grid{width:min(1200px,calc(100% - 48px));margin-inline:auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,6vw,76px);align-items:center}
.tc-teaser-copy{max-width:520px}
.tc-teaser-eyebrow{margin:0 0 13px;font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.19em;font-weight:700;color:#17253F}
.tc-teaser h2{margin:0;font-family:Lora,Georgia,serif;font-weight:500;color:#17253f;font-size:clamp(31px,3.25vw,46px);line-height:1.1;letter-spacing:-.026em;overflow-wrap:break-word}
.tc-teaser-lead{max-width:56ch;margin:18px 0 0;font-size:16px;line-height:1.7;color:#3d4a5f}
.tc-teaser-pills{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:22px 0 0;padding:0}
.tc-teaser-pills li{padding:7px 13px;border-radius:999px;background:#fff;border:1px solid rgba(23,37,63,.1);font-size:12.5px;font-weight:600;color:#17253f}
.tc-teaser-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:25px}
.tc-teaser-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 21px;border-radius:8px;background:#17253f;color:#fff!important;font-size:14px;font-weight:600;text-decoration:none;transition:background .25s,transform .25s cubic-bezier(.22,.61,.36,1)}
.tc-teaser-btn:hover{background:#0e1a30;transform:translateY(-1px)}
.tc-teaser-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#17253f!important;text-decoration:none}
.tc-teaser-link::after{content:"→";transition:transform .24s cubic-bezier(.22,.61,.36,1)}
.tc-teaser-link:hover::after{transform:translateX(3px)}
.tc-teaser-note{margin:14px 0 0;font-size:13px;color:#5A6578}

.tc-demo{display:block;width:min(100%,480px);margin-inline:auto;padding:26px 26px 22px;border-radius:20px;background:#fff;box-shadow:0 30px 70px -36px rgba(23,37,63,.45);color:#17253f;text-decoration:none;transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s}
.tc-demo:hover,.tc-demo:focus-visible{transform:translateY(-4px);box-shadow:0 40px 80px -36px rgba(23,37,63,.5)}
.tc-demo:focus-visible{outline:3px solid #97bae2;outline-offset:4px}
.tc-demo-head{display:flex;align-items:center;gap:14px;font-size:12px;color:#5A6578}
.tc-demo-count{white-space:nowrap}
.tc-demo-count b{color:#17253f}
.tc-demo-progress{flex:1;height:4px;border-radius:4px;background:#f9f3eb;overflow:hidden}
.tc-demo-progress i{display:block;height:100%;width:var(--prog,9%);background:#d87563;border-radius:4px;transition:width .7s cubic-bezier(.22,.61,.36,1)}
.tc-demo-slides{position:relative;display:grid;margin-top:18px}
.tc-slide{grid-area:1/1;opacity:0;transform:translateX(18px);transition:opacity .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1)}
.tc-slide.is-active{opacity:1;transform:none}
.tc-slide.is-leaving{opacity:0;transform:translateX(-18px)}
.tc-cat{margin:0;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#d87563}
.tc-q{margin:8px 0 0;font-family:Lora,Georgia,serif;font-size:20px;line-height:1.35;color:#17253f}
.tc-scale{display:grid;gap:7px;list-style:none;margin:18px 0 0;padding:0}
.tc-scale li{padding:9px 12px;border:1px solid rgba(23,37,63,.14);border-radius:10px;font-size:13px;color:#3d4a5f;transition:background .3s,border-color .3s,color .3s,transform .3s}
.tc-scale li.is-picked{background:#17253f;border-color:#17253f;color:#fff;transform:translateX(4px)}
.tc-bars{display:grid;gap:12px;list-style:none;margin:20px 0 0;padding:0}
.tc-bars li{display:grid;grid-template-columns:120px minmax(0,1fr);align-items:center;gap:12px;font-size:13px}
.tc-bars i{display:block;height:8px;width:calc(var(--v) * 100%);border-radius:8px;background:linear-gradient(90deg,#78c3a7,#97bae2);transform-origin:left;transform:scaleX(0);transition:transform .9s cubic-bezier(.22,.61,.36,1) .15s}
.tc-slide--result.is-active .tc-bars i{transform:scaleX(1)}
.tc-next{margin:18px 0 0;font-size:13px;color:#3d4a5f}
.tc-demo-cta{margin-top:18px;padding-top:14px;border-top:1px solid rgba(23,37,63,.14);font-size:13px;font-weight:700;color:#d87563}

@media(max-width:760px){.tc-teaser{padding:70px 0}.tc-teaser-grid{grid-template-columns:minmax(0,1fr);gap:30px}.tc-teaser-copy{max-width:none}}
@media(max-width:760px){.tc-teaser-grid{width:min(1200px,calc(100% - 32px))}.tc-q{font-size:18px}.tc-bars li{grid-template-columns:100px minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.tc-slide,.tc-bars i,.tc-demo,.tc-scale li{transition:none}}