.article-page{background:#f8fafc;width:100%;--article-gradient-from: #334155;--article-gradient-to: #94a3b8;--article-quote-border: #0f172a;--article-quote-mark: #e2e8f0;--article-highlight-bg: #0f172a;--article-highlight-color: #ffffff}.article-page .article-main{max-width:56rem;margin:0 auto;padding:5rem 1rem 3rem;animation:articleFadeIn .8s ease-out forwards}.article-page .article-header{text-align:center;margin-bottom:3rem}.article-page .article-badge{display:inline-block;background:#f0fdfa;color:#0d9488;padding:.25rem .75rem;border-radius:9999px;font-size:.875rem;font-weight:600;letter-spacing:.05em;margin-bottom:1.5rem;text-transform:uppercase;font-family:var(--font-body)}.article-page .article-title{font-size:clamp(2.25rem,5vw,3.75rem);font-weight:800;color:#0f172a;letter-spacing:-.025em;line-height:1.1;margin-bottom:1.5rem;font-family:var(--font-body)}.article-page .article-title-gradient{background:linear-gradient(to right,var(--article-gradient-from),var(--article-gradient-to));-webkit-background-clip:text;background-clip:text;color:transparent}.article-page .article-subtitle{font-size:1.25rem;color:#64748b;max-width:42rem;margin:0 auto 2rem;font-style:italic;font-family:var(--font-heading)}.article-page .article-hero{margin-bottom:4rem;border-radius:1rem;overflow:hidden;box-shadow:0 25px 50px -12px #94a3b880;position:relative}.article-page .article-hero-overlay{position:absolute;inset:0;background:#0f172a1a;z-index:1;pointer-events:none;transition:background .5s}.article-page .article-hero:hover .article-hero-overlay{background:transparent}.article-page .article-hero-img{width:100%;height:400px;object-fit:cover;display:block;transition:transform .7s ease-in-out}.article-page .article-hero:hover .article-hero-img{transform:scale(1.05)}.article-page .article-hero-caption{position:absolute;bottom:1rem;right:1rem;font-size:.75rem;color:#fffc;z-index:2;background:#0006;padding:.25rem .5rem;border-radius:.25rem;backdrop-filter:blur(4px)}.article-page .article-meta{max-width:42rem;margin:0 auto 2.5rem;display:flex;align-items:flex-start;gap:.75rem;font-family:var(--font-body)}.article-page .article-meta-logo{width:2.25rem;height:2.25rem;border-radius:.5rem;object-fit:contain;flex-shrink:0}.article-page .article-meta-text{font-size:.875rem;color:#64748b;line-height:1.6}.article-page .article-body{font-family:var(--font-body);font-size:1.125rem;line-height:1.75;color:#334155;max-width:42rem;margin:0 auto}.article-page .article-body>p{margin-bottom:2rem}.article-page .article-body a{color:#0d9488;text-decoration:underline}.article-page .article-body a:hover{color:#14b8a6}.article-page .drop-cap:first-letter{float:left;font-size:5rem;line-height:.85;padding-right:.75rem;padding-top:.1rem;font-weight:700;color:#0d9488;font-family:var(--font-body)}.article-page .article-figure-wide{margin:3rem -1rem;position:relative}.article-page .article-figure-bg{position:absolute;inset:-1.5rem -1rem;background:#f1f5f980;border-radius:1.5rem;z-index:-1}.article-page .article-figure-img{width:100%;height:auto;border-radius:.75rem;box-shadow:0 10px 15px -3px #0000001a;object-fit:cover}.article-page .article-figcaption{text-align:center;font-size:.875rem;color:#64748b;margin-top:1rem;font-family:var(--font-body)}.article-page .article-float{margin-top:.5rem;position:relative;z-index:1}.article-page .article-float-img{width:100%;height:auto;border-radius:.75rem;box-shadow:0 4px 6px -1px #0000001a;object-fit:cover;border:4px solid white}.article-page .article-pullquote{margin:3.5rem 0;position:relative;font-family:var(--font-body)}.article-page .article-pullquote-mark{position:absolute;top:-2rem;left:-1.5rem;color:var(--article-quote-mark);font-size:6rem;font-family:var(--font-heading);line-height:1;user-select:none;z-index:0}.article-page .article-pullquote-box{position:relative;z-index:1;border-left:4px solid var(--article-quote-border);background:#fff;box-shadow:0 20px 25px -5px #0f172a0d;border-radius:0 1rem 1rem 0;padding:2rem 2.5rem}.article-page .article-pullquote-text{font-size:clamp(1.5rem,3vw,1.875rem);font-weight:700;color:#0f172a;line-height:1.3;margin-bottom:1rem}.article-page .article-pullquote-highlight{color:var(--article-highlight-color);background:var(--article-highlight-bg);padding:0 .5rem;border-radius:.5rem}.article-page .article-pullquote-source{font-size:.875rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em}.article-page .clear-both{clear:both}.article-page .article-footer{max-width:42rem;margin:4rem auto 0;padding-top:2rem;border-top:1px solid #e2e8f0}.article-page .article-footer-row{display:flex;flex-direction:column;align-items:center;gap:1rem}.article-page .article-tags{display:flex;flex-wrap:wrap;gap:.5rem}.article-page .article-tag{padding:.25rem .75rem;background:#f1f5f9;color:#475569;border-radius:9999px;font-size:.75rem;font-weight:600;font-family:var(--font-body);text-transform:uppercase;letter-spacing:.05em}.article-page .article-share{display:flex;align-items:center;gap:.75rem;font-family:var(--font-body)}.article-page .article-share-label{font-size:.875rem;color:#64748b;font-weight:500}.article-page .article-share-btn{width:2.5rem;height:2.5rem;border-radius:9999px;background:#f1f5f9;color:#475569;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s}.article-page .article-share-btn:hover{background:#0d9488;color:#fff}.article-page .share-icon{width:1rem;height:1rem}.article-page .article-back{margin-top:2rem;text-align:center}.article-page .article-back a{font-size:.875rem;font-weight:600;color:#0d9488;font-family:var(--font-body);transition:color .2s}.article-page .article-back a:hover{color:#14b8a6}@keyframes articleFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(min-width:640px){.article-page .article-main{padding:5rem 1.5rem 3rem}.article-page .article-footer-row{flex-direction:row;justify-content:space-between}.article-page .article-float.float-left{float:left;width:50%;margin-right:2rem;margin-bottom:1.5rem}.article-page .article-float.float-right{float:right;width:50%;margin-left:2rem;margin-bottom:1.5rem}.article-page .article-figure-wide{margin-left:-2rem;margin-right:-2rem}}@media(min-width:1024px){.article-page .article-main{padding:6rem 2rem 4rem}.article-page .article-hero-img{height:500px}.article-page .article-figure-wide{margin-left:-4rem;margin-right:-4rem}}
