@media (max-width: 768px) {
  /* Variables */
  :root {
    --scale: 0.45;
    --scale-spacing: 0.45;
  }

  /* Typography */
  p { font-weight: 500; }
  .text-jumbo-mb { font-size: var(--font-jumbo); }
  .section-title { font-size: calc(var(--font-m) * 1.5); }
  .section-title.text-jumbo { font-size: calc(var(--font-jumbo) * 2); }
  .section-title.text-jumbo-mb { font-size: calc(var(--font-jumbo) * 1.35); }
  .text-shadow-mb { text-shadow: 1px 1px rgba(0, 0, 0, 0.1); }

  /* Layout */
  .hide-mb { display: none !important; }
  .flex-mb { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .flex-col-mb { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; }
  .flex-wrap-mb { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
  .items-start-mb { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .justify-start-mb { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
  .justify-center-mb { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .grid-mb { display: -ms-grid; display: grid; }
  .col-2-mb { -ms-grid-columns: (minmax(0, 1fr))[2]; grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* Spacing */
  .gap-tiny-mb { gap: var(--tiny); }
  .gap-xs-mb { gap: var(--xs); }
  .gap-s-mb { gap: var(--s); }
  .gap-xl-mb { gap: var(--xl); }
  .mt-none-mb { margin-top: 0; }
  .mt-m-mb { margin-top: var(--m); }
  .mt-xl-mb { margin-top: var(--jumbo); }
  .mb-s-mb { margin-bottom: var(--s); }
  .mb-m-mb { margin-bottom: var(--m); }
  .p-none-mb { padding: 0; }
  .p-m-mb { padding: var(--m); }
  .p-s-mb { padding: var(--s); }
  .pt-xl-mb { padding-top: var(--jumbo); }
  .b-move { bottom: 0; }
  .section-padding-mb {
    padding-bottom: var(--xl);
    padding-top: var(--xl);
  }

  /* Header */
  .nav { height: 55px; }

  .nav-drawer {
    position: fixed;
    width: 100dvw;
    height: calc(100dvh - 55px);
    inset: 0;
    margin-top: 55px;
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%);
    -webkit-transition: -webkit-transform var(--transition);
    transition: -webkit-transform var(--transition);
    transition: transform var(--transition);
    transition: transform var(--transition), -webkit-transform var(--transition);
  }

  .drawer-submenu {
    width: 100dvw;
    height: auto;
    top: 0;
    left: 0;
    min-height: 50dvh;
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%);
    -webkit-transition: -webkit-transform var(--transition);
    transition: -webkit-transform var(--transition);
    transition: transform var(--transition);
    transition: transform var(--transition), -webkit-transform var(--transition);
    position: fixed;
  }

  .nav-drawer.open, .drawer-submenu.open  { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
  header:has(.nav-drawer.open) .logo { display: block; }
  .header-icon { width: 1.15rem; }
  body:has(.nav-drawer.open) { height: 100dvh; overflow: hidden; }

  .nav .logo {
    max-height: 5rem;
    max-width: 5rem;
  }

  .hero-logo {
    height: 5rem;
    width: 5rem;
    max-width: 5rem;
    max-height: 5rem;
  }

  .nav-drawer-menu button, .nav-drawer-menu a, .drawer-submenu button, .drawer-submenu a { 
    margin-top: var(--s);
    height: auto; 
  }

  .nav-drawer .text-jumbo { font-size: 5rem; }

  /* Footer */
  .foot-lower {
    padding-bottom: var(--s);
    padding-top: var(--s);
    text-align: center;
    gap: var(--s);
  }

  .foot-logo {
    width: 60dvw;
    max-width: 12rem;
    margin-bottom: var(--s);
  }

  /* Elements */
  .twin-dot {
    height: .35rem;
    margin-top: 1rem;
    margin-right: .35rem;
    min-width: .35rem;
    width: .35rem;
    margin-left: .35rem;
    -webkit-box-shadow: 0 .5rem 0 0 var(--color-blue-dark);
            box-shadow: 0 .5rem 0 0 var(--color-blue-dark);
  }
  
  .card {
    padding: var(--s);
    height: 50dvh;
  }

  .card .h2-title { font-size: 10rem; }
  .card-label { font-size: var(--font-l); }
  
  .sponsor {
    margin: .5rem;
    max-height: 3rem;
    max-width: 4rem;
  }
  
  .gallery-item {
    min-height: 12rem;
    max-height: 25rem !important;
  }
  
  .dot {
    margin: 0 .25rem;
    height: .75rem;
    max-height: .75rem;
    max-width: .75rem;
    width: .75rem;
  }
  
  .overflow-mb { width: 100dvw; }
  form { width: 100%; }
  .talla-group { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
  .talla-item { -webkit-box-flex: 0; -ms-flex: 0 1 55px; flex: 0 1 55px; }
  video { max-height: 14rem; }
  .timer .h2 { font-size: var(--font-l); }
  .over-top img { max-height: 100vw; max-width: 100vw; object-position: top center; }
  .hero-title h1 { font-size: calc(var(--font-xl) * 1.05); }
  .hero { height: calc(80dvh - 55px);}
  
  .hero-title {
    min-height: unset;
    height: 100%;
    max-height: none;
    padding-top: var(--l);
    padding-bottom: var(--l);
  }

  .hero-title .hero-content.absolute {
    position: relative;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
    top: 0;
    left: 0;
    margin-top: var(--m);
  }

  .bg-wave { 
    top: -50px;
    width: 200%;
    max-width: unset;
    left: -50%;
  }

  .scoll-x-mb {
    overflow-y: hidden;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }

  .shadow-img {
    max-width: 90dvw;
    max-height: 16rem !important;
  }

  .whatsapp {
    bottom: 20px;
    right: 20px;
  }

  .whatsapp a {
    height: 3rem;
    width: 3rem;
  }

  .card-list .card-img { height: 15rem; }
  .card-list .card { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
  .card-tip { font-size: 1.25rem; }

  .card-img-sm {
    min-height: 15rem;
    max-height: 15rem;
    height: 15rem;
    max-width: 100%;
    min-width: 100%;
  }

  .card-icon {
    width: 1.5rem;
    margin-right: .5rem;
  }

  .inline-logo { width: 6rem; }
  .gallery-list > div { -webkit-box-flex: 1; -ms-flex: 1 0 47%; flex: 1 0 47%; }
  .gallery-list { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
  .over-top-mb { top: calc(var(--xs) * -1); }
  .lightbox-nav { width: 1rem; }
  .login-form { max-height: unset !important; }
  .profile-setup .card { 
    height: auto;
    width: 100%; 
  }

  .profile-setup .input-box { 
    margin-bottom: .5rem;
    width: 100%; 
  }

  .floating-btn {
    top: 55px;
    padding: .75rem 1.25rem;
    left: calc(var(--s) - .75rem);
  }
}