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

:root {
   --color-blue: #12e0ff;
   --color-blue-secondary: #0093d0;
   --color-blue-tertiary: #1b2a6b;
   --color-gray: #6b7280;
   --color-yellow: #ffd500;
   --color-white: #fff;
   --color-green: #9dc927;
   --color-orange: #ff7723;
   --color-purple: #734585;

}

/*Config html*/
html {
   font-size: 62.5%;
   scroll-behavior: smooth;
   -webkit-text-size-adjust: 100%;
   text-size-adjust: 100%;
}

/* Utilitários de visibilidade */
.d-none-mobile {
   display: block;
}

.d-none-desktop {
   display: none;
}

/*Main*/
.main {
   padding: 4.5rem 0;
   min-height: 100vh;
   background: url('../img/banner-desktop-ideal-3.webp');
   background-repeat: no-repeat;
   background-size: cover;
   background-position: top center;
   /* background-position-y: -8rem; */
}

.main>.container {
   margin: 0 auto;
   display: flex;
   flex-wrap: wrap;
   width: 100%;
   /* max-width: 146.0rem; */
   max-width: 166.0rem;
}

/*Info*/
.info {
   width: 50%;
   padding-left: 7vw;
}

.info__logo {
   width: 100%;
   max-width: 10.8rem;
}

.info__h1 {
   font-size: 4.0rem;
   line-height: 120%;
   color: var(--color-white);
   margin: 4.0rem 0 1.5rem 0;
   font-family: 'Poppins';
   font-weight: normal;
}

.info__h1 span {
   color: var(--color-blue);
   font-weight: bold;
}

.info__h2 {
   font-size: 8.1rem;
   line-height: 100%;
   color: var(--color-white);
   line-height: 100%;
   font-family: 'Behind The Nineties';
   font-weight: bold;
}

.info__h2.info__warning {
   font-size: 4.1rem;
   margin-bottom: 20px;
}

.info__p {
   font-family: 'Poppins';
   font-weight: bold;
   font-size: 2.3rem;
   color: var(--color-white);
   line-height: 120%;
   margin: 3.2rem 0 2.2rem 0;
}

.info__p span {
   color: var(--color-blue);
}

.info__box {
   background: var(--color-blue-secondary);
   padding: 1.5rem 2.0rem;
   width: 100%;
   max-width: 27.6rem;
   color: var(--color-white);
   font-size: 2.0rem;
   border-radius: 1.8rem;
   font-family: 'Poppins';
}

.info__box h3 {
   font-weight: bold;
   line-height: 120%;
   margin-bottom: 0.3rem;
}

.info__box p {
   font-weight: 500;
   line-height: 120%;
}

.info__box p:nth-of-type(1) {
   margin-bottom: 1.5rem;
}

/*Form*/
.form {
   width: 50%;
   display: flex;
   justify-content: end;
}

.form__box {
   width: 100%;
   /* max-width: 34.5rem; */
   max-width: 44.5rem;
   min-height: auto;
   display: flex;
   flex-direction: column;
   justify-content: end;
}

.form__title {
   text-align: center;
   font-family: 'Poppins';
}

.form__title p {
    font-size: 2.3rem;
    font-weight: 500;
    margin-top: 5px;    
}

.form__h2 {
   font-size: 3.1rem;
   line-height: 120%;
   color: var(--color-white);
   font-weight: 400;
   margin-bottom: 1.5rem;
}

.form__h2 span {
   font-size: 3.9rem;
   font-weight: 700;
}

.form__date {
   background-color: var(--color-yellow);
   color: var(--color-blue-tertiary);
   font-size: 2.45rem;
   font-family: 'Inter 18pt';
   line-height: 100%;
   padding: 1.0rem 0.2rem;
   border-radius: 2.9rem;
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 0 auto;
   gap: 0.9rem;
   width: 100%;
   max-width: 29rem;
}

.form__date img {
   width: 21px
}

.form__main {
   display: flex;
   flex-direction: column;
   gap: 15px;
   margin-top: 39px;
}

.form__main .form__main__buttons {
    list-style: none;
    display: flex;
    justify-content: center;
    border-radius: 8px;
    font-size: 2.6rem;
    height: 68px;
    align-items: center;
}

.form__main .form__main__buttons:first-child {
   background: var(--color-green);
}

.form__main .form__main__buttons:nth-child(2) {
   background: var(--color-yellow);
}

.form__main .form__main__buttons:nth-child(3) {
   background: var(--color-orange);
}

.form__main .form__main__buttons:nth-child(4) {
   background: var(--color-purple);
}

.form__main .form__main__buttons a {
   text-decoration: none;
   color: var(--color-white);
   font-family: 'Poppins';
   text-align: center;
   font-weight: 600;
}

.form__footer {
   padding: 1rem 0 0 1.5rem;
}

.form__footer p {
   color: var(--color-gray);
   font-size: 9px;
   line-height: 110%;
   font-family: 'Inter 18pt';

}

.form__footer--buttons {
   margin: 2.0rem 0 0 0;
   display: flex;
   justify-content: center;
   gap: 1.5rem;
}

.btn__edital {
   /* max-width: 12.5rem; */
   padding: 1.2rem 1.5rem;
   border-radius: 2.5rem;
   color: var(--color-white);
   border: 0.1rem solid var(--color-white);
   font-size: 1.8rem;
   font-family: 'Inter 18pt';
   font-weight: 500;
   display: flex;
   align-items: center;
   justify-content: center;
   line-height: 100%;
   gap: .3rem;
   text-decoration: none;
}

.btn__site {
   padding: 0.5rem 1.5rem;
   font-size: 1.8rem;
   border-radius: 2.5rem;
   color: var(--color-white);
   border: 0.1rem solid var(--color-white);
   display: flex;
   align-items: center;
   justify-content: center;
   line-height: 100%;
   font-family: 'Inter 18pt';
   text-decoration: none;
   font-weight: 500;
   gap: .3rem;
}
/*

.main::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 4px;
   background: #0197C9;
   /*background: linear-gradient(90deg, rgba(1, 151, 201, 1) 0%, rgba(103, 169, 134, 1) 35%, rgba(182, 187, 61, 1) 70%, rgba(255, 221, 3, 1) 100%);
}
*/
.mobile {
   display: none
}

@media screen and (max-width: 1780px) {
   .info {
      padding-left: 9vw;
      display: flex;
      flex-direction: column;
      justify-content: end;      
   }

   .info__h1 {
      margin: 2rem 0 1.5rem 0;
   }

   .info__h2 {
      font-size: 7.4rem;
   }

   .form__box {
      min-height: 88vh;
   }
}

/*Media querys*/
@media screen and (max-width: 1680px) {
   html {
      font-size: 58%;
   }

   .main>.container {
      width: 100%;
      max-width: 162.0rem;
   }

   .main {
      background-size: cover;
   }
}

@media screen and (max-width: 1600px) {
   html {
      font-size: 50%;
   }

   .main {
      /* background-position-y: -9rem; */
      background-size: cover;
   }

   .main>.container {
      width: 100%;
      max-width: 173.0rem;
   }

   .form__footer p {
      font-size: 9px;
   }
}

@media screen and (max-width: 1440px) {
   .main {
      /* background-position-y: -2rem; */
   }

   .main>.container {
      width: 100%;
      max-width: 160.0rem;
   }

   .form__box {
      min-height: 85vh;
   }

   .info__h1 {
      font-size: 3.5rem;
      margin: 4rem 0 1.5rem 0;
   }

   .info__h2 {
      font-size: 8rem;
   }

   .info {
      padding-left: 7vw;
   }

   .info__logo {
      max-width: 15rem;
   }

}

@media screen and (max-width: 1400px) {
   .main {
      background-position-y: 0;
      /* background-size: cover; */
   }

   .main>.container {
      width: 100%;
      max-width: 155.0rem;
   }

}

@media screen and (max-width: 1366px) {
   html {
      font-size: 38%;
   }

   .main {
      padding: 3.8rem 0;
      min-height: 100vh;
      /* background: url('../img/banner-laptop-ideal.webp'); */
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      /* background-position-y: -15rem; */
   }

   .main>.container {
      width: 100%;
      max-width: 198.0rem;
   }

   /* .main{
      background-position-y: 0;
      background-size: cover;
   } */
   .form__footer p {
      font-size: 7.5px;
      padding: 0.2rem 1rem;
   }

   .info__p {
      font-size: 2.6rem;
   }

   .form__box {
      max-width: 53.5rem;
      /* min-height: 91.0rem; */
      min-height: 91vh;
   }

   .form__h2 {
      font-size: 2.5rem;
   }

   .form__h2 span {
      font-size: 3.1rem;
   }

   .btn__edital,
   .btn__site {
      font-size: 1.6rem;
   }

   .form__date {
      font-size: 1.5rem;
      max-width: 19.0rem;
   }
}

@media screen and (max-width: 1280px) {
   html {
      font-size: 36%;
   }

   .main {
      background-position-y: 0rem;
      background-position: center center;
   }
}

@media screen and (max-width: 960px) {
   html {
      font-size: 55%;
   }
   
   .mobile {
      display: mobile;
   }

   .desktop {
      display: flex;
   }

   .info__logo {

      /* max-width: 20rem; */
      margin-bottom: 20px;
      width: 100%;
      max-width: 10rem;
   }

   .main {
      padding: 4.5rem 0;
      min-height: 100vh;
      background: url('../img/banner-mobile-ideal.jpg');
      background-repeat: no-repeat;
      background-size: cover;
      background-position: top center;
      background-position-y: 0;
   }

   /* Esconde no mobile */
   .d-none-mobile {
      display: none !important;
   }

   /* Exibe apenas no mobile */
   .d-none-desktop {
      display: block !important;
   }
   
   .form__main {
       height: auto;
   }


   /*Info*/
   .info {
      width: 100%;
      /* background-color: red; */
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      justify-content: flex-start;
      text-align: center;
      height: 1000px;
      margin-top: 100%;
   }

   .info__box {
      /* max-width: 33rem;
      font-size: 1.7rem; */
      max-width: 58rem;
      font-size: 2.75rem;

   }

   .form__box {
      max-width: 43.5rem;
      min-height: 0;
   }

   .info__p {
      font-size: 3rem;
   }

   /*Form*/
   .form {
      width: 100%;
      /* background-color: blue; */
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
   }

   .form__footer p {
      font-size: 10px;
   }

   .main>.container {
      display: flex;
      flex-direction: column-reverse;
   }

}

@media screen and (max-width: 767px) {
   html {
      font-size: 27%;
   }

   .main {
      padding: 4.5rem 0;
      min-height: 100vh;
      background: url('../img/banner-mobile-ideal.jpg');
      background-repeat: no-repeat;
      background-size: 107% auto;
      background-position: top center;
      background-position-y: 0;
      background-color: #131c47;
   }

   .main::after {
      display: none;
   }

   .info__h1 {
      margin: 2rem 0 1.5rem 0;
   }

   .info__h2 {
      font-size: 7rem;
   }

   .info__logo {
      margin-bottom: 0;
   }

   /*Info*/
   .info {
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      text-align: center;
      height: auto ;
      padding-left: 0;
   }



   .form__main {
      margin-top: 10px;
   }

   .form__box {
      max-width: 70.5rem;
      min-height: 0;
      border-radius: 3rem;
   }

   .form__title {
      padding: 3.0rem 2.0rem 3rem 2.0rem;
      border-radius: 3rem 3rem 0 0;
   }
   .form__title p {
        font-size: 2.8rem;
    }

   .form__h2 {
      font-size: 4.5rem;
   }

   .form__h2 span {
      font-size: 5.8rem;
   }

   .form__date {
      font-size: 3.8rem;
      font-family: 'Inter 18pt';
      line-height: 100%;
      padding: 1rem 1.1rem;
      border-radius: 3rem;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
      gap: 0.5rem;
      width: 100%;
      /* max-width: 35.0rem; */
      max-width: 42.0rem;
   }

   .form__main .form__main__buttons {
    /* font-size: 3.6rem; */
   font-size: 5rem;
    height: 40px;      
   }

   .form__footer--buttons a img {
      width: 11px;
      display: none;
   }

   .btn__edital {
      /* max-width: 12.5rem; */
      padding: 1.8rem 2rem;
      border-radius: 3rem;
      font-size: 2.5rem;
      display: flex;
      align-items: center;
      gap: 4px;
      justify-content: center;      
   }

   .btn__site {
      /* max-width: 12.5rem; */
      padding: 1.8rem 2rem;
      border-radius: 3rem;
      font-size: 2.5rem;
      display: flex;
      align-items: center;
      gap: 4px;
      justify-content: center;
   }

   .form__main .form__main__buttons {
        height: 40px;
        width: 100%;
        max-width: 280px;
        margin: 0 auto;
    }
}

@media (max-width: 458px) {
   .main {
      background-position-y: 69px;
      background-color: #053153;
      padding-bottom: 50px;
   }
   .info__logo {
      margin-bottom: 35px;
   }
   .form {
      height: clamp(385px, 205.09px + 90.91vw, 410px);
   }
   .form__title p {
      font-size: 2.8rem
   }
   /* .form__main .form__main__buttons {
      height: 37px;
   } */
   .form__main {
      gap: 8px;
   }
    .form__h2 span {
        font-size: 4.8rem;
    }   
}