/* DoWell — Wissens-Zaehler (Block "know"). Nutzt die Tokens aus style.css */
.know{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(52px,7.5vw,96px) 0;position:relative;overflow:hidden}
.know::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transform:translateX(-100%);animation:knowsweep 7s ease-in-out infinite}
@keyframes knowsweep{0%,12%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}}
.know .wrap{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(30px,5vw,76px);align-items:end}
.know-live{display:inline-flex;align-items:center;gap:10px}
.know-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent);animation:knowpulse 2s infinite}
.know.is-off .know-dot{background:var(--ink-dim);animation:none}
@keyframes knowpulse{70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.know-title{font-family:var(--serif);font-weight:330;font-size:clamp(28px,3.9vw,46px);line-height:1.1;letter-spacing:-.012em;margin:20px 0 0;max-width:20ch}
.know-title em{font-style:italic;color:var(--accent);font-weight:340}
.know-num{font-family:var(--serif);font-weight:300;font-size:clamp(40px,7.4vw,104px);line-height:1;letter-spacing:-.02em;display:flex;align-items:flex-end;white-space:nowrap;color:var(--ink);min-height:1em}
.know-num .od{display:inline-block;height:1em;width:.56em;overflow:hidden;text-align:center}
.know-num .od-strip{display:block;transition:transform .9s cubic-bezier(.16,.84,.24,1);will-change:transform}
.know-num .od-strip.nt{transition:none}
.know-num .od-strip i{display:block;height:1em;line-height:1em;font-style:normal}
.know-num .od-sep{display:inline-block;width:.26em;text-align:center;color:var(--accent)}
.know-sub{margin:18px 0 0;font-size:clamp(16px,1.7vw,19px);line-height:1.55;color:var(--ink-soft);max-width:46ch}
.know-facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:clamp(8px,2vw,22px)}
.know-fact{padding:24px clamp(14px,2.4vw,32px) 0 0;border-right:1px solid var(--line);margin-right:clamp(14px,2.4vw,32px)}
.know-fact:last-child{border-right:0;margin-right:0}
.know-fact b{display:block;font-family:var(--serif);font-weight:330;font-size:clamp(28px,3.4vw,42px);line-height:1.05;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:lining-nums}
.know-fact span{display:block;margin-top:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-dim);line-height:1.55}
.know-fact.tick b{animation:knowtick .8s ease-out}
@keyframes knowtick{0%{color:var(--accent)}100%{color:var(--ink)}}
@media(max-width:880px){.know .wrap{grid-template-columns:1fr;align-items:start}.know-facts{grid-template-columns:1fr}.know-fact{border-right:0;margin-right:0;border-bottom:1px solid var(--line);padding:18px 0}.know-fact:last-child{border-bottom:0}}
@media(prefers-reduced-motion:reduce){.know::before,.know-dot{animation:none}.know-num .od-strip{transition:none}.know-fact.tick b{animation:none}}

/* Verweis auf die Live-Recherche */
.know-more{grid-column:1/-1;margin:clamp(18px,3vw,30px) 0 0}
.know-more a{display:inline-flex;gap:14px;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;line-height:1.5;color:var(--ink);text-decoration:none;border:1px solid var(--ink);padding:14px 18px;background:var(--paper);transition:background .2s,color .2s}
.know-more a i{font-style:normal;color:var(--accent);font-size:16px;transition:transform .2s}
.know-more a:hover{background:var(--ink);color:var(--paper)}.know-more a:hover i{transform:translateX(4px)}
