@media (max-width: 93rem) {
  .main-nav-list {
    gap: 3.2rem !important;
  }
  .main-logo {
    width: 10rem !important;
    height: auto;
  }
  .logo-text {
    width: 13rem !important;
    height: auto;
  }
}

/****************************************/

/* BELOW 1344PX (SMALLER DESKTOP) */

/****************************************/

@media (max-width: 84rem) {
  /* Styles */
  .hero-section {
    max-width: 120rem;
  }
  .header-primary {
    font-size: 5.2rem !important;
  }
  .container-trust {
    padding: 2.4rem !important;
    justify-content: center;
  }
  .section-choose {
    padding: 0rem 0 9.6rem 0 !important;
  }
  .section-factory {
    padding: 7.4rem 0 !important;
  }
}

/****************************************/

/* BELOW 1200PX (LANDSCAPE TABLETS) */

/****************************************/

@media (max-width: 75rem) {
  /* Styles */

  html {
    font-size: 56.25% !important;
  }

  .main-nav-list a {
    font-size: 1.6rem !important;
  }

  /* .main-nav {
    padding: 0 3.2rem;
  } */
  .hero-section {
    max-width: 100rem;
  }
  .header-primary {
    font-size: 4.4rem !important;
  }
  .section-products {
    padding: 4.4rem 0 !important;
  }
  .section-choose {
    padding: 4.4rem 0 !important;
  }
  .container-trust {
    padding: 2.4rem !important;
    justify-content: center;
  }
  .section-factory {
    padding: 7.4rem 2.4rem !important;
  }
  .gallery {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .section-about {
    padding: 8.6rem 2.4rem !important;
  }
  .section-products {
    padding: 8.6rem 0;
  }
  .ethics-container {
    justify-content: center;
  }

  /* ABOUT PAGE */
  .pad-left-right {
    padding-left: 2.4rem !important;
    padding-right: 2.4rem !important;
  }
  .story-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.2rem;
  }
  .story-img {
    height: 100% !important;
    width: 20rem !important;
  }
  .gallery-product {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  /* CONTACT PAGE */
  .form-grid {
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
  }

  .grid-gap-contact {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 4.8rem !important;
  }
  .card-ganesh {
    justify-self: end !important;
  }
  .card-sathish {
    justify-self: start;
  }
  .card-mohana {
    grid-column: 1/-1 !important;
    justify-self: center;
  }

  /* CONTACT PAGE */
  .container-contact {
    max-width: 90rem !important;
  }
}

/****************************************/

/* BELOW 900PX (POTRAIT TABLETS) */

/****************************************/

/* PRODUCT PAGE */

@media (max-width: 59rem) {
  body {
    overflow-x: hidden !important;
  }
  html {
    font-size: 50% !important;
  }
  .hero-section {
    max-width: 80rem;
  }
  .about-container img {
    height: 100% !important;
  }
  .section-about {
    padding: 8rem 2.4rem !important;
  }
  .section-c2a {
    padding: 4.8rem 2.4rem 12.8rem 2.4rem !important;
  }
  .content {
    font-size: 3.6rem !important;
  }
  .c2a-grid {
    /* 3/5 = 60 2/5 = 40 */
    grid-template-columns: 3fr 2fr !important;
  }
  .gallery-product,
  .gallery {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .product-mar-mobile {
    margin-bottom: 6.4rem !important;
  }
  .product-sec-margin {
    margin-bottom: 6.4rem !important;
  }

  /* ABOUT US PAGE */
  .notes {
    gap: 2.4rem !important;
    grid-template-columns: 1fr 1fr !important;
    padding: 6.4rem 1.6rem !important;
  }
  .notes img {
    width: 45rem !important;
    padding: 2.4rem !important;
  }

  /* PRODUCT PAGE */

  .contact-heading {
    margin-bottom: 0 !important;
  }
  /* CERTIFICATE PAGE */

  .logo-container-cer {
    padding: 2.4rem !important;
  }

  .cer-details {
    margin-bottom: 4.8rem !important;
  }
  .mrg-btm-about {
    margin-bottom: 4.8rem !important;
  }
  .product-sec-margin {
    margin-bottom: 3.2rem !important;
  }

  /* CONTACT PAGE */
  .form-grid {
    grid-template-columns: 1fr, 1fr !important;
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
  }

  .container-contact {
    max-width: 95rem !important;
  }
  /* .card-mohana {
    grid-column: 1/-1 !important;
  } */
  .form-container {
    padding: 2.4rem !important;
  }
  .form-container input,
  .form-container textarea {
    font-size: 1.6rem !important;
  }
  .form-container button {
    font-size: 1.6rem !important;
  }

  .grid-gap-contact {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 9.6rem !important;
  }
  .card {
    padding: 3.6rem 0 !important;
  }
  .card-ganesh {
    justify-self: end !important;
  }
  .card-sathish {
    justify-self: start;
  }
  .card-mohana {
    grid-column: 1/-1 !important;
    justify-self: center;
  }
  .contact-heading {
    margin-bottom: 4.8rem !important;
  }
  .card-img {
    width: 25rem !important;
  }

  /* Mobile Nav */
  .btn-mobile-nav {
    display: block !important;
    z-index: 150;
  }
  .main-nav-list {
    background-color: var(--footer-bg) !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4.8rem !important;
    z-index: 100;
    transform: translateX(100%) !important;

    /* Hide Navigation */
    /* Allows no transition at all */
    /* display: none !important; */

    /* Allows transition */
    /* Hide it Visually */
    opacity: 0 !important;

    /* Make it unaccessible to mouse and keyboard */
    pointer-events: none !important;

    /* Hide it from the screen readers */
    visibility: hidden !important;

    transition: all 0.5s ease-in-out;
    backdrop-filter: blur(2rem);

    transform: translateX(-100%);
  }

  .main-nav-list a {
    font-size: 3rem !important;
  }

  .nav-open .main-nav-list {
    opacity: 100% !important;
    pointer-events: auto !important;
    visibility: visible !important;
    transform: translateX(0) !important;
  }

  .nav-open .icon-mobile-nav[name="close-outline"] {
    display: block !important;
  }
  .nav-open .icon-mobile-nav[name="menu-outline"] {
    display: none !important;
  }
  .icon-mobile-nav[name="close-outline"] {
    display: none !important;
  }
}

/****************************************/

/* BELOW 830PX (SMALLER TABLETS) */

/****************************************/

@media (max-width: 51.875em) {
  .grid--footer {
    grid-template-columns: 1.5fr 1fr 1fr !important;
    row-gap: 10rem !important;
  }
  .footer-logo {
    grid-row: 2 !important;
    grid-column: 1/-1 !important;
  }
  .logo-container {
    display: flex !important;
    /* justify-content: center !important; */
    align-items: center !important;
    gap: 1.6rem !important;
    align-self: self-start !important;
  }
  .copyrights {
    flex-direction: row !important;
  }
  .footer {
    padding: 4.8rem 2.4rem !important;
  }
  .add {
    gap: 3.5rem !important;
  }
  .add-sm-tablet {
    display: flex !important;

    gap: 3.5rem !important;
  }
  .clm-gap-footer {
    margin-left: 1.5rem !important;
  }
  .tel-grid {
    grid-column: 2 / -1 !important;
  }
  .white-space {
    display: none !important;
  }
  .ph-phone {
    width: 1rem !important;
  }
}

/****************************************/

/* BELOW 760PX (SMALLER TABLETS) */

/****************************************/

@media (max-width: 47.5em) {
  /* html {
    font-size: 43.75% !important;
  } */
  .hero-section {
    max-width: 60rem;
  }
  .header-primary {
    font-size: 3.6rem !important;
  }
  .grid--4--cols {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* About */
  .about-container {
    display: grid !important;
    grid-template-columns: 1fr 2fr !important;
    gap: 3.2rem !important;
  }
  .about-container img {
    height: 100% !important;
    width: 35rem !important;
  }
  .product-mar-mobile {
    margin-bottom: 6.4rem !important;
  }
  .section-products {
    padding: 4.4rem 0 !important;
  }
  .section-choose {
    padding: 4.4rem 0 !important;
  }
  .container-trust {
    padding: 2.4rem !important;
    justify-content: center;
  }
  .section-factory {
    padding: 7.4rem 2.4rem !important;
  }
  .gallery {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .section-about {
    padding: 8.6rem 2.4rem !important;
  }
  .section-products {
    padding: 8.6rem 0;
  }
  .ethics-container {
    justify-content: center;
  }
  .ethics-mar-sm-tab {
    margin-bottom: 3.2rem !important;
  }
  .grid-gap-fac {
    column-gap: 3.2rem !important;
    row-gap: 4.6rem !important;
  }
  .list-style {
    gap: 1.6rem !important;
  }

  /* ABOUT PAGE */
  .pad-left-right {
    padding-left: 2.4rem !important;
    padding-right: 2.4rem !important;
  }
  .story-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.2rem;
  }
  .story-img {
    height: 100% !important;
    width: 20rem !important;
  }
  .gallery-product {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .notes {
    display: grid;
    grid-template-columns: 2fr 3fr !important;
    gap: 3.2rem;
    padding: 9.6rem 2.4rem;
  }
  .notes img {
    width: 35rem !important;
    padding: 3.2rem !important;
  }
  .story-img-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 3.2rem;
  }
  .story-img {
    width: 25rem !important;
  }

  .c2a-grid {
    grid-template-columns: 1fr !important;
  }
  .c2a-img {
    height: 50rem !important;
    grid-row: 1 !important;
  }

  /* C2A */
  .cont-grid {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 0 !important;
  }
  .number {
    justify-self: start !important;
  }
  .address {
    justify-self: center !important;
    margin-right: 3.2rem !important;
  }
  /* CONTACT PAGE */
  .form-grid {
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
  }
  .container-contact {
    max-width: 70rem !important;
  }
  .grid-gap-contact {
    grid-template-columns: repeat(2, 1fr) !important;
    column-gap: 4.8rem !important;
  }
  .card-ganesh {
    justify-self: end !important;
  }
  .card-sathish {
    justify-self: start;
  }
  .card-mohana {
    grid-column: 1/-1 !important;
    justify-self: center;
  }

  /* PRODUCT PAGE */
  .contact-heading {
    margin-bottom: 0 !important;
  }
  .panel-container-product {
    grid-template-columns: repeat(3, 1fr) !important;
    padding: 2.4rem !important;
  }
  /* CERTIFICATE PAGE */

  .logo-container-cer {
    padding: 2.4rem !important;
  }
  .cer-grid-gap {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 3.2rem !important;
  }

  .grid-su {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 3.2rem !important;
  }

  /* CONTACT PAGE */
  .form-grid {
    grid-template-columns: 1fr !important;
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
    gap: 9.6rem !important;
    justify-content: center !important;
    align-content: center !important;
  }

  /* FOOTER */
  .grid--footer {
    grid-template-columns: 1.5fr 1fr 1fr !important;
    row-gap: 10rem !important;
  }
  .footer-logo {
    grid-row: 2 !important;
    grid-column: 1/-1 !important;
  }
  .logo-container {
    display: flex !important;
    /* justify-content: center !important; */
    align-items: center !important;
    gap: 1.6rem !important;
    align-self: self-start !important;
  }
  .copyrights {
    flex-direction: row !important;
  }
  .footer {
    padding: 4.8rem 2.4rem !important;
  }
  .add {
    gap: 3.5rem !important;
  }
  .add-sm-tablet {
    display: flex !important;

    gap: 3.5rem !important;
  }
  .clm-gap-footer {
    margin-left: 1.5rem !important;
  }
  .tel-grid {
    grid-column: 2 / -1 !important;
  }
  .white-space {
    display: none !important;
  }
  .ph-phone {
    width: 1rem !important;
  }
}

/****************************************/

/* BELOW 640PX (MOBILE DEVICE) */

/****************************************/

@media (max-width: 40em) {
  .grid--footer {
    grid-template-columns: 1fr 1fr !important;
    row-gap: 10rem !important;
  }
  .footer-logo {
    grid-row: 3 !important;
    grid-column: 1/-1 !important;
  }
  .footer-menu {
    grid-row: 1 !important;
    grid-column: 1 !important;
  }
  .footer-products {
    grid-row: 1 !important;
    grid-column: 2 !important;
  }
  .footer-contact {
    grid-row: 2 !important;
    grid-column: 1/-1 !important;
  }
  .logo-f {
    width: 5rem !important;
  }
  .logo-txt {
    width: 7rem !important;
  }
  .logo-container {
    display: flex !important;
    /* justify-content: center !important; */
    align-items: center !important;
    gap: 1.6rem !important;
    align-self: self-start !important;
  }
  .copyrights {
    flex-direction: row !important;
  }
  .footer {
    padding: 4.8rem 2.4rem !important;
  }
  .add {
    gap: 3.5rem !important;
  }

  .add-sm-tablet {
    display: flex !important;
    /* grid-template-columns: 0.5fr 2fr !important; */
    gap: 3.2rem !important;
  }
  .clm-gap-footer {
    margin-left: 1.5rem !important;
  }
  .tel-grid {
    grid-column: 2 / -1 !important;
  }
  .white-space {
    display: none !important;
  }
  .ph-phone {
    width: 1rem !important;
  }
}
/****************************************/

/* BELOW 550PX (MOBILE DEVICE) */

/****************************************/

@media (max-width: 34.375em) {
  /* Styles */
  html {
    overflow-x: hidden !important;
  }
  .hero-section {
    max-width: 40rem !important;
  }
  .main-logo {
    width: 5rem !important;
    margin-right: 1.2rem !important;
  }
  .logo-text {
    width: 10rem !important;
  }
  .btn-margin-right {
    margin-right: 0 !important;
  }
  #myVideo {
    visibility: hidden !important;
  }
  #bg-mobile {
    display: block !important;
  }
  .header-primary {
    font-size: 3.2rem !important;
  }
  .grid--4--cols {
    grid-template-columns: 1fr !important;
  }
  .about-grid {
    grid-template-columns: 1fr !important;
  }
  .explore-btn {
    margin-bottom: 2.4rem !important;
  }
  .about-container img {
    height: 100% !important;
    width: 100% !important;
  }
  .eco-grid {
    grid-template-columns: 1fr !important;
  }

  .gallery-about {
    grid-template-columns: 1fr !important;
  }

  .section-products {
    padding: 4.4rem 0 !important;
  }
  .section-choose {
    padding: 4.4rem 0 !important;
  }
  .container-trust {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 3.2rem !important;
    padding: 2.4rem !important;
    justify-content: center;
  }
  .section-factory {
    padding: 7.4rem 2.4rem !important;
  }
  .gallery {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .section-about {
    padding: 8.6rem 2.4rem !important;
  }
  .section-products {
    padding: 8.6rem 0;
  }
  .ethics-container {
    justify-content: center;
  }
  .ethics-mar-sm-tab {
    margin-bottom: 3.2rem !important;
  }
  .grid-gap-fac {
    column-gap: 3.2rem !important;
    row-gap: 4.6rem !important;
  }
  .list-style {
    gap: 1.6rem !important;
  }
  /* New c2a */
  .cont-grid {
    grid-template-columns: 1fr !important;
    gap: 4.8rem !important;
  }
  .address {
    max-width: 100% !important;
  }

  .number {
    justify-self: center !important;
  }
  .address {
    justify-self: center !important;
  }
  .mail {
    justify-self: center !important;
    margin-right: 3.2rem !important;
  }

  /* ABOUT PAGE */
  .pad-left-right {
    padding-left: 2.4rem !important;
    padding-right: 2.4rem !important;
  }
  .story-container {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 3.2rem;
  }
  .story-img {
    height: 100% !important;
    width: 20rem !important;
  }
  .gallery-product {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .notes {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 3.2rem;
    padding: 9.6rem 2.4rem;
  }
  .notes img {
    width: 35rem !important;
    padding: 3.2rem !important;
  }
  .story-img-container {
    display: flex !important;
    flex-direction: row !important;
    gap: 3.2rem;
  }
  .story-img {
    width: 100% !important;
  }
  .story-img-mobile {
    display: none !important;
  }
  .founder-image {
    justify-self: center !important;
  }
  .c2a-grid {
    grid-template-columns: 1fr !important;
    grid-auto-flow: auto !important;
    text-wrap: wrap;
  }
  .section-c2a {
    width: 100% !important;
  }
  .c2a-img {
    height: 30rem !important;
    width: 100% !important;
    grid-row: 1 !important;
  }
  .c2a-txt {
    min-width: 0 !important;
  }
  .c2a-title {
    padding: 3.6rem 1.2rem !important;
  }
  /* CONTACT PAGE */
  .form-grid {
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
  }
  .container-contact {
    max-width: 70rem !important;
  }
  .grid-gap-contact {
    grid-template-columns: repeat(1, 1fr) !important;
    column-gap: 4.8rem !important;
  }
  .card-ganesh {
    justify-self: end !important;
  }
  .card-sathish {
    justify-self: start;
  }
  .card-mohana {
    grid-column: 1/-1 !important;
    justify-self: center;
  }

  .panel-container-product {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 2.4rem !important;
  }

  /* CERTIFICATE PAGE */
  .cer-grid-gap {
    grid-template-columns: repeat(1, 1fr) !important;
    gap: 3.2rem !important;
  }

  /* SUSTAINABILITY PAGE */
  .grid-su {
    grid-template-columns: repeat(1, 1fr) !important;
    gap: 3.2rem !important;
  }

  /* CONTACT PAGE */
  .form-grid {
    grid-template-columns: 1fr !important;
    padding: 6.4rem 6.4rem 6.4rem 6.4rem !important;
    gap: 9.6rem !important;
    justify-content: center !important;
    align-content: center !important;
  }
  .grid-gap-contact {
    grid-template-columns: repeat(1, 1fr) !important;
    column-gap: 9.6rem !important;
  }
  .card-img,
  .card-ganesh,
  .card-sathish {
    justify-self: center !important;
  }

  /* FOOTER */
  /* FOOTER */
  .grid--footer {
    grid-template-columns: 1fr 1fr !important;
    row-gap: 10rem !important;
  }
  .footer-logo {
    grid-row: 3 !important;
    grid-column: 1/-1 !important;
  }
  .footer-menu {
    grid-row: 1 !important;
    grid-column: 1 !important;
  }
  .footer-products {
    grid-row: 1 !important;
    grid-column: 2 !important;
  }
  .footer-contact {
    grid-row: 2 !important;
    grid-column: 1/-1 !important;
  }
  .logo-f {
    width: 5rem !important;
  }
  .logo-txt {
    width: 7rem !important;
  }
  .logo-container {
    display: flex !important;
    /* justify-content: center !important; */
    align-items: center !important;
    gap: 1.6rem !important;
    align-self: self-start !important;
  }
  .copyrights {
    flex-direction: row !important;
  }
  .footer {
    padding: 4.8rem 2.4rem !important;
  }
  .add {
    gap: 3.5rem !important;
  }

  .add-sm-tablet {
    display: flex !important;
    /* grid-template-columns: 0.5fr 2fr !important; */
    gap: 3.2rem !important;
  }
  .clm-gap-footer {
    margin-left: 1.5rem !important;
  }
  .tel-grid {
    grid-column: 2 / -1 !important;
  }
  .white-space {
    display: none !important;
  }
  .ph-phone {
    width: 1rem !important;
  }
}
