* {
    margin: 0%;
    padding: 0%;
    box-sizing: border-box;
    scroll-behavior: smooth;
  }
  
  body {
    font-family: "Poppins", sans-serif;
    overflow-x: hidden;
    background-color: #000;
    color: #ffff;
    cursor: default;
  }
  
  /* Constants */
  
  .flex {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .flex-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  a {
    text-decoration: none;
    color: #ffff;
  }
  
  .moveable-element {
    position: relative;
    transition: transform 0.3s;
    cursor: pointer;
  }
  
  .underline {
    text-decoration: underline;
    text-decoration-color: rgb(255, 0, 0);
    text-decoration-thickness: 0.3rem;
  }
  
  .scale,
  .scale-up,
  .scale-up-extra {
    transition: 0.2s all;
  }
  .scale:hover {
    transform: scale(1.05);
  }
  
  .scale-up:hover {
    transform: translateY(-5px);
  }
  
  .scale-up-extra:hover {
    transform: translateY(-15px);
  }
  
  .fadein {
    transition: 0.8s ease-in-out;
  }
  
  .left-to-right-1,
  .left-to-right-2,
  .left-to-right-3,
  .left-to-right-4 {
    transition: 1.5s all;
  }
  
  .case-study-text {
    transition: 0.5s;
  }
  
  /* Underline */
  
  .greeting {
    font-size: 3rem;
    font-family: sans-serif;
    position: relative;
    z-index: 1;
  }
  
  
  .text-gradient {
    background: -webkit-linear-gradient(left, #ff0000, #870000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: 100%;
    font-weight: 600;
  }
  
  .null-space{
    height: 4rem;
    width: 100%;
  }
  
  /* Animation */
  
  @keyframes upDown {
    0%, 100% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-20px); /* Adjust the value as needed for desired distance */
    }
  }
  
  
  
  
  
  /* Nav Styles */
  .nav-bar-res,
  .nav-res,
  .nav-hamburger {
    display: none;
  }
  
  .nav-div {
    padding: 0rem 2rem;
    z-index: 9999999999999;
    height: 5rem;
    padding-top: 0.6rem;
    width: 100vw;
    position: fixed;
    top: 0%;
  
  
    backdrop-filter: blur(20px);
  
    display: flex;
    justify-content: space-between;
    align-items: center;
  
    transition: 0.2s all;
  }
  
  .nav-logo {
    height: 5rem;
  }
  
  .nav-options {
    font-size: 1.3rem;
    font-weight: 500;
    text-transform: uppercase;
    display: flex;
    justify-content: space-around;
  }
  
  .nav-option-links {
    margin: 0rem 4rem;
  }
  
  .nav-button {
    height: 3rem;
    width: 10rem;
    background: linear-gradient(
      112deg,
      rgba(255, 0, 30, 0.789) 0%,
      rgba(147, 0, 17, 0.284) 100%
    );
    background-color: rgba(81, 0, 9, 0.789);
    font-size: 1.1rem;
    font-weight: 500;
    border-radius: 50px;
    transition: 0.2s all;
    text-transform: uppercase;
  }
  
  /* Nav Animations */
  .underline-animation {
    position: relative;
    transition: 0.2s all;
  }
  
  .underline-animation::before {
    content: "";
    position: absolute;
    width: 0;
    height: 3px;
    bottom: 0;
    left: 0;
    background: linear-gradient(
      172deg,
      rgb(255, 0, 30) 0%,
      rgba(0, 0, 0, 1) 100%
    );
    transition: width 0.3s ease;
  }
  
  .underline-animation:hover::before {
    width: 100%;
  }
  
  .underline-animation:hover {
    transform: scale(1.1);
  }
  
  
  /* Header Styles */
  
  .header-bg {
    height: 100vh;
    width: 100vw;
    background: #000000;
    background-image: linear-gradient(rgba(255, 0, 0, 0.55) .1em, transparent .1em), linear-gradient(90deg, rgba(255, 0, 0, 0.55) .1em, transparent .1em);
    background-size: 4.6em 4.6em;
    box-shadow: 
      0 0 200px 200px rgba(0, 0, 0, 0.8) inset, 
      0 0 0 80px rgba(0, 0, 0, 0.503) inset;
  
      gap: 2rem;
  }
  
  .header-h1{
    color: #ffff;
    font-size: 3.2rem;
    text-align: center;
    line-height:4rem;
    width: 90%;
  }
  
  .header-button {
    height: 4rem;
    width: 13rem;
    background-color: #000000;
    border: 3px solid #ff0000;
    font-size: 1.2rem;
    font-weight: 600;
    border-radius: 50px;
    transition: 0.2s all;
    text-transform: uppercase;
  }
  
  .header-button:hover{
    background-color: #ff0000;
    color: #ffff;
    border-color: #320000;
  }
  
  
  /* Hover Pfp Section */
  .hover-pfp-bg{
    height: 38rem;
    width: 100vw;
    padding: 6% 6rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  
  .pfp-wrapper{
    gap: 1rem;
    width: 40%;
  }
  
  .hover-pfp-img{
    height: 15rem;
    filter: grayscale(100%);
    transition: 0.2s all;
    border-radius: 10000000px;
    padding: .8rem;
  }
  
  .hover-pfp-img:hover{
    filter: grayscale(0%);
    border: 2px solid #ff0000;
  }
  
  .hover-info{
    color: #ffff;
    text-align: center;
  }
  
  .hover-name{
    font-size: 1.6rem;
  }
  
  .hover-desc{
    line-height: 1.4rem;
  }
  
  
  
  /* Video testim */
  .video-testimonials-bg{
    height: 55rem;
    width: 100vw;
    color: #ffff;
    position: relative;
    padding: 4rem 8rem;
  }
  
  .video-testim-head{
    gap: 24rem;
  }
  
  .vid-testim-title-wrapper{
    position: absolute; 
    left: 50%;
    transform: translateX(-50%);
    line-height: 3rem;
  }
  
  .vid-testim-h1-lower{
    font-size: 3rem;
  }
  
  .star-1{
    height: 2.8rem;
    transform: translateY(3.6rem);
  }
  
  .star-2{
    height: 3.6rem;
    transform: translateY(-3.4rem);
  }
  
  .video-wrappers{
    margin-top: -899rem;
    justify-content: center;
    gap: 4%;
  
    animation: upDown 5s ease-in-out infinite;
  }
  
  .testim-video-div{
    width: 18rem;
    height: 31rem;
    border: 2px solid #ff0000;
    border-radius: 12px;
    padding: 2rem;
    gap: 2rem;
  
    position: relative;
    z-index: 56;
  }
  
  .testim-video{
    height: 900rem;
    width: 17rem;
    
    position: relative;
    z-index: -54;
  }
  
  .testim-vid-info{
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
    /* gap: 3rem; //multi lines  */
  }
  
  .vid-info-left{
    gap: 4px;
  }
  
  .info-name{
    font-size: 1.1rem;
    font-weight: 500;
  }
  
  .info-number{
    font-size: 1.1rem;
    font-weight: 500;
  }
  
  .info-text {
    font-size: .8rem;
    font-weight: 400;
  }
  
  .info-pfp{
    height: 2rem;
    border-radius: 1000%;
  }
  
  
  .testim-vid-1{
    rotate: -4.35deg;
  }
  
  .testim-vid-2{
    rotate: -2.55deg;
    margin-top: 14rem;
  }
  
  .testim-vid-3{
    rotate: 2.55deg;
    margin-top: 14rem;
  }
  
  .testim-vid-4{
    rotate: 4.35deg;
  }
  
  /* ============== */
  
  .actions-text-wrapper{
    height: 24rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .action-txt{
    text-align: center;
    font-weight: 500;
    font-size: 2.8rem;
    line-height: 3rem;
  }
  
  .qoute-icon{
    height: 3rem;
  }
  
  .normal-qoute{
    margin-top: -4.8rem;
    margin-right: -1rem;
  }
  
  .reverse-qoute{
    rotate: 180deg;
    margin-left: -1rem;
    z-index: -999999;
  }
  
  
  /* Impact Created */
  .impact-created-div{
    height: 32rem;
    margin-top: 21rem;
    padding: 5rem;
    color: #ffff;
  }
  
  .impact-h1{
    font-size: 2.4rem;
    text-align: center;
  }
  
  .impact-wrapper{
    margin-top: -4rem;
    height: 90%;
    /* gap: 16rem; */
    justify-content: space-around;
  }
  
  .impacts{
    width: 14rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  
  .impact-count{
    font-size: 4rem;
    line-height: 4rem;
  }
  
  .impact-name{
    font-size: 1.2rem;
  }
  
  .impact-videos{
    margin-left: 2.4rem;
  }
  
  
  /* Case Study */
  .case-study-bg{
    margin-top: -12rem;
    height: 90vh;
    width: 100vw;
    background: #000000;
    background-image: linear-gradient(rgba(255, 0, 0, 0.55) .1em, transparent .1em), linear-gradient(90deg, rgba(255, 0, 0, 0.55) .1em, transparent .1em);
    background-size: 4.6em 4.6em;
    box-shadow: 
      0 0 200px 200px rgba(0, 0, 0, 0.8) inset, 
      0 0 0 80px rgba(0, 0, 0, 0.503) inset;
  
      gap: 2rem;
  }
  
  .case-study-h1{
    font-size: 3rem;
    font-weight: 600;
    color: #ffff;
    text-align: center;
    line-height: 4rem;
  }
  
  
  /* Edited videos section */
  .edited-vid-sec{
    height: 60rem;
    position: relative;
    padding: 4rem;
  }
  
  .vid-title-wrapper{
    color: #ffff;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32rem;
    margin-top: 2rem;
  }
  
  .vid-title-h1{
    position: absolute; 
    left: 50%;
    transform: translateX(-50%);
    line-height: 3rem;
    font-size: 2.4rem;
    text-align: center;
    z-index: 999999999;
  }
  
  .vid-icon-1{
    height: 2.4rem;
    margin-top: -8rem;
  }
  
  .vid-icon-2{
    height: 3rem;
    margin-top: 4rem;
  }
  
  .edited-videos-wrapper{
    height: 90%;
    padding: 0rem 9rem;
    margin-top: -4rem;
    gap: 5%;
    animation: upDown 5s ease-in-out infinite;
  }
  
  .edited-vid-1{
    rotate: -3.66deg;
  }
  
  .edited-vid-2{
    margin-top: 12rem;
  }
  
  .edited-vid-3{
    rotate: 3.66deg;
  }
  
  
  /* Text Testimonials */
  .text-testim-sec{
    height: 28rem;
    margin-top: 4rem;
    padding: 1rem;
  }
  
  .text-testim-title-wrapper{
    padding: 0rem 8rem;
    padding-bottom: 2rem;
  }
  
  .text-testm-title{
    text-align: center;
  }
  
  /* ================== */
  
  .carousel-container {
    position: relative;
    width: 1024px; /* Largura de cada painel */
    margin: 50px auto;
    overflow: hidden; /* Adicionando overflow: hidden para esconder conteúdo que ultrapassa a largura */
    background-color: #e0e0e000; /* Cor de fundo do contêiner do carrossel */
  }
  
  .carousel {
    display: flex;
    transition: transform 0.5s ease-in-out;
    width: 4400px; 
  }
  
  .panel {
    width: 1024px;
    height: 250px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    border-radius: 10px; 
    overflow: hidden; 
    background-color: #f8f8f800; 
  
    gap: 2rem;
  }
  
  .content {
    padding: 20px;
  }
  
  .arrow-pos {
    position: absolute;
    top: 50%;
    margin-top: -3.5rem;
    /* transform: translateY(-50%); */
    padding: 10px;
    cursor: pointer;
    height: 6rem;
  }
  
  .prev {
    /* left: 10px; */
    left: 20px;
  }
  
  .next {
    /* right: 10px; */
    right: 20px;
  }
  
  .panel-h1{
    text-align: center;
    font-size: 2rem;
    font-weight: 400;
    line-height: 2.6rem;
    width: 75%;
  }
  
  .name-tag{
    background-color: #7100009a;
    border-radius: 99999px;
    /* width: 34rem; */
    height: 3.6rem;
  }
  
  .panel-name{
    font-size: 1.4rem;
    font-weight: 500;
    padding: 3rem;
    color: #ff0000;
  }
  
  .next-arrow{
    rotate: 180deg;
  }
  
  
  /* Big Text sec */
  .marquee-wrapper{
    height: 10rem;
    color: #ffff;
  }
  
  .marquee {
    width: 100%; /* Adjust as needed */
    overflow: hidden; /* Hide overflowing content */
    white-space: nowrap; /* Prevent text from wrapping */
  }
  
  .marquee p {
    font-size: 4.8rem;
    font-weight: 600;
  }
  
  .marquee-text{
    display: inline-block; /* Display text in a single line */
    animation: marquee 25s linear infinite; /* Adjust animation duration and timing as needed */
  }
  
  @keyframes marquee {
    from { transform: translateX(100%); } /* Start off-screen */
    to { transform: translateX(-100%); } /* Move text completely off-screen */
  }
  
  .marquee-text{
    margin: 0rem 2.1rem;
    display: flex;
    align-items: center;
  }
  
  .marquee-text img{
    margin-top: 12px;
  }
  
  
  /* Pricing */
  .pricing-sec{
    height: 56rem;
    padding-top: 8rem;
    /* padding: 8rem; */
  }
  
  .pricing-title{
    text-align: center;
  }
  
  .pricing-stars-1{
    margin-top: -2rem;
  }
  
  .pricing-stars-2{
    margin-left: 8rem;
  }
  
  .plan-wrapper{
    margin-top: 6rem;
    gap: 4rem;
  }
  
  .plan-1{
    height: 32rem;
    width: 19rem;
    background-color: #00000000;
    border: #ff0000 solid 2px;
    border-radius: 16px;
  
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    justify-content: space-between;
  
    padding: 2rem 1rem;
  }
  
  .plan-2{
    height: 38rem;
    width: 22rem;
    background-color: #00000000;
    border: #ff0000 solid 2px;
    border-radius: 16px;
  
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    justify-content: space-between;
  
    padding: 2rem 1rem;
  }
  
  .plan-title{
    text-transform: uppercase;
    text-align: center;
  }
  
  .perk-link{
    height: 3rem;
    width: 11rem;
    background-color: #000000;
    border: 2px solid #ff0000;
    font-size: 1.15rem;
    font-weight: 500;
    border-radius: 50px;
    transition: 0.2s all;
    text-transform: uppercase;
  
    align-self: center;
  }
  
  .perk{
    display: flex;
    gap: .8rem;
    line-height: 1.4rem;
    margin-top: .4rem;
  }
  
  .perk-icon{
    height: 1.8rem;
  }
  
  .perk-text{
    font-size: 1.1rem;
    font-weight: 500;
  }
  
  .link-main{
    background: linear-gradient(318deg, rgba(10,0,4,0.5405811982996324) 0%, rgba(176, 0, 21, 0.67) 69%);
  }
  
  
  /* Calendly Section */
  .calendly{
    height: 100vh;
  }
  
  /* FOoter */
  .footer-sec{
    height: 24rem;
    width: 100%;
    border-radius: 12rem 12rem 0% 0%;
    background-color: #111111;
    overflow: hidden;
    padding: 3rem 0rem;
    padding-top: 3rem;
  
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .footer{
    width: 100vw;
    padding: 0rem 2rem;
    justify-content: space-between;
  }
  
  .footer-marquee{
    font-weight: 100;
  }
  
  .footer-logo{
    height: 6rem;
  }
  
  .social-logo{
    height: 2.5rem;
    padding: 0rem .8rem;
    transition: 0.2s all;
  }
  
  .social-logo:hover{
    transform: scale(1.2);
  }