@import url("/css/app.css");

/* Paleta Vulcão: cobre, basalto e marfim */
:root {
    --cobre: #984525;
    --cobre-escuro: #73321c;
    --cobre-claro: #dfaa83;
    --basalto: #231c19;
    --marfim: #faf5ef;

    --ink: var(--basalto);
    --paper: var(--marfim);
    --muted: #716157;
    --line: #e4d5c8;
    --coral: #c65d3b;

    /* Liga a nova paleta aos estilos existentes */
    --teal: var(--cobre);
    --teal-dark: var(--cobre-escuro);
}

.header {
    border-bottom: 1px solid var(--line);
}

.brand-symbol {
    background: linear-gradient(145deg, #a85834, #633522);
    color: #fff8f1;
}

.hero-art {
    background:
        radial-gradient(circle at 70% 25%, #d6936240, transparent 50%),
        linear-gradient(145deg, #352522, #71432f 60%, #a4613b);
    border: 1px solid #815039;
}

.orbit {
    border-color: #edbd9160;
}

.bottle {
    filter: drop-shadow(20px 27px 15px #160d0b65);
}

.bottle-cap {
    background: linear-gradient(
        90deg,
        #653b28,
        #c08a5b 35%,
        #e0b48a 50%,
        #a26540 75%,
        #653b28
    );
}

.bottle-body {
    background: linear-gradient(
        90deg,
        #d8c6b1,
        #fff7e9 40%,
        #e9d8c1
    );
}

.bottle-brand {
    color: #4f3023;
}

.bottle-mark {
    color: var(--cobre);
}

.art-label {
    color: #fff0df;
    background: #231c19bf;
    padding: 7px 12px;
    border-radius: 20px;
}

.product-visual {
    background: linear-gradient(145deg, #f1e4d7, #e2c8af);
}

.product-visual[data-category="seruns"] {
    background: linear-gradient(145deg, #ead6c7, #cda88b);
}

.product-visual[data-category="hidratacao"] {
    background: linear-gradient(145deg, #f4e9db, #e7d4bc);
}

.product-monogram {
    background: #fff9f0e6;
    color: var(--cobre-escuro);
    box-shadow: 10px 14px 20px #4c2a181a;
}

.eco-badge {
    background: #f2e0d1;
    color: #753e28;
}

.eco-section {
    background:
        radial-gradient(circle at 100% 0%, #a858342b, transparent 55%),
        #231c19;
    border: 1px solid #49372d;
}

.eco-section .eyebrow,
.eco-caption {
    color: #e5b28b;
}

.eco-copy p {
    color: #e9ddd2;
}