body  {
     font-family: var(--gb-font);

}

.contato-intro  {
     max-width: 760px;
     margin: 72px auto 42px;
     text-align: center;

}

.sobretitulo  {
     color: #FFD700;
     font-size: .78rem;
     font-weight: 800;
     letter-spacing: .14em;

}

.contato-intro h1  {
     margin: 12px 0 16px;
     font-size: clamp(2rem, 5vw, 3.4rem);

}

.contato-intro h1 span, .contato-intro p  {
     color: #FFD700;

}

.contato-intro > p:last-child  {
     color: #d4d4d4;
     line-height: 1.7;

}

.canais  {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: 18px;
     margin-bottom: 52px;

}

.canal  {
     min-width: 0;
     display: flex;
     gap: 16px;
     align-items: flex-start;
     padding: 24px;
     background: #0d3327;
     border: 1px solid #323232;
     border-radius: 16px;
     color: #F8FAFC;
     text-decoration: none;
     transition: transform .2s, border-color .2s;

}

a.canal:hover  {
     transform: translateY(-4px);
     border-color: #FFD700;

}

.canal > i  {
     color: #FFD700;
     font-size: 1.55rem;
     margin-top: 3px;

}

.canal h2  {
     margin: 0 0 7px;
     font-size: 1.05rem;
     color: #F8FAFC;

}
.canal p  {
     margin: 0;
     font-weight: 700;
     overflow-wrap: anywhere;

}
.canal span  {
     display: block;
     margin-top: 7px;
     color: #b9c8c1;
     font-size: .86rem;

}

.contato-conteudo  {
     display: grid;
     grid-template-columns: .8fr 1.2fr;
     gap: 34px;
     align-items: start;

}

.ajuda, .form-contato  {
     padding: clamp(24px, 4vw, 38px);
     border-radius: 18px;
     background: #0d3327;
     border: 1px solid #1d4a39;

}

.ajuda h2  {
     margin-top: 0;
     color: #FFD700;
     font-size: 1.8rem;

}
.ajuda p  {
     color: #d1d1d1;
     line-height: 1.7;

}
.ajuda ul  {
     display: grid;
     gap: 15px;
     padding: 12px 0 0;
     list-style: none;

}
.ajuda i  {
     color: #FFD700;
     margin-right: 8px;

}

.form-contato  {
     display: grid;
     gap: 20px;

}
.campo-duplo  {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 18px;

}
.form-contato label  {
     display: grid;
     gap: 8px;
     color: #e7e7e7;
     font-weight: 700;
     font-size: .95rem;

}
.form-contato label span  {
     color: #FFD700;

}
.form-contato input, .form-contato select, .form-contato textarea  {
     width: 100%;
     border: 1px solid #3e3e3e;
     border-radius: 9px;
     padding: 13px 14px;
     background: #14543e;
     color: #F8FAFC;
     font: inherit;

}
.form-contato textarea  {
     resize: vertical;
     min-height: 130px;

}
.form-contato input:focus, .form-contato select:focus, .form-contato textarea:focus  {
     outline: 2px solid #FFD700;
     outline-offset: 1px;
     border-color: transparent;

}
.botao-enviar  {
     justify-self: start;
     border: 0;
     border-radius: 9px;
     padding: 14px 22px;
     background: #FFD700;
     color: #0d3327;
     font-weight: 800;
     cursor: pointer;

}
.botao-enviar:hover  {
     background: #FFE44D;

}
.botao-enviar i  {
     margin-left: 8px;

}
.mensagem-status  {
     min-height: 1.2em;
     margin: 0;
     color: #FFD700;
     font-weight: 700;

}

@media (max-width: 900px)  {
     .canais  {
         grid-template-columns: 1fr;

    }
    .contato-conteudo  {
         grid-template-columns: 1fr;

    }
    .contato-intro  {
         margin-top: 50px;

    }

}

@media (max-width: 600px)  {
     .contato-intro  {
         margin: 38px auto 30px;

    }
    .canais  {
         margin-bottom: 34px;

    }
    .canal  {
         padding: 19px;

    }
    .campo-duplo  {
         grid-template-columns: 1fr;
         gap: 20px;

    }
    .botao-enviar  {
         width: 100%;

    }
    .ajuda, .form-contato  {
         padding: 22px 18px;

    }

}



/* Ícones locais dos canais de atendimento */
.canais .canal > .canal-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: #FFD700;
    fill: currentColor;
}

.mensagem-status.erro { color: #ff8f8f; }
.mensagem-status.sucesso { color: #8ee0a1; }
