/*  Desktop */
@media all and (min-width: 1601px) and (max-width: 1920px) {
  .what_img img {
    height: clamp(380px, calc(100vh - 200px), 580px);
  }
}

/* Laptop */
@media (max-width: 1440px) {

  /* Home Page */
  .hero_txt span {
    font-size: 16px;
    margin-bottom: 5px;
  }

  .hero_txt h1 {
    font-size: 50px;
    line-height: 57px;
    margin-bottom: 12px;
  }

  .hero_txt p {
    font-size: 15px;
  }

  .home-2-circles-parent {
    margin: 0;
  }

  .what-marquee-content img {
    height: 80px;
  }
}

@media (max-width: 1366px) {
  .what_img img {
    height: clamp(300px, calc(100vh - 180px), 500px);
  }

  .nav-pills .nav-link {
    font-size: 16px;
    padding: 16px 14px;
    margin-bottom: 14px;
  }

  .pr_name {
    font-size: 20px;
  }
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1200px) {
  .what_img img {
    height: clamp(280px, calc(100vh - 180px), 420px);
  }

  /* Contact Image */
  .cont-flx {
    flex-wrap: wrap;
    grid-gap: 15px;
  }
}

@media (max-width: 1024px) {
  .circle._01 {
    width: 380px;
    height: 380px;
  }

  .circle._2 {
    width: 560px;
    height: 560px;
  }

  .circle._3 {
    width: 760px;
    height: 760px;
  }

  .what_blog_sticky {
    padding-top: 50px;
  }

  /* products */
  .product-tabs .tabs-nav button {
    white-space: nowrap;
    padding: 10px 15px;
    font-size: 14px;
    gap: 8px;
  }

  .product-tabs .tabs-nav {
    flex-wrap: nowrap;
    overflow-x: scroll;
    justify-content: flex-start;
    padding-bottom: 10px;
    margin-bottom: 40px;
  }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991px) {

  /* Home */
  br {
    display: none;
  }

  * {
    line-height: 1.4 !important;
  }

  main {
    padding: 70px 0 0;
  }

  /* Section padding */
  .mission-blog,
  .driver-blog,
  .brand-blog,
  .contact-blog {
    padding: 30px 0;
  }

  .about-blog,
  .product-tabs {
    padding: 0 0 30px;
  }

  .row-reverse {
    flex-direction: column-reverse;
  }

  .what_img img {
    height: clamp(260px, calc(100vh - 160px), 400px);
  }

  .who_img {
    padding: 0;
    margin-bottom: 15px;
  }

  .cmon-title span {
    font-size: 15px;
    letter-spacing: 3px;
  }

  .cmon-title h3 {
    font-size: 25px;
    margin: 0 auto 5px;
  }

  .cmon-title>p {
    font-size: 15px;
    margin-bottom: 5px;
  }

  .who_txt p {
    font-size: 15px;
  }

  .btn-red {
    font-size: 15px;
    padding: 10px 22px;
  }

  .services-grid {
    margin: 20px 0 0;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .service-card {
    padding: 15px;
  }

  .service-icon {
    margin: 0 auto 15px;
  }

  .service-icon svg {
    width: 35px;
    height: auto;
  }

  .service-card h3 {
    font-size: 18px;
  }

  .service-card p {
    font-size: 14px;
  }

  .hero {
    padding: 120px 0 30px;
  }

  .hero_txt span {
    font-size: 14px;
  }

  /* About */
  .iner-section {
    padding: 30px 0;
  }

  .iner-section::before {
    height: 300px;
  }

  .iner-section h1 {
    font-size: 40px;
    margin-bottom: 6px;
  }

  .abt-item {
    padding: 20px;
    grid-gap: 12px;
  }

  .abt-txt h3 {
    font-size: 30px;
    margin-bottom: 0;
  }

  .abt-txt p {
    font-size: 14px;
  }

  .abt-flx {
    grid-gap: 20px;
  }

  .mission-bx {
    padding: 20px;
    margin-bottom: 15px;
  }

  .mission-bx span {
    margin-bottom: 10px;
  }

  .mission-bx h4 {
    font-size: 20px;
    margin-bottom: 5px;
  }

  .driver-img {
    margin-bottom: 15px;
  }

  .brand-blog .cmon-title {
    margin-bottom: 30px;
  }

  .brand-item img {
    height: 40px;
  }

  .abt-data h3 {
    font-size: 30px;
  }

  .abt-data p {
    font-size: 14px;
  }

  .abt-data {
    bottom: 65px;
  }

  /* Products */
  .product-tabs .products-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  /* Contact  */
  .cont-flx .abt-txt span {
    text-align: center;
  }

  /* Trade */
  .wizard-wrapper h1 {
    font-size: 30px;
  }

  .wizard-wrapper .subtitle {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 20px;
  }

  .wizard-wrapper .row {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .radio-group {
    gap: 15px;
  }

  .wizard-wrapper .section-title {
    font-size: 18px;
    margin-bottom: 20px;
  }

  .driver-txt {
    padding: 0;
  }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767px) {

  /* General Section */
  .what_blog,
  .who_blog,
  .wedo_blog {
    padding: 30px 0;
  }

  .what_img img {
    height: clamp(220px, calc(100vh - 140px), 340px);
  }

  .circle._01 {
    width: 300px;
    height: 300px;
  }

  .circle._2 {
    width: 440px;
    height: 440px;
  }

  .circle._3 {
    width: 580px;
    height: 580px;
  }

  .what-marquee-content img {
    height: 36px;
  }

  .what_blog_sticky {
    padding-top: 40px;
  }

  .home-2-circles-parent {
    margin-top: -20px;
  }

  .what_blog_sticky {
    height: auto;
  }

  .what_blog {
    height: auto;
  }

  div#v-pills-tab {
    flex-direction: row !important;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: nowrap;
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 10px;
    text-wrap-mode: nowrap;
  }

  .nav-pills .nav-link {
    font-size: 14px;
    padding: 14px 12px;
    margin-bottom: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .product_card .btn-red {
    padding: 12px 18px;
    font-size: 14px;
  }

  .pr_name {
    font-size: 16px;
  }

  .product_info {
    bottom: 12px;
    left: 10px;
    right: 10px;
  }

  section.prod_blog {
    padding: 60px 0 80px;
  }

  .contact-section {
    padding-bottom: 80px;
  }

  /* ABout */
  .abt-item {
    flex-direction: column;
    justify-content: center;
  }

  .abt-item {
    padding: 15px;
  }

  .abt-txt,
  .abt-txt h3,
  .abt-txt p {
    text-align: center;
  }

  .driver-blog p {
    font-size: 14px;
  }

  .abt-data h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }

  .abt-data {
    bottom: 0;
  }

  .abt-flx {
    margin: 2em auto 0;
    width: 100%;
  }

  .iner-section .breadcrumb {
    margin: 0;
  }

  /* Products */
  .product-tabs .products-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Trade */
  .step-label,
  .pct-label {
    font-size: 14px;
  }

  .progress-rgt {
    width: 75%;
  }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
  .what_img img {
    height: clamp(180px, calc(100vh - 130px), 290px);
  }

  .circle._01 {
    width: 240px;
    height: 240px;
  }

  .circle._2 {
    width: 350px;
    height: 350px;
  }

  .circle._3 {
    width: 460px;
    height: 460px;
  }

  .what_blog_sticky {
    padding-top: 30px;
  }

  .services-grid {
    margin: 20px 0 0;
    grid-template-columns: repeat(1, 1fr);
  }

  .cmon-title h3 {
    font-size: 20px;
  }

  .cmon-title>p,
  .cmon-title span,
  .who_txt p {
    font-size: 14px;
  }

  .hero_txt h1 {
    font-size: 30px;
    line-height: 35px;
  }

  section.prod_blog {
    padding: 20px 0 40px;
  }

  .prod_blog .cmon-title {
    padding-bottom: 24px;
  }

  .contact-section {
    padding-bottom: 40px;
  }

  .hero::before {
    height: 250px;
  }

  .home-2-circles-parent {
    margin-top: 230px;
  }

  /* About */
  .iner-section h1 {
    font-size: 30px;
  }

  .abt-flx {
    flex-direction: column;
    grid-gap: 10px;
  }

  .about-img img {
    border-radius: 20px;
    height: 200px;
  }

  .about-img::before {
    border-radius: 0 0 20px 20px;
  }

  .abt-data p {
    font-size: 13px;
  }

  /* What we do */
  .custom-pagination {
    gap: 8px;
    margin: 20px auto 0;
  }

  .custom-pagination .page,
  .custom-pagination .nav-btn {
    width: 40px;
    height: 40px;
    font-size: 15px;
  }

  /* Trade */
  .wizard-wrapper h1 {
    font-size: 22px;
  }

  .wizard-wrapper .section-title {
    font-size: 16px;
    margin-bottom: 15px;
  }

  .choose-btn {
    padding: 5px 10px;
    font-size: 13px;
  }

  .file-name {
    font-size: 13px;
  }

  .check-label {
    font-size: 14px;
  }

  .check-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
  }

  /* Terms & Conditions */
  .terms-section {
    padding: 30px 0;
  }

  .terms-title {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .terms-text,
  .terms-sublist>li,
  .terms-bullet-list>li {
    font-size: 14px;
  }

  .terms-subsections>li strong {
    font-size: 15px;
  }

  .terms-item {
    margin-bottom: 25px;
  }

  .terms-sublist.list-alpha,
  .terms-bullet-list,
  .terms-sublist {
    padding-left: 1rem;
  }

  .terms-subsections {
    margin: 0;
  }
}

@media(max-width:480px) {
  .product-tabs .products-grid {
    grid-template-columns: 1fr;
  }
}