:root {
    --color-primary: #1B5E7F;      /* Azul marinho */
    --color-accent: #C4A863;       /* Ouro */
    --color-light: #F5F1E8;        /* Creme */
    --color-white: #FFFFFF;
    --color-dark: #2C3E50;
}

body {
    font-family: 'Alegreya Sans', sans-serif;
    background-color: var(--color-light);
    color: var(--color-dark);
}

h1, h2, h3 {
    font-family: 'Alegreya', serif;
    color: var(--color-primary);
}

html {
    scroll-behavior: smooth;
}

/* Hero */
header.hero-section h1 {
    color: var(--color-accent);
    font-size: 3rem;
}

header.hero-section p {
    color: var(--color-primary);
    font-size: 1.5rem;
}

header.hero-section .logo-container {
    margin-bottom: 2rem;
}

header.hero-section .logo-container img {
    max-width: 300px;
    height: auto;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));
}

header.hero-section .canva-button {
    margin-bottom: 2.5rem;
}

/* Acessibilidade - foco visível */
a:focus-visible,
button:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 3px;
    border-radius: 4px;
}

/* Tamanho mínimo de fonte */
body {
    font-size: 1rem;
    line-height: 1.6;
}

.canva-button {
    background-color: var(--color-accent);
    color: var(--color-white);
    transition: all 0.3s ease;
}

.canva-button:hover {
    background-color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(27, 94, 127, 0.2);
}

/* Cards de Produtos */
.canva-card {
    background-color: var(--color-white);
    border: 1px solid #e8dcc8;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.canva-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
}

.canva-card img {
    display: block;
    width: 100%;
    height: 14rem;
    object-fit: cover;
}

.canva-card h3 {
    color: var(--color-dark);
    font-size: 1.1rem;
    line-height: 1.4;
}

.canva-card p:not(.text-gray-600) {
    color: var(--color-accent);
}

/* Seção Sobre */
#sobre {
    background-color: rgba(196, 168, 99, 0.5);
}

/* Footer e Header */
.canva-footer,
nav {
    background-color: rgba(196, 168, 99, 0.5) !important;
}
#produtos {
    background-color: var(--color-light);
}

#produtos h2 {
    color: var(--color-primary);
    font-size: 2.5rem;
}

/* Seção Contato */
#contato {
    background-color: var(--color-light);
}

#contato h2 {
    font-family: 'Alegreya', serif;
}

#contato a:hover {
    box-shadow: 0 8px 16px rgba(27, 94, 127, 0.3);
}