@media (max-width: 1100px) {
  .products-scroll { grid-template-columns: repeat(4, minmax(200px, 1fr)); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .login-form form {width: 100%;}
  .product-content {grid-template-columns: 1fr;gap: 30px;}
  .thumb {width: 100px;}
  .blog-page .blog-content {max-width: 85%;margin: 10px auto 30px auto;}
}

@media (max-width: 900px) {
  .navbar {padding: 0 20px;}
  .nav-links, .navbar .search-menu {display: none;}
  .hamburger {display: flex;}
  .hero-section {grid-template-columns: 1fr; padding: 12px 20px;}
  .blog-grid {grid-auto-flow: row;}
  .blog-grid .blog-card {width: 95%;} 
  .login-page [class*="col-"] {width: 100%;max-width: 100%;flex: 0 0 100%;}
  .login-form form {width: 100%;}
  .product-content {grid-template-columns: 1fr;gap: 30px;}
  .thumb {width: 100px;}
  .blog-page .blog-content {max-width: 90%;margin: 10px auto 30px auto;}
  .account-layout {grid-template-columns: 1fr;padding: 12px;}
  /*My account*/
  nav {display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--lightGray);}
  .account-menu-link {width:100%;height: 100%;}
  .side-menu {min-height: inherit;}
}


@media (max-width: 600px) {
  :root {
    --fs-3xs: 0.25rem; /*8px*/
    --fs-2xs: 0.5rem; /*10px*/
    --fs-xs: 0.625rem; /*12px*/
    --fs-sm: 0.75rem; /*14px*/
    --fs-reg: 0.875rem; /*16px*/
    --fs-lg: 1rem; /*20px*/
    --fs-xl: 1.25rem; /*24px*/
    --fs-2xl: 1.5rem; /*28px*/
    --fs-3xl: 1.75rem; /*32px*/
  }
  .hero-banner {padding: 32px 24px; min-height: 360px;}
  .hero-title {font-size: 52px;}
  .head-actions {display: none;}
  .product-grid {display: flex;flex-direction: column;align-items: center;}
  .product-grid .card {width: 90%;max-width: 350px;margin-bottom: 10px;}
  .nav-links, .navbar .search-menu {display: none;}

  .hero-section {padding: 0;}
  .hero-section .container {flex-direction: column;}

  .hero-section .column-2 .col-6 {height: 350px;}
      
  .hero-section .container > .col-6 {width: 100%;max-width: 100%;flex: 0 0 100%;}

  .blog-grid {grid-auto-flow: row;}
  .blog-grid .blog-card {width: 95%;}
  .blog-page .blog-content {max-width: 95%;margin: 10px auto 30px auto;}

  /*Footer*/
  .footer-top {top: -10%;}
  .newletter-card {flex-direction: column;padding: 20px 10px;gap: 10px;}
  .newletter-card [class*="col-"] {width: 100%;max-width: 100%;flex: 0 0 100%;}
  .newletter-card .card-title br {display: none;}
  .newsletter-form .input-text {width: 70%;}
  .newsletter-form .btn-primary {width: 100px;}
  .footer .row [class*="col-"] {width: 33%;flex: 0 0 33%;max-width: 33%;}
  .footer .row .col-4 {width: 100%;flex: 0 0 100%;max-width: 100%;margin-bottom: 20px;}

  
  .login-form form {width: 100%;}
  .product-content {grid-template-columns: 1fr;gap: 20px;}
  .thumb {width: 80px;}
  /*My account*/
  nav {display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--lightGray);}
  .account-menu-link {width:100%;height: 100%;}
  .side-menu {min-height: inherit;}
}