@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Righteous&display=swap');


:root {
    --primary-color:  #fe7627;
    --text-dark: #111827;
    --text-light: #6b7280;
    --white: #ffffff;
    --max-width: 1200px;
    --primary-color-light: #fffcfa;

  }
  .footer{background-color: var(--primary-color-light);}

  * {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }

  html{background-color: #f4f4f4;}
  
  .section__container {
    max-width: var(--max-width);
    margin: auto;
    padding: 5rem 1rem;
  }
  
  .section__subheader {
    margin-bottom: 1rem;
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-light);
    text-align: center;
  }
  
  .section__header {
    font-size: 3rem;
    font-weight: 500;
    line-height: 3.75rem;
    color: var(--text-dark);
    text-align: center;
  }
  
  .logo {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--text-dark);


  }

  .log {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--text-dark);


  }
  

.footer__logo .logo{ font-size: 1.75rem;
  font-weight: 600;
  color: var(--text-dark);}

  .logo span {
    color: #fe7627;
  }


  .log .spannm {
    color: #fe7627;
  }
  
  
  .home__content span{color: #fe7627;}

  img {
    display: flex;
    width: 100%;
  }
  
  a {
    text-decoration: none;
    transition: 0.3s;
  }
  
  ul {
    list-style: none;
  }
  
  html,
  body {
    scroll-behavior: smooth;overflow-x: hidden;
  }
  
  body {
    font-family: "Poppins", sans-serif;
    background-image: url("assets/header-bg.png");
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
  }
  
  header{
    position:fixed;
    width: 100%;
    top:0;
    right:0;
    z-index:3;
    height: 80px;
    box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.034), 0 6px 20px 0 rgba(0, 0, 0, 0.082);
    background-color:#fff;
    
    }

  nav {
    isolation: isolate;
    width: 100%;
    max-width: var(--max-width);
    margin-inline: auto;
    z-index: 9;
    top:0;
    right:0;
    transform: translateY(-40%);
   
  }
  
  .nav__header {
    margin: 10rem 0rem;
    padding: 1rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--primary-color);
    height: 80px;

  }
  
  .logo {
    color: var(--white);
  }
  
  .nav__menu__btn {
    font-size: 1.5rem;
    color: var(--white);
    cursor: pointer;
  }
  
  .nav__links {
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2rem;
    padding: 2rem;
    background-color: var(--text-dark);
    transition: 0.5s;
    z-index: -1;
    transform: translateY(-100%);
  }
  
  .nav__links.open {
    transform: translateY(0);
  }
  
  .nav__links a {
    font-weight: 500;
    white-space: nowrap;
    color: var(--white);
  }
  
  .nav__links a:hover {
    color: var(--primary-color);
  }
  
 
  
  @media (width < 768px){ nav{right:0;
    transform: translateY(-210%)}}
  
  
  
    .investidor__grid {
    margin-top: 4rem;
    display: grid;
    gap: 1rem;
    border-radius: 50px;background-image: linear-gradient(
      180deg,
      rgba(255, 102, 0, 0.014) 0%,
      #ffffff 25%,
  
      #ffffff 75%,
      #ffffff 84%,
      #f4f4f4 100%
    );filter: blur(80%);
  }
  
  .investidor__card {
    padding: 2rem 1rem;
    text-align: center;
    border-radius: 2rem;
    transition: 0.3s;border: 2px dashed rgb(255, 102, 0);
  }
  
  .investidor__card:hover {
    box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.1);
  }
  
  .investidor__card img {
    margin-bottom: 2rem;
    max-width: 150px;
    margin-inline: auto;
    filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.3));border-radius: 32%;

  }
  

  .investidor__card h4 {
    margin-bottom: 1rem;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text-dark);
  }
  
  .investidor__card p {
    color: var(--text-light);
  }
  
  .mentor__grid {
    margin-top: 4rem;
    display: grid;
    gap: 1rem;
  }
  





  @media (width < 500px) {
   
  
    .card1 {
      height: 150px;}
    
   
.explore__content .btn{
  transform: translateY(-30px);}}



.requestz a{color: #ffffff;}

  .carde {
    width: 100%;
    max-width: 750px;
    height: 220px;
    border-radius: 10px 50px 20px 18px;
    display: flex;
    align-items: center;
    justify-content: left;
    backdrop-filter: blur(10px);
    transition: 0.5s ease-in-out;
  
  
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 30px;
    transition: 0.3s;background-color: #fff; 
    
  }
  
  .carde:before {
    content: "";
    position: absolute;
    z-index: -1;
    background: #00838d;
   
    transform: scale(1);
    transition: transform 0.25s ease-out;
  }
  
  .carde:hover:before {
    transform: scale(21);
  }
  
  .imge img{
    width: 200px;
    height: 200px;
    margin-left: 10px;
    border-radius: 32px;
    background: linear-gradient(#d7cfcf, #9198e5);
  }
  
  .carde:hover > .imge img{
    transition: 0.5s ease-in-out;
    background: linear-gradient(#9198e5, #712020);
  }









  
 
  .programa__image .ladoimagem {max-width: 225px; width: 100%;
    margin-inline: auto;
    
  }
  
  .programa__list {
    list-style: none;
    margin-top: 2rem;
    display: grid;
    gap: 1rem;
  }
  
  .programa__list li {
    display: flex;
    align-items: center;
    gap: 1rem;
    
    border-radius: 10px 50px 20px 18px;
   padding: 10px;
    justify-content: left;
    backdrop-filter: blur(10px);
    transition: 0.5s ease-in-out;
  
  
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 30px;
    transition: 0.3s;background-color: hsl(0, 0%, 100%); 


    width: 100%;
    max-width: 700px;
    margin: auto auto;   height: auto;  

  }
  

  .programa__list li:hover {
  transform: scale(1.1);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.185);
  color: #333; border-radius: 32px;
}


  .programa__list li span {
    font-size: 1rem;
    color: #000;
    border-radius: 1rem;
  }
  
  
  
  .programa__list h4 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #000000;
  }
  
  .programa__list p {
    color: #000;
  }
 
.yellowfundo{background-color: #1d1d1d28;
  }
  
 
  .ecoscase__swiper{
    transition: 0.3s;}
  
  .ecoscase__card__content {
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
  }
  
  .ecoscase__card__content p {
    margin-bottom: 2rem;
    color: var(--text-light);
  }
  
  .ecoscase__card__content h4 {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--text-dark);
  }
  
  .ecoscase__card__content h5 {
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-light);
  }
  
  .footer__container {
    display: grid;
    gap: 2rem;
  }
  
  .footer__col p {
    margin-top: 1rem;
    color: var(--text-light);
  }
  
  .footer__col h4 {
    margin-bottom: 1.5rem;
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--text-dark);
  }
  
  .footer__links {
    display: grid;
    gap: 1rem;
  }
  
  .footer__links a {
    font-weight: 500;
    color: var(--text-light);
  }
  
  .footer__links a:hover {
    color: var(--primary-color);
  }
  
  .footer__socials {
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  
  .footer__socials a {
    padding: 8px 12px;
    font-size: 1.25rem;
    color: var(--text-dark);
    border-radius: 100%;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
  }
  
  .footer__socials a:hover {
    color: var(--white);
    background-color: var(--primary-color);
  }
  
  .footer__col h5 {
    margin-bottom: 1rem;
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--text-light);
  }
  
  .footer__discover {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  

  .programa__container {
    display: grid;
    gap: 2rem;
    overflow: hidden;
  }


  .footer__discover img {
    max-width: 120px;
    border-radius: 1rem;
  }
  
  .footer__bar {
    padding: 1rem;
    font-size: 0.9rem;
    color: var(--text-light);
    text-align: center;
  }
  
  @media (width > 540px) {
    .investidor__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .mentor__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .footer__container {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .footer__col:nth-child(4) {
      grid-area: 2/1/3/2;
    }
  }
  
  @media (width > 768px) {
    nav {
      position: static;
      padding-block: 2rem 0;
      padding-inline: 1rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 2rem;
    }
  
    .nav__header {
      padding: 0;
      background-color: transparent;
    }
  
    .nav__logo .logo {
      color: var(--text-dark);
    }
  
    .nav__menu__btn {
      display: none;
    }
  
    .nav__links {
      position: static;
      padding: 0;
      flex-direction: row;
      justify-content: flex-end;
      gap: 4rem;
      background-color: transparent;
      transform: none;
    }
  
    .nav__links a {
      color: var(--text-dark);
    }
  
  
    .investidor__grid {
      grid-template-columns: repeat(4, 1fr);
    }
  
    .mentor__grid {
      grid-template-columns: repeat(3, 1fr);
    }
  
    .programa__container {
      grid-template-columns: repeat(2, 1fr);
      align-items: center;
    }

    .programa__image {
      grid-area: 1/2/2/3;
    }
  
    .programa__content :is(.section__subheader, .section__header) {
      text-align: center;
    }
  
    .ecoscase__container {
      grid-template-rows: 1fr 1fr;
    }
  
    .ecoscase__content :is(.section__subheader, .section__header) {
      text-align: left;
    }
  
    .footer__container {
      grid-template-columns: repeat(4, 1fr);
    }
  
    .footer__col:nth-child(4) {
      grid-area: unset;
    }
  }
  
  @media (width > 1024px) {
    .investidor__grid{
      gap: 2rem;
    }
  
    .investidor__card {
      padding: 2rem;
    }
  
    .mentor__grid {
      gap: 2rem;
    }
  }
  





.index img{z-index: 0;}

.programa img{z-index: 1; bottom: 90%;}



@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}


  .sobre__container {
    display: grid;
    gap: 2rem;
    overflow: hidden;  
  }




    
    .sobre__image{overflow: visible;}
   
    
    
  
  .sobre__image img {
    max-width: 400px;
    margin-inline: auto;
    filter: drop-shadow(-7px 5px 10px rgba(252, 127, 9, 0.4));
  }
  
  .explore__content .section__description {
    margin-bottom: 2rem;
  }
  
  .explore__bt2 .btn{
    text-align: center;margin-top: 20px;
  }
  
  .banner__container {
    display: grid;
    gap: 1rem;
  }
  
  .banner__card {
    padding: 2rem;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 3rem;
    transition: 0.3s;
    width: 450px;background-color: #fff;
  }
  
  .banner__card:hover {
    box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.1);
  }
  

  .banner__card .banner__icon {
    display: inline-block;
    margin-bottom: 1rem;
    padding: 10px 15px;
    font-size: 2rem;
    color: var(--white);
    border-radius: 50%;
    
  }

  p i {color: #000000;}
  
  .banner__card:nth-child(1) .banner__icon {
    background-color: #62b15c;
    box-shadow: 5px 5px 30px #62b15cd0;
  }
  
  .banner__card:nth-child(2) .banner__icon {
    background-color: #ff3e67;
    box-shadow: 5px 5px 30px #ff3e67d0;
  }
  
  .banner__card:nth-child(3) .banner__icon {
    background-color: #185adb;
    box-shadow: 5px 5px 30px #185adbd0;
  }
  
  .banner__card h4 {
    margin-bottom: 0.5rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-dark);
  }
  
  .banner__card p {
    margin-bottom: 1rem;
    color: var(--text-light);
    line-height: 1.75rem;
  }
  
  .banner__card a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 500;
    color: var(--primary-color);
  }
  
  .banner__card a span {
    font-size: 1.25rem;
    transition: 0.3s;
  }
  
  .banner__card a:hover span {
    transform: translateX(10px);
  }
  


/* Animación */
@keyframes float {
  0% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }

  100% {
    transform: translateY(0);
  }
}


  @media (width > 540px) {
    .special__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .banner__container {
      grid-template-columns: repeat(2, 1fr);
    }
  
    .footer__container {
      grid-template-columns: 3fr 2fr;
    }
  }
  
  @media (width > 768px) {
    nav {
      position: static;
      padding: 2rem 1rem;
      max-width: var(--max-width);
      margin-inline: auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 2rem;
    }
  
    .nav__header {
      flex: 1;
      padding: 0;
      background-color: transparent;
    }
  
    .nav__logo a {
      color: var(--primary-color);
    }
  
    .nav__logo .spanum{ border-radius: 50%;padding: 1px 18px;margin-right: 8px;
      width: 50px;
      height: 50px;
      color: #ffffff;
      background-color: #fe7627;
      border-radius: 50%;
      cursor: pointer;
      transition-duration: .3s;
      box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.13);
      border: none;
    }



    .cardcirculo { border-radius: 50%;padding: 5px 15px;
      
      color: #ffffff;
      background-color: #fe7627;
      cursor: pointer;
      transition-duration: .3s;
      box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.13);
      border: none;
    } 
    
    
    .cardvc { 
      
      color:#fe7627;
      
    } 

  

    .nav__menu__btn {
      display: none;
    }
  
    .nav__links {
      position: static;
      padding: 0;
      flex-direction: row;
      background-color: transparent;
      transform: none;
    }
  
    .nav__links a {
      color: var(--text-dark);
    }
  
    .nav__links a:hover {
      color: var(--primary-color);
    }
  
    .nav__btn {
      display: flex;
      flex: 1;
    }
  
    .nav__btn .btn {
      padding: 8px 10px;
      font-size: 1.5rem;
      border-radius: 100%;
    }
  
    .home__container {
      grid-template-columns: 2fr 3fr;
      align-items: center;
    }
  
    .home__content h1,
    .home__content .section__description,
    .header__btn {
      text-align: left;
    }
  
    .home__image {
      grid-area: 1/2/2/3;
    }
  
    .special__grid {
      grid-template-columns: repeat(3, 1fr);
    }

  
    .banner__container {
      grid-template-columns: repeat(3, 1fr);
    }
  
    .chef__bg {
      max-width: 300px;
    }
  
    .chef__container {
      grid-template-columns: repeat(2, 1fr);
      align-items: center;
    }
  
    .chef__image {
      grid-area: 1/2/2/3;
    }
  
    .chef__content :is(.section__header, .section__description) {
      text-align: left;
    }
  
    .chef__list li {
      justify-content: flex-start;
    }
  
    .ecoscase__swiper {
      padding: 3rem 2rem;
    }
  
    .footer__container {
      grid-template-columns: 2fr repeat(3, 1fr);
    }
  }
  
  @media (width > 1024px) {
    .special__grid {
      gap: 2rem;
    }
  
    .special__card {
      padding: 2rem;
      border-radius: 3rem;
    }
  
    .banner__container {
      gap: 2rem;
    }
  
    .chef__bg {
      max-width: 375px;
    }
  }
  




  @media (width < 1518px) {.redes1{display: none;}
  }



  @media (width < 489px) {.infoz{width: 80%;}}






  .ecoscase__container {
    padding-top: 0;
  }
  
  .ecoscase__container :is(.section__header, .section__description) {
    max-width: 800px;
    margin-inline: auto;
    text-align: center;
  }
  

  
  
  
  .ecoscase__card {
    text-align: center;
  }
  
  .ecoscase__card p {
    margin-bottom: 2rem;
    color: var(--text-dark);
    line-height: 1.75rem;
  }
  
  .ecoscase__card img {
    margin-bottom: 1rem;
    max-width: 70px;
    margin-inline: auto;
    border-radius: 100%;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.2);
  }
  
  .ecoscase__card h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #fff;
  }
  
  .ecoscase__card .section__header {
    font-size: 1rem;
    font-weight: 500;
    color: #fff;
  }
  
  
  










  
  .content {
    height:10px;
  }

  .nav__links .active{color: #e65100; border-bottom: 2px solid;border-color:#e65100;padding: 1px  ;}


  #progress-container {
    width: 100%;
    height: 8px;
    background: #ccc;
  }
  
  /* The progress bar (scroll indicator) */
  #progress-bar {
    height: 8px;
    background: #ff5e00bd;
    width: 0%;
  }

   
    


  .b1 button a{

    color: white;
    
   }



      
      .btn  {
        --btn-color: #fe7627;
        position: relative;
        padding: 10px 20px;
        font-family: Roboto, sans-serif;
        font-weight: 500;
        font-size: 16px;
        line-height: 1;
        color: white;
        background: none;
        border: none;
        outline: none;
        overflow: hidden;
        cursor: pointer;
        filter: drop-shadow(0 2px 8px rgba(248, 62, 6, 0.32));
        transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
       }
       
       .btn::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
        background: var(--btn-color);
        border-radius: 24px;
        transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
       }
       
       .btn span,
       .btn span span {
        display: inline-flex;
        vertical-align: middle;
        transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
       }
       
       .btns span {
        transition-delay: 0.05s;
       }
       
       .btn span:first-child {
        padding-right: 7px;
       }
       

      
       .btn span span {
        margin-left: 8px;
        transition-delay: 0.1s;
       }
       
       .btn ul {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        display: flex;
        margin: 0;
        padding: 0;
        list-style-type: none;
        transform: translateY(-50%);
       }
       
       .btn ul li {
        flex: 1;
       }
       
       .btn ul li a {
        display: inline-flex;
        vertical-align: middle;
        transform: translateY(55px);
        transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
       }
       
       .btn ul li a:hover {
        opacity: 0.5;
       }

       .btn:hover{border-radius: 50px;transform: scale(1.2);}
       
       .btn:hover::before {
        transform: scale(1.2);
       }
       
       .btn:hover span,
       .btn:hover span span {
        transform: translateY(-55px);
       }
       
       .btn:hover ul li a {
        transform: translateY(0);
       }
       
       .btn:hover ul li:nth-child(1) a {
        transition-delay: 0.15s;
       }
       
       .btn:hover ul li:nth-child(2) a {
        transition-delay: 0.2s;
       }
       
       .btn:hover ul li:nth-child(3) a {
        transition-delay: 0.25s;
       }

       

      

  /* From Uiverse.io by neerajbaniwal */ 
.wrapper {
    --background: #fd6500d3;
    --icon-color: #414856;
    --shape-color-01: #b8cbee;
    --shape-color-02: #7691e8;
    --shape-color-03: #fdd053;
    --width: 90px;
    --height: 90px;
    --border-radius: var(--height);
    width: var(--width);
    height: var(--height);
    position: fixed;
    border-radius: var(--border-radius);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0 0 90%;z-index: 1;
  }
  .wrapper .btn {
    background: var(--background);
    width: var(--width);
    height: var(--height);
    position: relative;
    z-index: 3;
    border-radius: var(--border-radius);
    box-shadow: 0 10px 30px rgba(65, 72, 86, 0.05);
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-animation: plus-animation-reverse 0.5s ease-out forwards;
    animation: plus-animation-reverse 0.5s ease-out forwards;
  }
  .wrapper .btn::before,
  .wrapper .btn::after {
    content: "";
    display: block;
    position: absolute;
    border-radius: 4px;
    background: #fff;
  }
  .wrapper .btn::before {
    width: 4px;
    height: 28px;
  }
  .wrapper .btn::after {
    width: 28px;
    height: 4px;
  }
  .wrapper .tooltip {
    width: 90px;
    height: 75px;
    border-radius: 70px;
    position: absolute;
    background: #fff;
    z-index: 2;
    padding: 0 15px;
    box-shadow: 0 10px 30px rgba(65, 72, 86, 0.05);
    opacity: 0;
    top: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    transition: opacity 0.15s ease-in, top 0.15s ease-in, width 0.15s ease-in;
  }
  .wrapper .tooltip > svg {
    width: 100%;
    height: 26px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    cursor: pointer;
  }
  .wrapper .tooltip > svg .icon {
    fill: none;
    stroke: var(--icon-color);
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.4;
    transition: opacity 0.3s ease;
  }
  .wrapper .tooltip > svg:hover .icon {
    opacity: 1;
  }
  .wrapper .tooltip::after {
    content: "";
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 3px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    bottom: -8px;
    transform: rotate(45deg);
    z-index: 0;
  }
  .wrapper > svg {
    width: 300px;
    height: 300px;
    position: absolute;
    z-index: 1;
    transform: scale(0);
  }
  .wrapper > svg .shape {
    fill: none;
    stroke: none;
    stroke-width: 3px;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform-origin: 50% 20%;
  }
  .wrapper input {
    height: 100%;
    width: 100%;
    border-radius: var(--border-radius);
    cursor: pointer;
    position: absolute;
    z-index: 5;
    opacity: 0;
  }
  .wrapper input:checked ~ svg {
    -webkit-animation: pang-animation 1.2s ease-out forwards;
    animation: pang-animation 1.2s ease-out forwards;
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(1) {
    transform: translate(25px, 30%) rotate(40deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(2) {
    transform: translate(-4px, 30%) rotate(80deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(3) {
    transform: translate(12px, 30%) rotate(120deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(4) {
    transform: translate(8px, 30%) rotate(160deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(5) {
    transform: translate(21px, 30%) rotate(200deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(6) {
    transform: translate(0px, 30%) rotate(240deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(7) {
    transform: translate(17px, 30%) rotate(280deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(8) {
    transform: translate(-3px, 30%) rotate(320deg);
  }
  .wrapper input:checked ~ svg .shape:nth-of-type(9) {
    transform: translate(25px, 30%) rotate(360deg);
  }
  .wrapper input:checked ~ .btn {
    -webkit-animation: plus-animation 0.5s ease-out forwards;
    animation: plus-animation 0.5s ease-out forwards;
  }
  .wrapper input:checked ~ .tooltip {
    width: 190px;
    height: 70px;
    -webkit-animation: stretch-animation 1s ease-out forwards 0.15s;
    animation: stretch-animation 1s ease-out forwards 0.15s;
    top: -90px;
    opacity: 1;
  }
  
  @-webkit-keyframes pang-animation {
    0% {
      transform: scale(0);
      opacity: 0;
    }
    40% {
      transform: scale(1);
      opacity: 1;
    }
    100% {
      transform: scale(1.1);
      opacity: 0;
    }
  }
  
  @keyframes pang-animation {
    0% {
      transform: scale(0);
      opacity: 0;
    }
    40% {
      transform: scale(1);
      opacity: 1;
    }
    100% {
      transform: scale(1.1);
      opacity: 0;
    }
  }
  @-webkit-keyframes plus-animation {
    0% {
      transform: rotate(0) scale(1);
    }
    20% {
      transform: rotate(60deg) scale(0.93);
    }
    55% {
      transform: rotate(35deg) scale(0.97);
    }
    80% {
      transform: rotate(48deg) scale(0.94);
    }
    100% {
      transform: rotate(45deg) scale(0.95);
    }
  }
  @keyframes plus-animation {
    0% {
      transform: rotate(0) scale(1);
    }
    20% {
      transform: rotate(60deg) scale(0.93);
    }
    55% {
      transform: rotate(35deg) scale(0.97);
    }
    80% {
      transform: rotate(48deg) scale(0.94);
    }
    100% {
      transform: rotate(45deg) scale(0.95);
    }
  }
  @-webkit-keyframes plus-animation-reverse {
    0% {
      transform: rotate(45deg) scale(0.95);
    }
    20% {
      transform: rotate(-15deg);
    }
    55% {
      transform: rotate(10deg);
    }
    80% {
      transform: rotate(-3deg);
    }
    100% {
      transform: rotate(0) scale(1);
    }
  }
  @keyframes plus-animation-reverse {
    0% {
      transform: rotate(45deg) scale(0.95);
    }
    20% {
      transform: rotate(-15deg);
    }
    55% {
      transform: rotate(10deg);
    }
    80% {
      transform: rotate(-3deg);
    }
    100% {
      transform: rotate(0) scale(1);
    }
  }
  @-webkit-keyframes stretch-animation {
    0% {
      transform: scale(1, 1);
    }
    10% {
      transform: scale(1.1, 0.9);
    }
    30% {
      transform: scale(0.9, 1.1);
    }
    50% {
      transform: scale(1.05, 0.95);
    }
    100% {
      transform: scale(1, 1);
    }
  }
  @keyframes stretch-animation {
    0% {
      transform: scale(1, 1);
    }
    10% {
      transform: scale(1.1, 0.9);
    }
    30% {
      transform: scale(0.9, 1.1);
    }
    50% {
      transform: scale(1.05, 0.95);
    }
    100% {
      transform: scale(1, 1);
    }
  }
  
  .socials {
    position: fixed;
    display: block;
    left: 20px;
    bottom: 20px;
  }
  .socials > a {
    display: block;
    width: 30px;
    opacity: 0.2;
    transform: scale(var(--scale, 0.8));
    transition: transform 0.3s cubic-bezier(0.38, -0.12, 0.24, 1.91);
  }
  .socials > a:hover {
    --scale: 1;
  }
  





  .colunas{display: flex;gap: 30px;}

  .letters{display: flex;flex-direction: column; width: 1200px;gap: 30px;}










  .shape{width: 500px;
    height: 400px;
border: 2px dashed  rgb(254, 100, 70);
    border-radius: 20% 20% 40% ;
    transform: translateY(-100px) translateX(80px); z-index: 0;position: absolute;}

  

   


.avatar img{    width: 350px;
  height: auto;border-radius: 20% 20% 10% 30%
  ;scale: 1.5;transform: translateY(10px) translateX(100px);position: absolute;}

.sgvstroke svg{transform: translatey(-400px) translatex(-80px);position: absolute; height: 550px;}











/* From Uiverse.io by andrew-demchenk0 */ 
.info {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  width: 500px;
  padding: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  background: #509AF8;
  border-radius: 8px;
  box-shadow: 0px 0px 5px -3px #111;
}

.info__icon {
  width: 20px;
  height: 20px;
  transform: translateY(-2px);
  margin-right: 8px;
}

.info__icon path {
  fill: #fff;
}

.info__title {
  font-weight: 500;
  font-size: 14px;
  color: #fff;
}

.info__close {
  width: 20px;
  height: 20px;
  cursor: pointer;
  margin-left: auto;
}

.info__close path {
  fill: #fff;
}



/* From Uiverse.io by Prince4fff */ 
.cardi p {
  font-size: 17px;
  font-weight: 400;
  line-height: 20px;
  color: #666;
}

.cardi p.small {
  font-size: 14px;
}



.explore__content .btn{position: absolute;
  margin-top: -50px;margin-left: 20px;}

.go-arrow {
  margin-top: -4px;
  margin-right: -4px;
  color: white;
  font-family: courier, sans;
}

.card1 {
  display: block;
  position: relative;
  max-width: 550px;
  border-radius: 10px 18px 25px 34px ; border: 2px dashed #f18b2b;
  padding: 30px 24px 50px 24px ;
  margin: 1px 0;
  text-decoration: none;
  z-index: 0;
  overflow: hidden;}



.card1:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -16px;
  right: -16px;
  background: #ff8800;
  height: 32px;
  width: 102px;
  border-radius: 32px;
  transform: scale(0);
  transform-origin: 50% 50%;
  transition: transform 0.25s ease-out;
}

.card1:hover:before {
  transform: scale(21);
}

.card1:hover p {
  transition: all 0.3s ease-out;
  color: rgba(255, 255, 255, 0.8);
}

.card1:hover h3 {
  transition: all 0.3s ease-out;
  color: #fff;
}

.card2 {
  display: block;
  top: 0px;
  position: relative;
  max-width: 262px;
  background-color: #f2f8f9;
  border-radius: 4px;
  padding: 32px 24px;
  margin: 12px;
  text-decoration: none;
  z-index: 0;
  overflow: hidden;
  border: 1px solid #f2f8f9;
}

.card2:hover {
  transition: all 0.2s ease-out;
  box-shadow: 0px 4px 8px rgba(38, 38, 38, 0.2);
  top: -4px;
  border: 1px solid #ccc;
  background-color: white;
}

.card2:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -16px;
  right: -16px;
  background: #99602a;
  height: 32px;
  width: 32px;
  border-radius: 32px;
  transform: scale(2);
  transform-origin: 50% 50%;
  transition: transform 0.15s ease-out;
}

.card2:hover:before {
  transform: scale(2.15);
}

.card3 {
  display: block;
  top: 0px;
  position: relative;
  max-width: 262px;
  background-color: #f2f8f9;
  border-radius: 4px;
  padding: 32px 24px;
  margin: 12px;
  text-decoration: none;
  overflow: hidden;
  border: 1px solid #f2f8f9;
}

.card3 .go-corner {
  opacity: 0.7;
}

.card3:hover {
  border: 1px solid #ff9100;
  box-shadow: 0px 0px 999px 999px rgba(255, 255, 255, 0.5);
  z-index: 500;
}

.card3:hover p {
  color: #fd8f00;
}

.card3:hover .go-corner {
  transition: opactiy 0.3s linear;
  opacity: 1;
}

.card4 {
  display: block;
  top: 0px;
  position: relative;
  max-width: 262px;
  background-color: #fff;
  border-radius: 4px;
  padding: 32px 24px;
  margin: 12px;
  text-decoration: none;
  overflow: hidden;
  border: 1px solid #ccc;
}

.card4 .go-corner {
  background-color: #806f61;
  height: 100%;
  width: 16px;
  padding-right: 9px;
  border-radius: 0;
  transform: skew(6deg);
  margin-right: -36px;
  align-items: start;
  background-image: linear-gradient(-45deg, #8f479a 1%, #dc2a74 100%);
}

.card4 .go-arrow {
  transform: skew(-6deg);
  margin-left: -2px;
  margin-top: 9px;
  opacity: 0;
}

.card4:hover {
  border: 1px solid #cd3d73;
}

.card4 h3 {
  margin-top: 8px;
}

.card4:hover .go-corner {
  margin-right: -12px;
}

.card4:hover .go-arrow {
  opacity: 1;
}











.buttonx {
  background: transparent;
  color: #00000000;
  border: 3px solid #9c838300;
  border-radius: 50px;
  padding: 0.8rem 2rem;
  font: 18px "Margarine", sans-serif;
  outline: none;
  cursor: pointer;
  position: relative;
  transition: 0.2s ease-in-out;
  letter-spacing: 2px; transform: translateY(00px);
}

.name {
  width: 100%;
  text-align: center;
  padding: 0 0 3rem;
  padding-top: 4rem;
  font: 500 14px "Rubik", sans-serif;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
}

.button-parrot .parrot {
  position: absolute;
  width: 60px;
  text-align: center;
  animation: blink 0.8s infinite;
  color: transparent;
}

.button-parrot .parrot:before {
  content: "Click Me!";
}

.button-parrot .parrot:nth-child(1) {
  top: -30px;
  left: -40px;
  font: 12px/1 "Margarine", sans-serif;
  transform: rotate(-20deg);
  animation-duration: 0.5s;
}

.button-parrot .parrot:nth-child(2) {
  font: 12px/1 "Margarine", sans-serif;
  right: -40px;
  top: -20px;
  transform: rotate(15deg);
  animation-duration: 0.3s;
}

.button-parrot .parrot:nth-child(3) {
  font: 16px/1 "Margarine", sans-serif;
  top: -60px;
  left: 15px;
  transform: rotate(10deg);
  animation-duration: 1s;
}

.button-parrot .parrot:nth-child(4) {
  font: 18px/1 "Margarine", sans-serif;
  top: -70px;
  left: 95px;
  transform: rotate(2deg);
  animation-duration: 0.7s;
}

.button-parrot .parrot:nth-child(5) {
  font: 14px/1 "Margarine", sans-serif;
  top: 80px;
  left: 105px;
  transform: rotate(-20deg);
  animation-duration: 0.8s;
}

.button-parrot .parrot:nth-child(6) {
  font: 12px/1 "Margarine", sans-serif;
  top: 80px;
  left: 5px;
  transform: rotate(10deg);
  animation-duration: 1.2s;
}

.button-parrot button:hover .parrot:before {
  content: "Do it!";
  width: 70px;
}

@keyframes blink {
  25%, 75% {
    color: transparent;
  }

  40%, 60% {
    color: #000000;
  }
}













































/* From Uiverse.io by Praashoo7 */ 
/* CodePen Card */

.cardx {
  width: 15em;
  height: 10em;
  background-color: #252525;
  border-radius: 7px;
  cursor: pointer;
}

.fl {
  display: flex;
  justify-content: flex-end;
  opacity: 0;
  transition: .2s ease-in-out;
}

.fl:hover .fullscreen {
  scale: 1.2;
}

.fl:hover .fullscreen_svg {
  fill: white;
}

.fullscreen {
  width: 1.5em;
  height: 1.5em;
  border-radius: 5px;
  background-color: #727890;
  margin: 1em;
  margin-right: 0.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .2s ease-in-out;
  box-shadow: 2px 2px 6px rgba(0,0,0,.4);
}

.fullscreen_svg {
  width: 15px;
  height: 15px;
  fill: rgb(177, 176, 176);
  transition: .2s ease-in-out;
}

.card_back {
  position: absolute;
  width: 15em;
  height: 13em;
  background-color: rgba(30, 31, 38, 0.575);
  border-radius: 7px;
  margin-top: -5em;
  margin-left: 0.7em;
  transition: .2s ease-in-out;
  z-index: -1;
}

.main:hover .card_back {
  margin-top: -6.25em;
  margin-left: 0em;
  scale: 1.1;
  height: 15.25em;
  cursor: pointer;
}

.main:hover .fl {
  opacity: 1;
  cursor: pointer;
  margin-right: 0.5em;
}

.data {
  display: flex;
  flex-direction: row;
  margin-top: 1em;
}

.img {
  width: 2.25em;
  height: 2.25em;
  background-color: #252525;
  border-radius: 5px;
  overflow: hidden;
}

.text {
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin-left: 0.5em;
  font-family: Montserrat;
  color: white;
}

.text_m {
  font-weight: bold;
  font-size: 0.9em;
}

.text_s {
  font-size: 0.7em;
}

.btns {
  display: flex;
  gap: 0.5em;
  transition: .2s ease-in-out;
}

.likes {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5em;
  height: 1.4em;
  border-radius: 4px;
  margin-top: -0.5em;
  opacity: 0;
  background-color: #444857;
  transition: .2s ease-in-out;
}

.likes_text {
  font-family: Montserrat;
  font-size: 0.8em;
  margin-left: 0.25em;
  color: white;
}

.likes_svg {
  width: 12px;
  height: 12px;
  fill: white;
}

.likes:hover {
  background-color: #5A5F73;
  cursor: pointer;
}

.comments {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5em;
  height: 1.4em;
  border-radius: 4px;
  margin-top: -0.5em;
  opacity: 0;
  background-color: #444857;
  transition: .24s ease-in-out;
}

.comments_text {
  font-family: Montserrat;
  font-size: 0.8em;
  margin-left: 0.25em;
  color: white;
}

.comments_svg {
  width: 12px;
  height: 12px;
  fill: white;
}

.comments:hover {
  background-color: #5A5F73;
  cursor: pointer;
}

.views {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3em;
  height: 1.4em;
  border-radius: 4px;
  margin-top: -0.5em;
  opacity: 0;
  background-color: #444857;
  transition: .28s ease-in-out;
}

.views_text {
  font-family: Montserrat;
  font-size: 0.8em;
  margin-left: 0.25em;
  color: white;
}

.views_svg {
  width: 12px;
  height: 12px;
  fill: white;
}

.views:hover {
  background-color: #5A5F73;
  cursor: pointer;
}

.main:hover .likes {
  margin-top: 0.5em;
  opacity: 1;
}

.main:hover .comments {
  margin-top: 0.5em;
  opacity: 1;
}

.main:hover .views {
  margin-top: 0.5em;
  opacity: 1;
}



/* The Main Switch */

.card_content {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* The switch - the box around the slider */
.switch_738 {
  font-size: 13px;
  position: relative;
  display: inline-block;
  width: 1.2em;
  height: 3.3em;
}

/* Hide default HTML checkbox */
.switch_738 .chk_738 {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider_738 {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: .4s;
  border-radius: 5px;
}

.slider_738:before {
  position: absolute;
  content: "";
  height: .5em;
  width: 2.4em;
  border-radius: 5px;
  left: -0.6em;
  top: 0.2em;
  background-color: white;
  box-shadow: 0 6px 7px rgba(0,0,0,0.3);
  transition: .4s;
}

.slider_738:before, .slider_738:after {
  content: "";
  display: block;
}

.slider_738:after {
  background: linear-gradient(transparent 50%, rgba(255, 255, 255, 0.15) 0) 0 50% / 50% 100%,
		repeating-linear-gradient(90deg,rgb(255, 255, 255) 0,rgb(255, 255, 255),rgb(255, 255, 255) 20%,rgb(255, 255, 255) 20%,rgb(255, 255, 255) 40%) 0 50% / 50% 100%,
		radial-gradient(circle at 50% 50%,rgb(255, 255, 255) 25%, transparent 26%);
  background-repeat: no-repeat;
  border: 0.25em solid transparent;
  border-left: 0.4em solid #ffffff;
  border-right: 0 solid transparent;
  transition: border-left-color 0.1s 0.3s ease-out, transform 0.3s ease-out;
  transform: translateX(-22.5%) rotate(90deg);
  transform-origin: 25% 50%;
  position: relative;
  top: 0.5em;
  left: 0.55em;
  width: 2em;
  height: 1em;
  box-sizing: border-box;
}

.chk_738:checked + .slider_738 {
  background-color: limegreen;
}

.chk_738:focus + .slider_738 {
  box-shadow: 0 0 1px limegreen;
}

.chk_738:checked + .slider_738:before {
  transform: translateY(2.3em);
}

.chk_738:checked + .slider_738:after {
  transform: rotateZ(90deg) rotateY(180deg) translateY(0.45em) translateX(-1.4em);
}























/* From Uiverse.io by Faizuddinq */ 
ul {
  list-style: none;
}

.example-2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  align-items: center;

  
}
.example-2 .icon-content {
  margin: 0 10px;
  position: relative;
}
.example-2 .icon-content .tooltip {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(50%);
  color: #fff;
  padding: 6px 10px;
  border-radius: 15px;
  opacity: 0;
  visibility: hidden;
  font-size: 14px;
  transition: all 0.3s ease;
}
.example-2 .icon-content:hover .tooltip {
  opacity: 1;
  visibility: visible;
  top: 6px;
}
.example-2 .icon-content a {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 20%;
  color: #000000;
  background-color: #ffff;
  transition: all 0.3s ease-in-out;


  
  box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
}
.example-2 .icon-content a:hover {
  box-shadow: 3px 2px 45px 0px rgb(0 0 0 / 50%);
}
.example-2 .icon-content a i {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px; scale: 1.4;
}
.example-2 .icon-content a:hover {
  color: white;
}
.example-2 .icon-content a .filled {
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #000;
  transition: all 0.3s ease-in-out;



  
}
.example-2 .icon-content a:hover .filled {
  height: 100%;
}
.example-2 .icon-content a[data-social="WhatsApp"] .filled,
.example-2 .icon-content a[data-social="WhatsApp"] ~ .tooltip {
  background-color: #1db954;
}
.example-2 .icon-content a[data-social="E-mail"] .filled,
.example-2 .icon-content a[data-social="E-mail"] ~ .tooltip {
  background-color: #bd081c;
}







.redes{position: relative; 
;}




.redes1{position: absolute;
  position: fixed;margin: -500px 100px ;}
















.shapeemdois{width: 00px;
  height: 0px;
  background: #00000000;
  box-shadow: 0 0.1rem 0.8rem rgba(254, 101, 70, 0);
  border-radius: 49% 51% 51% 49% / 36% 69% 31% 64%;border: 1px solid rgb(254, 100, 70);
  transform: translateY(204px) translateX(430px); z-index: 0;position: absolute;}



.fundo{width: 400px;
  height: 340px;
  border-radius: 50% 50% 52% 48% / 77% 78% 22% 23%;border: 2px dashed rgb(255, 102, 0);
  transform: translateY(-93px) translateX(40px); z-index:-100;position: absolute;filter: blur(0px);}




.svgemum svg{transform: translatey(100px) translatex(-80px); height: 350px;position: absolute;z-index:-200;}

.svgemdois svg{transform: translatey(00px) translatex(200px);height: 350px;position: absolute;z-index:-200;}



/* From Uiverse.io by gagan-gv */ 
/* Hide the default checkbox */
.containerx input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
 }
 
 .containerx {
  display: block;
  position: relative;
  cursor: pointer;
  font-size: 25px;
  user-select: none;
 }
 
 /* Create a custom checkbox */
 .checkmarkx{
  position: relative;
  top: 0;
  left: 0;
  height: 1.3em;
  width: 1.3em;
  background: black;
  border-radius: 50px;
  transition: all 0.7s;
  --spread: 20px;
 }
 
 /* When the checkbox is checked, add a blue background */
 .containerx input:checked ~ .checkmarkx {
  background: black;
  box-shadow: -10px -10px var(--spread) 0px #5B51D8, 0 -10px var(--spread) 0px #833AB4, 10px -10px var(--spread) 0px #E1306C, 10px 0 var(--spread) 0px #FD1D1D, 10px 10px var(--spread) 0px #F77737, 0 10px var(--spread) 0px #FCAF45, -10px 10px var(--spread) 0px #FFDC80;
 }
 
 /* Create the checkmark/indicator (hidden when not checked) */
 .checkmarkx:after {
  content: "";
  position: absolute;
  display: none;
 }
 
 /* Show the checkmark when checked */
 .containerx input:checked ~ .checkmarkx:after {
  display: block;
 }
 
 /* Style the checkmark/indicator */
 .containerx .checkmarkx:after {
  left: 0.45em;
  top: 0.25em;
  width: 0.25em;
  height: 0.5em;
  border: solid #f0f0f0;
  border-width: 0 0.15em 0.15em 0;
  transform: rotate(45deg);
 }















 /* From Uiverse.io by benjimich */ 
.buttonc {
  cursor: pointer;
  background: none;
  border: none;
  display: flex;
  flex-direction: column;
  width: 70px;
  gap: 4px;
}

.buttonc:hover {
  animation: move 2s infinite ease;
}

@keyframes move {
  0% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(20px);
  }

  100% {
    transform: translateX(0);
  }
}

.roundc {
  width: 6px;
  height: 6px;
  background: #fc893d;
  border-radius: 50%;
}

.linec {
  display: flex;
  gap: 4px;
}

.twoc {
  transform: translateX(10px);
}

.threec {
  transform: translateX(20px);
}

.fourc {
  transform: translateX(30px);
}

.fivec {
  transform: translateX(20px);
}

.sixc {
  transform: translateX(10px);
}






.custom-shape-divider-top-1724942102 {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}


.custom-shape-divider-top-1724942102 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 150px;
}

.custom-shape-divider-top-1724942102 .shape-fill {
  fill: #f4f4f4;
}



.custom-shape-divider-bottom-1724942747 {
  position: relative;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}

.custom-shape-divider-bottom-1724942747 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 150px;
}

.custom-shape-divider-bottom-1724942747 .shape-fill {
  fill:  #f4f4f4;
}

.marcum{position: absolute; transform: translateY(200px) translateX(100px);z-index: 100px;}
.marcdois{position: absolute; transform: translateY(300px) translateX(200px);z-index: 100px;}
.marctres{position: absolute; transform: translateY(200px) translateX(600px);z-index: 100px;}
.marcquatro{position: absolute; transform: translateY(400px) translateX(300px);z-index: 100px;}
.marccinco{position: absolute; transform: translateY(500px) translateX(400px);z-index: 100px;}





.ttf{ border-radius: 50%;padding: 1px 18px;margin-right: 8px;
  width: 50px;
  height: 50px;
  color: #ffffff;
  background-color: #fe7627;
  border-radius: 50%;
  cursor: pointer;
  transition-duration: .3s;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.13);
  border: none;}



  .cor{color:  #fe7627;}