/* KIMIA NATURIS — RESPONSIVE.CSS */

@media (max-width:768px){

  body{
    font-size:16px;
    overflow-x:hidden;
  }

  h1{font-size:clamp(38px,12vw,56px);}
  h2{font-size:clamp(30px,9vw,42px);}
  h3{font-size:clamp(22px,7vw,30px);}
  p{font-size:16px;}

  .custom-logo,
  .custom-logo-link img{
    height:72px !important;
    max-height:72px !important;
    width:auto !important;
    margin-inline:auto;
  }

  header,
  .site-header{
    padding:12px 0 !important;
    text-align:center !important;
  }

  .site-navigation,
  .main-navigation,
  nav{
    display:block !important;
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap !important;
    -webkit-overflow-scrolling:touch;
    border-top:1px solid var(--color-border);
    border-bottom:1px solid var(--color-border);
  }

  .site-navigation ul,
  .main-navigation ul,
  nav ul{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:22px !important;
    padding:12px 18px !important;
    margin:0 !important;
    list-style:none !important;
  }

  .site-navigation li,
  .main-navigation li,
  nav li{
    flex:0 0 auto !important;
  }

  .site-navigation a,
  .main-navigation a,
  nav a{
    font-size:14px !important;
    font-weight:600;
    white-space:nowrap !important;
  }
}