main {
    margin: 3rem 20rem 3rem 20rem;
}

#mainSection {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 1rem;
}

img {
  max-width:26rem;
}

h1 {
    color:#fa8035;
    font-size: 2.5rem;
}

h2 {
    color: #fafbfc;
    background-color: #050c29;
    width: 28rem;
    border-radius: 3rem;
    font-size: 1.2rem;
}

p {
    color:#0e0e0e;
    font-size: 1rem;
}

#saibaMais {
    width: 7rem;
    background-color: #050c29;
    color: #fafbfc;
    border-radius: 3rem;
    font-size: 1rem;
    cursor: pointer;
    transition: 0.3s ease;
}

#saibaMais:hover {
    font-size: 1.1rem;
    box-shadow: #0e0e0e;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.493);
}

/*Acessibilidade botoes*/
.floating-controls {
  position: fixed; 
  top: 50%;
  right: 10px;
  transform: translateY(-50%); 
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 1000; 
}

.floating-controls button {
  background-color: #2697b9; 
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 10px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.floating-controls button:hover {
  background-color: #2a618f; 
}

/* Modo escuro */
body.dark-mode {
    background-color: #181818; 
    color: #d1d1d1;
}

body.dark-mode p, 
body.dark-mode footer, 
body.dark-mode header, 
body.dark-mode a {
    background-color: inherit;
    color: #d1d1d1; 
}

body.dark-mode #saibaMais, 
body.dark-mode button {
    background-color: #fa8035; 
    color: #050c29;
}

body.dark-mode footer p#copyright {
    color: #d1d1d1; 
}

/* Alto contraste */
body.high-contrast {
    background-color: #000; 
    color: #fff;
}

body.high-contrast p, 
body.high-contrast footer, 
body.high-contrast header, 
body.high-contrast a {
    background-color: inherit; 
    color: rgb(255, 255, 85);
}

body.high-contrast h1, 
body.high-contrast h2,
body.high-contrast h3 {
    background-color: inherit;
    color: rgb(179, 179, 2);
}

body.high-contrast a {
    color: #ff0;
}

body.high-contrast #saibaMais, 
body.high-contrast button {
    background-color: #ff0; 
    color: #000;
}

body.high-contrast footer p#copyright {
    color: #fff; 
}

/* Ajuste para o zoom */
body.zoom-in {
    font-size: 110%; 
    transform: scale(1.1); 
    transform-origin: top left;
    transition: transform 0.3s ease, font-size 0.3s ease; 
}

body.zoom-out {
    font-size: 90%; 
    transform: scale(0.9); 
    transform-origin: top left; 
    transition: transform 0.3s ease, font-size 0.3s ease;
}

body.zoom-in img {
    width: 110%;
}

body.zoom-out img {
    width: 90%; 
}

@media (min-width: 320px) and (max-width: 1280px){
    main {
        width:auto;
        margin: 0 0.8rem 0 0.8rem;
        display: flex;
        flex-wrap: wrap;
    }

    #mainSection {
        padding-right: 0.5rem;
    }

    img {
        min-width: 17rem;
        max-width: auto;
        margin: 0 0.2rem 0 0.2rem;
    }

    h2 {
        width: 25rem;
    }
}

@media (min-width: 1400px) and (max-width: 1980px) {
    #mainSection {
        height: 62vh;
    }

    img {
        min-width: 28rem;
        max-width: 38rem;
    }

    h1 {
        font-size: 2.3rem;
    }

    h2 {
        font-size: 1.5rem;
    }

    #saibaMais {
        font-size: 1.3rem;
        width: 12rem;
    }

    #saibaMais:hover {
        font-size: 1.5rem;
    }
}