@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800;900&display=swap');
:root{--blue:#2463df;--navy:#102a52;--ink:#172b4d;--muted:#71809b;--line:#e4eaf4;--bg:#f7f9fd;--soft:#eef4ff}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:Vazirmatn,Arial,sans-serif}a{text-decoration:none;color:inherit}.mg-blog{max-width:1240px;margin:auto;padding:30px 24px 90px}.mg-breadcrumb{display:flex;gap:10px;align-items:center;color:#8a96aa;font-size:12px;margin:15px 0 36px}.mg-breadcrumb a{color:var(--blue)}.mg-blog-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;border-bottom:1px solid var(--line);padding-bottom:35px}.mg-eyebrow{display:inline-block;color:var(--blue);font-size:12px;font-weight:700;margin-bottom:9px}.mg-blog-heading h1{font-size:34px;line-height:1.6;margin:0 0 10px;color:#101d37}.mg-blog-heading p{color:var(--muted);font-size:14px;margin:0;max-width:650px}.mg-blog-search{width:min(360px,100%);height:52px;border:1px solid #d9e1ef;border-radius:10px;display:flex;align-items:center;padding:0 13px;gap:8px;background:#fff}.mg-blog-search span{font-size:25px;color:var(--blue)}.mg-blog-search input{border:0;outline:0;min-width:0;flex:1;font:inherit;font-size:12px;color:var(--ink)}.mg-blog-search button{border:0;border-radius:7px;background:var(--blue);color:#fff;font:inherit;font-size:11px;padding:9px 12px;cursor:pointer}.mg-blog-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:38px;direction:ltr;margin-top:38px}.mg-blog-content,.mg-blog-sidebar{direction:rtl}.mg-blog-sidebar{display:flex;flex-direction:column;gap:20px}.mg-side-box{border:1px solid var(--line);border-radius:14px;padding:22px;background:#fff}.mg-side-box h2{font-size:17px;margin:0 0 19px}.mg-chips{display:flex;flex-wrap:wrap;gap:8px}.mg-chips a{background:#f4f7fc;color:#4a6287;border-radius:6px;font-size:11px;padding:8px 9px}.mg-chips a:hover{background:#e8f0ff;color:var(--blue)}.mg-categories{display:grid;gap:8px}.mg-categories a{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#4f6381;padding:9px 0;border-bottom:1px solid #eff2f7}.mg-categories a:last-child{border:0}.mg-categories small{color:var(--blue);background:#edf3ff;border-radius:20px;padding:3px 8px}.mg-featured{display:grid;grid-template-columns:1.1fr .9fr;min-height:300px;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#edf4ff,#f8fbff);border:1px solid #dce8fc;margin-bottom:45px}.mg-featured-copy{padding:38px 38px 30px}.mg-featured-copy h2{font-size:27px;line-height:1.65;margin:8px 0 15px;color:#112b57}.mg-featured-copy p{font-size:13px;line-height:2;color:#657693;margin:0 0 24px}.mg-featured-image{min-height:300px;background:linear-gradient(135deg,#2762ce,#80a8ff);display:grid;place-items:center;color:#fff;font-size:42px;font-weight:900}.mg-featured-image img,.mg-post-image img,.mg-article-image{width:100%;height:100%;object-fit:cover;display:block}.mg-post-category{color:var(--blue);font-size:11px;font-weight:700}.mg-post-meta,.mg-article-meta{display:flex;gap:15px;flex-wrap:wrap;color:#8995a9;font-size:10px}.mg-section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.mg-section-title h2{font-size:23px;margin:3px 0 0}.mg-result-count{color:#8995a9;font-size:11px}.mg-post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.mg-post-card{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff;transition:.2s;box-shadow:0 8px 22px #224d8a09}.mg-post-card:hover{transform:translateY(-4px);box-shadow:0 16px 30px #224d8a16}.mg-post-image{height:160px;background:linear-gradient(135deg,#17386c,#4d86e7);display:grid;place-items:center;color:#fff;font-size:25px;font-weight:900}.mg-post-card-body{padding:17px}.mg-post-card h3{font-size:15px;line-height:1.7;margin:8px 0}.mg-post-card h3 a:hover{color:var(--blue)}.mg-post-card p{color:var(--muted);font-size:11px;line-height:1.9;height:42px;overflow:hidden;margin:0 0 15px}.mg-pagination{margin-top:28px}.mg-pagination nav{display:flex;justify-content:center}.mg-pagination a,.mg-pagination span{display:inline-grid;place-items:center;min-width:34px;height:34px;border:1px solid var(--line);color:var(--blue);font-size:11px;margin:0 3px;border-radius:7px}.mg-pagination span[aria-current="page"]{background:var(--blue);border-color:var(--blue);color:#fff}.mg-newsletter{margin-top:45px;border-radius:16px;background:#f5f7fc;padding:28px 30px;display:flex;justify-content:space-between;gap:25px;align-items:center}.mg-newsletter h2{margin:2px 0 8px;font-size:22px}.mg-newsletter p{color:var(--muted);font-size:12px;margin:0}.mg-newsletter form{display:flex;gap:8px;min-width:330px}.mg-newsletter input{flex:1;border:1px solid #dce3ef;border-radius:8px;padding:12px;font:inherit;font-size:11px;outline:0}.mg-newsletter button,.mg-side-button{border:0;border-radius:8px;background:var(--blue);color:#fff;padding:12px 17px;font:inherit;font-size:11px;cursor:pointer}.mg-empty{grid-column:1/-1;border:1px dashed #cbd6e8;padding:55px;text-align:center;color:var(--muted);border-radius:14px}.mg-article-page{max-width:1200px}.mg-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:35px;direction:ltr}.mg-article,.mg-article-layout .mg-blog-sidebar{direction:rtl}.mg-article{max-width:820px}.mg-article h1{font-size:36px;line-height:1.6;margin:10px 0 12px}.mg-article-meta{margin-bottom:25px}.mg-article-image{height:390px;border-radius:16px;background:#e9f0ff}.mg-article-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#1a3d78,#5d91e8);color:#fff;font-size:45px;font-weight:900}.mg-article-body{font-size:16px;line-height:2.3;color:#42516a;padding:32px 4px;white-space:normal}.mg-article-body p{margin:0 0 18px}.mg-share{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding-top:20px;color:#687996;font-size:12px}.mg-share a,.mg-share button{border:1px solid #dce4f1;border-radius:7px;background:#fff;color:var(--blue);padding:8px 12px;font:inherit;cursor:pointer}.mg-related{display:grid;gap:14px}.mg-related a{display:flex;gap:10px;align-items:center;border-bottom:1px solid #eff2f7;padding-bottom:13px}.mg-related a:last-child{border:0}.mg-related img,.mg-related>a>span{width:58px;height:50px;border-radius:8px;object-fit:cover;background:#2e66cf;color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800;flex-shrink:0}.mg-related b{display:block;font-size:11px;line-height:1.7}.mg-related small{display:block;color:#8c98aa;font-size:9px;margin-top:4px}.mg-muted{color:var(--muted);font-size:11px;line-height:1.9}.mg-side-box>p{color:var(--muted);font-size:11px;line-height:1.9}.mg-side-button{display:inline-block;margin-top:9px}.mg-faq{max-width:820px;margin:50px 0 0 auto}.mg-faq h2{font-size:24px;margin-bottom:19px}.mg-faq details{border-top:1px solid var(--line);padding:19px 0;color:#40516c;font-size:13px}.mg-faq summary{cursor:pointer;font-weight:600}.mg-faq p{font-size:12px;line-height:2;color:var(--muted);margin:15px 0 0}@media(max-width:900px){.mg-blog-heading{display:block}.mg-blog-search{margin-top:24px;width:100%}.mg-blog-layout,.mg-article-layout{grid-template-columns:1fr}.mg-blog-sidebar{order:2}.mg-blog-content{order:1}.mg-post-grid{grid-template-columns:repeat(2,1fr)}.mg-featured{grid-template-columns:1fr}.mg-featured-image{min-height:220px}.mg-newsletter{display:block}.mg-newsletter form{min-width:0;margin-top:20px}}@media(max-width:560px){.mg-blog{padding:22px 15px 55px}.mg-blog-heading h1{font-size:25px}.mg-post-grid{grid-template-columns:1fr}.mg-featured-copy{padding:25px}.mg-featured-copy h2{font-size:21px}.mg-newsletter{padding:22px}.mg-newsletter form{display:block}.mg-newsletter input,.mg-newsletter button{width:100%;margin-bottom:8px}.mg-article h1{font-size:26px}.mg-article-image{height:230px}.mg-article-body{font-size:14px;line-height:2.1}}


/* MG-BLOG-MOBILE-V2-20260919
   Clean mobile layout for /blog
*/
@media (max-width: 760px) {

    .mg-blog {
        width: 100%;
        max-width: 100%;
        padding: 18px 14px 55px !important;
        overflow: hidden;
    }

    .mg-breadcrumb {
        margin: 8px 0 22px;
        gap: 7px;
        font-size: 10px;
        overflow-x: auto;
        white-space: nowrap;
    }

    /* ---------- heading ---------- */

    .mg-blog-heading {
        display: block !important;
        padding-bottom: 22px;
        margin-bottom: 0;
    }

    .mg-blog-heading h1 {
        font-size: 24px !important;
        line-height: 1.65 !important;
        margin: 3px 0 8px !important;
    }

    .mg-blog-heading p {
        font-size: 12px !important;
        line-height: 2 !important;
    }

    .mg-blog-search {
        width: 100% !important;
        height: 50px;
        margin-top: 18px !important;
        border-radius: 13px;
    }

    .mg-blog-search input {
        font-size: 12px;
    }

    .mg-blog-search button {
        height: 36px;
        padding: 0 14px;
        border-radius: 9px;
    }

    /* ---------- layout ---------- */

    .mg-blog-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 28px !important;
        margin-top: 24px !important;
    }

    .mg-blog-content {
        width: 100%;
        min-width: 0;
        order: 1;
    }

    .mg-blog-sidebar {
        width: 100%;
        min-width: 0;
        order: 2;
    }

    /* ---------- featured article ---------- */

    .mg-featured {
        display: flex !important;
        flex-direction: column !important;

        width: 100%;
        min-width: 0;
        min-height: 0 !important;

        margin-bottom: 32px !important;

        border-radius: 17px !important;

        overflow: hidden !important;

        background: #fff !important;

        box-shadow:
            0 10px 28px rgba(25, 63, 108, .08);
    }

    .mg-featured-image {
        order: -1;

        width: 100%;
        height: auto !important;
        min-height: 0 !important;

        aspect-ratio: 16 / 9;

        overflow: hidden;

        background: #edf3fb;
    }

    .mg-featured-image img {
        display: block !important;

        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center !important;
    }

    .mg-featured-copy {
        padding: 18px 17px 17px !important;
        min-width: 0;
    }

    .mg-featured-copy h2 {
        margin: 7px 0 9px !important;

        font-size: 19px !important;
        line-height: 1.8 !important;

        color: #162f54 !important;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;

        overflow: hidden;
    }

    .mg-featured-copy p {
        margin: 0 0 14px !important;

        font-size: 11.5px !important;
        line-height: 2 !important;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;

        overflow: hidden;
    }

    .mg-post-category {
        display: inline-flex;

        align-items: center;

        min-height: 25px;

        padding: 4px 9px;

        border-radius: 999px;

        background: #edf5ff;

        color: #1769d5;

        font-size: 9.5px !important;
        font-weight: 800;
    }

    .mg-post-meta {
        display: flex !important;
        align-items: center;
        flex-wrap: wrap;

        gap: 6px 12px !important;

        font-size: 9px !important;

        color: #8999ad;
    }

    /* ---------- section title ---------- */

    .mg-section-title {
        align-items: center !important;

        margin-bottom: 14px !important;
    }

    .mg-section-title h2 {
        font-size: 19px !important;
    }

    .mg-result-count {
        font-size: 9px;
    }

    /* ---------- normal article cards ---------- */

    .mg-post-grid {
        display: grid !important;

        grid-template-columns: 1fr !important;

        gap: 15px !important;

        width: 100%;
        min-width: 0;
    }

    .mg-post-card {
        display: block !important;

        width: 100%;
        min-width: 0;

        overflow: hidden !important;

        border-radius: 16px !important;

        background: #fff;

        box-shadow:
            0 8px 22px rgba(25, 63, 108, .06);
    }

    .mg-post-card:hover {
        transform: none !important;
    }

    .mg-post-image {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        aspect-ratio: 16 / 9;

        overflow: hidden !important;

        margin: 0 !important;

        background: #edf3fb;
    }

    .mg-post-image img {
        display: block !important;

        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center !important;
    }

    .mg-post-card-body {
        padding: 15px 15px 14px !important;

        min-width: 0;
    }

    .mg-post-card h3 {
        margin: 7px 0 8px !important;

        font-size: 15px !important;
        line-height: 1.9 !important;

        color: #1a3558;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;

        overflow: hidden;
    }

    .mg-post-card h3 a {
        display: block;
        margin: 0 !important;

        color: inherit;
    }

    .mg-post-card p {
        height: auto !important;
        max-height: none !important;

        margin: 0 0 12px !important;

        font-size: 10.5px !important;
        line-height: 2 !important;

        color: #71829a;

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;

        overflow: hidden;
    }

    /* ---------- sidebar ---------- */

    .mg-side-box {
        padding: 17px !important;
        border-radius: 16px !important;
    }

    .mg-side-box h2 {
        font-size: 15px !important;
        margin-bottom: 14px !important;
    }

    /* ---------- newsletter ---------- */

    .mg-newsletter {
        margin-top: 30px !important;

        padding: 20px 17px !important;

        border-radius: 17px !important;
    }

    .mg-newsletter h2 {
        font-size: 18px !important;
    }

    .mg-newsletter p {
        font-size: 10.5px;
        line-height: 1.9;
    }

    .mg-newsletter form {
        display: grid !important;
        gap: 8px !important;

        min-width: 0 !important;

        margin-top: 15px !important;
    }

    .mg-newsletter input,
    .mg-newsletter button {
        width: 100% !important;
        margin: 0 !important;
    }
}
