.content {
    padding-top: 230px;
    padding-left: 93px;
    padding-right: 130px;
}

.heading{
    padding-top: 100px;
}

.heading h1 {
    font-size: 90px;
    font-weight: 400;
    text-transform: uppercase;
}

.heading h2 {
    font-size: 35px;
    font-weight: 600;
    padding-bottom: 100px;
}

.heading p {
    font-size: 30px;
    padding-bottom: 50px;
}

.heading ol {
    padding-bottom: 100px;
}

.heading li {
    font-size: 30px;
    gap: 10px;
    list-style-position: inside;
}

.heading h3 {
    font-weight: 600;
    font-size: 30px;
    padding-bottom: 50px;
}



@media (min-width: 2560px) {
  .content { padding-top: 100px; padding-left: 300px; padding-right: 300px; }
  .heading { padding-top: 200px; }
  .heading h1 { font-size: 150px; }
  .heading h2 { font-size: 50px; padding-bottom: 50px; }
  .heading p { font-size: 35px; padding-bottom: 50px; }
  .heading ol { padding-bottom: 50px; }
  .heading li { font-size: 35px; gap: 40px; padding-bottom: 20px;}
  .heading h3 { font-size: 35px; padding-bottom: 50px; }
}

@media (min-width: 1367px) and (max-width: 1600px) {
  .content { padding-top: 100px; padding-left: 120px; padding-right: 120px; }
  .heading { padding-top: 80px; }
  .heading h1 { font-size: 90px; }
  .heading h2 { font-size: 40px; padding-bottom: 50px; }
  .heading p { font-size: 25px; padding-bottom: 40px; }
  .heading ol { padding-bottom: 120px; }
  .heading li { font-size: 25px; gap: 14px; padding-bottom: 10px;}
  .heading h3 { font-size: 25px; padding-bottom: 50px; }
}

@media (min-width: 1024px) and (max-width: 1366px) {
  .content { padding-top: 120px; padding-left: 60px; padding-right: 60px; }
  .heading { padding-top: 60px; }
  .heading h1 { font-size: 60px; }
  .heading h2 { font-size: 35px; padding-bottom: 30px; }
  .heading p { font-size: 24px; padding-bottom: 40px; }
  .heading ol { padding-bottom: 80px; }
  .heading li { font-size: 24px; gap: 10px; padding-bottom: 10px;}
  .heading h3 { font-size: 24px; padding-bottom: 40px;}
}

@media (min-width: 768px) and (max-width: 1023px) {
  .content { padding-top: 60px; padding-left: 20px; padding-right: 20px; }
  .heading { padding-top: 30px; }
  .heading h1 { font-size: 40px; }
  .heading h2 { font-size: 24px; padding-bottom: 40px; }
  .heading p { font-size: 18px; padding-bottom: 20px; }
  .heading ol { padding-bottom: 40px; }
  .heading li { font-size: 18px; gap: 6px; padding-bottom: 10px;}
  .heading h3 { font-size: 18px; padding-bottom: 20px; }
}

@media (max-width: 767px) {
  .content { padding-top: 100px; padding-left: 5px; padding-right: 5px; }
  .heading { padding-top: 10px; }
  .heading h1 { font-size: 40px; padding-bottom: 30px;}
  .heading h2 { font-size: 20px; padding-bottom: 20px; }
  .heading p { font-size: 16px; padding-bottom: 20px; }
  .heading ol { padding-bottom: 20px; }
  .heading li { font-size: 16px; gap: 2px; padding-bottom: 10px; }
  .heading h3 { font-size: 16px; padding-bottom: 10px; }
}

@media (max-width: 480px) {
  .content { padding-top: 100px; padding-left: 20px; padding-right: 20px; }
  .heading { padding-top: 0px; }
  .heading h1 { font-size: 30px; }
  .heading h2 { font-size: 20px; padding-bottom: 15px; }
  .heading p { font-size: 14px; padding-bottom: 15px; }
  .heading ol { padding-bottom: 15px; }
  .heading li { font-size: 14px; gap: 5px; }
  .heading h3 { font-size: 20px; padding-bottom: 15px; }
}


.fade-in {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1), transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  will-change: opacity, transform;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}