.werkzeuge-hub a:focus-visible,.werkzeuge-hub .btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:8px;box-shadow:0 0 0 4px #fff}.hub-hero{z-index:1;max-width:820px;padding:clamp(1.5rem, 4vw, 3.5rem) var(--spacing-lg) clamp(1.5rem, 3vw, 2.5rem);text-align:center;margin:0 auto;position:relative}.hub-breadcrumb{color:var(--color-ink-tertiary);flex-wrap:wrap;justify-content:center;margin:0 0 1.25rem;padding:0;font-size:.8125rem;list-style:none;display:flex}.hub-breadcrumb li{align-items:center;display:inline-flex}.hub-breadcrumb li:not(:first-child):before{content:"›";color:var(--color-border-strong);margin:0 .5rem}.hub-breadcrumb a{color:var(--color-ink-secondary);text-underline-offset:2px;text-decoration:underline;-webkit-text-decoration-color:var(--color-border-strong);text-decoration-color:var(--color-border-strong)}.hub-breadcrumb a:hover{color:var(--color-primary)}.hub-breadcrumb [aria-current=page]{color:var(--color-ink);font-weight:600}.hub-eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--color-primary);margin-bottom:.875rem;font-size:.75rem;font-weight:700;display:inline-block}.hub-h1{font-family:var(--font-display);letter-spacing:-.03em;color:var(--color-ink);max-width:16ch;margin:0 auto;font-size:clamp(2rem,4.6vw,3rem);font-weight:800;line-height:1.1}.hub-lede{color:var(--color-ink-secondary);max-width:46rem;margin:1.25rem auto 0;font-size:clamp(1rem,1.6vw,1.125rem);line-height:1.7}.hub-grid-section{z-index:1;max-width:1180px;padding:clamp(1.5rem, 3vw, 2.5rem) var(--spacing-lg) clamp(3rem, 6vw, 4.5rem);margin:0 auto;position:relative}.hub-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin:0;padding:0;list-style:none;display:grid}.hub-card{background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-lg);height:100%;transition:border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);flex-direction:column;gap:10px;padding:20px;text-decoration:none;display:flex}.hub-card:hover{border-color:color-mix(in srgb, var(--tool-accent) 45%, var(--color-border));box-shadow:var(--shadow-elevated);transform:translateY(-3px)}.hub-card-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.hub-card-icon{border-radius:var(--radius-md);background:var(--tool-accent-bg);width:42px;height:42px;color:var(--tool-accent);justify-content:center;align-items:center;display:inline-flex}.hub-card-category{text-transform:uppercase;letter-spacing:.07em;border-radius:var(--radius-pill);color:var(--tool-accent-text);background:var(--tool-accent-bg);padding:3px 9px;font-size:9px;font-weight:700}.hub-card-name{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-ink);font-size:16px;font-weight:800;line-height:1.2}.hub-card-tagline{color:var(--color-ink);font-size:13px;font-weight:600;line-height:1.4}.hub-card-desc{color:var(--color-ink-secondary);flex:1;font-size:12px;line-height:1.6}.hub-card-foot{border-top:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:10px;margin-top:6px;padding-top:12px;display:flex}.hub-card-chip{color:var(--tool-accent-text);background:var(--tool-accent-bg);border-radius:var(--radius-pill);align-items:center;padding:3px 9px;font-size:10px;font-weight:700;display:inline-flex}.hub-card-more{color:var(--color-ink-tertiary);white-space:nowrap;transition:color var(--transition-base);font-size:11px;font-weight:700}.hub-card:hover .hub-card-more{color:var(--tool-accent-text)}.hub-final{z-index:1;padding:clamp(3rem, 6vw, 5rem) var(--spacing-lg);text-align:center;border-top:1px solid var(--color-border);background:var(--color-surface-subtle);position:relative}.hub-final-inner{max-width:680px;margin:0 auto}.hub-final-inner h2{font-family:var(--font-display);letter-spacing:-.025em;color:var(--color-ink);margin:0 0 1rem;font-size:clamp(1.6rem,3.2vw,2.125rem);font-weight:800}.hub-final-inner p{color:var(--color-ink-secondary);max-width:34rem;margin:0 auto 2rem;font-size:1.0625rem;line-height:1.65}.hub-final-cta{flex-wrap:wrap;justify-content:center;gap:.875rem;display:flex}@media (max-width:1024px){.hub-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.hub-grid{grid-template-columns:1fr}.hub-final-cta .btn{text-align:center;width:100%}}@media (prefers-reduced-motion:reduce){.hub-card,.hub-card-more{transition:none}}
