.wgr-cat-container { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem 3rem; background-color: #FFF9F3; color: #230202; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; box-sizing: border-box; } .wgr-cat-container .wgr-article { background-color: #FFFFFF; border-radius: 18px; padding: 2.5rem 2.25rem; box-shadow: 0 18px 45px rgba(35, 2, 2, 0.08); box-sizing: border-box; } .wgr-cat-container .wgr-header { margin-bottom: 1.75rem; } .wgr-cat-container .wgr-header h1 { font-size: 2.1rem; line-height: 1.2; margin: 0 0 0.75rem; color: #230202; } .wgr-cat-container .wgr-meta { display: flex; flex-wrap: wrap; gap: 0.35rem; font-size: 0.9rem; color: #680505; align-items: center; } .wgr-cat-container .wgr-meta-dot { color: #DB0824; } .wgr-cat-container .wgr-meta span { display: inline-flex; align-items: center; } .wgr-cat-container .wgr-section { margin-top: 2rem; } .wgr-cat-container .wgr-section-title { font-size: 1.3rem; margin: 0 0 0.75rem; color: #3A0202; } .wgr-cat-container .wgr-intro p { margin: 0 0 0.85rem; line-height: 1.7; font-size: 1rem; } .wgr-cat-container .wgr-intro small { display: block; margin-top: 0.25rem; color: #680505; font-size: 0.85rem; } .wgr-cat-container .wgr-keypoints { background: #FEF3F3; border-radius: 14px; padding: 1.5rem 1.5rem 1.25rem; border: 1px solid #FDDCDC; } .wgr-cat-container .wgr-keypoints .wgr-section-title { font-size: 1.15rem; margin-bottom: 0.75rem; } .wgr-cat-container .wgr-text-list { list-style: none; padding: 0; margin: 0; } .wgr-cat-container .wgr-text-list li { position: relative; padding-left: 1.35rem; margin-bottom: 0.5rem; line-height: 1.6; font-size: 0.98rem; } .wgr-cat-container .wgr-text-list li::before { content: "›"; position: absolute; left: 0; top: 0; color: #DB0824; font-weight: 600; } .wgr-cat-container .wgr-section p { margin: 0 0 0.85rem; line-height: 1.7; font-size: 1rem; } .wgr-cat-container .wgr-section ul { padding-left: 1.15rem; margin: 0.25rem 0 0.85rem; } .wgr-cat-container .wgr-section ul li { margin-bottom: 0.4rem; line-height: 1.6; } .wgr-cat-container .wgr-section strong { font-weight: 600; } /* Boxen */ .wgr-cat-container .wgr-box { margin: 1.5rem 0; border-radius: 14px; padding: 1.35rem 1.4rem 1.3rem; border: 1px solid #FDDCDC; background-color: #FEF3F3; } .wgr-cat-container .wgr-box-header { display: flex; align-items: center; margin-bottom: 0.65rem; } .wgr-cat-container .wgr-box-pill { display: inline-flex; align-items: center; padding: 0.15rem 0.7rem; border-radius: 999px; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; } .wgr-cat-container .wgr-box-label { margin-left: 0.5rem; font-size: 0.9rem; font-weight: 600; color: #3A0202; } .wgr-cat-container .wgr-box-body p { margin: 0; font-size: 0.95rem; line-height: 1.7; } .wgr-cat-container .wgr-box--merke { border-left: 4px solid #DB0824; } .wgr-cat-container .wgr-box--merke .wgr-box-pill { background-color: #DB0824; color: #FFFFFF; } .wgr-cat-container .wgr-box--gesetz { border-left: 4px solid #680505; } .wgr-cat-container .wgr-box--gesetz .wgr-box-pill { background-color: #680505; color: #FFFFFF; } .wgr-cat-container .wgr-box--tipp { border-left: 4px solid #3A0202; } .wgr-cat-container .wgr-box--tipp .wgr-box-pill { background-color: #3A0202; color: #FFFFFF; } .wgr-cat-container .wgr-box--checkliste { border-left: 4px solid #F1A5B5; } .wgr-cat-container .wgr-box--checkliste .wgr-box-pill { background-color: #FDDCDC; color: #3A0202; } /* CTA */ .wgr-cat-container .wgr-cta { margin-top: 2.5rem; padding: 1.75rem 1.6rem; border-radius: 16px; background: linear-gradient(135deg, #FDDCDC, #FEF3F3); border: 1px solid #F7C0C8; } .wgr-cat-container .wgr-cta-title { font-size: 1.2rem; margin: 0 0 0.6rem; color: #3A0202; } .wgr-cat-container .wgr-cta-text { margin: 0; font-size: 0.98rem; line-height: 1.7; } /* FAQ */ .wgr-cat-container .wgr-faq { margin-top: 2.5rem; } .wgr-cat-container .wgr-faq-list { margin-top: 1rem; } .wgr-cat-container .wgr-faq-item { border-radius: 12px; border: 1px solid #F1D0D6; background-color: #FFFFFF; padding: 1rem 1.15rem 0.9rem; margin-bottom: 0.9rem; } .wgr-cat-container .wgr-faq-question { font-weight: 600; margin: 0 0 0.4rem; font-size: 1rem; color: #3A0202; } .wgr-cat-container .wgr-faq-answer { margin: 0; font-size: 0.96rem; line-height: 1.7; } /* Weiterführende Themen */ .wgr-cat-container .wgr-related { margin-top: 2.5rem; } .wgr-cat-container .wgr-related-title { font-size: 1.2rem; margin: 0 0 0.75rem; color: #3A0202; } .wgr-cat-container .wgr-related-list { list-style: none; padding: 0; margin: 0; } .wgr-cat-container .wgr-related-list li { padding-left: 1.1rem; position: relative; margin-bottom: 0.4rem; font-size: 0.97rem; } .wgr-cat-container .wgr-related-list li::before { content: "•"; position: absolute; left: 0; top: 0; color: #DB0824; } /* Links allgemein (für externe Quellenangaben) */ .wgr-cat-container a { color: #DB0824; text-decoration: none; } .wgr-cat-container a:hover, .wgr-cat-container a:focus { text-decoration: underline; } /* Responsive */ @media (max-width: 768px) { .wgr-cat-container .wgr-article { padding: 1.6rem 1.25rem; border-radius: 14px; } .wgr-cat-container .wgr-header h1 { font-size: 1.6rem; } .wgr-cat-container .wgr-section-title { font-size: 1.15rem; } .wgr-cat-container .wgr-keypoints { padding: 1.25rem 1.1rem 1.1rem; } .wgr-cat-container .wgr-cta { padding: 1.4rem 1.2rem; } }