@media (min-width: 1400px) {
   .container {
      max-width: 1295px;
   }
}
@media (max-width: 1399px) {
   .hero-title {
      font-size: 60px;
   }
   .brand-area-btn {
      font-size: 28px;
      padding: 24px 70px;
   }
   .brand-area-btn .btn-icon {
      width: 60px;
      height: 60px;
   }
   .brand-slider-container {
      width: calc(100% - 395px);
   }
   .brand-slide {
      width: 250px;
      height: 120px;
   }
   .review {
      font-size: 36px;
      max-width: 980px;
   }
   .testimonial-name {
      font-size: 24px;
   }
   .section-title h2 {
      font-size: 36px;
   }
   .section-title p {
      font-size: 20px;
   }
   .arrow-btn {
      width: 100px;
      height: 100px;
   }
   .pricing-area-title h2 {
      max-width: 530px;
   }
   .price-card-title h5 {
      font-size: 20px;
   }
   .price-card-title h2 {
      font-size: 60px;
   }
   .price-card-title h2 span {
      font-size: 30px;
   }
   .price-card-tag {
      font-size: 20px;
      top: 20px;
      right: 25px;
   }
   .price-card-btn {
      font-size: 24px;
   }
   .database-btn-wrap {
      padding: 60px;
      gap: 50px 20px;
   }
   .btn-left-icon {
      width: 90px;
      height: 90px;
   }
   .database-btn {
      font-size: 26px;
      gap: 40px;
   }
   .database-btn.small .btn-text {
      width: 190px;
   }
   .database-btn .btn-text {
      width: 210px;
   }
   .database-btn .btn-arrow {
      width: 30px;
   }
   .testimonial-area-title h2 {
      max-width: 590px;
   }
   .testimonial-area-title p {
      max-width: 300px;
   }
   .testimonial-slider2 .review {
      max-width: 660px;
      margin-bottom: 125px;
   }
   .slider-nav {
      width: 70px;
      height: 70px;
   }
   .slider-nav-wrap {
      gap: 20px;
      bottom: 55px;
   }
   .cta-content p {
      font-size: 18px;
   }
   .cta-btn {
      padding: 24px 60px;
      font-size: 26px;
   }
   .cta-btn .btn-icon {
      width: 60px;
      height: 60px;
   }
   .cta-wrapper {
      gap: 65px;
   }
}

@media (max-width: 1199px) {
   .hero-wrapper {
      gap: 60px;
   }
   .hero-title {
      font-size: 44px;
   }
   .hero-desc {
      font-size: 18px;
      max-width: 445px;
   }
   .hero-thumb {
      width: 300px;
   }
   .hero-area-main {
      padding: 30px 20px;
   }
   .menu-item-wrap {
      gap: 50px;
   }
   .brand-area-btn {
      font-size: 24px;
      padding: 20px 50px;
   }
   .brand-area-btn .btn-icon {
      width: 50px;
      height: 50px;
   }
   .brand-area-btn .btn-icon img {
      width: 25px;
   }
   .brand-slider-container {
      width: calc(100% - 321px);
   }
   .brand-slide img {
      max-width: 170px;
      max-height: 60px;
   }
   .brand-slide {
      width: 220px;
      height: 100px;
   }
   .review {
      font-size: 30px;
      max-width: 775px;
   }
   .testimonial-name {
      font-size: 22px;
   }
   .testimonial-img {
      width: 140px;
      height: 140px;
   }
   .testimonial-img img {
      width: 120px;
   }
   .pricing-area {
      padding: 100px 0;
   }
   .section-title h2 {
      font-size: 32px;
   }
   .section-title p {
      font-size: 18px;
   }
   .arrow-btn {
      width: 90px;
      height: 90px;
   }
   .arrow-btn img {
      width: 45px;
   }
   .pricing-area-title {
      border-radius: 40px;
      padding: 20px;
   }
   .pricing-area-title h2 {
      border-radius: 28px;
      padding: 20px 30px;
      max-width: 430px;
   }
   .price-title {
      padding: 15px;
      border-radius: 24px;
      margin-bottom: 20px;
   }
   .price-wrapper .row {
      --bs-gutter-x: 20px;
   }
   .price-card-title {
      margin: 0 20px 0 12px;
      padding: 20px 0px 25px 20px;
   }
   .price-card-title h2 {
      font-size: 50px;
   }
   .price-card-title h2 span {
      font-size: 24px;
   }
   .price-card-top ul {
      padding: 20px;
      gap: 20px;
   }
   .price-card-top ul li {
      gap: 10px;
      font-size: 18px;
   }
   .price-card-top ul li img {
      width: 25px;
   }
   .price-card {
      border-radius: 30px;
      min-height: 380px;
   }
   .price-card-btn {
      font-size: 20px;
      padding: 12px;
   }
   .price-card-btn .btn-icon {
      width: 32px;
      height: 32px;
   }
   .database-area {
      padding: 80px 0;
   }
   .database-area-title {
      margin-bottom: 50px;
   }
   .database-btn-wrap {
      padding: 40px;
      gap: 40px 20px;
      border-radius: 80px;
   }
   .database-btn-left {
      gap: 20px;
   }
   .database-btn {
      font-size: 22px;
      gap: 30px;
   }
   .database-btn.small .btn-text {
      width: 150px;
   }
   .btn-left-icon {
      width: 80px;
      height: 80px;
   }
   .btn-left-icon img {
      max-width: 40px;
   }
   .database-btn .btn-text {
      width: 180px;
   }
   .testimonial-area {
      padding: 100px 0;
   }
   .testimonial-area-title {
      border-radius: 40px;
      padding: 20px;
   }
   .testimonial-slider2 .review {
      max-width: 560px;
   }
   .cta-area {
      padding: 0 20px 100px;
   }
   .cta-area-wrapper {
      border-radius: 40px;
      padding: 50px 20px;
   }
   .cta-wrapper {
      gap: 40px;
   }
   .cta-btn {
      padding: 20px 40px;
      font-size: 20px;
      border-radius: 24px;
   }
   .cta-btn .btn-icon {
      width: 50px;
      height: 50px;
   }
   .cta-btn .btn-icon img {
      width: 24px;
   }
   .cta-img {
      width: 330px;
      height: 440px;
      gap: 20px;
   }
   .cta-img-icon {
      width: 70px;
   }
   .cta-img-text {
      font-size: 50px;
   }
}


@media (max-width: 991px) {
   .header-area {
      top: 20px;
   }
   .menu-item-wrap li a {
      font-size: 14px;
   }
   .menu-item-wrap {
      gap: 40px;
   }
   .menu-btn {
      padding: 6px 24px;
      font-size: 14px;
   }
   .hero-area {
      padding: 150px 0px 40px;
   }
   .hero-wrapper {
      gap: 30px;
   }
   .hero-title {
      font-size: 36px;
   }
   .hero-desc {
      font-size: 16px;
      max-width: 445px;
   }
   .hero-thumb {
      width: 250px;
   }
   .hero-area-main {
      padding: 30px 15px;
   }
   .brand-slider-container {
      width: 100%;
   }
   .brand-area-btn {
      font-size: 20px;
      padding: 20px 40px;
      border-radius: 24px;
   }
   .brand-area-btn .btn-icon {
      width: 40px;
      height: 40px;
   }
   .brand-area-btn .btn-icon img {
      width: 20px;
   }
   .testimonial-slider-container {
      padding: 30px;
   }
   .review {
      font-size: 26px;
      max-width: 660px;
      margin: 25px auto;
   }
   .testimonial-name {
      font-size: 20px;
   }
   .section-title h2 {
      font-size: 26px;
   }
   .pricing-area-title {
      flex-direction: column;
   }
   .pricing-area-title h2 {
      border-radius: 24px;
      max-width: 100%;
   }
   .section-title p {
      font-size: 16px;
   }
   .arrow-btn {
      width: 80px;
      height: 80px;
   }
   .arrow-btn img {
      width: 40px;
   }
   .pricing-area {
      padding: 80px 0;
   }
   .price-wrapper .row {
      --bs-gutter-y: 30px;
   }
   .price-card {
      min-height: 360px;
   }
   .database-area-title {
      margin-bottom: 40px;
      flex-direction: column;
      text-align: center;
   }
   .section-title h3 {
      font-size: 26px;
   }
   .database-area-title h3 {
      max-width: 100%;
      margin-bottom: 20px;
   }
   .database-area-title p {
      max-width: 100%;
   }
   .database-btn-wrap {
      padding: 30px 20px;
      gap: 30px 15px;
      border-radius: 60px;
   }
   .btn-left-icon {
      width: 60px;
      height: 60px;
   }
   .btn-left-icon img {
      max-width: 32px;
   }
   .database-btn-left {
      gap: 12px;
   }
   .database-btn {
      font-size: 18px;
      gap: 20px;
      border-radius: 24px;
   }
   .database-btn .btn-arrow {
      width: 25px;
   }
   .database-btn.small .btn-text {
      width: 120px;
   }
   .database-btn .btn-text {
      width: 145px;
   }
   .testimonial-area-title {
      flex-direction: column;
      text-align: center;
   }
   .testimonial-area-title h2 {
      max-width: 100%;
   }
   .testimonial-area-title p {
      max-width: 100%;
   }
   .testimonial-area .testimonial-slider-container {
      margin: 0;
   }
   .testimonial-slider2 .review {
      margin-bottom: 100px;
   }
   .slider-nav-wrap {
      bottom: 45px;
   }
   .slider-nav {
      width: 60px;
      height: 60px;
   }
   .slider-nav img {
      width: 30px;
   }
   .testimonial-area {
      padding: 80px 0;
   }
   .cta-area-wrapper {
      padding: 40px 15px;
   }
   .cta-wrapper {
      gap: 20px;
   }
   .cta-img {
      width: 280px;
      height: 400px;
   }
   .cta-img-text {
      font-size: 40px;
   }
   .cta-btn {
      padding: 15px 30px;
      font-size: 18px;
      border-radius: 20px;
   }
   .cta-btn .btn-icon {
      width: 40px;
      height: 40px;
   }
   .cta-btn .btn-icon img {
      width: 20px;
   }
   .cta-area {
      padding: 0 20px 80px;
   }
   .footer-area {
      background-color: var(--primary-color);
      padding: 80px 20px 20px;
   }
   .footer-logo {
      font-size: 32px;
   }
   .policy-menu {
      gap: 20px;
   }
   .policy-menu a {
      font-size: 14px;
   }
   .payment-method {
      gap: 40px;
   }
   .copyright {
      padding-top: 20px;
   }
}

@media (max-width: 767px) {
   .hero-wrapper {
      flex-direction: column-reverse;
   }
   .hero-area-main {
      padding: 30px 10px;
   }
   .hero-content {
      text-align: center;
   }
   .hero-title {
      font-size: 24px;
   }
   .hero-desc {
      max-width: 100%;
   }
   .brand-slider-container {
      padding: 0 10px;
   }
   .brand-slide {
      width: 180px;
      height: 90px;
   }
   .brand-slide img {
      max-width: 160px;
      max-height: 50px;
   }
   .brand-area-btn {
      font-size: 18px;
      padding: 15px 30px;
      border-radius: 20px;
   }
   .brand-area-btn .btn-icon {
      width: 30px;
      height: 30px;
   }
   .brand-area-btn .btn-icon img {
      width: 16px;
   }
   .testimonial-slider-container {
      padding: 20px 10px;
   }
   .review {
      font-size: 22px;
      max-width: 100%;
      margin: 20px auto;
   }
   .testimonial-img {
      width: 120px;
      height: 120px;
   }
   .testimonial-img img {
      width: 100px;
   }
   .testimonial-name {
      font-size: 18px;
   }
   .pricing-area {
      padding: 60px 0;
   }
   .section-title h2 {
      font-size: 22px;
   }
   .pricing-area-title h2 {
      border-radius: 20px;
      max-width: 100%;
      padding: 15px 20px;
   }
   .price-title-right {
      flex-direction: column;
      text-align: center;
   }
   .arrow-btn {
      width: 70px;
      height: 70px;
   }
   .arrow-btn img {
      width: 35px;
   }
   .pricing-area-title {
      margin-bottom: 20px;
   }
   .database-area {
      padding: 60px 0;
   }
   .section-title h3 {
      font-size: 22px;
   }
   .database-btn-wrap {
      padding: 20px 15px;
      gap: 20px 10px;
      border-radius: 40px;
   }
   .btn-left-icon {
      width: 40px;
      height: 40px;
   }
   .btn-left-icon img {
      max-width: 24px;
   }
   .database-btn {
      font-size: 16px;
      gap: 15px;
      border-radius: 16px;
   }
   .database-btn-left {
      gap: 8px;
   }
   .database-btn .btn-arrow {
      width: 20px;
   }
   .database-btn.small .btn-text {
      width: 90px;
   }
   .database-btn .btn-text {
      width: 130px;
   }
   .testimonial-area {
      padding: 60px 0;
   }
   .testimonial-area-title {
      margin-bottom: 20px;
   }
   .testimonial-area-title h2 {
      border-radius: 20px;
      padding: 15px 40px;
   }
   .slider-nav {
      width: 50px;
      height: 50px;
   }
   .slider-nav img {
      width: 25px;
   }
   .slider-nav-wrap {
      bottom: 40px;
   }
   .testimonial-slider2 .review {
      margin-bottom: 90px;
      max-width: 100%;
   }
   .cta-area {
      padding: 0 15px 60px;
   }
   .cta-area-wrapper {
      padding: 30px 10px;
   }
   .cta-wrapper {
      flex-direction: column-reverse;
   }
   .cta-content {
      text-align: center;
   }
   .cta-btn .btn-icon {
      width: 30px;
      height: 30px;
   }
   .cta-btn .btn-icon img {
      width: 16px;
   }
   .footer-area {
      padding: 60px 20px 20px;
      border-radius: 80px 80px 0px 0px;
   }
   .menu-item-wrap {
      gap: 30px;
      flex-wrap: wrap;
   }
   .menu-bar {
      width: 50px;
      height: 50px;
      font-size: 28px;
      background-color: var(--secondary-color);
      color: var(--primary-color);
   }
}