.container {
  max-width: var(--container-max-width);
  margin: 0 auto;
}
.tit_pageBanner{
    text-align:left;
    color: #fff;
    font-size:1.4rem;
    line-height:1.3;
    font-family: "LexendDeca-M";
    margin:0 0;
    padding:0 0;
}
.tit_pageBanner.tit-detail{
  font-size:1.2rem;
}
.pn-list-product{
  display:grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap:0.5rem;
}
.pn-posts-list{
  display:grid;
  grid-template-columns:1fr;
  grid-gap:0.5rem;
}

.grid-CoreValue{
  display:grid;
  grid-template-columns:1fr;
  grid-gap:0.5rem;
}
.des_pageBanner{
    text-align:left;
}
.d-hb .right{
  display:none;
}

@media (min-width:360px) {
    .pn-list-product,.pn-posts-list{
       grid-template-columns: repeat(2, 1fr);
    }

}
@media (min-width: 440px) {
  .pn-list-product,.pn-posts-list,.grid-CoreValue{
    grid-gap:0.7rem;
  }
}
@media (min-width: 576px) {
    .grid-CoreValue{
         grid-template-columns: repeat(2, 1fr);
    }
    .pn-why__l-gird{
      grid-template-columns:repeat(2,1fr);
    }
}
@media (min-width: 768px) {
    .pn-list-product{
       grid-template-columns: repeat(3, 1fr);
       grid-gap:1rem;
    }
    .pn-posts-list{
      grid-gap:1rem;
      grid-template-columns: repeat(3, 1fr);
    }

}
@media (min-width: 992px) {
  .df-heading .nav{
    display:block;
  }
  .m-menu{
    display:none;
  }
  .logo img{
   max-width:8rem;
   transition: all 0.2s ease-out;
  }
  .fixed .logo img {
        max-width: 6rem;
    }
     .select-lang {
        min-width: 100px;
        gap: 8px;
        padding: 6px 12px;
    }
  .d-hb{
    flex-direction:row;
  }
  .d-hb .left,.d-hb .right{
    width:50%;
    position:relative;
  }
  .d-hb .right{
    display:block;
  }
  .d-hb .left{
    display:flex;
    align-items:center;
    padding-right:8rem;
  }
  .d-hb .right .icon-sharking{
    position:absolute;
    left:-110px;
    top:calc(50% - 110px);
    width:220px;
    height:220px;
    cursor: pointer;
    transition: transform 2s ease-in-out;
  }
  .d-hb .right .icon-sharking img{
    border-radius:50%;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  }

  a.logo{
    max-width:8rem;
  }
  :root{ --container-max-width:960px; }
  .grid-CoreValue{
     grid-template-columns: repeat(3, 1fr);
  }

  #nav_main > li {
    display: inline-block;
    padding: 0 0.7rem;
    position: relative;
  }

  #nav_main > li:first-child {
    padding-left: 0;
  }

  #nav_main > li > ul,
  #nav_main > li > ul > li > ul {
    position: absolute;
    background:#fff;
    border-radius:0;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
  }

  #nav_main > li > ul {
    top: 100%;
    left: 0;
    min-width:300px;
    max-width: 1000px;
    transform: translateY(10px);
  }
  #nav_main > li.last-item > ul {
    right: 0;
    left: unset;
  }

  #nav_main > li > ul > li {
    position: relative;
    display: block;
  }

  #nav_main > li > ul > li > ul {
    top: 0;
    left: 100%;
    min-width: 200px;
    transform: translateX(10px);
  }
  #nav_main > li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  #nav_main li ul li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
  }
  .pn-homeBanner{
    height:calc(50vh - 60px);
  }
  .flex-footer{
    flex-direction:row;
  }
  .flex-footer .left{
    width:20%;
  }
  .flex-footer .center{
    width:40%;
  }
  .flex-footer .right{
    width:40%;
  }
  .grecaptcha-badge{
    visibility:visible;
  }
}
@media (min-width: 1200px) {
  #nav_main > li > ul{
    padding:0.8rem 0.8rem;
  }
  :root { --container-max-width:96%;}
  .heading-main .container{
    max-width:96%;
  }
  .des_pageBanner{
    text-align:center;
  }
  .tit_pageBanner{
    font-size:1.6rem;
    text-align:center;
  }
  .tit_pageBanner.tit-detail{
    font-size:1.4rem;
  }
   .pn-list-product{
    grid-template-columns: repeat(4, 1fr);
  }
  .pn-posts-list{
      grid-template-columns: repeat(4, 1fr);
   }
   .grid-CoreValue{
     grid-gap:1.2rem;
  }
  #nav_main > li {
    padding: 0 0.7rem; /* Tăng khoảng cách giữa các mục cho thoáng */
  }
  .pn-homeBanner{
    height:calc(100vh - 60px);
    overflow: hidden;
  }
}
@media (min-width: 1400px) {
  .pn-post-detail.full-page{
   max-width:1200px;
}
  .pn-product-detail .container{
   max-width:1200px;
}
  .heading-main .container{
    max-width:96%;
  }
  .root{--container-max-width: 1320px; }
  .pn-list-product,.pn-posts-list{
    grid-gap:1.2rem;
  }
   .grid-CoreValue{
     grid-gap:2rem;
  }
}
@media (min-width: 1600px) {
  .grid-CoreValue{
     grid-gap:3rem;
  }
  :root{ --container-max-width: 1520px; }
  .heading-main .container{
    max-width:1520px;
  }
  .tit_pageBanner{
    font-size:1.8rem;
  }
  .tit_pageBanner.tit-detail{
    font-size:1.6rem;
  }
  .pn-list-product,.pn-posts-list{
    grid-gap:1.5rem;
  }

  #nav_main > li > a {
    font-size: 1.1rem;
  }
}