/* omega3-test.net — gemeinsame Bausteine für Rechner, Quiz und Funnel-Seiten (21.10.2026) */

.o3-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ---------- Lead-Formular v2 ---------- */
.o3-lm .o3-lm-icon { font-size: 2.2rem; margin-bottom: 0.6rem; }
.o3-lm .cta-box-form input[type="email"] { min-width: 0; }
.o3-lm .o3-lm-legal { font-size: 0.78rem; color: rgba(255,255,255,0.6); margin: 0.9rem auto 0; max-width: 440px; }
.o3-lm .o3-lm-legal a, .o3-lm .consent-wrap a { color: var(--accent); }
.o3-lm .o3-lm-error { margin: 0.8rem auto 0; max-width: 440px; padding: 0.55rem 0.8rem; border-radius: 8px; background: rgba(239,68,68,0.18); color: #FECACA; font-size: 0.85rem; }
.o3-lm-success { padding: 1.5rem 0.5rem; }
.o3-lm-success .o3-lm-check { font-size: 2.6rem; color: var(--accent); margin-bottom: 0.6rem; }
.o3-lm-success h3 { color: #fff; }
.o3-lm-success p { color: rgba(255,255,255,0.75); }
.o3-lm-success .o3-lm-small { font-size: 0.8rem; color: rgba(255,255,255,0.5); }
@media (max-width: 560px) {
    .cta-box { padding: 1.8rem 1.2rem; }
    .o3-lm .cta-box-form { flex-direction: column; }
    .o3-lm .cta-box-form button { width: 100%; }
}

/* ---------- Ergebnis-Karten ---------- */
.o3-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.4rem 1.5rem; box-shadow: var(--shadow); }
.o3-card + .o3-card { margin-top: 1rem; }
.o3-card h3 { font-family: 'Playfair Display', serif; color: var(--primary); margin-bottom: 0.4rem; }
.o3-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.8rem; margin: 1rem 0; }
.o3-kpi div { background: var(--bg-warm); border-radius: 10px; padding: 0.9rem 1rem; }
.o3-kpi strong { display: block; font-size: 1.5rem; color: var(--primary); line-height: 1.2; }
.o3-kpi span { font-size: 0.82rem; color: var(--text-muted); }

/* Ampel-Badges */
.o3-badge { display: inline-block; padding: 0.2rem 0.65rem; border-radius: 50px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.02em; }
.o3-badge--low { background: rgba(239,68,68,0.12); color: #B91C1C; }
.o3-badge--mid { background: rgba(245,158,11,0.15); color: #92400E; }
.o3-badge--good { background: rgba(34,197,94,0.14); color: #166534; }
.o3-badge--info { background: rgba(46,139,139,0.12); color: var(--secondary); }

/* ---------- CTA-Raster nach Ergebnissen ---------- */
.o3-cta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.o3-cta-card { display: flex; flex-direction: column; gap: 0.35rem; padding: 1.2rem; border-radius: 12px; background: #fff; border: 1px solid rgba(30,58,95,0.12); color: #334155; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.o3-cta-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(15,40,68,0.12); color: #334155; }
.o3-cta-card strong { color: var(--primary); font-size: 1.05rem; }
.o3-cta-card .o3-cta-tag { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--secondary); }
.o3-cta-card .o3-cta-go { margin-top: auto; padding-top: 0.4rem; font-weight: 700; color: var(--secondary); }
.o3-cta-card--primary { background: var(--primary); border-color: var(--primary); color: rgba(255,255,255,0.82); }
.o3-cta-card--primary:hover { color: rgba(255,255,255,0.9); }
.o3-cta-card--primary strong { color: #fff; }
.o3-cta-card--primary .o3-cta-tag, .o3-cta-card--primary .o3-cta-go { color: var(--accent); }

/* Werbelink-Kennzeichnung direkt am Link */
.o3-ad-note { display: block; font-size: 0.74rem; color: var(--text-muted); margin-top: 0.35rem; }
.o3-cta-card--primary .o3-ad-note { color: rgba(255,255,255,0.55); }
.o3-transparency { font-size: 0.82rem; color: var(--text-muted); border-left: 3px solid var(--border); padding-left: 0.8rem; margin: 1rem 0; }

/* ---------- Range-Slider ---------- */
.o3-range { width: 100%; accent-color: var(--secondary); height: 2rem; }
.o3-range-row { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.o3-range-value { font-weight: 800; font-size: 1.4rem; color: var(--primary); }

/* ---------- Quellen- und Methodenkasten ---------- */
.o3-sources { font-size: 0.85rem; color: var(--text-light); background: var(--bg-warm); border-radius: 10px; padding: 1rem 1.2rem; margin: 1.5rem 0; }
.o3-sources h4 { font-size: 0.9rem; color: var(--primary); margin-bottom: 0.4rem; }
.o3-sources ol, .o3-sources ul { padding-left: 1.2rem; }

/* Tabellen mobil scrollbar */
.o3-tablewrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.2rem 0; border-radius: 10px; }
.o3-tablewrap table { min-width: 640px; }

/* Grafiken */
.o3-figure { margin: 2rem 0; }
.o3-figure img, .o3-figure svg { width: 100%; height: auto; display: block; border-radius: 12px; }
.o3-figure figcaption { font-size: 0.8rem; color: var(--text-muted); margin-top: 0.5rem; }

/* Autorbox */
.o3-author { display: flex; gap: 1rem; align-items: flex-start; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.2rem; margin: 2rem 0; }
.o3-author-img { flex: 0 0 64px; height: 64px; border-radius: 50%; background: linear-gradient(135deg, var(--secondary), var(--primary)); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.3rem; }
.o3-author p { margin: 0.2rem 0 0; font-size: 0.9rem; color: var(--text-light); }

/* Fokus sichtbar */
.calc-option input:focus-visible + label, .quiz-option input:focus-visible + label, .o3-cta-card:focus-visible, .btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

/* ---------- Artikel-Endblock v2: drei Karten ---------- */
.o3-endbox-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 860px) { .o3-endbox-grid--3 { grid-template-columns: 1fr; } }

/* Footer mit fünf Spalten (Rechner & Tools, 27.10.2026) */
@media (min-width: 901px) {
    .footer-grid { grid-template-columns: 1.6fr repeat(4, 1fr); gap: 2rem; }
}