main.section{padding:1em;background-color:#f8f4e9}article.content{background:#fffdf5;padding:4em;margin:1em 13em;border-radius:6px;box-shadow:0 2px 4px rgba(0,0,0,.1);position:relative;overflow:hidden;.lottie-container { position: absolute; top: -180px; right:-170px; width: 700px; height: 700px; opacity: 0.3; pointer-events: none; z-index: 1; } .content-wrapper { position: relative; z-index: 2; } .article-cover-image { width: 100%; margin-bottom: 2.5rem; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } .article-cover-image img { width: 100%; height: auto; display: block; object-fit: cover; } .badge { display: inline-flex!important; align-items: center!important; justify-content: center!important; background-color: rgba(33, 94, 172, 0.1)!important; color: #215eac!important; font-family: 'Inter', sans-serif!important; font-size: 0.75rem!important; font-weight: 500!important; line-height: 1!important; padding: 0.375rem 0.75rem!important; border-radius: 9999px!important; white-space: nowrap!important; text-transform: uppercase!important; letter-spacing: 0.025em!important; border: 1px solid rgba(33, 94, 172, 0.2)!important; } .article-meta { margin-bottom: 3rem!important; padding-bottom: 2rem!important; border-bottom: 1px solid #e0e0e0!important; display: flex!important; flex-direction: row!important; gap: 1.5rem!important; font-family: 'Inter', sans-serif!important; } .article-meta .byline { font-family: 'Inter', sans-serif!important; font-size: 0.875rem!important; color: #6b7280!important; margin-bottom: 0!important; text-transform: uppercase!important; letter-spacing: 0.05em!important; font-weight: 600!important; } .article-meta .last-updated { font-family: 'Inter', sans-serif!important; font-size: 0.875rem!important; color: #6b7280!important; margin-bottom: 0!important; font-weight: 500!important; } .language-switcher { margin: 0.5rem 0 2rem 0!important; padding: 0!important; background: transparent!important; border-radius: 0!important; text-align: left!important; } .language-switcher-label { font-family: 'Inter', sans-serif!important; font-size: 0.75rem!important; color: #6b7280!important; font-weight: 500!important; margin-right: 0.5rem!important; text-transform: uppercase!important; letter-spacing: 0.05em!important; } .language-switcher .language-link { font-family: 'Inter', sans-serif!important; font-size: 0.75rem!important; color: #215eac!important; text-decoration: none!important; padding: 0 0.5rem!important; font-weight: 600!important; } .language-switcher .language-link:hover { color: #2874c7!important; text-decoration: underline!important; } .language-switcher span { color: #6b7280!important; font-size: 0.75rem!important; } hr { border: none!important; height: 2px!important; background-color: rgba(33, 94, 172, 0.2)!important; margin: 2em 0!important; } h1.title.is-1 { font-family: 'Sora', sans-serif; font-size: 2.5rem; line-height: 1.2; font-weight: 800; margin-bottom: 2rem; color: #2A3049!important; text-align: left; max-width: 100%!important; letter-spacing: -0.03em!important; } h2 { font-family: 'Sora', sans-serif; font-size: 1.75rem!important; line-height: 1.25!important; font-weight: 700!important; margin-top: 3rem!important; margin-bottom: 1.5rem!important; padding-bottom: 0.5rem!important; color: #1a1a1a!important; border-bottom: 3px solid #215eac!important; letter-spacing: -0.02em!important; } h3 { font-family: 'Sora', sans-serif; font-size: 1.25rem !important; line-height: 1.3 !important; font-weight: 700 !important; margin-top: 2.5rem !important; margin-bottom: 1rem !important; padding-bottom: 0.25rem !important; color: #2d2d2d !important; border-bottom: 1px solid #e0e0e0 !important; letter-spacing: -0.01em !important; } h4 { font-family: 'Sora', sans-serif; color: #215eac !important; font-weight: 700 !important; font-size: 1.1rem !important; margin-bottom: 0.75rem !important; margin-top: 2rem !important; letter-spacing: -0.01em !important; } strong { font-weight: 700!important; color: #1a1a1a!important; } p { font-family: 'Inter', sans-serif; font-size: 1.0625rem!important; line-height: 1.75!important; margin-bottom: 1.75em!important; color: #2d2d2d!important; } ul, ol { margin: 1.25em 0!important; padding-left: 2em!important; } ul li { margin-bottom: 0.75em!important; line-height: 1.6!important; color: #4a4a4a!important; font-size: 1rem!important; position: relative!important; padding-left: 0.5em!important; list-style: disc!important; } ol li { margin-bottom: 0.75em!important; color: #4a4a4a!important; font-size: 1rem!important; line-height: 1.6!important; list-style: decimal!important; } a { color: #215eac!important; text-decoration: underline!important; font-weight: 500!important; } a:hover { color: #2874c7!important; text-decoration: underline!important; } table { width: 100%!important; border-collapse: collapse!important; margin: 2em 0!important; background-color: #ffffff!important; border-radius: 8px!important; overflow: hidden!important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1)!important; } thead { background-color: #215eac!important; color: #ffffff!important; } thead th { padding: 1rem 1.5rem!important; text-align: left!important; font-family: 'Sora', sans-serif!important; font-weight: 600!important; font-size: 0.95rem!important; border-bottom: 2px solid #2874c7!important; } tbody tr { border-bottom: 1px solid rgba(33, 94, 172, 0.1)!important; transition: background-color 0.2s ease!important; } tbody tr:hover { background-color: rgba(204, 228, 252, 0.3)!important; } tbody tr:last-child { border-bottom: none!important; } tbody td { padding: 1rem 1.5rem!important; color: #4a4a4a!important; font-size: 0.95rem!important; line-height: 1.6!important; vertical-align: top!important; } tbody td:first-child { font-weight: 600!important; color: #215eac!important; } tbody td::before { margin-right: 0.5em!important; } code { background-color: rgba(33, 94, 172, 0.1)!important; color: #215eac!important; padding: 0.2em 0.4em!important; border-radius: 3px!important; font-size: 0.9em!important; font-family: 'Courier New', monospace!important; } pre { border-radius: 6px!important; font-size: 0.85em!important; overflow-x: auto!important; background-color: #062751!important; margin-bottom: 2em!important; color: #f8f4e9!important; padding: 1.5em!important; } pre code { background-color: transparent!important; color: #f8f4e9!important; padding: 0!important; } blockquote { border-left: 4px solid #215eac!important; padding-left: 1.5em!important; margin: 2em 0!important; color: #4a4a4a!important; font-style: italic!important; background-color: rgba(204, 228, 252, 0.2)!important; padding: 1em 1.5em!important; border-radius: 4px!important; }}@media(max-width:1024px){article.content{padding:3em!important;margin:1em 6em!important}}@media(max-width:768px){article.content{padding:2em!important;margin:1em!important;.article-cover-image { margin-bottom: 1.5rem; border-radius: 6px; } .language-switcher { margin: 0.5rem 0 1.5rem 0!important; } .language-switcher-label, .language-switcher .language-link, .language-switcher span { font-size: 0.7rem!important; } .article-meta { flex-direction: column!important; gap: 0.5rem!important; } .lottie-container { width: 600px; height: 600px; opacity: 0.2; left:-40px; top: -120px; } h1.title.is-1 { font-size: 1.875rem!important; max-width: 100%!important; line-height: 1.15!important; } h2 { font-size: 1.5rem!important; margin-top: 2rem!important; } h3 { font-size: 1.125rem!important; margin-top: 1.75rem!important; } p, ul li, ol li { font-size: 0.95rem!important; } table { font-size: 0.85rem!important; display: block!important; overflow-x: auto!important; } thead th { padding: 0.75rem!important; font-size: 0.85rem!important; } tbody td { padding: 0.75rem!important; font-size: 0.85rem!important; }}}