/* Device: Mobile — Very small screens (≤360px) */
 @media (max-width: 320px) {
     .time-period-tabs .btn {
         font-size: 0.85rem;
     }

     .progress-step-label {
         font-size: 0.7rem;
     }
 }

 @media (max-width:360px) {
     .hero-text h1 {
         font-size: 1.5rem;
     }

     .hero-text h2 {
         font-size: 1.1rem;
     }
 }

 /* Device: Mobile — Small phones (361px to 576px) */
 @media (max-width:576px) {
     h1 {
         font-size: clamp(1.75rem, 5vw, 1.875rem);
     }

     h2 {
         font-size: calc(1.2rem + .9vw);
     }

     p {
         font-size: clamp(.9375rem, 4vw, .9375rem);
     }

     .left-content h1 {
         font-size: 1.8rem
     }

     .scroll-arrow i {
         font-size: .7rem;
     }

     .filters .active-tab {
         font-weight: 600;
     }

     .square-card-text {
         font-size: 0.7rem;
     }

     .dock-card-text {
         font-size: 0.8rem;
     }

     .button-container .btn,
     .custom-breadcrumb,
     .btn-custom,
     .dock-card-text {
         font-size: 0.7rem;
     }

     .director-content h1 {
         font-size: 1.125rem;
     }

     .director-submenu-item {
         font-size: 0.875rem;
     }

     .sidebar-toggle-btn {
         font-size: 1.125rem;
     }

     .director-nav-section-title {
         font-size: 0.75rem;
     }

     .card-title-vertical {

         font-size: 0.9rem;

     }

     .info-green-box div {

         font-size: 0.85rem;

     }
 }

 /* Device: Mobile — Small tablets / phones (up to 768px) */
 @media (max-width:768px) {
     h1 {
         font-size: clamp(1.75rem, 5vw, 1.875rem);
     }

     h2 {
         font-size: calc(1.2rem + .9vw);
     }

     p {
         font-size: clamp(.9375rem, 4vw, .9375rem);
     }

     .test-price {
         font-size: var(--fs-xxl);
         font-weight: 600;
     }

     .scroll-arrow {
         font-size: .9rem;
     }

     .app-btns .btn-custom-sm {
         font-size: .85rem;
     }

     .question-title {
         font-size: 1.2rem;
     }

     .test-step,
     .test-step:first-child,
     .test-step:last-child,
     .info-btn-text,
     .cart-list-item-name {
         font-size: 0.85rem;
     }

     .progress-step-label {
         font-size: 0.75rem;
     }
 }

 /* Device: Tablet — Small tablets (768px to 900px) */
 @media (min-width:768px) and (max-width:900px) {
     .banner-background h1 {
         font-size: 1.75rem;
     }

     .banner-background p.lead {
         font-size: 1rem;
     }

     .info-btn-text {
         font-size: 0.8rem;
     }

 }

 /* Device: Tablet/PC — Up to 900px */
 @media (max-width:900px) {
     h1 {
         font-size: clamp(1.75rem, 5vw, 1.875rem);
     }

     h2 {
         font-size: calc(1.2rem + .9vw);
     }

     p {
         font-size: clamp(.8rem, 4vw, .85rem);
     }

     .left-content h1 {
         font-size: 2.2rem
     }

     .app-btns span small {
         font-size: .7rem;
     }

     .app-btns span strong {
         font-size: .9rem;
     }
 }

 /* Device: PC — 992px to 1025px */
 @media (min-width:992px) and (max-width:1025px) {
     .icon-circle i {
         font-size: 1rem;
     }

     .sub-nav .nav>li {
         margin-right: .1rem;
     }

     .header .contact-number,
     .contact-label,
     .metropolis-header .contact-number {
         font-size: var(--fs-sm);
     }

     .info-btn-text {
         font-size: 0.92rem;
     }
 }

 /* Device: PC — Up to 1025px */
 @media (max-width:1025px) {
     .sub-nav .nav-link {
         font-size: .82rem !important;
     }

     .card-info p {
         font-size: .7rem;
     }

     .metbuddy-text {
         font-size: .4375rem;
     }
 }

 /* Device: PC — 992px to 1100px */
 @media (min-width:992px) and (max-width:1100px) {
     .vt-text h6 {
         font-size: 0.85rem;
     }

     .vt-text p {
         font-size: 0.7rem;
     }

     .sub-nav .fa-chevron-down {
         font-size: 0.65rem !important;

     }


     .sub-nav .btn-custom-md {

         font-size: 0.8125rem !important;
     }
 }

 /* Device: PC — 1024px to 1280px */
 @media (min-width:1024px) and (max-width:1280px) {
     .sub-nav .login-text {
         font-size: 0.8125rem;
     }

     .custom-form-title {
         font-size: 1.2rem;
     }
 }

 /* Device: PC — 1100px to 1199px */
 @media (min-width:1100px) and (max-width:1199px) {
     .sub-nav .nav-link {
         font-size: .8rem;
     }

     .sub-nav .dropdown-toggle i {
         font-size: .7rem;
     }
 }

 /* Device: PC — 1200px and above */
 @media (min-width:1200px) {
     .icon-circle i {
         font-size: 1.2rem;
     }
 }