/* reset */
*, *::before, *::after {
    box-sizing: border-box;
  }
  * {
    margin: 0;
    padding: 0;
  }
  a {
    text-decoration: none;
    color: inherit;
  }
  body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    font-family: var(--p-font);
  }
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--h-font);
  }
  img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
  }
  input, button, textarea, select {
    font: inherit;
  }
  p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
  }
  #root, #__next {
    isolation: isolate;
  }

/* mz globals */
main {
    min-height: calc(100vh - 200px);
    padding-bottom: 60px;
}
/* flex */
._fx { display: flex; }
._fxc { display: flex; justify-content: center; align-items: center; }
._fsa { display: flex; justify-content: space-around; }
._fsb { display: flex; justify-content: space-between; }
._fjc { justify-content: center; }
._fjfs { justify-content: flex-start; }
._fjfe { justify-content: flex-end; }
._fac { align-items: center; }
._fas { align-items: flex-start; }
._fae { align-items: flex-end; }
._fxd { flex-direction: column; }
._fxdc { flex-direction: column; justify-content: center; }
._fxw { flex-wrap: wrap; }
._fxnw { flex-wrap: nowrap; }
._fx1 { flex: 1; }
._g_sm {
    gap: 10px;
}
._g_20 {
    gap: 25px;
}
._gy_40 {
    row-gap: 40px;
}

/* grid */
._gr { display: grid; }
._gci { grid-column: inherit; }
._gce { grid-column-end: span 1; }
._gcs { grid-column-start: span 1; }
._gar { grid-auto-rows: auto; }
._gac { grid-auto-columns: auto; }
._gaf { grid-auto-flow: row; }
._grg { grid-gap: 10px; }
._grgc { grid-gap: 5px; }
._grr { grid-template-rows: repeat(2, 1fr); }
._grc1 { grid-template-columns: 1fr; }
._grc2 { grid-template-columns: repeat(2, 1fr); }
._grc3 { grid-template-columns: repeat(3, 1fr); }

/* padding, marign*/
._p0 { padding: 0; }
._p1 { padding: 4px; }
._p2 { padding: 8px; }
._p3 { padding: 12px; }
._p4 { padding: 16px; }
._p5 { padding: 20px; }
._pt1 { padding-top: 4px; }
._pt2 { padding-top: 8px; }
._pr1 { padding-right: 4px; }
._pr2 { padding-right: 8px; }
._pb1 { padding-bottom: 4px; }
._pb2 { padding-bottom: 8px; }
._pl1 { padding-left: 4px; }
._pl2 { padding-left: 8px; }
._px1 { padding-left: 4px; padding-right: 4px; }
._px2 { padding-left: 8px; padding-right: 8px; }
._py1 { padding-top: 4px; padding-bottom: 4px; }
._py2 { padding-top: 8px; padding-bottom: 8px; }
._p6 { padding: 24px; }
._p7 { padding: 32px; }
._p8 { padding: 40px; }
._p9 { padding: 48px; }
._p10 { padding: 56px; }
._pt3 { padding-top: 12px; }
._pt4 { padding-top: 16px; }
._pt5 { padding-top: 20px; }
._pt6 { padding-top: 24px; }
._pr3 { padding-right: 12px; }
._pr4 { padding-right: 16px; }
._pr5 { padding-right: 20px; }
._pr6 { padding-right: 24px; }
._pb3 { padding-bottom: 12px; }
._pb4 { padding-bottom: 16px; }
._pb5 { padding-bottom: 20px; }
._pb6 { padding-bottom: 24px; }
._pl3 { padding-left: 12px; }
._pl4 { padding-left: 16px; }
._pl5 { padding-left: 20px; }
._pl6 { padding-left: 24px; }
._px3 { padding-left: 12px; padding-right: 12px; }
._px4 { padding-left: 16px; padding-right: 16px; }
._px5 { padding-left: 20px; padding-right: 20px; }
._py3 { padding-top: 12px; padding-bottom: 12px; }
._py4 { padding-top: 16px; padding-bottom: 16px; }
._py5 { padding-top: 20px; padding-bottom: 20px; }
._m10 { margin: 10px; }
._m20 { margin: 20px; }
._m30 { margin: 30px; }
._m40 { margin: 40px; }
._m50 { margin: 50px; }
._mt10 { margin-top: 10px; }
._mt20 { margin-top: 20px; }
._mt30 { margin-top: 30px; }
._mt40 { margin-top: 40px; }
._mr10 { margin-right: 10px; }
._mr20 { margin-right: 20px; }
._mr30 { margin-right: 30px; }
._mr40 { margin-right: 40px; }
._mb10 { margin-bottom: 10px; }
._mb20 { margin-bottom: 20px; }
._mb30 { margin-bottom: 30px; }
._mb40 { margin-bottom: 40px; }
._ml10 { margin-left: 10px; }
._ml20 { margin-left: 20px; }
._ml30 { margin-left: 30px; }
._ml40 { margin-left: 40px; }
._mx10 { margin-left: 10px; margin-right: 10px; }
._mx20 { margin-left: 20px; margin-right: 20px; }
._my10 { margin-top: 10px; margin-bottom: 10px; }
._my20 { margin-top: 20px; margin-bottom: 20px; }



/* fonts, colors, text utilites */
._fs1 { font-size: var(--fs-1); }
._fs2 { font-size: var(--fs-2); }
._fs3 { font-size: var(--fs-3); }
._fs4 { font-size: var(--fs-4); }
._fs5 { font-size: var(--fs-5); }
._fw_b { font-weight: bold; }
._fw_r { font-weight: normal; }
._fw_l { font-weight: lighter; }
._tt_u { text-transform: uppercase; }
._tt_l { text-transform: lowercase; }
._tt_c { text-transform: capitalize; }
._ta_l { text-align: left; }
._ta_r { text-align: right; }
._ta_c { text-align: center; }
._ta_j { text-align: justify; }
._lh1 { line-height: 1; }
._lh2 { line-height: 1.5; }
._lh3 { line-height: 2; }
._td_u { text-decoration: underline; }
._td_n { text-decoration: none; }
._c_white { color: white; }
._c_black { color: black; }
._c_secondary {color: var(--secondary-text);}
._c_accent { color: var(--accent); }
._bg_white { background-color: white; }
._bg_black { background-color: black; }
._bg_accent { background-color: var(--accent-bg); }
._bg_grey_light {background-color: #efefef;}

/* block */
._d_ib { display: inline-block; }
._d_b { display: block; }
._d_n { display: none; }

/* overflow, position */
._ov_h { overflow: hidden; }
._ov_s { overflow: scroll; }
._ov_a { overflow: auto; }
._tr_translateX_n50 { transform: translateX(-50%); }
._tr_translateY_n50 { transform: translateY(-50%); }
._tr_translateXY_n50 { transform: translate(-50%, -50%); }
._tr_none { transform: none; }
._tr_scale1 { transform: scale(1); }
._tr_scale1_5 { transform: scale(1.5); }
._tr_scale2 { transform: scale(2); }
._tr_rotate90 { transform: rotate(90deg); }
._tr_rotate180 { transform: rotate(180deg); }
._tr_rotate270 { transform: rotate(270deg); }
._tr_skewX10 { transform: skewX(10deg); }
._tr_skewX20 { transform: skewX(20deg); }
._tr_skewY10 { transform: skewY(10deg); }
._tr_skewY20 { transform: skewY(20deg); }
._tr_translateX50 { transform: translateX(50px); }
._tr_translateX100 { transform: translateX(100px); }
._tr_translateY50 { transform: translateY(50px); }
._tr_translateY100 { transform: translateY(100px); }
._z1 { z-index: 1; }
._zn1 { z-index: -1; }
._psr {
    position: relative;
}


/* border */
._br_0 { border-radius: 0; }
._br_s { border-radius: 4px; }
._br_m { border-radius: 8px; }
._br_l { border-radius: 12px; }
._br_full { border-radius: 50%; }


/* template */
.container {
    max-width: calc(var(--mw) + 30px);
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}
.blog_cards {
    display: grid;
    gap: 20px;
    justify-content: space-between;
}
.blog_cards._more {
    padding: 40px 0;
}
.blog_cards_header p {
    font-size: 19px;
}
._two {
    grid-template-columns: 48.5% 48.5%;
}
._three {
    grid-template-columns: repeat(3, 1fr);
}
.blog_cards._with_border .blog_card{
    border: 1px solid rgba(0,0,0,.1);
}
.blog_cards._with_shadow .blog_card{
    box-shadow: 0 1px 7px rgba(0,0,0,.05);
}
.blog_cards img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.blog_card {
    display: flex;
    flex-wrap: wrap;
    background-color: #fff;
}
.blog_cards._v2 .blog_card_img  {
width: 30%;
}
.blog_cards_top h2 {
    padding-bottom: 20px;
    display: inline-block;
    border-bottom: 1px solid #000;
}
.blog_cards_top {
    border-bottom: 2px solid #efefef;
}
.blog_card_txt {
    flex: 1;
    padding: 25px;
}
.blog_card_txt h3 {
    font-size: var(--fs-5);
    max-width: 90%;
    margin-bottom: 10px;
    line-height: 1.2;
}
.blog_card_txt p {
    color: var(--secondary-text);
}

/* single blog page template */
.single_blog {
    display: grid;
}
.single_blog._three {
    grid-template-columns: 10% 1fr 10%;
}
.blog_header {
    margin-bottom: 30px;
}
.single_blog p {
    font-size: 19px;
}
.blog_content > *:not(:last-child) {
    margin-bottom: 20px;
}
.blog_header h1 {
    font-size: 39px;
    line-height: 1;
    margin-bottom: 30px;
}
.single_blog .tags {
    display: flex;
    gap: 10px;
}
.single_blog blockquote {
    border-left: 4px solid #00ab6b;
    padding: 0 20px;
    font-style: italic;
    color: rgba(0, 0, 0, .5);
}

.single_blog .tags a {
    font-size: 14px;
    background: rgba(0, 0, 0, .05);
    color: rgba(0, 0, 0, .6);
    border-radius: 3px;
    padding: 5px 10px;
}
._fmt_ul ul, ._fmt_ul ol {
    margin: 7px 0px 15px 35px;
}
._fmt_h *:is(h1,h2,h3,h4,h5,h6) {
    margin-top: 12px;
    margin-bottom: 3px;
}
._fmt_h p {
    margin: 13px 0;
}
@media(max-width: 992px) {
    .blog_card > * {
        width: 100% !important;
    }
    .single_blog._three  {
        grid-template-columns: 1fr;
    }
}
@media(max-width: 568px) {
    .blog_cards {
        grid-template-columns: 100% !important;
    }
}