.blog-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}@media (max-width:991px){.blog-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.blog-grid{grid-template-columns:1fr}}.blog-card{background-color:var(--bg-surface);border:1px solid var(--border-color);box-shadow:0 4px 0px 0px var(--border-color);will-change:transform,box-shadow;box-sizing:border-box;border-radius:16px;flex-direction:column;transition:transform .4s cubic-bezier(.25,1,.5,1),border-color .4s cubic-bezier(.25,1,.5,1),box-shadow .4s cubic-bezier(.25,1,.5,1);display:flex;overflow:hidden}.blog-card__img-wrap{aspect-ratio:16/10.5;background-color:var(--bg-site);width:100%;position:relative;overflow:hidden}.blog-card__img-wrap .blog-card__img{transition:transform .5s cubic-bezier(.25,1,.5,1);object-fit:cover!important}.blog-card__content{text-align:start;flex-direction:column;flex:1;padding:18px;display:flex}.blog-card .meta-info{color:var(--text-light);gap:10px;margin-bottom:10px;font-size:11px;font-weight:600;display:flex}.blog-card .meta-info .meta-item{align-items:center;gap:4px;display:flex}.blog-card__title{color:var(--text-main);line-clamp:2;-webkit-box-orient:vertical;height:40px;margin:0 0 8px;font-size:14.5px;font-weight:800;line-height:1.4;display:-webkit-box;overflow:hidden}.blog-card__title a{color:inherit;text-decoration:none;transition:color .3s cubic-bezier(.25,1,.5,1)}.blog-card__title a:hover{color:var(--main-color)}.blog-card__excerpt{color:var(--text-muted);line-clamp:2;-webkit-box-orient:vertical;height:38px;margin:0 0 16px;font-size:12.5px;font-weight:600;line-height:1.5;display:-webkit-box;overflow:hidden}.blog-card__footer{border-top:1px solid var(--border-color);margin-top:auto;padding-top:10px}.blog-card__link{color:var(--main-color);align-items:center;gap:4px;font-size:12px;font-weight:700;text-decoration:none;transition:color .3s cubic-bezier(.25,1,.5,1);display:inline-flex}.blog-card__link .arrow-icon{transition:transform .3s cubic-bezier(.25,1,.5,1)}.blog-card__link:hover{color:var(--text-main)}.blog-card__link:hover .arrow-icon{transform:translate(-4px)}.blog-card:hover{border-color:var(--main-color);box-shadow:0 12px 25px #7c3aed0a,0 4px 0px 0px var(--main-color);transform:translateY(-2px)}.blog-card:hover .blog-card__img{transform:scale(1.035)}.blog-load-more-container{justify-content:center;margin-top:40px;display:flex}.load-more-action-btn{background-color:var(--text-main);color:#fff;cursor:pointer;will-change:transform,box-shadow;touch-action:manipulation;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;height:44px;padding-inline:28px;font-size:13px;font-weight:700;transition:background-color .35s cubic-bezier(.25,1,.5,1),transform .35s cubic-bezier(.25,1,.5,1),box-shadow .35s cubic-bezier(.25,1,.5,1),opacity .35s cubic-bezier(.25,1,.5,1);display:inline-flex;box-shadow:0 4px 15px #0000001f}.load-more-action-btn:hover:not(:disabled){background-color:var(--main-color);box-shadow:0 6px 20px var(--main-color-light);transform:translateY(-2px)}.load-more-action-btn:active:not(:disabled){transform:translateY(1px)}.load-more-action-btn:disabled{opacity:.8;cursor:not-allowed}@media (max-width:480px){.load-more-action-btn{width:100%}}.load-more-action-btn .animate-spin{animation:.85s linear infinite containerSpin}@keyframes containerSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
.blog-page-container{box-sizing:border-box;max-width:1120px;margin-inline:auto;padding-block:40px 80px;padding-inline:24px}@media (max-width:767px){.blog-page-container{padding-block:24px 48px;padding-inline:16px}}.blog-page-header{text-align:center;margin-bottom:40px}.blog-page-header h1{color:var(--text-main);margin:0 0 8px;font-size:32px;font-weight:900}.blog-page-header p{color:var(--text-muted);max-width:520px;margin-inline:auto;font-size:14px;font-weight:600;line-height:1.5}.blog-grid-section{margin-bottom:56px}.blog-grid-section .section-title-wrap{flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:24px;display:flex}.blog-grid-section .section-title-wrap h2{color:var(--text-main);margin:0;font-size:18px;font-weight:900}.blog-grid-section .section-title-wrap .title-line{background-color:var(--main-color);border-radius:2px;width:36px;height:3px}.blog-cta-section{background:linear-gradient(135deg, #7c3aed0d 0%, #1a0b3305 100%),var(--bg-surface);border:1px solid var(--border-color);text-align:center;box-sizing:border-box;box-shadow:0 4px 0px 0px var(--border-color);border-radius:20px;padding:40px;transition:border-color .4s cubic-bezier(.25,1,.5,1),box-shadow .4s cubic-bezier(.25,1,.5,1)}.blog-cta-section:hover{box-shadow:0 8px 30px #7c3aed08,0 4px 0px 0px var(--border-color);border-color:#7c3aed4d}@media (max-width:767px){.blog-cta-section{padding:28px 16px}}.blog-cta-section .blog-cta-content{flex-direction:column;align-items:center;max-width:580px;margin-inline:auto;display:flex}.blog-cta-section .cta-badge{background-color:var(--main-color-light);color:var(--main-color);border:1px solid #7c3aed1a;border-radius:20px;align-items:center;gap:6px;margin-bottom:14px;padding:4px 10px;font-size:11px;font-weight:800;display:inline-flex}.blog-cta-section h2{color:var(--text-main);margin:0 0 10px;font-size:22px;font-weight:900}@media (max-width:767px){.blog-cta-section h2{font-size:18px}}.blog-cta-section p{color:var(--text-muted);margin:0 0 20px;font-size:13.5px;font-weight:600;line-height:1.6}.cta-browse-btn{background-color:var(--text-main);color:#fff;cursor:pointer;will-change:transform,box-shadow;touch-action:manipulation;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;height:44px;padding-inline:28px;font-size:13px;font-weight:700;text-decoration:none;transition:background-color .35s cubic-bezier(.25,1,.5,1),transform .35s cubic-bezier(.25,1,.5,1),box-shadow .35s cubic-bezier(.25,1,.5,1);display:inline-flex;box-shadow:0 4px 15px #0000001f}.cta-browse-btn:hover{background-color:var(--main-color);box-shadow:0 6px 20px var(--main-color-light);transform:translateY(-2px)}.cta-browse-btn:active{transform:translateY(1px)}@media (max-width:480px){.cta-browse-btn{width:100%}}