main{align-items:flex-start;max-width:1070px;margin:auto;padding:0;display:flex;position:relative}.blog-post{color:#111;max-width:800px;margin:80px auto;padding:0 16px}.post-title{margin-bottom:12px;font-size:42px;font-weight:900;line-height:1.2}.post-date{color:#525151;margin-bottom:24px;font-size:14px}.post-image-wrapper{margin-bottom:24px}.post-image{object-fit:cover;border-radius:12px;width:100%;max-height:450px}.post-content{color:#333;font-size:17px;line-height:1.8}.post-content h2{margin-top:32px;font-size:28px;font-weight:700}.post-content h3{margin-top:28px;margin-bottom:12px;font-size:22px;font-weight:700}.post-content p{margin-bottom:18px}.post-content ul,.post-content ol{margin-bottom:18px;margin-left:20px}.post-content li{margin-bottom:8px}.post-content a{color:#4f46e5;text-decoration:underline;transition:color .2s;display:inline-block}.post-content a:hover{color:#3730a3}.post-content img{border-radius:12px;max-width:100%;margin:20px 0}.post-content pre{background:#f3f3f3;border-radius:8px;margin-bottom:20px;padding:16px;font-family:Courier New,monospace;overflow-x:auto}.post-content code{background:#f3f3f3;border-radius:4px;padding:2px 6px;font-family:Courier New,monospace}.post-content blockquote{color:#555;border-left:4px solid #4f46e5;margin:20px 0;padding-left:16px;font-style:italic}@media screen and (max-width:768px){main{flex-direction:column}.blog-post{order:2;margin-top:20px}}
.banner{color:#e5e7eb;text-align:center;background:linear-gradient(135deg,#0f172a,#020617);border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:14px;padding:20px;transition:transform .25s,box-shadow .25s;display:flex}.sticky-banner{min-width:200px;margin:950px auto 400px;position:sticky;top:100px}.top-banner,.bottom-banner{width:100%;margin:30px auto}.banner h3{color:#f9fafb;margin:0;font-size:1.1rem;font-weight:700;line-height:1.3}.banner p{color:#cbd5f5;margin:0;font-size:.88rem;line-height:1.55}.banner button{color:#020617;cursor:pointer;background:linear-gradient(135deg,#38bdf8,#22c55e);border:none;border-radius:10px;padding:12px 14px;font-size:.9rem;font-weight:600;transition:transform .15s,box-shadow .15s,background .2s}@media (hover:hover){.banner button:hover{transform:translateY(-1px);box-shadow:0 6px 18px #22c55e73}}.banner button:active{transform:translateY(0);box-shadow:0 3px 10px #0000004d}@media (hover:hover){.sticky-banner:hover{transform:translateY(-3px);box-shadow:0 16px 40px #0009,inset 0 1px #ffffff0f}}@media screen and (max-width:768px){.banner{margin:50px auto}.sticky-banner{order:1;width:calc(100% - 40px);position:static}.top-banner{display:none}}