/* Imports de arquivos CSS */
@import url('header.css');
@import url('home.css');
@import url('collections.css');
@import url('about.css');
@import url('services.css');
@import url('contact.css');
@import url('footer.css');

/* Imports de fontes */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

/* Variáveis de cor (ainda não usada) */
:root {
    --color-primary: #e9a209;
}

* {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {

}

.playfair-display-chique {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.montserrat-corpo {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 520;
  font-style: normal;
}

body{
  
}

section{
    padding: 28px 20%;
}

/* Botão */
.btn-default {
    display: inline-flex; /* resolve diferença entre <a> e <button> */
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 10px 16px;

    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,.25);

    background-color: #e9a209;
    color: #ffffff;

    font-weight: 700;
    text-decoration: none; /* importante para <a> */

    cursor: pointer;

    white-space: nowrap; /* impede quebra do texto */

    
}

/* Botão Secundário (Apenas bordas, preenche no hover) */
.btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 10px 16px;

    /* No lugar de 'none', colocamos a borda da cor do tema */
    border: 2px solid #e9a209; 
    border-radius: 12px;
    background-color: transparent; /* Fundo transparente inicialmente */
    color: #e9a209; /* Texto na cor do tema para leitura na borda */

    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;

    /* Suaviza a troca de cor no hover */
    transition: all 0.3s ease;
}

.btn-outline:hover {
    background-color: #e9a209; /* Preenche de amarelo */
    color: #ffffff; /* Texto volta a ser branco para contrastar */
    box-shadow: 0 8px 24px rgba(233, 162, 9, 0.3); /* Sombra suave na cor do botão */
}

/* Ajuste para o ícone do whats não sumir no hover se você quiser manter ele verde */
.btn-outline:hover i {
    color: #ffffff; /* Ou mantenha verde, mas branco fica mais elegante no fundo amarelo */
}



.btn-default:hover {
    background-color: #b88322;
    box-shadow: 0 8px 24px rgba(204, 143, 10, 0.3);

}