/* Estilos Gerais */
:root{
    --bg:#f7f1e8;
    --card:#ffffff;
    --text:#3a2b20;
    --muted:#8a7562;
    --primary:#a0522d;
    --primary-dark:#7a3e21;
    --accent:#c9974c;
    --border:#e6d9c6;
    --shadow: 0 6px 18px rgba(70,40,20,0.10);
}

* { box-sizing: border-box; }

html {
    overflow-x: clip;
    width: 100%;
}

body {
    font-family: 'Poppins', Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: var(--bg);
    color: var(--text);
    overflow-x: clip;
    width: 100%;
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0;
}

/* Estilos do Cabeçalho (Header) */
header {
    position: relative;
    background-color: #ffffff;
    color: var(--primary);
    padding: 20px 0 18px;
    text-align: center;
    border-bottom-left-radius: 24px;
    border-bottom-right-radius: 24px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.sino-notificacoes {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #e0f5e9;
    border: 1px solid #a9d9b8;
    font-size: 1.15em;
    align-items: center;
    justify-content: center;
    z-index: 5;
}
.sino-notificacoes:disabled { cursor: default; }

header .logo {
    max-width: 130px;
    height: auto;
    margin-bottom: 10px;
}

header h1 {
    margin: 0;
    font-size: 2em;
    font-weight: 700;
    color: var(--primary);
}

header p {
    margin: 6px 0 0;
    font-size: 1em;
    color: var(--muted);
}

.header-cidade {
    margin: 4px 0 0;
    font-size: 0.85em;
    font-weight: 600;
    color: var(--primary);
}

/* Cards de destaque */
.destaques {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}
.destaque-item {
    flex: 1;
    min-width: 140px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: var(--shadow);
}
.destaque-item .emoji { font-size: 16px; }
.destaque-item .txt { font-size: 11px; color: var(--muted); font-weight: 600; margin: 0; }

@media (max-width: 600px) {
    .destaque-item {
        min-width: 47%;
        padding: 6px 8px;
    }
    .destaque-item .emoji { font-size: 15px; }
    .destaque-item .txt { font-size: 10px; }
}

/* Estilos da Seção Principal (Main) */
main {
    padding: 10px 0 20px;
}

/* Estilos da Seção de Produtos em Destaque */
/* Carrossel de destaques — vitrine de conversão */
.carrossel-destaques {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    margin: 8px auto 20px;
    box-shadow: 0 14px 36px rgba(94, 49, 34, 0.16);
    border: 1px solid rgba(173, 122, 97, 0.18);
    background: #fff8f5;
}
.carrossel-trilho {
    display: flex;
    transition: transform 0.5s ease;
}
.carrossel-slide {
    min-width: 100%;
    position: relative;
    height: 230px;
    cursor: pointer;
    background: linear-gradient(110deg, #fff8f5 0%, #fff1ec 46%, #ead7cf 100%);
    overflow: hidden;
}
.carrossel-fundo {
    position: absolute;
    inset: -8%;
    width: 116%;
    height: 116%;
    object-fit: cover;
    filter: blur(22px) saturate(.9);
    opacity: .18;
    display: block;
}
.carrossel-foto {
    position: absolute;
    z-index: 1;
    top: 0; right: 0;
    width: 58%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.carrossel-slide::after {
    content: '';
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(90deg, rgba(255,248,245,.99) 0%, rgba(255,248,245,.96) 38%, rgba(255,248,245,.72) 52%, rgba(255,248,245,.05) 72%);
    pointer-events: none;
}
.carrossel-slide-info {
    position: relative;
    z-index: 3;
    width: min(52%, 510px);
    height: 100%;
    color: #5f3328;
    padding: 24px 24px 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 7px;
}
.carrossel-kicker {
    font-size: .72rem;
    letter-spacing: .08em;
    font-weight: 800;
    color: #b96c72;
}
.carrossel-slide-info strong {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.25rem, 2.2vw, 1.85rem);
    line-height: 1.05;
    max-width: 390px;
}
.carrossel-preco {
    font-size: 1.25rem;
    font-weight: 800;
    color: #9b5b54;
}
.carrossel-microcopy {
    font-size: .82rem;
    color: #80645c;
}
.carrossel-cta {
    margin-top: 5px;
    border: 0;
    border-radius: 999px;
    padding: 9px 15px;
    background: #b96c72;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 7px 16px rgba(185,108,114,.2);
}
.carrossel-cta:hover { transform: translateY(-1px); filter: brightness(.97); }
.carrossel-bolinhas {
    position: absolute;
    z-index: 5;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
}
.carrossel-bolinha {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(95,51,40,.28);
    cursor: pointer;
}
.carrossel-bolinha.ativa { background: #b96c72; transform: scale(1.18); }
.carrossel-destaque-seta {
    position: absolute;
    z-index: 6;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.88);
    color: #6f3d33;
    font-size: 26px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0,0,0,.14);
}
.carrossel-destaque-anterior { left: 10px; }
.carrossel-destaque-proximo { right: 10px; }
.carrossel-slide-banner { background: #fff; cursor: default; }
.carrossel-slide-banner.tem-link { cursor: pointer; }
.carrossel-slide-banner::after { display: none; }
.carrossel-banner-imagem {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    background: #fff;
}
.produto-destaque-pulso {
    animation: produtoDestaquePulso 1.6s ease;
}
@keyframes produtoDestaquePulso {
    0%,100% { box-shadow: var(--shadow); }
    35%,65% { box-shadow: 0 0 0 5px rgba(185,108,114,.22), var(--shadow); }
}
@media (max-width: 700px) {
    .carrossel-destaques { border-radius: 16px; margin-bottom: 16px; }
    .carrossel-slide { height: 205px; }
    .carrossel-foto { width: 56%; }
    .carrossel-slide::after { background: linear-gradient(90deg, rgba(255,248,245,.99) 0%, rgba(255,248,245,.97) 46%, rgba(255,248,245,.48) 68%, rgba(255,248,245,.04) 88%); }
    .carrossel-slide-info { width: 62%; padding: 18px 14px 28px; gap: 5px; }
    .carrossel-slide-info strong { font-size: 1.12rem; }
    .carrossel-preco { font-size: 1.08rem; }
    .carrossel-microcopy { display: none; }
    .carrossel-cta { padding: 8px 11px; font-size: .78rem; }
    .carrossel-destaque-seta { width: 30px; height: 30px; font-size: 22px; }
    .carrossel-destaque-anterior { left: 6px; }
    .carrossel-destaque-proximo { right: 6px; }
}

#produtos-destaque {
    padding: 10px 0 0;
}

#produtos-destaque h2 {
    text-align: center;
    color: var(--primary);
    margin-bottom: 20px;
    font-size: 1.8em;
}

.categoria-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 18px;
    margin-bottom: 28px;
    justify-content: center;
}

@media (min-width: 1000px) {
    .categoria-grid { grid-template-columns: repeat(5, 1fr); }
}

.categoria-titulo {
    color: var(--primary);
    font-size: 1.25em;
    margin: 26px 0 14px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--border);
    scroll-margin-top: 90px;
}
.categoria-titulo:first-child {
    margin-top: 0;
}

/* Estilos para cada item de produto */
.produto-item {
    background-color: var(--card);
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    padding: 0 0 15px;
    text-align: center;
    box-shadow: var(--shadow);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform 0.18s, box-shadow 0.18s;
    position: relative;
}

.produto-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(70,40,20,0.16);
}

.produto-item img {
    max-width: 100%;
    height: 170px;
    object-fit: cover;
    margin-bottom: 10px;
}

.produto-item h3 {
    color: var(--primary);
    font-size: 1.2em;
    margin: 0 14px 5px;
}

.produto-item .descricao {
    font-size: 0.9em;
    color: var(--muted);
    margin: 0 14px 10px;
    flex-grow: 1;
}

.produto-item .preco {
    font-size: 1.3em;
    color: var(--primary);
    font-weight: bold;
    margin: 0 14px 15px;
}

.preco-original {
    text-decoration: line-through;
    color: var(--muted);
    font-size: 0.7em;
    font-weight: 500;
}

.produto-tag {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #e0483b;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.3px;
    padding: 7px 16px;
    border-radius: 16px;
    box-shadow: 0 3px 10px rgba(224,72,59,0.45);
    z-index: 5;
    animation: pulso-oferta 1.6s ease-in-out infinite;
}

@keyframes pulso-oferta {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
}

.categoria-titulo-oferta {
    color: #e0483b !important;
    font-size: 1.4em !important;
}

.categoria-btn-oferta {
    background: #fdecea !important;
    color: #e0483b !important;
    border-color: #f0b7ae !important;
    font-weight: 800 !important;
}
.categoria-btn-oferta:hover { background: #e0483b !important; color: #fff !important; }
.categoria-btn-oferta.active { background: #e0483b !important; color: #fff !important; border-color: #e0483b !important; }

.produto-item .adicionar-carrinho {
    background-color: var(--primary);
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 10px;
    cursor: pointer;
    font-size: 1em;
    font-family: inherit;
    font-weight: 600;
    margin: 0 14px;
    transition: background-color 0.3s ease;
}

.produto-item .adicionar-carrinho:hover {
    background-color: var(--primary-dark);
}

/* Estilos para a seção do carrinho */
#carrinho {
    margin-top: 20px;
}

#carrinho h2 {
    color: var(--primary);
    text-align: center;
    margin-bottom: 20px;
}

.carrinho-itens {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 15px 18px;
    box-shadow: var(--shadow);
    margin-bottom: 5px;
}

.carrinho-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--border);
    font-size: 0.95em;
    color: var(--text);
}

.carrinho-item-foto {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--bg);
}
.carrinho-item-foto-vazia {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3em;
}

.carrinho-item-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.carrinho-item-info span { line-height: 1.3; }

.carrinho-item-direita {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    flex-shrink: 0;
}
.btn-remover-item {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.95em;
    opacity: 0.6;
    padding: 2px;
}
.btn-remover-item:hover { opacity: 1; }

.carrinho-item:last-child {
    border-bottom: none;
}

.carrinho-total {
    text-align: right;
    margin-top: 15px;
}

.carrinho-total p {
    margin: 4px 0;
    color: var(--text);
    font-size: 1em;
    font-weight: normal;
}

.carrinho-total p.total-final {
    font-size: 1.2em;
    font-weight: bold;
    color: var(--primary);
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

.compra-segura-box {
    background: var(--card);
    border: 1px solid var(--border);
    border-top: 3px solid var(--accent);
    border-radius: 10px;
    padding: 16px 18px;
    margin: 16px 0;
}
.compra-segura-titulo {
    font-weight: 600;
    color: var(--primary);
    margin: 0 0 6px 0;
    font-size: 1.02em;
}
.compra-segura-texto {
    font-size: 0.85em;
    color: var(--muted);
    margin: 0 0 14px 0;
    line-height: 1.45;
}
.compra-segura-grade {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.compra-segura-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg);
    border-radius: 8px;
    padding: 10px 10px;
    font-size: 0.8em;
    font-weight: 600;
    color: var(--primary-dark, var(--primary));
    line-height: 1.25;
}
.compra-segura-icone { font-size: 1.25em; flex-shrink: 0; }
@media (max-width: 480px) {
    .compra-segura-grade { grid-template-columns: 1fr; }
}

.finalizar-compra {
    display: block;
    width: 100%;
    background-color: #25D366;
    color: white;
    border: none;
    padding: 13px 20px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 1.1em;
    font-weight: 700;
    font-family: inherit;
    margin-top: 20px;
    transition: background-color 0.3s ease;
}

.finalizar-compra:hover {
    background-color: #1ebc59;
}

.finalizar-compra:disabled {
    background-color: #ccc;
    color: #777;
    cursor: not-allowed;
}

@media (max-width: 600px) {
    .finalizar-compra {
        position: sticky;
        bottom: 12px;
        z-index: 20;
        box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    }
}

/* Estilos do Rodapé (Footer) */
footer {
    text-align: center;
    color: var(--muted);
    padding: 26px 0;
    margin-top: 20px;
    font-size: 0.9em;
    line-height: 1.7;
}
.footer-seguranca { margin-bottom: 12px; }
.footer-seguranca-titulo { font-weight: 600; color: var(--primary); margin: 0 0 6px 0; font-size: 0.95em; }
.footer-seguranca-links { margin: 0; font-size: 0.88em; }
.footer-seguranca-links a { color: var(--muted); text-decoration: underline; }
.footer-seguranca-links a:hover { color: var(--primary); }

/* --- Media Queries para Responsividade --- */
@media (max-width: 768px) {
    .container { padding: 0 15px; }
    header h1 { font-size: 1.6em; }
    header p { font-size: 0.9em; }
    .categoria-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
    .produto-item img { height: 150px; }
    .produto-item h3 { font-size: 1.1em; }
    .produto-item .preco { font-size: 1.1em; }
    #carrinho h2 { font-size: 1.6em; }
}

@media (max-width: 480px) {
    header h1 { font-size: 1.5em; }
    header p { font-size: 0.85em; }
    .categoria-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
        max-width: 340px;
        margin-left: auto;
        margin-right: auto;
    }
    .produto-item { width: calc(50% - 5px); }
    .produto-item img { height: 100px; }
    .produto-item h3 { font-size: 0.95em; margin: 0 8px 3px; }
    .produto-item .descricao { font-size: 0.75em; margin: 0 8px 6px; }
    .produto-item .preco { font-size: 1em; margin: 0 8px 8px; }
    .produto-quantidade-stepper { margin: 6px 0; gap: 10px; }
    .qtd-btn { width: 24px; height: 24px; font-size: 1em; }
    .produto-item .adicionar-carrinho { padding: 8px 10px; font-size: 0.8em; margin: 0 8px 12px; }
    .carrinho-item { flex-direction: column; align-items: flex-start; }
    .carrinho-item span:last-child { margin-top: 5px; }
}

/* Estilos para os botões de quantidade no carrinho */
.quantidade-controle {
    display: flex;
    align-items: center;
    gap: 5px;
}

.btn-quantidade {
    background-color: var(--primary);
    color: white;
    border: none;
    border-radius: 8px;
    width: 25px;
    height: 25px;
    font-size: 1em;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.2s ease;
}

.btn-quantidade:hover {
    background-color: var(--primary-dark);
}

@media (max-width: 480px) {
    .carrinho-item { flex-wrap: wrap; justify-content: space-between; }
    .carrinho-item > span:first-child { flex-basis: 100%; margin-bottom: 5px; }
    .quantidade-controle { margin-right: auto; }
}

/* Estilos do card "Seus dados" */
.card-secao {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 18px;
    margin-top: 20px;
    box-shadow: var(--shadow);
}

.endereco-form h3 {
    color: var(--primary);
    margin: 0 0 12px;
    font-size: 1.15em;
    border-bottom: 2px solid var(--border);
    padding-bottom: 10px;
    text-align: left;
}

.endereco-form label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-top: 12px;
    color: var(--text);
}

.endereco-form .label-cep {
    color: var(--primary);
}

.endereco-form input[type="text"],
.endereco-form input[type="tel"],
.endereco-form textarea {
    width: 100%;
    padding: 10px 12px;
    margin-top: 5px;
    border: 1px solid var(--border);
    border-radius: 10px;
    box-sizing: border-box;
    font-size: 0.95em;
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
}

.endereco-form textarea { resize: vertical; }

/* Botões de opção (Retirada/Entrega, Forma de pagamento) */
.opcoes-radio {
    display: flex;
    gap: 10px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.opcao-btn {
    flex: 1;
    min-width: 120px;
    text-align: center;
    padding: 13px;
    border: 2px solid var(--border);
    border-radius: 12px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    background: var(--bg);
    color: var(--text);
    transition: all 0.15s;
    user-select: none;
}

.opcao-btn.selecionado {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}

#areaEntrega, #areaTroco {
    margin-top: 4px;
}

.info-frete {
    font-size: 0.9em;
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 10px;
    background-color: #faf5ec;
    color: var(--primary);
    font-weight: 600;
    border: 1px solid var(--border);
}

/* Estilos para produtos indisponíveis */
.produto-item.indisponivel {
    opacity: 0.6;
    pointer-events: none;
    position: relative;
}

.produto-item.indisponivel::after {
    content: "Esgotado";
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(160, 82, 45, 0.85);
    color: white;
    padding: 8px 15px;
    border-radius: 8px;
    font-weight: bold;
    font-size: 1.1em;
    z-index: 10;
}

.produto-item.indisponivel .adicionar-carrinho.indisponivel-btn {
    background-color: #ccc;
    cursor: not-allowed;
}

/* Estilos para as Categorias */
.categorias {
    position: sticky;
    top: 0;
    z-index: 40;
    background: var(--card);
    margin: 0 0 20px;
    padding: 12px 0;
    box-shadow: var(--shadow);
    border-bottom: 1px solid var(--border);
}

.categorias ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    overflow-x: auto;
    gap: 10px;
}

.categorias button {
    white-space: nowrap;
    background-color: var(--bg);
    border: 1px solid var(--border);
    padding: 10px 16px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 1em;
    font-family: inherit;
    color: var(--primary);
    font-weight: 600;
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.categorias button:hover {
    background-color: var(--accent);
    color: #3a2b12;
}

.categorias button.active {
    background-color: var(--primary);
    color: white;
    border-color: var(--primary);
    font-weight: 700;
}

@media (max-width: 600px) {
    .categorias ul {
        justify-content: flex-start;
        padding-bottom: 5px;
    }
    .categorias button {
        flex-shrink: 0;
    }
}

/* Faixa de status da loja (aberta/fechada) */
.status-loja-banner {
    position: sticky;
    top: 0;
    z-index: 55;
    text-align: center;
    padding: 8px 16px;
    font-size: 0.88em;
    font-weight: 700;
    background: var(--bg);
    color: var(--muted);
}
.status-loja-banner.loja-aberta { background: #d4edda; color: #1e6b34; }
.status-loja-banner.loja-pausada { background: #fff1cf; color: #805b13; }
.status-loja-banner.loja-fechada { background: #f8d7da; color: #a53238; }

/* Faixa de status do pedido (aparece pro cliente acompanhar aceite/recusa) */
.status-pedido-banner {
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 16px;
    font-size: 0.9em;
    font-weight: 600;
    text-align: center;
    box-shadow: var(--shadow);
}

.status-pedido-banner.status-pendente { background: #fff3cd; color: #8a6300; }
.status-pedido-banner.status-aguardando_pagamento { background: #e0e7ff; color: #3730a3; }
.status-pedido-banner.status-aceito { background: #d4edda; color: #1e6b34; }
.status-pedido-banner.status-em_rota { background: #d6e9fb; color: #1a5a96; }
.status-pedido-banner.status-pronto_retirada { background: #fde9c8; color: #8a5a00; }
.status-pedido-banner.status-entregue { background: #e0f5e9; color: #157347; }
.status-pedido-banner.status-recusado { background: #f8d7da; color: #a53238; }

#statusPedidoFechar {
    background: none;
    border: none;
    font-size: 1em;
    cursor: pointer;
    color: inherit;
    opacity: 0.7;
    font-weight: 700;
    padding: 0 4px;
}
#statusPedidoFechar:hover { opacity: 1; }

#btnPagarRestante {
    background: var(--primary, #a0522d);
    color: #fff;
    border: none;
    border-radius: 20px;
    padding: 7px 14px;
    font-size: 0.85em;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}
#btnPagarRestante:hover { opacity: 0.9; }
#btnPagarRestante:disabled { opacity: 0.6; cursor: not-allowed; }

.btn-pagar-restante-lista {
    display: block;
    width: 100%;
    margin-top: 8px;
    background: var(--primary, #a0522d);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 8px;
    font-size: 0.85em;
    font-weight: 700;
    cursor: pointer;
}
.btn-pagar-restante-lista:hover { opacity: 0.9; }
.btn-pagar-restante-lista:disabled { opacity: 0.6; cursor: not-allowed; }

/* Cupom de desconto */
.cupom-area {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}
.cupom-area input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    font-family: inherit;
    font-size: 0.9em;
    background: var(--bg);
    color: var(--text);
}
.cupom-area button {
    background: var(--primary);
    color: #fff;
    border: none;
    padding: 10px 16px;
    border-radius: 10px;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
}
.cupom-area button:hover { background: var(--primary-dark); }

.cupom-mensagem {
    font-size: 0.85em;
    margin: 6px 0 0;
    font-weight: 600;
}
.cupom-mensagem.sucesso { color: #1e6b34; }
.cupom-mensagem.erro { color: #c0392b; }

.sugestao-produto-carrinho {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}
.sugestao-produto-linha {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: var(--card);
    border: 1px dashed var(--primary);
    border-radius: 10px;
    font-size: 0.85em;
}
.sugestao-produto-linha span { color: var(--text); }
.sugestao-produto-linha button {
    flex-shrink: 0;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 7px 12px;
    font-weight: 700;
    font-size: 0.9em;
    cursor: pointer;
}

#linhaDesconto span { color: #1e6b34; font-weight: 600; }

/* Observação por item (personalização) */
.produto-item .observacao-item {
    width: calc(100% - 28px);
    margin: 0 14px 10px;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 0.82em;
    font-family: inherit;
    background: var(--bg);
    color: var(--text);
}

.cardapio-erro {
    text-align: center;
    color: var(--muted);
    padding: 30px 10px;
    grid-column: 1 / -1;
}

/* Aviso de oferta ativa */
.oferta-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 16px;
    font-size: 0.9em;
    font-weight: 700;
    text-align: center;
    background: #fff0e0;
    color: var(--primary);
    border-bottom: 1px solid #f0c896;
}
.oferta-banner span {
    cursor: pointer;
}
.oferta-banner span:hover {
    text-decoration: underline;
}
.oferta-banner button {
    background: none;
    border: none;
    font-size: 1em;
    cursor: pointer;
    color: inherit;
    opacity: 0.7;
    font-weight: 700;
}
.oferta-banner button:hover { opacity: 1; }

/* Sabores/opções clicáveis (variantes) */
.variantes-lista {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 14px 12px;
}
.variante-pill {
    background: var(--bg);
    border: 1px solid var(--border);
    color: var(--primary);
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 0.78em;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.15s;
}
.variante-pill:hover { background: var(--accent); color: #3a2b12; }
.variante-pill.selecionada {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* Tela de boas-vindas — Premium */
.tela-boas-vindas {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100svh;
    padding: clamp(20px, 4vw, 48px);
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 16% 18%, rgba(255, 221, 180, .26), transparent 26%),
        radial-gradient(circle at 82% 23%, rgba(255, 236, 210, .13), transparent 27%),
        radial-gradient(circle at 50% 112%, rgba(83, 33, 16, .55), transparent 48%),
        linear-gradient(135deg, #7d351c 0%, #9f4d28 38%, #783318 72%, #3f1f16 100%);
    opacity: 1;
    transition: opacity .34s ease, visibility .34s ease;
}

.tela-boas-vindas::before,
.tela-boas-vindas::after {
    content: "";
    position: absolute;
    z-index: -2;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(1px);
}

.tela-boas-vindas::before {
    width: min(72vw, 980px);
    height: min(72vw, 980px);
    left: -34vw;
    bottom: -49vw;
    border: 1px solid rgba(255, 224, 191, .12);
    box-shadow:
        0 0 0 74px rgba(255,255,255,.022),
        0 0 0 148px rgba(255,255,255,.014);
}

.tela-boas-vindas::after {
    width: 460px;
    height: 460px;
    right: -210px;
    top: -160px;
    background: radial-gradient(circle, rgba(255,239,219,.12), transparent 67%);
}

.tela-boas-vindas.fechando {
    opacity: 0;
    visibility: hidden;
}

.boas-vindas-luz {
    position: absolute;
    z-index: -1;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(58px);
    opacity: .42;
}

.boas-vindas-luz--um {
    left: 12%;
    bottom: 7%;
    background: rgba(255, 181, 102, .2);
}

.boas-vindas-luz--dois {
    right: 11%;
    top: 9%;
    background: rgba(255, 232, 200, .16);
}

.boas-vindas-conteudo {
    position: relative;
    width: min(100%, 520px);
    max-width: 520px;
    padding: clamp(30px, 4vw, 48px) clamp(24px, 4.5vw, 46px) 30px;
    text-align: center;
    border: 1px solid rgba(255, 225, 192, .84);
    border-radius: 30px;
    background:
        linear-gradient(180deg, rgba(255,253,249,.985), rgba(255,248,240,.97));
    box-shadow:
        0 32px 80px rgba(45, 18, 8, .33),
        0 8px 24px rgba(64, 25, 9, .14),
        inset 0 1px 0 rgba(255,255,255,.95);
    overflow: hidden;
    transform: translateY(0);
    animation: boasVindasEntrar .62s cubic-bezier(.2,.72,.2,1) both;
}

.boas-vindas-conteudo::before {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px solid rgba(186, 116, 70, .18);
    border-radius: 23px;
    pointer-events: none;
}

.boas-vindas-conteudo::after {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -112px;
    top: -105px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(200, 134, 85, .12), rgba(200,134,85,0) 68%);
    pointer-events: none;
}

@keyframes boasVindasEntrar {
    from { opacity: 0; transform: translateY(18px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.boas-vindas-kicker {
    position: relative;
    z-index: 1;
    margin-bottom: 15px;
    color: #a66a43;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .24em;
    text-transform: uppercase;
}

.boas-vindas-logo-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 154px;
    min-height: 112px;
    margin: 0 auto 18px;
    padding: 8px 12px;
}

.boas-vindas-logo-wrap::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 88px;
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, rgba(155, 86, 49, .38), transparent);
}

.boas-vindas-logo {
    display: block;
    max-width: 142px;
    max-height: 106px;
    width: auto;
    height: auto;
    margin: 0;
    object-fit: contain;
    filter: drop-shadow(0 8px 14px rgba(86, 46, 25, .06));
}

.boas-vindas-conteudo h2 {
    position: relative;
    z-index: 1;
    max-width: 430px;
    margin: 0 auto 13px;
    color: #7f3f24;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: clamp(2.05rem, 4vw, 3.12rem);
    font-weight: 700;
    line-height: .99;
    letter-spacing: -.025em;
    text-wrap: balance;
}

.boas-vindas-divisor {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 118px;
    margin: 16px auto 15px;
    color: #ca8a5c;
    font-size: .7rem;
}

.boas-vindas-divisor::before,
.boas-vindas-divisor::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(178, 105, 64, .44));
}

.boas-vindas-divisor::after {
    transform: rotate(180deg);
}

.boas-vindas-subtitulo,
.boas-vindas-conteudo > p {
    position: relative;
    z-index: 1;
    max-width: 370px;
    margin: 0 auto 24px;
    color: #776153;
    font-size: clamp(.9rem, 1.7vw, 1rem);
    line-height: 1.58;
    text-wrap: balance;
}

.boas-vindas-cta,
.boas-vindas-conteudo button {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    min-width: 238px;
    min-height: 56px;
    padding: 14px 24px 14px 28px;
    border: 1px solid rgba(255, 206, 160, .45);
    border-radius: 18px;
    background: linear-gradient(135deg, #9d4a25 0%, #b65d2b 54%, #8b3d20 100%);
    color: #fffaf4;
    box-shadow:
        0 14px 28px rgba(130, 55, 24, .24),
        inset 0 1px 0 rgba(255,255,255,.19);
    font-family: 'Poppins', Arial, sans-serif;
    font-size: .98rem;
    font-weight: 700;
    letter-spacing: -.01em;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.boas-vindas-cta:hover,
.boas-vindas-conteudo button:hover {
    background: linear-gradient(135deg, #a65028 0%, #bf6531 54%, #914222 100%);
    transform: translateY(-2px);
    box-shadow:
        0 18px 32px rgba(130, 55, 24, .3),
        inset 0 1px 0 rgba(255,255,255,.22);
    filter: saturate(1.04);
}

.boas-vindas-cta:active,
.boas-vindas-conteudo button:active {
    transform: translateY(0);
}

.boas-vindas-cta:focus-visible,
.boas-vindas-conteudo button:focus-visible {
    outline: 3px solid rgba(255, 222, 187, .74);
    outline-offset: 4px;
}

.boas-vindas-seta {
    display: inline-grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    font-size: 1.15rem;
    font-weight: 500;
    transition: transform .18s ease, background .18s ease;
}

.boas-vindas-cta:hover .boas-vindas-seta {
    transform: translateX(3px);
    background: rgba(255,255,255,.18);
}

.boas-vindas-valores {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 24px;
    color: #9a6a4e;
    font-size: .59rem;
    font-weight: 700;
    letter-spacing: .19em;
    text-transform: uppercase;
}

.boas-vindas-valores i {
    color: #d9ab87;
    font-style: normal;
    letter-spacing: 0;
}

.boas-vindas-assinatura {
    position: absolute;
    z-index: 0;
    display: flex;
    flex-direction: column;
    color: rgba(255, 232, 207, .72);
    pointer-events: none;
    user-select: none;
}

.boas-vindas-assinatura--esquerda {
    left: clamp(28px, 8vw, 120px);
    top: 21%;
    max-width: 210px;
    text-align: left;
    text-transform: uppercase;
}

.boas-vindas-assinatura--esquerda span,
.boas-vindas-assinatura--esquerda strong {
    font-size: clamp(.66rem, 1vw, .78rem);
    line-height: 1.7;
    letter-spacing: .31em;
}

.boas-vindas-assinatura--esquerda strong {
    max-width: 175px;
    color: rgba(255, 230, 202, .9);
    font-weight: 600;
}

.boas-vindas-assinatura--esquerda::after {
    content: "";
    width: 70px;
    height: 1px;
    margin-top: 20px;
    background: rgba(255, 220, 183, .48);
}

.boas-vindas-assinatura--direita {
    right: clamp(32px, 9vw, 140px);
    bottom: 23%;
    align-items: center;
    transform: rotate(-4deg);
    color: rgba(255, 229, 201, .75);
    font-family: 'Cormorant Garamond', Georgia, serif;
    line-height: .95;
}

.boas-vindas-assinatura--direita span {
    font-size: clamp(1rem, 1.6vw, 1.35rem);
    font-style: italic;
}

.boas-vindas-assinatura--direita strong {
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-style: italic;
    font-weight: 600;
}

@media (max-width: 980px) {
    .boas-vindas-assinatura { display: none; }
    .boas-vindas-conteudo { width: min(100%, 500px); }
}

@media (max-width: 560px) {
    .tela-boas-vindas {
        align-items: center;
        padding: 18px;
        background:
            radial-gradient(circle at 15% 12%, rgba(255, 222, 181, .22), transparent 25%),
            radial-gradient(circle at 80% 88%, rgba(255, 218, 177, .12), transparent 28%),
            linear-gradient(160deg, #8d4324 0%, #9e4b28 46%, #5f2c1b 100%);
    }

    .boas-vindas-conteudo {
        width: 100%;
        max-width: 430px;
        padding: 29px 20px 24px;
        border-radius: 25px;
    }

    .boas-vindas-conteudo::before {
        inset: 6px;
        border-radius: 20px;
    }

    .boas-vindas-kicker {
        margin-bottom: 10px;
        font-size: .57rem;
    }

    .boas-vindas-logo-wrap {
        width: 132px;
        min-height: 94px;
        margin-bottom: 14px;
    }

    .boas-vindas-logo {
        max-width: 122px;
        max-height: 90px;
    }

    .boas-vindas-conteudo h2 {
        max-width: 330px;
        font-size: clamp(2rem, 10vw, 2.55rem);
        line-height: 1.02;
    }

    .boas-vindas-subtitulo,
    .boas-vindas-conteudo > p {
        max-width: 315px;
        margin-bottom: 21px;
        font-size: .87rem;
    }

    .boas-vindas-cta,
    .boas-vindas-conteudo button {
        width: 100%;
        max-width: 310px;
        min-height: 54px;
        border-radius: 16px;
    }

    .boas-vindas-valores {
        margin-top: 20px;
        gap: 6px;
        font-size: .51rem;
        letter-spacing: .13em;
    }
}

@media (prefers-reduced-motion: reduce) {
    .boas-vindas-conteudo { animation: none; }
    .tela-boas-vindas,
    .boas-vindas-cta,
    .boas-vindas-conteudo button,
    .boas-vindas-seta { transition: none; }
}

/* Carrossel de fotos do produto */
.produto-imagem-wrap {
    position: relative;
}
.produto-imagem-atual {
    cursor: zoom-in;
}
.carrossel-seta {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.45);
    color: #fff;
    border: none;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 1.2em;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.carrossel-seta:hover { background: rgba(0,0,0,0.65); }
.carrossel-anterior { left: 8px; }
.carrossel-proximo { right: 8px; }
.carrossel-dots {
    position: absolute;
    bottom: 18px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 5px;
}
.carrossel-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.6);
}
.carrossel-dot.ativo {
    background: #fff;
}

/* Visualizador de foto em tela cheia (lightbox) */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(0,0,0,0.92);
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.lightbox img {
    max-width: 100%;
    max-height: 88vh;
    border-radius: 8px;
}
.lightbox-fechar {
    position: absolute;
    top: 18px;
    right: 18px;
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: none;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-size: 1.2em;
    cursor: pointer;
}
.lightbox-fechar:hover { background: rgba(255,255,255,0.3); }
.lightbox-seta {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-size: 1.6em;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lightbox-seta:hover { background: rgba(255,255,255,0.3); }
.lightbox-anterior { left: 12px; }
.lightbox-proximo { right: 12px; }

/* Botão de ativar notificações */
.btn-notificacoes {
    width: 100%;
    background: var(--card);
    border: 2px solid var(--border);
    color: var(--primary);
    padding: 12px;
    border-radius: 12px;
    font-weight: 700;
    font-family: inherit;
    font-size: 0.9em;
    cursor: pointer;
    margin-top: 4px;
}
.btn-notificacoes:hover { background: var(--bg); }
.btn-notificacoes:disabled {
    background: #eef7f0;
    border-color: #b9e0c2;
    color: #1e6b34;
    cursor: default;
}

/* Toast de notificação em primeiro plano */
.toast-notificacao {
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 300;
    background: var(--card);
    border: 1px solid var(--border);
    border-left: 5px solid var(--primary);
    border-radius: 12px;
    padding: 14px 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    max-width: 340px;
    width: calc(100% - 32px);
    flex-direction: column;
    gap: 4px;
}
.toast-notificacao span:first-child {
    font-weight: 700;
    color: var(--primary);
}
.toast-notificacao span:last-child {
    font-size: 0.9em;
    color: var(--text);
}

/* Clube Brit's (fidelidade) */
.clube-fidelidade-card {
    background: linear-gradient(135deg, #fff8ec, #fdf1de);
    border: 1px solid var(--accent);
    border-radius: 12px;
    padding: 12px 14px;
    text-align: center;
    font-size: 0.9em;
}
.clube-fidelidade-card h3 {
    margin: 0 0 2px;
    color: var(--primary);
    font-size: 1em;
}
.clube-fidelidade-card > div > p {
    margin: 0 0 8px;
    color: var(--muted);
    font-size: 0.85em;
}
.clube-fidelidade-card button {
    background: var(--primary);
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-family: inherit;
    font-size: 0.9em;
    cursor: pointer;
}
.clube-fidelidade-card button:hover { background: var(--primary-dark); }

#clubeFormIdentificacao input {
    width: 100%;
    padding: 8px 10px;
    margin-bottom: 6px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.9em;
    background: #fff;
}

.clube-saudacao { font-weight: 700; color: var(--primary); font-size: 0.92em; margin: 0 0 6px !important; }

.clube-barra-fundo {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 20px;
    height: 10px;
    overflow: hidden;
    margin: 4px 0;
}
.clube-barra-preenchida {
    height: 100%;
    background: linear-gradient(90deg, var(--accent), var(--primary));
    border-radius: 20px;
    transition: width 0.4s ease;
}

.clube-recompensas-titulo {
    color: var(--primary);
    font-size: 0.85em;
    margin: 10px 0 6px;
    text-align: left;
}
.clube-recompensa-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 6px 10px;
    margin-bottom: 5px;
    font-size: 0.78em;
    text-align: left;
}
.clube-recompensa-item.bloqueada { opacity: 0.5; }
.clube-recompensa-item button {
    padding: 5px 10px;
    font-size: 0.85em;
    border-radius: 6px;
    white-space: nowrap;
}

.link-sair-clube {
    background: none !important;
    color: var(--muted) !important;
    text-decoration: underline;
    font-size: 0.72em !important;
    font-weight: 400 !important;
    padding: 4px !important;
    margin-top: 6px;
}

/* Seletor de quantidade no card do produto */
.produto-quantidade-stepper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin: 8px 0;
}
.qtd-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: #fff;
    color: var(--primary);
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.qtd-btn:hover { background: var(--bg); }
.qtd-valor {
    min-width: 22px;
    text-align: center;
    font-weight: 700;
    font-size: 1.05em;
}

/* Ícones de redes sociais no cabeçalho */
.contato-redes-sociais {
    text-align: center;
    margin-top: 20px;
    padding: 18px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
}
.contato-mensagem {
    margin: 0;
    font-weight: 700;
    color: var(--primary);
    font-size: 0.95em;
}

.redes-sociais-header {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 12px;
}
.rede-social-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    transition: transform 0.15s ease;
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
}
.rede-social-btn:hover { transform: scale(1.08); }
.rede-instagram {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.rede-whatsapp {
    background: #25D366;
}

/* Seção "Personalize seu cardápio" — vitrine pro serviço de cardápio digital */
.personalizar-secao {
    margin-top: 20px;
    padding: 24px 20px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 16px;
}
.personalizar-chamada {
    display: block;
    width: 100%;
    background: none;
    border: none;
    text-align: center;
    color: var(--primary);
    font-size: 1.3em;
    font-weight: 700;
    font-family: inherit;
    margin: 0;
    padding: 8px;
    cursor: pointer;
    line-height: 1.4;
}
.personalizar-chamada:hover { opacity: 0.85; }
.personalizar-conteudo { margin-top: 12px; }
.personalizar-subtitulo {
    text-align: center;
    color: var(--muted);
    font-size: 0.9em;
    margin: 0 0 20px;
}
.personalizar-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}
.personalizar-form { display: flex; flex-direction: column; }
.personalizar-form label {
    font-size: 0.82em;
    font-weight: 600;
    color: var(--text);
    margin: 10px 0 4px;
}
.personalizar-form label:first-child { margin-top: 0; }
.personalizar-form input {
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-family: inherit;
    font-size: 0.95em;
}
.personalizar-form input[type="color"] {
    padding: 4px;
    height: 42px;
    cursor: pointer;
}
.personalizar-form button {
    margin-top: 16px;
    background: var(--primary);
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 10px;
    font-family: inherit;
    font-weight: 700;
    font-size: 0.95em;
    cursor: pointer;
}
.personalizar-preview {
    background: var(--bg);
    border-radius: 14px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.preview-legenda {
    font-size: 0.75em;
    color: var(--muted);
    margin: 0 0 10px;
    font-weight: 600;
}
.preview-mini-cardapio {
    --cor-preview: #a0522d;
    background: #fff;
    border-radius: 12px;
    padding: 20px 16px;
    text-align: center;
    width: 100%;
    box-shadow: var(--shadow);
    border-top: 4px solid var(--cor-preview);
}
.preview-mini-cardapio img {
    max-width: 70px;
    height: auto;
    border-radius: 50%;
    margin-bottom: 8px;
}
.preview-mini-cardapio h3 {
    color: var(--cor-preview);
    font-size: 1.1em;
    margin: 0 0 4px;
}
.preview-mini-cardapio p {
    color: var(--muted);
    font-size: 0.8em;
    margin: 0;
}
.preview-botao-exemplo {
    margin-top: 14px;
    background: var(--cor-preview);
    color: #fff;
    padding: 9px;
    border-radius: 8px;
    font-size: 0.85em;
    font-weight: 700;
}
.personalizar-beneficios {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
}
.personalizar-beneficios li {
    font-size: 0.85em;
    color: var(--text);
}

@media (max-width: 700px) {
    .personalizar-grid { grid-template-columns: 1fr; }
    .personalizar-beneficios { grid-template-columns: 1fr; }
}

/* Banner de "modo demo" — aparece quando a pessoa ativa a prévia completa no site */
.banner-modo-demo {
    position: sticky;
    top: 0;
    z-index: 200;
    background: #2d2d2d;
    color: #fff;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    font-size: 0.85em;
    font-weight: 600;
    text-align: center;
}
.banner-modo-demo button {
    background: #fff;
    color: #2d2d2d;
    border: none;
    padding: 7px 14px;
    border-radius: 8px;
    font-family: inherit;
    font-weight: 700;
    font-size: 0.95em;
    cursor: pointer;
    white-space: nowrap;
}

.personalizar-form .btn-ver-previa {
    margin-top: 16px;
    background: #fff;
    color: var(--primary);
    border: 2px solid var(--primary);
    padding: 11px;
    border-radius: 10px;
    font-family: inherit;
    font-weight: 700;
    font-size: 0.95em;
    cursor: pointer;
}

/* Modal de escolha de adicionais (recheio, extras, etc.) */
.modal-adicionais-fundo {
    position: fixed;
    inset: 0;
    z-index: 210;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.modal-adicionais-cartao {
    background: var(--card);
    border-radius: 16px;
    padding: 24px 20px;
    max-width: 420px;
    width: 100%;
    max-height: 85vh;
    overflow-y: auto;
    position: relative;
}
.modal-adicionais-fechar {
    position: absolute;
    top: 14px;
    right: 14px;
    background: var(--bg);
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 1em;
    cursor: pointer;
}
.modal-adicionais-cartao h3 {
    margin: 0 0 16px;
    padding-right: 30px;
    color: var(--primary);
}
.grupo-adicional-titulo {
    font-weight: 700;
    font-size: 0.95em;
    margin: 14px 0 6px;
}
.grupo-adicional-tag {
    font-size: 0.75em;
    font-weight: 400;
    color: var(--muted);
}
.opcao-adicional {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 6px;
    cursor: pointer;
    font-size: 0.9em;
}
.opcao-adicional.selecionada {
    border-color: var(--primary);
    background: var(--bg);
}
.opcao-adicional-esquerda {
    display: flex;
    align-items: center;
    gap: 8px;
}
.opcao-adicional-preco {
    color: var(--muted);
    font-size: 0.85em;
}
.modal-adicionais-confirmar {
    width: 100%;
    margin-top: 16px;
    padding: 12px;
    border: none;
    border-radius: 10px;
    background: var(--primary);
    color: #fff;
    font-weight: 700;
    font-size: 0.95em;
    cursor: pointer;
}

/* Checkbox de encomenda com data agendada */
.checkbox-encomenda {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9em;
    margin: 12px 0 6px;
    cursor: pointer;
}
.dica-encomenda {
    font-size: 0.95em;
    color: var(--text);
    margin: 4px 0 10px;
    line-height: 1.4;
}

/* Seção especial de Encomendas */
.categoria-titulo-encomenda {
    color: var(--primary) !important;
    font-size: 1.4em !important;
}
.categoria-btn-encomenda {
    font-weight: 600 !important;
}

/* A agenda vira uma faixa horizontal compacta, integrada ao ritmo do cardápio. */
.encomenda-layout {
    display: grid;
    grid-template-columns: minmax(320px, .82fr) minmax(0, 2.18fr);
    gap: 22px;
    align-items: start;
    margin-bottom: 30px;
}

.encomenda-intro {
    max-width: none;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.encomenda-agendamento-faixa {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 13px;
    padding: 15px 17px;
    border: 1px solid rgba(111, 78, 55, .15);
    border-radius: 17px;
    background:
        radial-gradient(circle at 8% 18%, rgba(212, 164, 83, .08), transparent 30%),
        linear-gradient(145deg, #fffdf9 0%, #fff8ef 100%);
    box-shadow: 0 10px 26px rgba(76, 49, 32, .07);
}

.encomenda-agendamento-info {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.encomenda-agendamento-icone {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6f4e37, #a66a3f);
    color: #fff;
    font-size: 20px;
    box-shadow: 0 7px 16px rgba(111, 78, 55, .16);
}

.encomenda-agendamento-textos {
    min-width: 0;
}

.encomenda-agendamento-kicker {
    margin-bottom: 2px;
    color: #9b6d49;
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.encomenda-agendamento-titulo {
    color: #35271f;
    font-size: 16px;
    font-weight: 850;
    line-height: 1.2;
}

.encomenda-agendamento-descricao {
    max-width: 520px;
    margin-top: 4px;
    color: #7b6a60;
    font-size: 12px;
    line-height: 1.4;
}

.encomenda-agendamento-controles {
    min-width: 0;
}

.encomenda-agendamento-campos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.encomenda-campo-label {
    display: block;
    min-width: 0;
    margin: 0 !important;
    color: #5f493b;
    font-size: 11px !important;
    font-weight: 800 !important;
}

.encomenda-campo-label > span {
    display: block;
    margin-bottom: 5px;
}

.encomenda-campo-label input {
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    padding: 9px 10px;
    border: 1px solid #e3d6ca;
    border-radius: 11px;
    outline: none;
    background: #fff;
    color: #35271f;
    font: inherit;
}

.encomenda-campo-label input:focus {
    border-color: rgba(166, 106, 63, .7);
    box-shadow: 0 0 0 3px rgba(166, 106, 63, .10);
}

.encomenda-disponibilidade-msg {
    min-height: 16px;
    margin: 7px 0 0;
    padding: 7px 9px;
    border-radius: 9px;
    background: rgba(111, 78, 55, .055);
    color: #6f5c50;
    font-size: 10.8px;
    line-height: 1.3;
}

/* Preserva a grade do cardápio, mas não centraliza um único produto de encomenda. */
#produtos-destaque .categoria-grid.encomenda-grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 310px));
    justify-content: start;
    align-content: start;
    gap: 22px;
    max-width: none;
    margin: 0;
}

@media (max-width: 980px) {
    .encomenda-layout {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-bottom: 26px;
    }

    .encomenda-agendamento-faixa {
        grid-template-columns: minmax(0, 1fr) minmax(330px, .9fr);
        align-items: center;
        gap: 14px;
        padding: 13px 14px;
    }

    .encomenda-agendamento-descricao {
        max-width: none;
    }

    #produtos-destaque .categoria-grid.encomenda-grid {
        grid-template-columns: repeat(auto-fill, minmax(245px, 295px));
        justify-content: start;
        gap: 18px;
    }
}

@media (max-width: 760px) {
    .encomenda-agendamento-faixa {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    #produtos-destaque .categoria-grid.encomenda-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
        gap: 13px;
    }
}

@media (max-width: 480px) {
    .encomenda-agendamento-faixa {
        gap: 10px;
        padding: 12px;
        border-radius: 15px;
    }

    .encomenda-agendamento-info {
        align-items: flex-start;
        gap: 10px;
    }

    .encomenda-agendamento-icone {
        width: 38px;
        height: 38px;
        min-width: 38px;
        border-radius: 12px;
        font-size: 18px;
    }

    .encomenda-agendamento-kicker {
        font-size: 9px;
    }

    .encomenda-agendamento-titulo {
        font-size: 14px;
    }

    .encomenda-agendamento-descricao {
        margin-top: 3px;
        font-size: 10.5px;
        line-height: 1.35;
    }

    .encomenda-agendamento-campos {
        gap: 7px;
    }

    .encomenda-campo-label {
        font-size: 9.8px !important;
    }

    .encomenda-campo-label > span {
        margin-bottom: 4px;
    }

    .encomenda-campo-label input {
        min-height: 39px;
        padding: 8px 8px;
        border-radius: 10px;
        font-size: 11px;
    }

    .encomenda-disponibilidade-msg {
        margin-top: 6px;
        padding: 6px 8px;
        font-size: 9.8px;
    }

    #produtos-destaque .categoria-grid.encomenda-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 15px;
        width: 100%;
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
        justify-content: stretch;
    }

    #produtos-destaque .encomenda-grid .produto-item {
        width: 100% !important;
        max-width: 420px;
        min-width: 0;
    }
}

/* Barra flutuante do carrinho, fixa embaixo enquanto rola a página */
.carrinho-flutuante {
    position: fixed;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 150;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 30px;
    padding: 12px 20px;
    font-size: 0.95em;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 92vw;
}
.carrinho-flutuante-seta {
    font-weight: 400;
    opacity: 0.9;
    font-size: 0.9em;
}

/* Botão de copiar link de um produto específico */
.btn-copiar-link-produto {
    width: 100%;
    margin-top: 6px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
    color: var(--muted);
    font-size: 0.8em;
    cursor: pointer;
}

/* Destaque temporário quando chega por um link direto de produto */
.produto-destacado-link {
    animation: destaqueProdutoLink 1.5s ease-in-out 2;
}
@keyframes destaqueProdutoLink {
    0%, 100% { box-shadow: var(--shadow); }
    50% { box-shadow: 0 0 0 4px var(--accent); }
}

/* Aviso amigável quando o cardápio ainda não tem nenhum produto cadastrado */
.cardapio-vazio-aviso {
    text-align: center;
    padding: 60px 20px;
}

/* Botão "Meus Pedidos" no cabeçalho */
.btn-meus-pedidos {
    display: block;
    margin: 12px auto 0;
    padding: 8px 16px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 20px;
    color: var(--text);
    font-size: 0.85em;
    font-weight: 600;
    cursor: pointer;
}

/* Modal de Meus Pedidos */
.modal-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.modal-meus-pedidos {
    background: var(--bg);
    border-radius: 16px;
    padding: 20px;
    max-width: 420px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
}
.modal-meus-pedidos-topo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}
.btn-fechar-modal {
    background: none;
    border: none;
    font-size: 1.2em;
    cursor: pointer;
    color: var(--muted);
}
.item-meus-pedidos {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 12px;
    margin-top: 10px;
}
.item-meus-pedidos-topo {
    display: flex;
    justify-content: space-between;
    font-size: 0.9em;
    margin-bottom: 6px;
}
.item-meus-pedidos-itens {
    font-size: 0.85em;
    color: var(--muted);
    margin: 0 0 4px;
}
.item-meus-pedidos-total {
    font-weight: 700;
    margin: 0;
}

/* Lembrete de carrinho esquecido */
.lembrete-carrinho-banner {
    position: fixed;
    bottom: 80px;
    left: 16px;
    right: 16px;
    max-width: 420px;
    margin: 0 auto;
    background: var(--card);
    border: 1px solid var(--accent);
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: var(--shadow);
    z-index: 90;
    display: flex;
    flex-direction: column;
    gap: 8px;
    animation: lembreteCarrinhoEntrada 0.3s ease-out;
}
@keyframes lembreteCarrinhoEntrada {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
.lembrete-carrinho-banner span {
    font-size: 0.9em;
}
.lembrete-carrinho-botoes {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.lembrete-carrinho-botoes button:first-child {
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 6px 12px;
    flex: 1;
    font-size: 0.85em;
    font-weight: 600;
    cursor: pointer;
}
.lembrete-carrinho-fechar {
    background: none;
    border: none;
    color: var(--muted);
    font-size: 1em;
    cursor: pointer;
    padding: 4px;
}

/* Toggle Sim/Não — pra perguntas de sim ou não ficarem visualmente claras */
.toggle-sim-nao {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}
.toggle-opcao {
    flex: 0 0 auto;
    min-width: 70px;
    padding: 6px 14px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--primary);
    font-weight: 700;
    font-size: 0.85em;
    cursor: pointer;
}
.toggle-opcao.selecionado {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* Convite inteligente para ativar notificações */
.convite-notificacoes {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translate(-50%, 18px);
    z-index: 290;
    width: min(520px, calc(100% - 28px));
    background: var(--card);
    border: 1px solid var(--border);
    border-left: 5px solid var(--primary);
    border-radius: 18px;
    padding: 16px 16px 15px;
    box-shadow: 0 18px 44px rgba(50, 30, 20, .22);
    align-items: flex-start;
    gap: 12px;
    opacity: 0;
}
.convite-notificacoes.mostrar {
    display: flex !important;
    animation: conviteNotificacaoEntrar .32s ease forwards;
}
@keyframes conviteNotificacaoEntrar {
    from { opacity: 0; transform: translate(-50%, 18px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}
.convite-notificacoes-icone {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    font-size: 1.35rem;
}
.convite-notificacoes-conteudo { min-width: 0; padding-right: 22px; }
.convite-notificacoes-conteudo strong {
    display: block;
    color: var(--primary);
    font-size: 1rem;
    line-height: 1.25;
    margin-bottom: 5px;
}
.convite-notificacoes-conteudo p {
    margin: 0;
    color: var(--text);
    font-size: .86rem;
    line-height: 1.45;
}
.convite-notificacoes-acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 11px;
}
.convite-notificacoes-aceitar,
.convite-notificacoes-agora-nao {
    border-radius: 999px;
    padding: 9px 14px;
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
}
.convite-notificacoes-aceitar {
    border: 1px solid var(--primary);
    background: var(--primary);
    color: #fff;
}
.convite-notificacoes-agora-nao {
    border: 1px solid var(--border);
    background: transparent;
    color: var(--muted);
}
.convite-notificacoes-fechar {
    position: absolute;
    top: 9px;
    right: 9px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-size: 1rem;
}
@media (max-width: 520px) {
    .convite-notificacoes { bottom: 12px; padding: 14px; gap: 10px; }
    .convite-notificacoes-icone { width: 40px; height: 40px; flex-basis: 40px; }
    .convite-notificacoes-conteudo { padding-right: 16px; }
    .convite-notificacoes-acoes { flex-direction: column; }
    .convite-notificacoes-aceitar, .convite-notificacoes-agora-nao { width: 100%; }
}

/* Informações complementares de cada pedido em Meus Pedidos */
.item-meus-pedidos-meta {
    font-size: 0.78em;
    color: var(--muted);
    margin: -2px 0 6px;
}

/* ============================================================
   PEDEAKI SITE — ESTRUTURA GLOBAL PREMIUM V1
   Somente layout/responsividade. Não altera lógica, IDs ou JS.
   ============================================================ */
:root {
    --site-max-width: 1380px;
    --site-gutter: clamp(16px, 3vw, 34px);
    --site-section-gap: clamp(20px, 3vw, 34px);
    --site-radius-lg: 22px;
    --site-shadow-soft: 0 12px 34px rgba(74, 44, 27, 0.09);
}

/* O conteúdo passa a usar melhor monitores grandes sem ficar colado nas bordas. */
.container {
    width: min(calc(100% - (var(--site-gutter) * 2)), var(--site-max-width));
    max-width: var(--site-max-width);
    margin-left: auto;
    margin-right: auto;
}

main {
    padding-top: 14px;
}

/* Benefícios: grade estável no desktop e leitura mais confortável. */
main > .container:first-of-type .destaques {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 2px 0 14px;
}

main > .container:first-of-type .destaque-item {
    min-width: 0;
    min-height: 48px;
    padding: 9px 12px;
    border-radius: 13px;
    box-shadow: 0 7px 20px rgba(74, 44, 27, 0.07);
}

/* Vitrine: mesma linha visual do restante do cardápio. */
.carrossel-destaques.container {
    width: min(calc(100% - (var(--site-gutter) * 2)), var(--site-max-width));
    max-width: var(--site-max-width);
    padding: 0;
    margin: 10px auto var(--site-section-gap);
}

/* Área principal do catálogo. */
#produtos-destaque {
    width: min(calc(100% - (var(--site-gutter) * 2)), var(--site-max-width));
    max-width: var(--site-max-width);
    padding: 0;
}

#produtos-destaque > h2 {
    margin: 4px 0 18px;
    font-size: clamp(1.45rem, 2vw, 2rem);
    letter-spacing: -0.02em;
}

/* Categorias permanecem acessíveis durante a navegação. */
#produtos-destaque .categorias {
    top: 38px;
    margin: 0 0 24px;
    padding: 10px 12px;
    border: 1px solid rgba(230, 217, 198, .88);
    border-radius: 16px;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 10px 28px rgba(74, 44, 27, .09);
}

#produtos-destaque .categorias ul {
    justify-content: flex-start;
    gap: 8px;
    scrollbar-width: thin;
    padding: 0 2px;
}

#produtos-destaque .categorias button {
    flex: 0 0 auto;
    padding: 9px 15px;
    font-size: .9rem;
    border-radius: 999px;
}

/* No desktop, quatro produtos por linha: maiores e mais fáceis de ler que a grade antiga de cinco. */
#produtos-destaque .categoria-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 34px;
    align-items: stretch;
}

#produtos-destaque .categoria-titulo {
    margin: 32px 0 15px;
    padding-bottom: 9px;
    font-size: clamp(1.08rem, 1.35vw, 1.28rem);
}

#produtos-destaque .produto-item {
    width: 100%;
    min-width: 0;
    border-radius: 18px;
    box-shadow: 0 9px 26px rgba(70, 40, 20, .09);
}

#produtos-destaque .produto-item img {
    width: 100%;
    height: clamp(185px, 16vw, 225px);
}

/* Carrinho/checkout seguem o mesmo eixo do catálogo. */
#carrinho.container,
main > .container:not(:first-of-type) {
    width: min(calc(100% - (var(--site-gutter) * 2)), var(--site-max-width));
    max-width: var(--site-max-width);
}

#carrinho {
    scroll-margin-top: 88px;
    margin-top: 28px;
}

#carrinho .carrinho-itens {
    border-radius: 18px;
    box-shadow: var(--site-shadow-soft);
}

/* Barra do carrinho com largura controlada, sem atravessar a tela inteira. */
.carrinho-flutuante {
    width: auto;
    max-width: min(92vw, 620px);
    justify-content: center;
    padding: 12px 20px;
    box-shadow: 0 12px 30px rgba(63, 35, 22, .24);
}

/* Tablets / notebooks menores */
@media (max-width: 1180px) {
    :root { --site-gutter: 22px; }
    #produtos-destaque .categoria-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 17px;
    }
    #produtos-destaque .produto-item img {
        height: clamp(180px, 21vw, 220px);
    }
}

@media (max-width: 860px) {
    :root { --site-gutter: 16px; }
    main > .container:first-of-type .destaques {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #produtos-destaque .categoria-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
    #produtos-destaque .produto-item img {
        height: clamp(175px, 33vw, 230px);
    }
    #produtos-destaque .categorias {
        top: 36px;
        border-radius: 14px;
    }
}

@media (max-width: 560px) {
    :root { --site-gutter: 12px; }
    .container,
    .carrossel-destaques.container,
    #produtos-destaque,
    #carrinho.container,
    main > .container:not(:first-of-type) {
        width: calc(100% - (var(--site-gutter) * 2));
    }
    main { padding-top: 8px; }
    main > .container:first-of-type .destaques {
        gap: 8px;
    }
    main > .container:first-of-type .destaque-item {
        min-height: 44px;
        padding: 7px 9px;
    }
    #produtos-destaque > h2 {
        margin-bottom: 12px;
    }
    #produtos-destaque .categorias {
        margin-left: -4px;
        margin-right: -4px;
        padding: 8px;
        top: 34px;
    }
    #produtos-destaque .categorias button {
        padding: 8px 13px;
        font-size: .84rem;
    }
    #produtos-destaque .categoria-grid {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-bottom: 28px;
    }
    #produtos-destaque .produto-item img {
        height: clamp(210px, 64vw, 285px);
    }
    #produtos-destaque .categoria-titulo {
        margin-top: 26px;
    }
    .carrinho-flutuante {
        bottom: 10px;
        width: calc(100% - 24px);
        max-width: 520px;
        padding: 11px 14px;
    }
}

/* ============================================================
   PEDEAKI SITE — CARDS DE PRODUTO PREMIUM V2
   Somente apresentação. Não altera carrinho, produtos, Firebase ou JS.
   ============================================================ */

/* Cada categoria centraliza a quantidade REAL de produtos disponível.
   Assim 1, 2 ou 3 produtos não ficam "grudados" no lado esquerdo. */
#produtos-destaque .categoria-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 310px));
    justify-content: center;
    align-items: stretch;
    gap: 22px;
    margin-bottom: 38px;
}

/* Card mais editorial: borda leve, sombra limpa e proporção consistente. */
#produtos-destaque .produto-item {
    width: 100% !important;
    max-width: 310px;
    min-width: 0;
    padding: 0 0 14px;
    border: 1px solid rgba(224, 208, 188, .9);
    border-radius: 20px;
    background: linear-gradient(180deg, #fff 0%, #fff 76%, #fffdf9 100%);
    box-shadow: 0 10px 26px rgba(66, 39, 24, .09);
    overflow: hidden;
    text-align: left;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

@media (hover:hover) and (pointer:fine) {
    #produtos-destaque .produto-item:hover {
        transform: translateY(-5px);
        border-color: rgba(171, 91, 46, .28);
        box-shadow: 0 16px 34px rgba(66, 39, 24, .14);
    }
}

/* Foto ganha protagonismo e todos os cards mantêm a mesma proporção. */
#produtos-destaque .produto-imagem-wrap {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f7f0e6;
    border-bottom: 1px solid rgba(226, 212, 194, .8);
}

#produtos-destaque .produto-item img,
#produtos-destaque .produto-imagem-atual {
    display: block;
    width: 100%;
    height: 100% !important;
    max-width: none;
    margin: 0;
    object-fit: cover;
    transition: transform .28s ease;
}

@media (hover:hover) and (pointer:fine) {
    #produtos-destaque .produto-item:hover .produto-imagem-atual {
        transform: scale(1.025);
    }
}

/* Oferta vira selo premium, sem animação chamativa. */
#produtos-destaque .produto-tag {
    top: 12px;
    left: 12px;
    padding: 6px 11px;
    border-radius: 999px;
    background: rgba(204, 64, 48, .94);
    box-shadow: 0 5px 14px rgba(174, 52, 38, .24);
    font-size: .68rem;
    letter-spacing: .045em;
    animation: none;
}

/* Setas e indicadores ficam mais discretos sobre a foto. */
#produtos-destaque .carrossel-seta {
    width: 32px;
    height: 32px;
    background: rgba(35, 24, 18, .5);
    border: 1px solid rgba(255,255,255,.42);
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
#produtos-destaque .carrossel-anterior { left: 10px; }
#produtos-destaque .carrossel-proximo { right: 10px; }
#produtos-destaque .carrossel-dots { bottom: 10px; }
#produtos-destaque .carrossel-dot {
    width: 7px;
    height: 7px;
    box-shadow: 0 1px 5px rgba(0,0,0,.18);
}

/* Hierarquia de leitura: nome > descrição curta > preço > escolha > ação. */
#produtos-destaque .produto-item h3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    min-height: 2.7em;
    margin: 14px 15px 6px;
    color: #4b2f20;
    font-size: 1.02rem;
    line-height: 1.34;
    letter-spacing: -.012em;
    text-align: left;
}

#produtos-destaque .produto-item .descricao {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    min-height: 4.2em;
    margin: 0 15px 10px;
    color: #75675e;
    font-size: .82rem;
    line-height: 1.45;
    text-align: left;
    flex-grow: 1;
}

#produtos-destaque .produto-item .preco {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 7px;
    min-height: 32px;
    margin: 0 15px 8px;
    color: var(--primary);
    font-size: 1.18rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: left;
}

#produtos-destaque .produto-item .preco-original {
    color: #a2978f;
    font-size: .68rem;
    font-weight: 600;
}

/* Sabores/opções: chips compactos, sem estourar visualmente o card. */
#produtos-destaque .variantes-lista {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-height: 74px;
    overflow: auto;
    margin: 1px 15px 9px;
    padding: 1px 2px 2px 0;
    scrollbar-width: thin;
}

#produtos-destaque .variante-pill {
    min-height: 29px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fbf6ef;
    border-color: #eadac7;
    color: #69422a;
    font-size: .7rem;
    line-height: 1.15;
}
#produtos-destaque .variante-pill.selecionada {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    box-shadow: 0 4px 10px rgba(150, 75, 38, .17);
}

/* Quantidade em cápsula compacta, com controles maiores para toque. */
#produtos-destaque .produto-quantidade-stepper {
    align-self: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 36px;
    margin: 2px auto 9px;
    padding: 3px 6px;
    border: 1px solid #eadac7;
    border-radius: 999px;
    background: #fbf7f1;
}

#produtos-destaque .qtd-btn {
    width: 29px;
    height: 29px;
    border: 0;
    background: #fff;
    box-shadow: 0 2px 7px rgba(73, 44, 28, .08);
    font-size: 1rem;
}
#produtos-destaque .qtd-valor {
    min-width: 20px;
    color: #503421;
    font-size: .9rem;
}

/* CTA é o foco da parte inferior, sem ficar pesado demais. */
#produtos-destaque .produto-item .adicionar-carrinho {
    width: calc(100% - 30px);
    min-height: 42px;
    margin: 0 15px;
    padding: 9px 14px;
    border-radius: 12px;
    background: linear-gradient(180deg, #b45d31 0%, #9f4e29 100%);
    color: #fff;
    box-shadow: 0 6px 15px rgba(153, 75, 38, .18);
    font-size: .84rem;
    font-weight: 750;
    line-height: 1.2;
}
#produtos-destaque .produto-item .adicionar-carrinho:hover {
    background: linear-gradient(180deg, #a9532c 0%, #8e4323 100%);
}

/* Link secundário não compete com o botão de compra. */
#produtos-destaque .btn-copiar-link-produto {
    width: auto;
    align-self: center;
    margin: 7px 15px 0;
    padding: 3px 7px;
    border: 0;
    background: transparent;
    color: #a3958b;
    font-size: .64rem;
    line-height: 1.2;
    text-decoration: none;
}
#produtos-destaque .btn-copiar-link-produto:hover {
    color: var(--primary);
    background: transparent;
    text-decoration: underline;
}

/* Indisponível continua informativo, mas sem "apagar" o produto inteiro. */
#produtos-destaque .produto-item.indisponivel {
    opacity: .76;
}
#produtos-destaque .produto-item.indisponivel::after {
    top: 105px;
    padding: 7px 13px;
    border-radius: 999px;
    background: rgba(87, 68, 56, .88);
    font-size: .78rem;
    letter-spacing: .02em;
}

/* Categoria ganha acabamento mais editorial e melhor separação visual. */
#produtos-destaque .categoria-titulo {
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #eadfce;
    color: #5a3b28;
    font-weight: 800;
    letter-spacing: -.01em;
}

/* Notebooks e tablets: cartões continuam centrados e confortáveis. */
@media (max-width: 1180px) {
    #produtos-destaque .categoria-grid {
        grid-template-columns: repeat(auto-fit, minmax(245px, 295px));
        gap: 18px;
    }
    #produtos-destaque .produto-item { max-width: 295px; }
}

@media (max-width: 760px) {
    #produtos-destaque .categoria-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 13px;
    }
    #produtos-destaque .produto-item {
        max-width: none;
        border-radius: 17px;
    }
    #produtos-destaque .produto-item h3 {
        margin: 11px 11px 5px;
        min-height: 2.55em;
        font-size: .93rem;
    }
    #produtos-destaque .produto-item .descricao {
        min-height: 3.9em;
        margin: 0 11px 8px;
        font-size: .76rem;
        line-height: 1.38;
    }
    #produtos-destaque .produto-item .preco {
        margin: 0 11px 7px;
        font-size: 1.05rem;
    }
    #produtos-destaque .variantes-lista { margin-left: 11px; margin-right: 11px; }
    #produtos-destaque .produto-item .adicionar-carrinho {
        width: calc(100% - 22px);
        margin-left: 11px;
        margin-right: 11px;
        font-size: .78rem;
    }
}

/* Celular: um card por linha. A leitura do produto fica confortável e a foto vende melhor. */
@media (max-width: 560px) {
    #produtos-destaque .categoria-grid {
        grid-template-columns: 1fr;
        gap: 15px;
        width: 100%;
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
    }
    #produtos-destaque .produto-item {
        width: 100% !important;
        max-width: 420px;
        padding-bottom: 13px;
    }
    #produtos-destaque .produto-imagem-wrap { aspect-ratio: 16 / 10; }
    #produtos-destaque .produto-item h3 {
        min-height: 0;
        margin: 13px 14px 5px;
        font-size: 1rem;
    }
    #produtos-destaque .produto-item .descricao {
        min-height: 0;
        margin-left: 14px;
        margin-right: 14px;
        font-size: .8rem;
        -webkit-line-clamp: 4;
    }
    #produtos-destaque .produto-item .preco { margin-left: 14px; margin-right: 14px; }
    #produtos-destaque .variantes-lista { margin-left: 14px; margin-right: 14px; }
    #produtos-destaque .produto-item .adicionar-carrinho {
        width: calc(100% - 28px);
        margin-left: 14px;
        margin-right: 14px;
        min-height: 44px;
        font-size: .84rem;
    }
}


/* ============================================================
   PEDEAKI SITE — CARRINHO + CHECKOUT PREMIUM V3
   Estrutura visual e responsiva. Mantém IDs, eventos e lógica existentes.
   ============================================================ */

#carrinho.checkout-premium {
    padding-top: 16px;
    padding-bottom: 20px;
    margin-top: 34px;
}

.checkout-premium-cabecalho {
    max-width: 760px;
    margin: 0 auto 22px;
    text-align: center;
}

.checkout-premium-eyebrow,
.checkout-resumo-eyebrow {
    display: inline-block;
    color: #a65a32;
    font-size: .7rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

#carrinho.checkout-premium .checkout-premium-cabecalho h2 {
    margin: 7px 0 6px;
    color: #4c3020;
    font-size: clamp(1.55rem, 2.1vw, 2rem);
    line-height: 1.15;
    letter-spacing: -.025em;
}

.checkout-premium-cabecalho p {
    margin: 0;
    color: #7c6b5e;
    font-size: .9rem;
    line-height: 1.55;
}

.checkout-premium-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(350px, .75fr);
    gap: 22px;
    align-items: start;
}

.checkout-premium-formulario,
.checkout-premium-resumo {
    min-width: 0;
}

#carrinho.checkout-premium .checkout-card-principal {
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(226, 211, 192, .92);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 14px 34px rgba(70, 42, 26, .08);
}

.checkout-bloco {
    padding: 20px 22px;
    border-bottom: 1px solid rgba(230, 218, 202, .82);
}

.checkout-bloco:last-child {
    border-bottom: 0;
}

.checkout-bloco-titulo {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.checkout-bloco-titulo > div {
    min-width: 0;
}

.checkout-bloco-titulo strong {
    display: block;
    color: #4b3021;
    font-size: .98rem;
    line-height: 1.2;
}

.checkout-bloco-titulo small {
    display: block;
    margin-top: 3px;
    color: #8a7768;
    font-size: .74rem;
    line-height: 1.4;
    font-weight: 500;
}

.checkout-passo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 1px solid #ead6bf;
    border-radius: 11px;
    background: #fff7ef;
    color: #ad5a31;
    font-size: .72rem;
    font-weight: 800;
    box-shadow: 0 4px 12px rgba(111, 68, 39, .05);
}

.checkout-campos-duplos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

#carrinho.checkout-premium .endereco-form input[type="text"],
#carrinho.checkout-premium .endereco-form input[type="tel"],
#carrinho.checkout-premium .endereco-form textarea {
    margin: 0;
    min-height: 44px;
    padding: 11px 13px;
    border: 1px solid #e5d7c5;
    border-radius: 12px;
    background: #fffdf9;
    color: #3f3027;
    font-size: .88rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

#carrinho.checkout-premium .endereco-form textarea {
    min-height: 82px;
    resize: vertical;
}

#carrinho.checkout-premium .endereco-form input:focus,
#carrinho.checkout-premium .endereco-form textarea:focus,
#carrinho.checkout-premium .cupom-area input:focus {
    outline: none;
    border-color: rgba(160, 82, 45, .62);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(160, 82, 45, .09);
}

.checkout-endereco-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 9px;
    margin-top: 13px;
    padding: 14px;
    border: 1px solid #eadfce;
    border-radius: 16px;
    background: #fbf6ef;
}

.checkout-endereco-label {
    grid-column: 1 / -1;
    margin: 0 !important;
    color: #765643 !important;
    font-size: .76rem !important;
    font-weight: 750 !important;
}

#cepCliente { grid-column: span 4; }
#infoFrete { grid-column: 1 / -1; }
#ruaCliente { grid-column: span 8; }
#numeroCliente { grid-column: span 4; }
#complementoCliente { grid-column: 1 / -1; }
#bairroCliente { grid-column: span 5; }
#cidadeCliente { grid-column: span 5; }
#estadoCliente { grid-column: span 2; }

#carrinho.checkout-premium .info-frete {
    margin: 0;
    padding: 9px 11px;
    border-color: #e3d3bd;
    background: #fffaf4;
    font-size: .78rem;
}

#carrinho.checkout-premium .opcoes-radio {
    display: grid;
    gap: 9px;
    margin-top: 0;
}

#carrinho.checkout-premium .checkout-opcoes-entrega {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

#carrinho.checkout-premium .checkout-opcoes-pagamento {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

#carrinho.checkout-premium .opcao-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    min-height: 58px;
    padding: 10px 9px;
    border: 1px solid #e4d6c3;
    border-radius: 14px;
    background: #fffdf9;
    color: #51392b;
    font-size: .78rem;
    line-height: 1.2;
    font-weight: 750;
    text-transform: none;
    box-shadow: 0 3px 10px rgba(70, 42, 25, .035);
}

#carrinho.checkout-premium .opcao-btn span {
    color: #9a8575;
    font-size: .64rem;
    font-weight: 600;
}

#carrinho.checkout-premium .opcao-btn.selecionado {
    border-color: #a75a34;
    background: linear-gradient(145deg, #ae5c33, #934623);
    color: #fff;
    box-shadow: 0 7px 17px rgba(139, 68, 34, .18);
}

#carrinho.checkout-premium .opcao-btn.selecionado span {
    color: rgba(255,255,255,.78);
}

#carrinho.checkout-premium #areaTroco {
    margin-top: 12px;
    padding: 13px 14px;
    border: 1px solid #eadfce;
    border-radius: 14px;
    background: #fbf6ef;
}

#carrinho.checkout-premium #areaTroco > label,
#carrinho.checkout-premium #campoValorTroco label {
    margin: 0 0 7px;
    color: #674b39;
    font-size: .76rem;
}

#carrinho.checkout-premium .toggle-sim-nao {
    gap: 7px;
}

#carrinho.checkout-premium .toggle-opcao {
    min-width: 88px;
    min-height: 36px;
    border-radius: 10px;
}

.checkout-bloco-observacoes textarea {
    width: 100%;
}

.checkout-premium-resumo {
    position: sticky;
    top: 18px;
    padding: 18px;
    border: 1px solid rgba(224, 207, 187, .96);
    border-radius: 22px;
    background: linear-gradient(180deg, #fff 0%, #fffdf9 100%);
    box-shadow: 0 15px 36px rgba(68, 39, 22, .11);
}

.checkout-resumo-cabecalho {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 2px 1px 13px;
    border-bottom: 1px solid #eee1d2;
}

.checkout-resumo-cabecalho h3 {
    margin: 4px 0 0;
    color: #493022;
    font-size: 1.05rem;
    line-height: 1.25;
}

.checkout-resumo-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 13px;
    background: #fff4e8;
    border: 1px solid #ecd8c0;
    font-size: 1.08rem;
}

#carrinho.checkout-premium .carrinho-itens {
    margin: 13px 0 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

#carrinho.checkout-premium .carrinho-itens > p:only-child {
    margin: 0;
    padding: 18px 12px;
    border: 1px dashed #dfcdb7;
    border-radius: 13px;
    background: #fdf8f2;
    color: #8b7667;
    text-align: center;
    font-size: .82rem;
}

#carrinho.checkout-premium .carrinho-item {
    gap: 11px;
    padding: 11px 2px;
    border-bottom: 1px solid #eee1d3;
    font-size: .82rem;
}

#carrinho.checkout-premium .carrinho-item-foto {
    width: 54px;
    height: 54px;
    border-radius: 11px;
    border: 1px solid #eadcca;
}

#carrinho.checkout-premium .carrinho-item-info > span:first-child {
    color: #4f3728;
    font-weight: 700;
    line-height: 1.35;
}

#carrinho.checkout-premium .obs-mini {
    color: #8a7769;
    font-size: .9em;
    font-weight: 500;
}

#carrinho.checkout-premium .quantidade-controle {
    width: max-content;
    margin-top: 2px;
    padding: 2px;
    border: 1px solid #eadbc9;
    border-radius: 999px;
    background: #fbf6ef;
}

#carrinho.checkout-premium .btn-quantidade {
    width: 26px;
    height: 26px;
    border-radius: 50%;
}

#carrinho.checkout-premium .carrinho-item-direita > span {
    color: #6d422a;
    font-weight: 800;
    white-space: nowrap;
}

#carrinho.checkout-premium .btn-remover-item {
    filter: grayscale(1);
    opacity: .42;
}

.checkout-cupom-card {
    margin-top: 13px;
    padding: 13px;
    border: 1px solid #eadfce;
    border-radius: 15px;
    background: #fcf8f3;
}

.checkout-cupom-card > label {
    display: block;
    margin-bottom: 7px;
    color: #604735;
    font-size: .74rem;
    font-weight: 750;
}

#carrinho.checkout-premium .cupom-area {
    gap: 7px;
    margin: 0;
}

#carrinho.checkout-premium .cupom-area input {
    min-height: 39px;
    padding: 9px 11px;
    border-color: #e5d7c5;
    background: #fff;
    font-size: .8rem;
}

#carrinho.checkout-premium .cupom-area button {
    min-width: 84px;
    min-height: 39px;
    padding: 8px 13px;
    border-radius: 10px;
    background: #a9562e;
    font-size: .76rem;
}

#carrinho.checkout-premium .cupom-mensagem {
    margin-top: 6px;
    font-size: .74rem;
}

#carrinho.checkout-premium .carrinho-total {
    margin: 14px 0 0;
    padding: 13px 2px 2px;
    border-top: 1px solid #eee0d0;
    text-align: left;
}

#carrinho.checkout-premium .carrinho-total p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 5px 1px;
    color: #746153;
    font-size: .8rem;
}

#carrinho.checkout-premium .carrinho-total p strong {
    color: #4c3528;
    font-size: .82rem;
    font-weight: 750;
}

#carrinho.checkout-premium .carrinho-total p.total-final {
    margin-top: 7px;
    padding-top: 12px;
    border-top: 1px dashed #ddc9b2;
    color: #4a3021;
    font-size: .92rem;
    font-weight: 800;
}

#carrinho.checkout-premium .carrinho-total p.total-final strong {
    color: #a6532e;
    font-size: 1.15rem;
    font-weight: 850;
}

#carrinho.checkout-premium .finalizar-compra {
    min-height: 48px;
    margin: 15px 0 0;
    padding: 12px 18px;
    border-radius: 14px;
    background: linear-gradient(135deg, #20b85e 0%, #15984b 100%);
    box-shadow: 0 9px 20px rgba(24, 151, 75, .21);
    font-size: .94rem;
    letter-spacing: -.01em;
}

#carrinho.checkout-premium .finalizar-compra:hover {
    background: linear-gradient(135deg, #1baa55 0%, #128b43 100%);
}

.checkout-final-ajuda {
    margin: 8px 3px 0;
    color: #9a8779;
    font-size: .67rem;
    line-height: 1.45;
    text-align: center;
}

#carrinho.checkout-premium .compra-segura-box {
    margin: 14px 0 0;
    padding: 13px;
    border: 1px solid #e9decf;
    border-top: 1px solid #e9decf;
    border-radius: 15px;
    background: #fdf9f4;
}

#carrinho.checkout-premium .compra-segura-titulo {
    margin-bottom: 4px;
    color: #5a4232;
    font-size: .79rem;
}

#carrinho.checkout-premium .compra-segura-texto {
    margin-bottom: 10px;
    color: #8c7868;
    font-size: .68rem;
    line-height: 1.45;
}

#carrinho.checkout-premium .compra-segura-grade {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

#carrinho.checkout-premium .compra-segura-item {
    gap: 5px;
    padding: 7px 8px;
    border: 1px solid #eee2d5;
    background: #fff;
    color: #6f5747;
    font-size: .63rem;
    font-weight: 650;
}

#carrinho.checkout-premium .compra-segura-icone {
    font-size: .95rem;
}

/* Clube e relacionamento seguem o mesmo eixo do novo checkout. */
#carrinho.checkout-premium + .container {
    margin-top: 3px;
}

#carrinho.checkout-premium + .container .clube-fidelidade-card,
#carrinho.checkout-premium + .container .contato-redes-sociais {
    border-radius: 18px;
    border-color: rgba(228, 214, 195, .9);
    box-shadow: 0 8px 22px rgba(70, 42, 26, .055);
}

@media (max-width: 1040px) {
    .checkout-premium-grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, .82fr);
        gap: 16px;
    }

    .checkout-bloco {
        padding: 18px;
    }

    #carrinho.checkout-premium .checkout-opcoes-pagamento {
        grid-template-columns: 1fr;
    }

    #carrinho.checkout-premium .checkout-opcoes-pagamento .opcao-btn {
        flex-direction: row;
        min-height: 46px;
        gap: 5px;
    }
}

@media (max-width: 820px) {
    #carrinho.checkout-premium {
        margin-top: 26px;
    }

    .checkout-premium-grid {
        grid-template-columns: 1fr;
    }

    .checkout-premium-resumo {
        position: static;
    }

    .checkout-campos-duplos {
        grid-template-columns: 1fr;
    }

    #carrinho.checkout-premium .checkout-opcoes-pagamento {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    #carrinho.checkout-premium {
        padding-top: 8px;
    }

    .checkout-premium-cabecalho {
        margin-bottom: 15px;
        text-align: left;
    }

    .checkout-premium-cabecalho p {
        font-size: .8rem;
    }

    .checkout-bloco {
        padding: 16px 14px;
    }

    .checkout-bloco-titulo {
        align-items: flex-start;
        gap: 10px;
    }

    #carrinho.checkout-premium .checkout-opcoes-entrega,
    #carrinho.checkout-premium .checkout-opcoes-pagamento {
        grid-template-columns: 1fr;
    }

    #carrinho.checkout-premium .opcao-btn {
        flex-direction: row;
        justify-content: flex-start;
        min-height: 46px;
        padding: 10px 12px;
        gap: 5px;
        text-align: left;
    }

    .checkout-endereco-grid {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    #cepCliente,
    #ruaCliente,
    #numeroCliente,
    #complementoCliente,
    #bairroCliente,
    #cidadeCliente,
    #estadoCliente,
    #infoFrete,
    .checkout-endereco-label {
        grid-column: 1 !important;
    }

    .checkout-premium-resumo {
        padding: 15px 13px;
        border-radius: 18px;
    }

    #carrinho.checkout-premium .finalizar-compra {
        bottom: 10px;
        z-index: 20;
    }

    #carrinho.checkout-premium .compra-segura-grade {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 420px) {
    #carrinho.checkout-premium .compra-segura-grade {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   PEDEAKI SITE — CHECKOUT PREMIUM V4 REFINADO
   Microajustes visuais. Não altera IDs, eventos ou lógica.
   ============================================================ */

/* Barra de categorias: presença mais elegante sem disputar com o checkout. */
#produtos-destaque .categorias {
    margin-bottom: 30px;
    border-color: rgba(224, 207, 185, .92);
    box-shadow: 0 8px 24px rgba(72, 43, 25, .075);
    transition: box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

#produtos-destaque .categorias:focus-within,
#produtos-destaque .categorias:hover {
    border-color: rgba(195, 151, 112, .55);
    box-shadow: 0 12px 30px rgba(72, 43, 25, .105);
}

/* Cabeçalho do carrinho mais coeso e com sensação de etapa final. */
#carrinho.checkout-premium {
    position: relative;
    margin-top: 42px;
}

.checkout-premium-cabecalho {
    position: relative;
    max-width: none;
    margin: 0 0 18px;
    padding: 18px 22px 17px 70px;
    border: 1px solid rgba(226, 211, 192, .92);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,248,240,.96));
    text-align: left;
    box-shadow: 0 10px 28px rgba(72, 43, 25, .065);
    overflow: hidden;
}

.checkout-premium-cabecalho::before {
    content: '🛒';
    position: absolute;
    left: 22px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #ead4bb;
    border-radius: 11px;
    background: #fff5e9;
    box-shadow: 0 4px 12px rgba(112, 67, 38, .07);
    font-size: 1rem;
}

.checkout-premium-cabecalho::after {
    content: '';
    position: absolute;
    inset: auto -42px -56px auto;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(180, 98, 50, .09), transparent 70%);
    pointer-events: none;
}

.checkout-premium-cabecalho p {
    max-width: 780px;
}

/* Blocos do formulário: separação mais refinada. */
.checkout-bloco {
    transition: background .18s ease;
}

.checkout-bloco:hover {
    background: rgba(253, 249, 244, .48);
}

/* Entrega e pagamento como escolhas reais, não botões comuns. */
#carrinho.checkout-premium .opcao-btn {
    position: relative;
    cursor: pointer;
    overflow: hidden;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

#carrinho.checkout-premium .opcao-btn:hover {
    transform: translateY(-1px);
    border-color: #d8b998;
    box-shadow: 0 7px 16px rgba(90, 51, 27, .08);
}

#carrinho.checkout-premium .opcao-btn.selecionado {
    padding-right: 30px;
}

#carrinho.checkout-premium .opcao-btn.selecionado::after {
    content: '✓';
    position: absolute;
    top: 8px;
    right: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    color: #fff;
    font-size: .62rem;
    font-weight: 900;
}

/* Resumo decisivo com mais peso visual. */
.checkout-premium-resumo {
    border-color: rgba(208, 172, 138, .72);
    background:
        linear-gradient(180deg, rgba(255,255,255,.99), rgba(255,250,244,.99)),
        #fff;
    box-shadow: 0 18px 42px rgba(68, 39, 22, .135);
}

.checkout-premium-resumo::before {
    content: '';
    position: absolute;
    left: 18px;
    right: 18px;
    top: 0;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #8f4324, #c77847, #8f4324);
    opacity: .88;
}

.checkout-resumo-cabecalho {
    padding-top: 6px;
}

#carrinho.checkout-premium .carrinho-total p.total-final {
    margin-top: 10px;
    padding: 13px 12px;
    border: 1px solid #ead4bb;
    border-radius: 13px;
    background: linear-gradient(135deg, #fff7ee, #fffdf9);
}

#carrinho.checkout-premium .carrinho-total p.total-final span {
    color: #5d4130;
    font-size: .86rem;
    letter-spacing: .01em;
}

#carrinho.checkout-premium .carrinho-total p.total-final strong {
    font-size: 1.28rem;
    letter-spacing: -.025em;
}

#carrinho.checkout-premium .finalizar-compra {
    position: relative;
    width: 100%;
    min-height: 52px;
    padding-right: 48px;
    border: 1px solid rgba(8, 120, 57, .18);
    box-shadow: 0 11px 24px rgba(24, 151, 75, .24);
    font-weight: 800;
}

#carrinho.checkout-premium .finalizar-compra::after {
    content: '→';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.1rem;
    font-weight: 800;
    transition: transform .18s ease;
}

#carrinho.checkout-premium .finalizar-compra:hover::after {
    transform: translate(3px, -50%);
}

/* Segurança: menos cara de “mais um card”, mais assinatura de confiança. */
#carrinho.checkout-premium .compra-segura-box {
    padding: 11px 12px;
    background: linear-gradient(180deg, #fbf8f3, #fff);
}

#carrinho.checkout-premium .compra-segura-titulo {
    display: flex;
    align-items: center;
    gap: 5px;
}

#carrinho.checkout-premium .compra-segura-grade {
    gap: 5px;
}

#carrinho.checkout-premium .compra-segura-item {
    min-height: 34px;
    border-radius: 9px;
}

/* Pós-checkout: relacionamento e suporte viram um rodapé de confiança mais compacto. */
#carrinho.checkout-premium + .container {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
    gap: 14px;
    align-items: stretch;
    margin-top: 9px;
}

#carrinho.checkout-premium + .container > .clube-fidelidade-card,
#carrinho.checkout-premium + .container > .contato-redes-sociais {
    margin: 0;
    min-width: 0;
    min-height: 100%;
    padding: 16px 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,245,.96));
}

#carrinho.checkout-premium + .container > .clube-fidelidade-card {
    display: flex;
    align-items: center;
}

#carrinho.checkout-premium + .container > .clube-fidelidade-card > div {
    width: 100%;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
        'msg redes'
        'pedido pedido'
        'repetir repetir';
    align-content: center;
    gap: 10px 12px;
    text-align: left;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais .contato-mensagem {
    grid-area: msg;
    margin: 0;
    align-self: center;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais .redes-sociais-header {
    grid-area: redes;
    margin: 0;
    align-self: center;
    justify-content: flex-end;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais #btnMeusPedidos {
    grid-area: pedido;
    width: 100%;
    margin: 0;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais #btnRepetirPedido {
    grid-area: repetir;
    width: 100%;
    margin: 0;
}

/* Elementos que não fazem parte do rodapé de confiança continuam ocupando toda a largura. */
#carrinho.checkout-premium + .container > #modalMeusPedidos,
#carrinho.checkout-premium + .container > .personalizar-secao {
    grid-column: 1 / -1;
}

/* Personalização fica mais separada visualmente do fluxo de compra. */
#carrinho.checkout-premium + .container > .personalizar-secao {
    margin-top: 4px;
}

/* Rodapé institucional mais discreto. */
footer .footer-seguranca {
    padding-top: 4px;
}

footer .footer-seguranca-titulo {
    margin-bottom: 5px;
}

@media (max-width: 820px) {
    #carrinho.checkout-premium + .container {
        grid-template-columns: 1fr;
    }

    #carrinho.checkout-premium + .container > #modalMeusPedidos,
    #carrinho.checkout-premium + .container > .personalizar-secao {
        grid-column: 1;
    }
}

@media (max-width: 600px) {
    #produtos-destaque .categorias {
        margin-bottom: 22px;
        box-shadow: 0 7px 20px rgba(72, 43, 25, .075);
    }

    #carrinho.checkout-premium {
        margin-top: 30px;
    }

    .checkout-premium-cabecalho {
        padding: 15px 15px 15px 58px;
        border-radius: 17px;
    }

    .checkout-premium-cabecalho::before {
        left: 14px;
        width: 32px;
        height: 32px;
    }

    #carrinho.checkout-premium .opcao-btn.selecionado {
        padding-right: 38px;
    }

    #carrinho.checkout-premium .opcao-btn.selecionado::after {
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
    }

    #carrinho.checkout-premium + .container > .contato-redes-sociais {
        grid-template-columns: 1fr auto;
        padding: 15px;
    }
}

@media (max-width: 430px) {
    #carrinho.checkout-premium + .container > .contato-redes-sociais {
        grid-template-columns: 1fr;
        grid-template-areas:
            'msg'
            'redes'
            'pedido'
            'repetir';
        text-align: center;
    }

    #carrinho.checkout-premium + .container > .contato-redes-sociais .redes-sociais-header {
        justify-content: center;
    }
}

/* ============================================================
   PEDEAKI SITE — CHECKOUT PREMIUM V5 FINAL
   Lapidação fina do carrinho/checkout. Somente visual.
   ============================================================ */

/* Aproxima o início do carrinho do checkout para formar uma única seção. */
#carrinho.checkout-premium {
    margin-top: 30px;
}

.checkout-premium-cabecalho {
    margin-bottom: 12px;
    padding-top: 16px;
    padding-bottom: 15px;
}

.checkout-premium-grid {
    gap: 14px;
}

/* Resumo decisivo: mais contraste sem ficar pesado. */
.checkout-premium-resumo {
    border-color: rgba(190, 137, 96, .72);
    background: linear-gradient(180deg, #fff 0%, #fffaf4 100%);
    box-shadow:
        0 18px 42px rgba(68, 39, 22, .14),
        0 0 0 1px rgba(255,255,255,.9) inset;
}

.checkout-resumo-cabecalho {
    padding-bottom: 12px;
}

.checkout-resumo-cabecalho h3 {
    color: #3f291d;
}

/* Entrega e pagamento: seleção mais evidente e elegante. */
#carrinho.checkout-premium .opcao-btn {
    border-width: 1px;
}

#carrinho.checkout-premium .opcao-btn.selecionado {
    border-color: #8e421f;
    background: linear-gradient(145deg, #b55e32 0%, #8e421f 100%);
    box-shadow:
        0 8px 18px rgba(139, 68, 34, .22),
        0 0 0 2px rgba(181, 94, 50, .10);
}

#carrinho.checkout-premium .opcao-btn.selecionado::after {
    width: 19px;
    height: 19px;
    background: #fff;
    color: #9d4b27;
    box-shadow: 0 2px 7px rgba(83, 43, 24, .16);
    font-size: .68rem;
}

#carrinho.checkout-premium .opcao-btn.selecionado span {
    color: rgba(255,255,255,.88);
}

/* Total como ponto focal, sem competir com o botão final. */
#carrinho.checkout-premium .carrinho-total p.total-final {
    margin-top: 11px;
    padding: 14px 13px;
    border-color: #dfc3a8;
    background: linear-gradient(135deg, #fff5e9, #fffdf9);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

#carrinho.checkout-premium .carrinho-total p.total-final strong {
    color: #9d4925;
    font-size: 1.34rem;
}

#carrinho.checkout-premium .finalizar-compra {
    min-height: 54px;
    margin-top: 13px;
    border-radius: 15px;
    box-shadow: 0 12px 26px rgba(24, 151, 75, .25);
}

/* Segurança e relacionamento ficam mais próximos do checkout. */
#carrinho.checkout-premium .compra-segura-box {
    margin-top: 11px;
}

#carrinho.checkout-premium + .container {
    margin-top: 6px;
    gap: 10px;
    align-items: stretch;
}

#carrinho.checkout-premium + .container > .clube-fidelidade-card,
#carrinho.checkout-premium + .container > .contato-redes-sociais {
    min-height: 128px;
    border-color: rgba(220, 201, 181, .95);
    box-shadow: 0 8px 20px rgba(70, 42, 26, .055);
}

#carrinho.checkout-premium + .container > .clube-fidelidade-card {
    justify-content: center;
}

#carrinho.checkout-premium + .container > .contato-redes-sociais {
    align-content: center;
}

/* O bloco de personalização não fica visualmente colado ao rodapé de confiança. */
#carrinho.checkout-premium + .container > .personalizar-secao {
    margin-top: 2px;
}

@media (max-width: 820px) {
    #carrinho.checkout-premium {
        margin-top: 24px;
    }

    .checkout-premium-grid {
        gap: 12px;
    }

    #carrinho.checkout-premium + .container > .clube-fidelidade-card,
    #carrinho.checkout-premium + .container > .contato-redes-sociais {
        min-height: auto;
    }
}

@media (max-width: 600px) {
    #carrinho.checkout-premium {
        margin-top: 22px;
    }

    .checkout-premium-cabecalho {
        margin-bottom: 10px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    #carrinho.checkout-premium .opcao-btn.selecionado::after {
        right: 11px;
    }

    #carrinho.checkout-premium + .container {
        gap: 8px;
    }
}

/* ============================================================
   PEDEAKI SITE — TOPO / VITRINE / CATEGORIAS PREMIUM V6
   Lapidação visual cuidadosa. Sem alterações de lógica, IDs ou JS.
   ============================================================ */

/* Cabeçalho do cardápio: mais compacto, elegante e focado no conteúdo. */
header {
    padding: 16px 0 14px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom: 1px solid rgba(226, 209, 191, .82);
    background:
        radial-gradient(circle at 50% -40%, rgba(229, 190, 154, .18), transparent 52%),
        linear-gradient(180deg, #ffffff 0%, #fffdf9 100%);
    box-shadow: 0 7px 24px rgba(67, 40, 24, .065);
}

header .container {
    padding-top: 0;
    padding-bottom: 0;
}

header .logo {
    max-width: 92px;
    margin-bottom: 6px;
    filter: drop-shadow(0 4px 8px rgba(85, 50, 31, .08));
}

header h1 {
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.18;
    letter-spacing: -.02em;
}

header p:not(.header-cidade) {
    width: min(100%, 760px);
    margin: 7px auto 0;
    font-size: .9rem;
    line-height: 1.55;
}

.header-cidade:not(:empty) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    margin-top: 7px;
    padding: 4px 10px;
    border: 1px solid rgba(205, 172, 140, .5);
    border-radius: 999px;
    background: rgba(251, 244, 236, .82);
    font-size: .72rem;
}

.sino-notificacoes {
    top: 12px;
    right: max(14px, var(--site-gutter));
    width: 36px;
    height: 36px;
    border-color: #cfe8d7;
    box-shadow: 0 6px 16px rgba(31, 117, 63, .1);
}

/* Avisos operacionais: mais finos e fáceis de identificar sem competir com a vitrine. */
.status-loja-banner {
    min-height: 34px;
    padding: 7px var(--site-gutter);
    border-bottom: 1px solid rgba(0, 0, 0, .04);
    font-size: .78rem;
    letter-spacing: .005em;
}

.oferta-banner,
.status-pedido-banner {
    min-height: 36px;
    padding-top: 7px;
    padding-bottom: 7px;
}

/* Benefícios: pequenos sinais de confiança, não caixas pesadas. */
main > .container:first-of-type {
    padding-top: 13px;
    padding-bottom: 8px;
}

main > .container:first-of-type .destaques {
    gap: 10px;
    margin-bottom: 10px;
}

main > .container:first-of-type .destaque-item {
    min-height: 46px;
    padding: 8px 12px;
    border-color: rgba(225, 207, 189, .8);
    background: linear-gradient(180deg, #fff 0%, #fffdf9 100%);
    box-shadow: 0 7px 18px rgba(72, 43, 25, .055);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

main > .container:first-of-type .destaque-item:hover {
    transform: translateY(-1px);
    border-color: rgba(195, 150, 111, .52);
    box-shadow: 0 10px 22px rgba(72, 43, 25, .075);
}

main > .container:first-of-type .destaque-item .emoji {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: #fbf2e8;
    font-size: 14px;
}

main > .container:first-of-type .destaque-item .txt {
    color: #6c5544;
    font-size: .72rem;
    line-height: 1.25;
}

.btn-notificacoes {
    width: fit-content;
    max-width: 100%;
    min-height: 34px;
    margin: 0 auto 3px;
    padding: 7px 14px;
    border-radius: 999px;
    border-color: rgba(205, 172, 140, .68);
    background: rgba(255, 252, 247, .96);
    box-shadow: 0 5px 14px rgba(72, 43, 25, .045);
    font-size: .74rem;
}

/* Carrossel: preserva o comportamento atual; melhora somente acabamento e leitura. */
.carrossel-destaques.container {
    margin-top: 9px;
    margin-bottom: 26px;
    border-radius: 23px;
    border-color: rgba(178, 129, 91, .26);
    background: #fffaf6;
    box-shadow:
        0 18px 42px rgba(83, 46, 27, .12),
        0 1px 0 rgba(255,255,255,.9) inset;
}

.carrossel-slide {
    height: clamp(225px, 19vw, 270px);
}

.carrossel-foto {
    width: 60%;
}

.carrossel-slide::after {
    background: linear-gradient(90deg,
        rgba(255,250,246,.995) 0%,
        rgba(255,250,246,.975) 39%,
        rgba(255,250,246,.78) 53%,
        rgba(255,250,246,.12) 75%);
}

.carrossel-slide-info {
    width: min(54%, 540px);
    padding: 27px 28px 34px;
    gap: 7px;
}

.carrossel-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(185, 108, 114, .09);
    font-size: .65rem;
    letter-spacing: .1em;
}

.carrossel-slide-info strong {
    color: #4b2e24;
    font-size: clamp(1.32rem, 2vw, 1.9rem);
    line-height: 1.06;
}

.carrossel-preco {
    color: #964a34;
}

.carrossel-cta {
    min-height: 38px;
    padding: 9px 17px;
    background: linear-gradient(145deg, #b96443 0%, #994726 100%);
    box-shadow: 0 9px 20px rgba(153, 71, 38, .2);
}

.carrossel-destaque-seta {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(210, 184, 161, .72);
    background: rgba(255,255,255,.94);
    box-shadow: 0 7px 18px rgba(65, 38, 24, .14);
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.carrossel-destaque-seta:hover {
    background: #fff;
    box-shadow: 0 9px 22px rgba(65, 38, 24, .18);
}

.carrossel-destaque-anterior:hover { transform: translateY(-50%) translateX(-1px); }
.carrossel-destaque-proximo:hover { transform: translateY(-50%) translateX(1px); }

.carrossel-bolinhas {
    bottom: 11px;
    gap: 7px;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.62);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.carrossel-bolinha {
    width: 7px;
    height: 7px;
    background: rgba(92, 56, 41, .24);
    transition: transform .18s ease, background .18s ease;
}

.carrossel-bolinha.ativa {
    background: #9f4e34;
    transform: scale(1.28);
}

/* Banner enviado pela loja continua inteiro, sem crop nem overlay. */
.carrossel-slide-banner {
    background: #fff;
}

.carrossel-banner-imagem {
    object-fit: contain;
}

/* Entrada do catálogo: editorial e mais clara, sem aumentar demais a tela. */
#produtos-destaque > h2 {
    position: relative;
    width: fit-content;
    margin: 2px auto 17px;
    padding: 0 42px;
    color: #8e4728;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.45rem, 2.15vw, 2.05rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.025em;
}

#produtos-destaque > h2::before,
#produtos-destaque > h2::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(166, 96, 55, .55));
}

#produtos-destaque > h2::before {
    left: 0;
}

#produtos-destaque > h2::after {
    right: 0;
    transform: scaleX(-1);
}

/* Navegação por categorias: barra premium, scroll suave e estado ativo mais forte. */
#produtos-destaque .categorias {
    top: 37px;
    margin-bottom: 26px;
    padding: 9px 10px;
    border-radius: 17px;
    border-color: rgba(220, 201, 183, .9);
    background: rgba(255, 253, 249, .95);
    box-shadow: 0 10px 27px rgba(67, 40, 24, .085);
}

#produtos-destaque .categorias ul {
    gap: 7px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

#produtos-destaque .categorias ul::-webkit-scrollbar {
    display: none;
}

#produtos-destaque .categorias button {
    scroll-snap-align: start;
    min-height: 34px;
    padding: 7px 13px;
    border-color: rgba(218, 198, 179, .9);
    background: #fbf6ef;
    color: #755039;
    font-size: .76rem;
    box-shadow: none;
}

#produtos-destaque .categorias button:hover {
    border-color: #cca884;
    background: #f4e7d7;
    color: #6c3b22;
}

#produtos-destaque .categorias button.active {
    border-color: #9d4b28;
    background: linear-gradient(145deg, #b55d32, #914320);
    color: #fff;
    box-shadow: 0 6px 15px rgba(145, 67, 32, .18);
}

#produtos-destaque .categorias button.categoria-btn-encomenda.active {
    border-color: #9d4b28 !important;
    background: linear-gradient(145deg, #b55d32, #914320) !important;
    color: #fff !important;
    box-shadow: 0 6px 15px rgba(145, 67, 32, .18) !important;
}

/* Títulos das categorias com separação mais discreta. */
#produtos-destaque .categoria-titulo {
    margin-top: 28px;
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(221, 202, 183, .82);
    color: #583a29;
    font-size: clamp(1rem, 1.2vw, 1.17rem);
    font-weight: 700;
}

@media (max-width: 900px) {
    main > .container:first-of-type .destaques {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .carrossel-slide-info {
        width: 58%;
        padding-left: 22px;
        padding-right: 20px;
    }
}

@media (max-width: 700px) {
    header {
        padding: 14px 0 12px;
        border-bottom-left-radius: 17px;
        border-bottom-right-radius: 17px;
    }

    header .logo {
        max-width: 76px;
        margin-bottom: 4px;
    }

    header h1 {
        font-size: 1.24rem;
    }

    header p:not(.header-cidade) {
        font-size: .78rem;
        line-height: 1.45;
    }

    .carrossel-destaques.container {
        border-radius: 18px;
        margin-bottom: 21px;
    }

    .carrossel-slide {
        height: 205px;
    }

    .carrossel-foto {
        width: 57%;
    }

    .carrossel-slide-info {
        width: 64%;
        padding: 17px 14px 29px;
    }

    .carrossel-kicker {
        min-height: 21px;
        padding: 3px 7px;
        font-size: .56rem;
    }

    .carrossel-slide-info strong {
        font-size: 1.08rem;
        line-height: 1.08;
    }

    .carrossel-preco {
        font-size: 1rem;
    }

    .carrossel-destaque-seta {
        width: 31px;
        height: 31px;
        font-size: 21px;
    }

    #produtos-destaque > h2 {
        padding: 0 34px;
        font-size: 1.42rem;
    }

    #produtos-destaque > h2::before,
    #produtos-destaque > h2::after {
        width: 23px;
    }

    #produtos-destaque .categorias {
        top: 35px;
        padding: 8px;
        border-radius: 15px;
    }

    #produtos-destaque .categorias button {
        min-height: 32px;
        padding: 6px 11px;
        font-size: .7rem;
    }
}

@media (max-width: 520px) {
    main > .container:first-of-type .destaques {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    main > .container:first-of-type .destaque-item {
        min-height: 42px;
        padding: 7px 8px;
    }

    main > .container:first-of-type .destaque-item .emoji {
        flex-basis: 24px;
        width: 24px;
        height: 24px;
        font-size: 12px;
    }

    main > .container:first-of-type .destaque-item .txt {
        font-size: .64rem;
    }

    .btn-notificacoes {
        font-size: .68rem;
    }
}

/* ============================================================
   PEDEAKI SITE — CABEÇALHO / AVISOS / BENEFÍCIOS PREMIUM V7
   Refino visual apenas. Carrossel, categorias e lógica preservados.
   ============================================================ */

/* Cabeçalho vira uma assinatura de marca compacta no desktop. */
header {
    position: relative;
    padding: 12px 0;
    overflow: hidden;
    border-bottom-left-radius: 22px;
    border-bottom-right-radius: 22px;
    background:
        radial-gradient(circle at 12% 0%, rgba(190, 118, 69, .085), transparent 28%),
        radial-gradient(circle at 88% 100%, rgba(229, 201, 174, .22), transparent 32%),
        linear-gradient(180deg, #fff 0%, #fffdf9 100%);
    box-shadow: 0 8px 28px rgba(66, 39, 24, .07);
}

header::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: min(420px, 62vw);
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, rgba(165, 91, 49, .28), transparent);
}

header .container {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    grid-template-areas:
        'logo titulo'
        'logo descricao'
        'logo cidade';
    align-items: center;
    column-gap: 17px;
    row-gap: 2px;
    width: min(calc(100% - (var(--site-gutter) * 2)), 980px);
    margin: 0 auto;
    padding: 0;
    text-align: left;
}

header .logo {
    grid-area: logo;
    align-self: center;
    width: 68px;
    max-width: 68px;
    max-height: 68px;
    margin: 0;
    object-fit: contain;
    filter: drop-shadow(0 6px 13px rgba(86, 48, 27, .1));
}

header h1 {
    grid-area: titulo;
    align-self: end;
    margin: 0;
    color: #8f4526;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.3rem, 1.75vw, 1.62rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.022em;
}

header p:not(.header-cidade) {
    grid-area: descricao;
    align-self: start;
    width: auto;
    max-width: 690px;
    margin: 4px 0 0;
    color: #755f50;
    font-size: .78rem;
    line-height: 1.4;
}

.header-cidade {
    grid-area: cidade;
    justify-self: start;
}

.header-cidade:not(:empty) {
    min-height: 22px;
    margin: 4px 0 0;
    padding: 3px 9px;
    border-color: rgba(201, 164, 130, .42);
    background: rgba(250, 243, 235, .7);
    color: #7a5a43;
    font-size: .65rem;
}

.sino-notificacoes {
    top: 12px;
    right: max(12px, var(--site-gutter));
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(244, 252, 246, .96);
    box-shadow: 0 7px 18px rgba(31, 117, 63, .09);
}

/* Avisos importantes deixam de parecer faixas técnicas e viram alertas leves. */
.status-loja-banner,
.oferta-banner,
.status-pedido-banner {
    width: min(calc(100% - (var(--site-gutter) * 2)), 1180px);
    margin-left: auto;
    margin-right: auto;
    border-left: 1px solid rgba(0, 0, 0, .035);
    border-right: 1px solid rgba(0, 0, 0, .035);
    border-radius: 0 0 10px 10px;
    box-shadow: 0 4px 12px rgba(64, 39, 24, .035);
}

.status-loja-banner {
    min-height: 29px;
    margin-top: 7px;
    padding: 5px 12px;
    font-size: .69rem;
    font-weight: 700;
}

.oferta-banner,
.status-pedido-banner {
    min-height: 31px;
    margin-top: 4px;
    padding: 5px 12px;
    font-size: .69rem;
    line-height: 1.25;
}

.oferta-banner button,
.status-pedido-banner button {
    min-width: 25px;
    min-height: 25px;
}

/* Benefícios: uma única régua de confiança, leve e fácil de escanear. */
main > .container:first-of-type {
    padding-top: 10px;
    padding-bottom: 5px;
}

main > .container:first-of-type .destaques {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin: 0 auto 7px;
    padding: 5px;
    border: 1px solid rgba(222, 202, 183, .72);
    border-radius: 15px;
    background: rgba(255, 253, 249, .9);
    box-shadow: 0 7px 20px rgba(74, 45, 27, .05);
}

main > .container:first-of-type .destaque-item {
    position: relative;
    min-height: 37px;
    padding: 6px 8px;
    gap: 7px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    box-shadow: none;
}

main > .container:first-of-type .destaque-item:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 8px;
    right: -4px;
    bottom: 8px;
    width: 1px;
    background: rgba(220, 201, 184, .58);
}

main > .container:first-of-type .destaque-item:hover {
    transform: none;
    border-color: transparent;
    background: #fbf5ee;
    box-shadow: none;
}

main > .container:first-of-type .destaque-item .emoji {
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    border-radius: 8px;
    background: linear-gradient(145deg, #fff6ec, #f7e8d8);
    font-size: 12px;
}

main > .container:first-of-type .destaque-item .txt {
    color: #675041;
    font-size: .66rem;
    font-weight: 650;
    line-height: 1.2;
}

.btn-notificacoes {
    min-height: 30px;
    margin: 0 auto;
    padding: 5px 12px;
    border-radius: 999px;
    border-color: rgba(202, 169, 137, .54);
    background: #fffdf9;
    color: #75523b;
    box-shadow: 0 4px 11px rgba(76, 45, 27, .04);
    font-size: .67rem;
    font-weight: 700;
}

.btn-notificacoes:hover {
    border-color: rgba(174, 113, 72, .54);
    background: #fbf2e9;
    color: #8d4425;
}

/* Aproxima a vitrine do topo sem alterar um único estilo interno do carrossel. */
.carrossel-destaques.container {
    margin-top: 7px;
}

@media (max-width: 760px) {
    header {
        padding: 11px 0 10px;
        border-bottom-left-radius: 17px;
        border-bottom-right-radius: 17px;
    }

    header .container {
        grid-template-columns: 54px minmax(0, 1fr);
        column-gap: 11px;
        width: min(calc(100% - 28px), 650px);
    }

    header .logo {
        width: 52px;
        max-width: 52px;
        max-height: 52px;
    }

    header h1 {
        font-size: 1.08rem;
    }

    header p:not(.header-cidade) {
        margin-top: 3px;
        font-size: .68rem;
        line-height: 1.32;
    }

    .header-cidade:not(:empty) {
        margin-top: 3px;
        font-size: .6rem;
    }

    .status-loja-banner,
    .oferta-banner,
    .status-pedido-banner {
        width: calc(100% - 20px);
    }

    main > .container:first-of-type .destaques {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 3px;
    }

    main > .container:first-of-type .destaque-item {
        min-height: 35px;
    }

    main > .container:first-of-type .destaque-item:nth-child(2)::after {
        display: none;
    }
}

@media (max-width: 480px) {
    header .container {
        grid-template-columns: 46px minmax(0, 1fr);
        column-gap: 9px;
    }

    header .logo {
        width: 44px;
        max-width: 44px;
        max-height: 44px;
    }

    header h1 {
        font-size: .98rem;
    }

    header p:not(.header-cidade) {
        font-size: .62rem;
    }

    main > .container:first-of-type {
        padding-top: 7px;
    }

    main > .container:first-of-type .destaques {
        padding: 4px;
    }

    main > .container:first-of-type .destaque-item .txt {
        font-size: .61rem;
    }
}

/* ============================================================
   PEDEAKI SITE — ACABAMENTO PREMIUM FINAL V8
   Microrefino visual. Nenhuma estrutura ou lógica alterada.
   ============================================================ */

/* Assinatura da marca: um pouco mais de presença sem aumentar o topo. */
header {
    border-bottom: 1px solid rgba(187, 145, 108, .16);
}

header .container {
    grid-template-columns: 78px minmax(0, 1fr);
    column-gap: 19px;
    width: min(calc(100% - (var(--site-gutter) * 2)), 1040px);
}

header .logo {
    width: 74px;
    max-width: 74px;
    max-height: 74px;
    filter: drop-shadow(0 7px 15px rgba(86, 48, 27, .12));
}

header h1 {
    font-size: clamp(1.34rem, 1.85vw, 1.7rem);
    color: #88401f;
}

header p:not(.header-cidade) {
    max-width: 730px;
    color: #6f594b;
}

/* Alertas ganham acabamento mais consistente, inclusive na pausa. */
.status-loja-banner.loja-pausada {
    border-color: rgba(211, 166, 67, .28);
    background: linear-gradient(180deg, #fff5d9 0%, #ffefc6 100%);
    color: #735414;
    box-shadow: 0 5px 14px rgba(139, 101, 24, .06);
}

.status-loja-banner.loja-aberta {
    box-shadow: 0 5px 14px rgba(31, 117, 63, .045);
}

.status-loja-banner.loja-fechada {
    box-shadow: 0 5px 14px rgba(150, 55, 55, .045);
}

/* Microinterações consistentes sem alterar dimensões/layout. */
button,
.btn,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(181, 91, 45, .18);
    outline-offset: 2px;
}

button:not(:disabled):active,
.btn:not(:disabled):active {
    transform: translateY(1px);
}

/* Campos ganham foco mais elegante sem mudar sua geometria. */
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(177, 91, 47, .5);
    box-shadow: 0 0 0 3px rgba(177, 91, 47, .07);
}

/* Acessibilidade: respeita quem prefere menos animação. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media (max-width: 760px) {
    header .container {
        grid-template-columns: 58px minmax(0, 1fr);
        column-gap: 12px;
    }

    header .logo {
        width: 56px;
        max-width: 56px;
        max-height: 56px;
    }

    header h1 {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    header .container {
        grid-template-columns: 48px minmax(0, 1fr);
        column-gap: 10px;
    }

    header .logo {
        width: 46px;
        max-width: 46px;
        max-height: 46px;
    }

    header h1 {
        font-size: 1rem;
    }
}

/* ============================================================
   PedeAki — Personalização / Conversão Premium V9
   Somente apresentação. IDs e ações existentes foram preservados.
   ============================================================ */
.personalizar-secao.personalizar-conversao {
    position: relative;
    overflow: hidden;
    margin-top: 18px;
    padding: 0;
    background:
        radial-gradient(circle at 92% 4%, rgba(194, 111, 61, .10), transparent 30%),
        linear-gradient(180deg, #fffdf9 0%, #fffaf3 100%);
    border: 1px solid rgba(214, 191, 167, .92);
    border-radius: 24px;
    box-shadow: 0 16px 38px rgba(75, 45, 28, .075);
}

.personalizar-conversao .personalizar-chamada {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "eyebrow cta"
        "title cta"
        "text cta";
    align-items: center;
    column-gap: 26px;
    width: 100%;
    min-height: 148px;
    padding: 24px 30px;
    text-align: left;
    background: transparent;
    border: 0;
    color: var(--text);
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
}

.personalizar-conversao .personalizar-chamada::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 250px;
    height: 250px;
    right: 7%;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(176, 86, 42, .11), rgba(176, 86, 42, 0) 68%);
    pointer-events: none;
}

.personalizar-conversao .personalizar-chamada:hover {
    opacity: 1;
    background: rgba(255, 255, 255, .42);
}

.personalizar-chamada-eyebrow {
    grid-area: eyebrow;
    display: block;
    margin-bottom: 5px;
    color: #a45a35;
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.personalizar-chamada-titulo {
    grid-area: title;
    display: block;
    color: #472d21;
    font-size: clamp(1.35rem, 2.3vw, 2rem);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -.02em;
}

.personalizar-chamada-texto {
    grid-area: text;
    display: block;
    max-width: 760px;
    margin-top: 8px;
    color: #7a695d;
    font-size: .92rem;
    font-weight: 500;
    line-height: 1.55;
}

.personalizar-chamada-cta {
    grid-area: cta;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 210px;
    min-height: 48px;
    padding: 12px 20px;
    border-radius: 15px;
    background: linear-gradient(135deg, #a9532d 0%, #bf693d 100%);
    color: #fff;
    box-shadow: 0 9px 20px rgba(169, 83, 45, .20);
    font-size: .88rem;
    font-weight: 800;
    white-space: nowrap;
}

.personalizar-conversao .personalizar-conteudo {
    margin: 0;
    padding: 28px;
    border-top: 1px solid rgba(222, 204, 184, .82);
    background: rgba(255, 255, 255, .68);
}

.personalizar-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.personalizar-intro h3,
.personalizar-beneficios-topo h3 {
    margin: 4px 0 7px;
    color: #412b20;
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    line-height: 1.25;
}

.personalizar-intro p {
    max-width: 700px;
    margin: 0;
    color: #817064;
    font-size: .86rem;
    line-height: 1.55;
}

.personalizar-intro-kicker,
.personalizar-bloco-kicker {
    display: block;
    color: #ad623d;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.personalizar-intro-selos {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
    max-width: 410px;
}

.personalizar-intro-selos span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 7px 11px;
    border: 1px solid #eadbc9;
    border-radius: 999px;
    background: #fff;
    color: #705b4d;
    box-shadow: 0 4px 12px rgba(69, 43, 28, .045);
    font-size: .7rem;
    font-weight: 700;
}

.personalizar-conversao .personalizar-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
    align-items: start;
    gap: 22px;
    margin-bottom: 28px;
}

.personalizar-form-card,
.personalizar-conversao .personalizar-preview {
    border: 1px solid #eadccf;
    border-radius: 20px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 10px 28px rgba(72, 43, 25, .06);
}

.personalizar-form-card {
    display: block;
    padding: 22px;
}

.personalizar-bloco-topo {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 20px;
}

.personalizar-passo {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid #ead6c1;
    background: linear-gradient(145deg, #fffaf4, #fff3e8);
    color: #a45a35;
    font-size: .75rem;
    font-weight: 800;
}

.personalizar-bloco-topo h4,
.personalizar-preview-topo h4 {
    margin: 3px 0 3px;
    color: #3f2c22;
    font-size: 1.03rem;
    line-height: 1.25;
}

.personalizar-bloco-topo p {
    margin: 0;
    color: #8a786b;
    font-size: .73rem;
    line-height: 1.45;
}

.personalizar-campos-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px 14px;
}

.personalizar-campo {
    min-width: 0;
}

.personalizar-conversao .personalizar-form label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 6px;
    color: #533c30;
    font-size: .72rem;
    font-weight: 750;
}

.campo-essencial,
.campo-opcional {
    display: inline-flex;
    align-items: center;
    min-height: 19px;
    padding: 2px 6px;
    border-radius: 999px;
    font-size: .56rem;
    font-weight: 800;
    letter-spacing: .02em;
}

.campo-essencial {
    background: #fff0e7;
    color: #a4512d;
}

.campo-opcional {
    background: #f5f1ec;
    color: #8a7b70;
}

.personalizar-conversao .personalizar-form input:not([type="color"]):not([type="file"]) {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #e3d4c4;
    border-radius: 11px;
    background: #fffdfa;
    color: #4a352a;
    font-family: inherit;
    font-size: .82rem;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.personalizar-conversao .personalizar-form input:not([type="color"]):not([type="file"]):focus {
    border-color: #bd805e;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(176, 91, 48, .10);
}

.personalizar-divisor {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 22px 0 16px;
    color: #937c6e;
    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .11em;
}

.personalizar-divisor::before,
.personalizar-divisor::after {
    content: "";
    height: 1px;
    flex: 1;
    background: #eee3d7;
}

.personalizar-identidade-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 13px 14px;
}

.personalizar-campo-logo {
    grid-row: span 2;
}

.personalizar-upload {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 91px;
    padding: 13px;
    overflow: hidden;
    border: 1px dashed #d7b99f;
    border-radius: 13px;
    background: #fffaf4;
    cursor: pointer;
}

.personalizar-upload:hover {
    border-color: #b96d45;
    background: #fff7ef;
}

.personalizar-upload-icone {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 39px;
    height: 39px;
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(75, 44, 28, .07);
}

.personalizar-upload strong,
.personalizar-upload small {
    display: block;
}

.personalizar-upload strong {
    color: #543b2d;
    font-size: .78rem;
}

.personalizar-upload small {
    margin-top: 3px;
    color: #938176;
    font-size: .64rem;
    line-height: 1.35;
}

.personalizar-upload input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.personalizar-cor-campo {
    align-self: end;
}

.personalizar-cor-linha {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 7px 9px;
    border: 1px solid #e3d4c4;
    border-radius: 11px;
    background: #fffdfa;
}

.personalizar-conversao .personalizar-form input[type="color"] {
    flex: 0 0 auto;
    width: 42px;
    height: 30px;
    padding: 2px;
    border: 0;
    border-radius: 8px;
    background: transparent;
}

.personalizar-cor-linha span {
    color: #8b786c;
    font-size: .65rem;
    line-height: 1.35;
}

.personalizar-acoes {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 10px;
    margin-top: 20px;
}

.personalizar-conversao .personalizar-form button {
    min-height: 48px;
    margin: 0;
    border-radius: 13px;
    padding: 11px 14px;
    font-size: .78rem;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.personalizar-conversao .personalizar-form button:hover {
    transform: translateY(-1px);
}

.personalizar-conversao .personalizar-form .btn-ver-previa {
    border: 1px solid #d9bca7;
    background: #fffaf5;
    color: #8f4a2b;
    box-shadow: none;
}

.personalizar-conversao .personalizar-form .btn-ver-previa:hover {
    background: #fff3e9;
}

.personalizar-conversao .btn-interesse-personalizado {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #a8532d, #be673a);
    box-shadow: 0 8px 18px rgba(169, 83, 45, .18);
}

.personalizar-acao-nota {
    margin: 9px 0 0;
    color: #99877a;
    font-size: .61rem;
    text-align: center;
    line-height: 1.4;
}

.personalizar-msg-envio {
    margin: 8px 0 0 !important;
    padding: 0;
    color: #2f794d;
    font-size: .7rem;
    text-align: center;
}

.personalizar-conversao .personalizar-preview {
    position: sticky;
    top: 92px;
    display: block;
    min-height: 100%;
    padding: 18px;
    background:
        radial-gradient(circle at 90% 8%, rgba(173, 94, 50, .11), transparent 30%),
        #f8f1e8;
}

.personalizar-preview-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

.preview-ao-vivo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 9px;
    border: 1px solid #cee6d6;
    border-radius: 999px;
    background: #f4fbf6;
    color: #397253;
    font-size: .62rem;
    font-weight: 800;
    white-space: nowrap;
}

.preview-ao-vivo i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #38b66b;
    box-shadow: 0 0 0 4px rgba(56, 182, 107, .11);
}

.preview-browser {
    overflow: hidden;
    border: 1px solid #ded4ca;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 15px 28px rgba(65, 39, 24, .11);
}

.preview-browser-barra {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 34px;
    padding: 7px 10px;
    border-bottom: 1px solid #ece4dc;
    background: #faf8f5;
}

.preview-browser-barra > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d9c8b9;
}

.preview-browser-barra > div {
    flex: 1;
    margin-left: 5px;
    padding: 4px 8px;
    border-radius: 7px;
    background: #fff;
    color: #a49285;
    font-size: .54rem;
    text-align: center;
}

.personalizar-conversao .preview-mini-cardapio {
    position: relative;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 30px 24px 24px;
    border: 0;
    border-top: 4px solid var(--cor-preview);
    border-radius: 0;
    box-shadow: none;
    background:
        radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--cor-preview) 8%, transparent), transparent 34%),
        #fff;
}

.preview-mini-etiqueta {
    position: absolute;
    top: 13px;
    left: 14px;
    padding: 4px 7px;
    border-radius: 999px;
    background: #f7f1eb;
    color: #947b6c;
    font-size: .53rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.personalizar-conversao .preview-mini-cardapio img {
    max-width: 84px;
    max-height: 84px;
    object-fit: contain;
    border-radius: 16px;
    margin-bottom: 12px;
    filter: drop-shadow(0 5px 8px rgba(60, 38, 25, .08));
}

.personalizar-conversao .preview-mini-cardapio h3 {
    max-width: 290px;
    margin: 0 0 5px;
    color: var(--cor-preview);
    font-size: 1.25rem;
    line-height: 1.2;
}

.personalizar-conversao .preview-mini-cardapio p {
    max-width: 270px;
    color: #8b796c;
    font-size: .72rem;
    line-height: 1.45;
}

.preview-mini-produtos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
    width: min(100%, 260px);
    margin-top: 16px;
}

.preview-mini-produtos span {
    height: 54px;
    border: 1px solid #eee3d9;
    border-radius: 10px;
    background: linear-gradient(145deg, #fff8f1, #f2e6da);
}

.personalizar-conversao .preview-botao-exemplo {
    width: min(100%, 260px);
    margin-top: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--cor-preview);
    box-shadow: 0 6px 14px color-mix(in srgb, var(--cor-preview) 20%, transparent);
    color: #fff;
    font-size: .72rem;
}

.personalizar-conversao .preview-legenda {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin: 13px 0 0;
}

.personalizar-conversao .preview-legenda span {
    padding: 5px 8px;
    border: 1px solid #e5d8cc;
    border-radius: 999px;
    background: rgba(255,255,255,.78);
    color: #7f6b5e;
    font-size: .57rem;
    font-weight: 700;
}

.personalizar-preview-nota {
    max-width: 390px;
    margin: 11px auto 0;
    color: #907d70;
    font-size: .63rem;
    line-height: 1.45;
    text-align: center;
}

.personalizar-beneficios-topo {
    max-width: 820px;
    margin: 0 auto 16px;
    text-align: center;
}

.personalizar-beneficios-topo h3 {
    margin-top: 6px;
}

.personalizar-conversao .personalizar-beneficios {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
}

.personalizar-conversao .personalizar-beneficios li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: 96px;
    padding: 14px;
    border: 1px solid #eaded2;
    border-radius: 15px;
    background: #fff;
    color: #564034;
    box-shadow: 0 5px 15px rgba(70, 42, 26, .04);
}

.beneficio-icone {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #fff4e9;
    font-size: .88rem;
}

.personalizar-beneficios li strong,
.personalizar-beneficios li span:not(.beneficio-icone) {
    display: block;
}

.personalizar-beneficios li strong {
    color: #4a3327;
    font-size: .73rem;
    line-height: 1.25;
}

.personalizar-beneficios li span:not(.beneficio-icone) {
    margin-top: 4px;
    color: #8c796d;
    font-size: .62rem;
    line-height: 1.42;
}

@media (max-width: 1040px) {
    .personalizar-conversao .personalizar-grid {
        grid-template-columns: minmax(0, 1fr) minmax(300px, .78fr);
    }

    .personalizar-conversao .personalizar-beneficios {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .personalizar-conversao .personalizar-chamada {
        grid-template-columns: 1fr;
        grid-template-areas: "eyebrow" "title" "text" "cta";
        row-gap: 3px;
        padding: 22px;
    }

    .personalizar-chamada-cta {
        width: fit-content;
        min-width: 0;
        margin-top: 13px;
    }

    .personalizar-conversao .personalizar-conteudo {
        padding: 22px;
    }

    .personalizar-intro {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .personalizar-intro-selos {
        justify-content: flex-start;
        max-width: none;
    }

    .personalizar-conversao .personalizar-grid {
        grid-template-columns: 1fr;
    }

    .personalizar-conversao .personalizar-preview {
        position: relative;
        top: auto;
    }
}

@media (max-width: 620px) {
    .personalizar-secao.personalizar-conversao {
        border-radius: 18px;
    }

    .personalizar-conversao .personalizar-chamada {
        min-height: 0;
        padding: 19px 17px;
    }

    .personalizar-chamada-titulo {
        font-size: 1.22rem;
    }

    .personalizar-chamada-texto {
        font-size: .78rem;
    }

    .personalizar-chamada-cta {
        min-height: 44px;
        font-size: .78rem;
    }

    .personalizar-conversao .personalizar-conteudo {
        padding: 15px;
    }

    .personalizar-intro-selos span {
        font-size: .62rem;
    }

    .personalizar-form-card,
    .personalizar-conversao .personalizar-preview {
        padding: 16px;
        border-radius: 16px;
    }

    .personalizar-campos-grid,
    .personalizar-identidade-grid,
    .personalizar-acoes,
    .personalizar-conversao .personalizar-beneficios {
        grid-template-columns: 1fr;
    }

    .personalizar-campo-logo {
        grid-row: auto;
    }

    .personalizar-conversao .preview-mini-cardapio {
        min-height: 300px;
        padding-inline: 16px;
    }

    .personalizar-conversao .personalizar-beneficios li {
        min-height: 0;
    }
}


/* ============================================================
   PEDEAKI — PRÉVIA COM DUAS CORES DE MARCA V11
   Mantém o espaço do formulário e evita misturar a identidade
   demonstrada com as cores reais da loja que está servindo de exemplo.
   ============================================================ */
.personalizar-cores-linha {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    min-height: 44px;
}

.personalizar-cor-opcao {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0;
    min-height: 44px;
    margin: 0 !important;
    padding: 6px 8px;
    border: 1px solid #e3d4c4;
    border-radius: 11px;
    background: #fffdfa;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.personalizar-cor-opcao:hover,
.personalizar-cor-opcao:focus-within {
    border-color: #bd805e;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(176, 91, 48, .08);
}

.personalizar-conversao .personalizar-form .personalizar-cor-opcao input[type="color"] {
    flex: 0 0 auto;
    width: 34px;
    height: 30px;
    padding: 2px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
}

.personalizar-cor-opcao > span {
    display: block;
    min-width: 0;
    line-height: 1.15;
}

.personalizar-cor-opcao strong,
.personalizar-cor-opcao small {
    display: block;
}

.personalizar-cor-opcao strong {
    color: #543b2d;
    font-size: .65rem;
    font-weight: 800;
    white-space: nowrap;
}

.personalizar-cor-opcao small {
    margin-top: 2px;
    color: #9a887d;
    font-size: .53rem;
    font-weight: 600;
    white-space: nowrap;
}

/* A mini prévia passa a mostrar as duas cores escolhidas. */
.personalizar-conversao .preview-mini-cardapio {
    --cor-preview-accent: #c9974c;
}

.personalizar-conversao .preview-mini-etiqueta {
    border: 1px solid color-mix(in srgb, var(--cor-preview-accent) 34%, #eee3d9);
    color: color-mix(in srgb, var(--cor-preview) 72%, #57483f);
}

.personalizar-conversao .preview-mini-produtos span:nth-child(1) {
    background: linear-gradient(145deg, color-mix(in srgb, var(--cor-preview) 10%, #fff), #fff);
}
.personalizar-conversao .preview-mini-produtos span:nth-child(2) {
    background: linear-gradient(145deg, color-mix(in srgb, var(--cor-preview-accent) 16%, #fff), #fff);
}
.personalizar-conversao .preview-mini-produtos span:nth-child(3) {
    background: linear-gradient(145deg, color-mix(in srgb, var(--cor-preview) 8%, #fff), color-mix(in srgb, var(--cor-preview-accent) 10%, #fff));
}

.personalizar-conversao .preview-botao-exemplo {
    background: linear-gradient(135deg, var(--cor-preview), color-mix(in srgb, var(--cor-preview) 68%, var(--cor-preview-accent)));
}

/* Durante a demonstração completa, as áreas Premium que tinham tons fixos da
   loja de exemplo passam a obedecer a identidade escolhida pelo futuro cliente. */
body.modo-demo-personalizado #produtos-destaque .produto-item .adicionar-carrinho,
body.modo-demo-personalizado .carrossel-cta,
body.modo-demo-personalizado #carrinho.checkout-premium .opcao-btn.selecionado {
    border-color: var(--primary) !important;
    background: linear-gradient(145deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 22%, transparent) !important;
}

body.modo-demo-personalizado #produtos-destaque .produto-item .adicionar-carrinho:hover,
body.modo-demo-personalizado .carrossel-cta:hover {
    background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 90%, #fff) 0%, var(--primary-dark) 100%) !important;
}

body.modo-demo-personalizado #carrinho.checkout-premium .opcao-btn.selecionado::after {
    color: var(--primary) !important;
}

body.modo-demo-personalizado .checkout-premium-resumo::before {
    background: linear-gradient(90deg, var(--primary-dark), var(--accent), var(--primary-dark)) !important;
}

body.modo-demo-personalizado #carrinho.checkout-premium .carrinho-total p.total-final {
    border-color: color-mix(in srgb, var(--accent) 44%, #dfc3a8) !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, #fff), #fffdf9) !important;
}

body.modo-demo-personalizado #carrinho.checkout-premium .carrinho-total p.total-final strong,
body.modo-demo-personalizado .carrossel-preco {
    color: var(--primary) !important;
}

body.modo-demo-personalizado .checkout-premium-cabecalho::before,
body.modo-demo-personalizado .checkout-resumo-icone {
    border-color: color-mix(in srgb, var(--accent) 42%, #ead4bb) !important;
    background: color-mix(in srgb, var(--accent) 9%, #fff) !important;
}

@media (max-width: 430px) {
    .personalizar-cor-opcao {
        gap: 6px !important;
        padding-left: 6px;
        padding-right: 6px;
    }
    .personalizar-cor-opcao strong { font-size: .61rem; }
    .personalizar-cor-opcao small { font-size: .49rem; }
}

/* ============================================================
   MEUS PEDIDOS — RESUMO FINANCEIRO PREMIUM DE ENCOMENDA
   Apenas apresentação: não altera regras, valores ou pagamento.
   ============================================================ */
.item-meus-pedidos-financeiro {
    margin-top: 10px;
    padding: 11px;
    border: 1px solid rgba(160, 82, 45, 0.18);
    border-radius: 13px;
    background: linear-gradient(180deg, rgba(160, 82, 45, 0.055), rgba(201, 151, 76, 0.035));
}

.item-meus-pedidos-financeiro-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 9px;
    font-size: 0.76em;
    color: var(--muted);
}

.item-meus-pedidos-financeiro-topo strong {
    color: #2f7d4a;
    font-size: 0.98em;
    text-align: right;
}

.item-meus-pedidos-financeiro-valores {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.item-meus-pedidos-financeiro-valor {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
}

.item-meus-pedidos-financeiro-valor span,
.item-meus-pedidos-financeiro-total span {
    display: block;
    margin-bottom: 2px;
    color: var(--muted);
    font-size: 0.72em;
}

.item-meus-pedidos-financeiro-valor strong {
    display: block;
    color: var(--text);
    font-size: 0.95em;
}

.item-meus-pedidos-financeiro-total {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}

.item-meus-pedidos-financeiro-total span {
    margin: 0;
}

.item-meus-pedidos-financeiro-total strong {
    color: var(--primary);
    font-size: 0.98em;
}

.item-meus-pedidos-financeiro.pagamento-completo {
    border-color: rgba(47, 125, 74, 0.24);
    background: linear-gradient(180deg, rgba(47, 125, 74, 0.07), rgba(47, 125, 74, 0.025));
}

.btn-pagar-restante-lista {
    margin-top: 10px;
    border-radius: 12px;
    padding: 10px 12px;
    box-shadow: 0 6px 16px rgba(160, 82, 45, 0.14);
}

@media (max-width: 380px) {
    .item-meus-pedidos-financeiro-topo {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .item-meus-pedidos-financeiro-topo strong {
        text-align: left;
    }
}

/* ============================================================
   CHECKOUT — MOMENTOS DO CARRINHO + RESUMO DE ENCOMENDA V1
   ============================================================ */
#resumoEncomendaCheckout {
    margin: 14px 18px 16px;
    padding: 15px 17px;
    border: 1px solid rgba(166, 90, 50, .16);
    border-radius: 15px;
    background: linear-gradient(145deg, #fffaf4, #fffdf9);
    box-shadow: 0 6px 18px rgba(76, 48, 31, .055);
}

#resumoEncomendaCheckout .dica-encomenda {
    margin: 0;
    color: #614a3b;
    font-size: .82rem;
    line-height: 1.62;
}

.checkout-grupo-itens-titulo {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 12px 0 3px;
    padding: 8px 9px;
    border-radius: 10px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .01em;
}

.checkout-grupo-itens-titulo:first-child { margin-top: 0; }

.checkout-grupo-itens-titulo--agora {
    color: #2f6948;
    background: #edf8f1;
    border: 1px solid rgba(48, 133, 84, .14);
}

.checkout-grupo-itens-titulo--encomenda {
    color: #825326;
    background: #fff5e6;
    border: 1px solid rgba(183, 119, 40, .15);
}

@media (max-width: 680px) {
    #resumoEncomendaCheckout {
        margin: 12px 12px 14px;
        padding: 13px 14px;
    }
}



/* ============================================================
   BRIT'S — ENCOMENDAS ACCORDION PREMIUM V2
   Apenas apresentação/posição. Regras de encomenda preservadas.
   ============================================================ */
.encomendas-premium {
    grid-column: 1 / -1;
    width: 100%;
    margin: 18px 0 20px;
    scroll-margin-top: 92px;
    border: 1px solid rgba(215, 190, 162, .88);
    border-radius: 22px;
    background: radial-gradient(circle at 94% 12%, rgba(221, 174, 113, .11), transparent 26%), linear-gradient(145deg, #fffdf9 0%, #fffaf3 100%);
    box-shadow: 0 16px 38px rgba(73, 43, 25, .085);
    overflow: hidden;
}
.encomendas-premium-toggle {
    width: 100%; min-height: 104px; padding: 19px 22px; display: flex; align-items: center;
    justify-content: space-between; gap: 20px; border: 0; background: transparent; color: inherit;
    font-family: inherit; text-align: left; cursor: pointer;
}
.encomendas-premium-toggle:hover { background: rgba(166, 91, 50, .035); }
.encomendas-premium-identidade { min-width: 0; display: flex; align-items: center; gap: 15px; }
.encomendas-premium-icone {
    width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center;
    border: 1px solid rgba(192, 137, 88, .28); border-radius: 17px;
    background: linear-gradient(145deg, #fff7ec, #f5e4d2);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 7px 18px rgba(113, 65, 38, .08); font-size: 24px;
}
.encomendas-premium-titulos { min-width: 0; display: flex; flex-direction: column; }
.encomendas-premium-kicker { margin-bottom: 4px; color: #ad663c; font-size: .66rem; font-weight: 850; letter-spacing: .13em; }
.encomendas-premium-titulos strong {
    color: #4d3020; font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.15rem, 1.55vw, 1.42rem); line-height: 1.14; letter-spacing: -.015em;
}
.encomendas-premium-titulos small { margin-top: 6px; max-width: 720px; color: #7a695d; font-size: .79rem; line-height: 1.42; }
.encomendas-premium-direita {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
}

.encomendas-premium-contagem {
    padding: 7px 11px;
    border: 1px solid rgba(204, 170, 136, .72);
    border-radius: 999px;
    background: rgba(255,255,255,.78);
    color: #76513b;
    font-size: .68rem;
    font-weight: 750;
    white-space: nowrap;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.encomendas-premium-cta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}

.encomendas-premium-dica {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #9b6a49;
    font-size: .57rem;
    font-weight: 850;
    letter-spacing: .105em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.encomendas-premium-dica::before {
    content: '';
    width: 18px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(181, 93, 50, .72));
}

.encomendas-premium-dica-aberta { display: none; }
.encomendas-premium.aberta .encomendas-premium-dica-fechada { display: none; }
.encomendas-premium.aberta .encomendas-premium-dica-aberta { display: inline-flex; }

.encomendas-premium-acao {
    min-width: 158px;
    min-height: 38px;
    padding: 9px 15px 9px 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    border: 1px solid rgba(116, 50, 25, .18);
    border-radius: 999px;
    background: linear-gradient(145deg, #b95f34 0%, #93431f 58%, #7f371b 100%);
    color: #fff;
    text-align: center;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .01em;
    white-space: nowrap;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.24),
        0 9px 21px rgba(125, 55, 27, .19);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.encomendas-premium-acao::after {
    content: '';
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    margin-top: -4px;
    border: solid rgba(255,255,255,.96);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: transform .22s ease, margin .22s ease;
}

.encomendas-premium.aberta .encomendas-premium-acao::after {
    margin-top: 4px;
    transform: rotate(225deg);
}

@media (hover:hover) and (pointer:fine) {
    .encomendas-premium-toggle:hover .encomendas-premium-acao {
        transform: translateY(-1px);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.26),
            0 12px 25px rgba(125, 55, 27, .23);
        filter: saturate(1.03);
    }
}
.encomendas-premium-conteudo {
    padding: 0 22px 23px; border-top: 1px solid rgba(228, 211, 193, .82); animation: encomendasPremiumAbrir .2s ease;
}
.encomendas-premium-conteudo[hidden] { display: none !important; }
@keyframes encomendasPremiumAbrir { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.encomendas-premium .encomenda-layout { margin: 22px 0 0; }
.encomendas-premium .categoria-grid.encomenda-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 310px)); justify-content: start;
    align-items: stretch; gap: 22px; margin: 0;
}
.encomendas-premium .produto-item {
    width: 100% !important; max-width: 310px; min-width: 0; padding: 0 0 14px;
    border: 1px solid rgba(224, 208, 188, .9); border-radius: 20px;
    background: linear-gradient(180deg, #fff 0%, #fff 76%, #fffdf9 100%);
    box-shadow: 0 10px 26px rgba(66, 39, 24, .09); overflow: hidden; text-align: left;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.encomendas-premium .produto-imagem-wrap { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #f7f0e6; border-bottom: 1px solid rgba(226, 212, 194, .8); }
.encomendas-premium .produto-item img, .encomendas-premium .produto-imagem-atual {
    display: block; width: 100%; height: 100% !important; max-width: none; margin: 0; object-fit: cover;
}
.encomendas-premium .produto-item h3 { margin: 12px 13px 5px; min-height: 2.45em; color: #5a3825; font-size: .93rem; line-height: 1.22; }
.encomendas-premium .produto-item .descricao { min-height: 3.7em; margin: 0 13px 8px; color: #7a675a; font-size: .76rem; line-height: 1.4; }
.encomendas-premium .produto-item .preco { margin: 0 13px 8px; color: #9a4d29; font-size: 1.04rem; }
.encomendas-premium .produto-item .adicionar-carrinho {
    width: calc(100% - 26px); min-height: 41px; margin-left: 13px; margin-right: 13px; border-radius: 11px;
    background: linear-gradient(145deg, #b55d32, #914320); box-shadow: 0 7px 16px rgba(145, 67, 32, .13); font-size: .79rem;
}
@media (hover:hover) and (pointer:fine) {
    .encomendas-premium .produto-item:hover { transform: translateY(-4px); border-color: rgba(171, 91, 46, .28); box-shadow: 0 15px 32px rgba(66, 39, 24, .13); }
}
@media (max-width: 980px) {
    .encomendas-premium-toggle { min-height: 92px; padding: 17px 18px; }
    .encomendas-premium-direita { gap: 7px; }
    .encomendas-premium .categoria-grid.encomenda-grid { grid-template-columns: repeat(auto-fill, minmax(245px, 295px)); gap: 18px; }
}
@media (max-width: 760px) {
    .encomendas-premium-toggle { align-items: flex-start; }
    .encomendas-premium-direita { justify-content: flex-end; gap: 10px; }
    .encomendas-premium-acao { min-width: 138px; }
    .encomendas-premium .categoria-grid.encomenda-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; gap: 13px; }
    .encomendas-premium .produto-item { max-width: none; }
}
@media (max-width: 560px) {
    .encomendas-premium { margin-top: 14px; border-radius: 18px; scroll-margin-top: 84px; }
    .encomendas-premium-toggle { min-height: 0; padding: 14px; gap: 11px; }
    .encomendas-premium-identidade { align-items: flex-start; gap: 10px; }
    .encomendas-premium-icone { width: 42px; height: 42px; flex-basis: 42px; border-radius: 13px; font-size: 20px; }
    .encomendas-premium-kicker { font-size: .55rem; }
    .encomendas-premium-titulos strong { font-size: 1rem; }
    .encomendas-premium-titulos small { font-size: .69rem; }
    .encomendas-premium-direita {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
    }
    .encomendas-premium-contagem,
    .encomendas-premium-dica { display: none !important; }
    .encomendas-premium-cta { display: block; }
    .encomendas-premium-acao {
        min-width: 0;
        min-height: 34px;
        padding: 8px 11px 8px 13px;
        gap: 8px;
        font-size: .62rem;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.22),
            0 7px 16px rgba(125, 55, 27, .16);
    }
    .encomendas-premium-acao::after {
        width: 7px;
        height: 7px;
        flex-basis: 7px;
    }
    .encomendas-premium-conteudo { padding: 0 14px 16px; }
    .encomendas-premium .encomenda-layout { margin-top: 15px; }
    .encomendas-premium .categoria-grid.encomenda-grid { grid-template-columns: 1fr; width: 100%; max-width: 420px; margin-left: auto; margin-right: auto; gap: 15px; }
    .encomendas-premium .produto-item { width: 100% !important; max-width: 420px; }
    .encomendas-premium .produto-imagem-wrap { aspect-ratio: 16 / 10; }
}


/* ============================================================
   BRIT'S — ACCORDION ENCOMENDAS PREMIUM V2.2
   Equilíbrio automático por quantidade de produtos.
   1–2 itens: conjunto compacto e centralizado.
   3+ itens: aproveita naturalmente a largura disponível.
   ============================================================ */
@media (min-width: 981px) {
    .encomendas-premium.encomendas-qtd-1 .encomenda-layout {
        grid-template-columns: minmax(320px, 360px) minmax(280px, 310px);
        width: min(100%, 760px);
        max-width: 760px;
        margin: 22px auto 0;
        justify-content: center;
    }

    .encomendas-premium.encomendas-qtd-1 .categoria-grid.encomenda-grid {
        grid-template-columns: minmax(280px, 310px);
        width: 310px;
        max-width: 310px;
        justify-content: start;
    }

    .encomendas-premium.encomendas-qtd-2 .encomenda-layout {
        grid-template-columns: minmax(320px, 360px) minmax(0, 642px);
        width: min(100%, 1024px);
        max-width: 1024px;
        margin: 22px auto 0;
        justify-content: center;
    }

    .encomendas-premium.encomendas-qtd-2 .categoria-grid.encomenda-grid {
        grid-template-columns: repeat(2, minmax(260px, 310px));
        width: min(100%, 642px);
        max-width: 642px;
        justify-content: start;
    }

    .encomendas-premium.encomendas-qtd-muitos .encomenda-layout {
        width: 100%;
        max-width: none;
        margin: 22px 0 0;
    }
}


/* ============================================================
   BRIT'S — ACCORDION ENCOMENDAS PREMIUM V2.3
   Agenda horizontal no topo + produtos centralizados abaixo.
   Somente apresentação.
   ============================================================ */

@media (min-width: 981px) {
    /* O agendamento vira uma régua horizontal fina em toda a largura. */
    .encomendas-premium .encomenda-layout,
    .encomendas-premium.encomendas-qtd-1 .encomenda-layout,
    .encomendas-premium.encomendas-qtd-2 .encomenda-layout,
    .encomendas-premium.encomendas-qtd-muitos .encomenda-layout {
        display: block;
        width: 100%;
        max-width: none;
        margin: 20px 0 0;
    }

    .encomendas-premium .encomenda-intro {
        width: 100%;
        margin: 0;
    }

    .encomendas-premium .encomenda-agendamento-faixa {
        display: grid;
        grid-template-columns: minmax(360px, .92fr) minmax(520px, 1.08fr);
        align-items: center;
        gap: 24px;
        width: 100%;
        min-height: 0;
        padding: 13px 16px;
        border-radius: 16px;
    }

    .encomendas-premium .encomenda-agendamento-info {
        align-items: center;
        gap: 12px;
    }

    .encomendas-premium .encomenda-agendamento-icone {
        width: 44px;
        height: 44px;
        min-width: 44px;
        border-radius: 13px;
        font-size: 20px;
    }

    .encomendas-premium .encomenda-agendamento-kicker {
        margin-bottom: 2px;
        font-size: 10px;
    }

    .encomendas-premium .encomenda-agendamento-titulo {
        font-size: 15px;
        line-height: 1.18;
    }

    .encomendas-premium .encomenda-agendamento-descricao {
        max-width: 560px;
        margin-top: 3px;
        font-size: 11px;
        line-height: 1.32;
    }

    .encomendas-premium .encomenda-agendamento-controles {
        min-width: 0;
    }

    .encomendas-premium .encomenda-agendamento-campos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .encomendas-premium .encomenda-campo-label {
        font-size: 10px !important;
    }

    .encomendas-premium .encomenda-campo-label > span {
        margin-bottom: 4px;
    }

    .encomendas-premium .encomenda-campo-label input {
        min-height: 39px;
        padding: 8px 10px;
        border-radius: 10px;
        font-size: 11px;
    }

    .encomendas-premium .encomenda-disponibilidade-msg {
        min-height: 0;
        margin: 6px 0 0;
        padding: 6px 9px;
        border-radius: 9px;
        font-size: 10px;
        line-height: 1.25;
    }

    /* Produtos ficam abaixo da régua e se equilibram pelo centro. */
    .encomendas-premium .categoria-grid.encomenda-grid,
    .encomendas-premium.encomendas-qtd-1 .categoria-grid.encomenda-grid,
    .encomendas-premium.encomendas-qtd-2 .categoria-grid.encomenda-grid,
    .encomendas-premium.encomendas-qtd-muitos .categoria-grid.encomenda-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 310px));
        justify-content: center;
        align-items: stretch;
        width: 100%;
        max-width: none;
        margin: 22px auto 0;
        gap: 22px;
    }

    .encomendas-premium.encomendas-qtd-1 .categoria-grid.encomenda-grid {
        grid-template-columns: minmax(280px, 310px);
    }

    .encomendas-premium.encomendas-qtd-2 .categoria-grid.encomenda-grid {
        grid-template-columns: repeat(2, minmax(260px, 310px));
    }
}

/* Notebook menor: continua horizontal, mas com proporções mais flexíveis. */
@media (min-width: 981px) and (max-width: 1180px) {
    .encomendas-premium .encomenda-agendamento-faixa {
        grid-template-columns: minmax(310px, .82fr) minmax(460px, 1.18fr);
        gap: 18px;
    }
}


/* BRIT'S — Checkout Premium: clareza do pagamento (apenas camada visual, R1) */
#carrinho .checkout-pagamento-claro[hidden], .brits-confirmacao-premium[hidden] { display: none !important; }
#carrinho .checkout-pagamento-claro {
    display: flex; align-items: flex-start; gap: 12px; margin: 14px 0 13px;
    padding: 15px 14px; border: 1px solid #ead9c6; border-radius: 16px;
    background: linear-gradient(135deg, #fffaf5 0%, #fff3e9 100%);
    box-shadow: 0 7px 21px rgba(101,60,35,.055);
}
#carrinho .checkout-pagamento-claro-icone {
    display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px;
    border-radius: 12px; background: #fff; border: 1px solid #f0dfd1; font-size: 18px;
}
#carrinho .checkout-pagamento-claro-corpo { min-width: 0; }
#carrinho .checkout-pagamento-claro-kicker {
    display: block; color: #9b5b37; font-size: .63rem; font-weight: 850;
    text-transform: uppercase; letter-spacing: .085em; line-height: 1.4; margin: 0 0 4px;
}
#carrinho .checkout-pagamento-claro strong { display:block; color:#4d3022; font-size: .88rem; line-height:1.3; }
#carrinho .checkout-pagamento-claro p { margin: 7px 0 6px; font-size: .75rem; line-height:1.5; color:#665345; }
#carrinho .checkout-pagamento-claro small { display:block; color:#946c55; font-size: .69rem; line-height:1.42; }
#carrinho .finalizar-compra { min-height: 47px; white-space: normal; line-height: 1.35; }
.brits-confirmacao-premium {
    position: fixed; inset: 0; z-index: 22000; display: grid; place-items: center;
    padding: 22px 14px; overflow-y: auto; background: rgba(29,21,16,.66);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.brits-confirmacao-premium-card {
    width: min(100%, 450px); max-height: calc(100dvh - 44px); overflow-y: auto;
    padding: 27px 25px 23px; border: 1px solid rgba(234,212,187,.98);
    border-radius: 25px; background: linear-gradient(160deg, #fff 0%, #fffaf5 76%, #fdf0e5 100%);
    box-shadow: 0 25px 75px rgba(22,12,6,.26); text-align: center;
}
.brits-confirmacao-premium-marca {color:#8e4a2b; font-size:.64rem;letter-spacing:.13em;font-weight:900;}
.brits-confirmacao-premium-marca span {color:#ae8c76;font-weight:650;}
.brits-confirmacao-premium-selo {
    display:grid; place-items:center; width:64px;height:64px;margin:23px auto 12px;
    border-radius:22px; background:linear-gradient(150deg,#ecf8eb,#d8efd9); color:#2f7e47;
    font-size:1.7rem;font-weight:850;box-shadow:0 8px 19px rgba(54,125,65,.1);
}
.brits-confirmacao-premium-etiqueta {color:#9c643e;font-size:.66rem;font-weight:850;letter-spacing:.09em;}
.brits-confirmacao-premium h2 {color:#4d3022;font-size:clamp(1.22rem,4vw,1.53rem);line-height:1.18;margin:8px 0 9px;}
.brits-confirmacao-premium-card>p {color:#745c4a;font-size:.86rem;line-height:1.58;margin:0 auto 20px;}
.brits-confirmacao-premium-etapas {display:grid;gap:8px;text-align:left;margin-bottom:19px;}
.brits-confirmacao-premium-etapas>div {
    display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid #eadccf;
    border-radius:13px;background:rgba(255,255,255,.79);
}
.brits-confirmacao-premium-etapas>div>span {
    display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;
    border-radius:10px;background:#fff2e7;color:#a25532;font-size:.68rem;font-weight:900;
}
.brits-confirmacao-premium-etapas p {margin:0;min-width:0;}
.brits-confirmacao-premium-etapas strong {display:block;color:#51392a;font-size:.79rem;line-height:1.35;}
.brits-confirmacao-premium-etapas small {display:block;color:#88705e;font-size:.7rem;line-height:1.35;margin-top:2px;}
.brits-confirmacao-premium-fechar {
    display:block;width:100%;min-height:47px;border:none;border-radius:13px;
    background:linear-gradient(125deg,#b86638,#914222);color:white;
    font-size:.82rem;font-weight:850;line-height:1.3;padding:13px;
    box-shadow:0 9px 20px rgba(144,67,34,.18);cursor:pointer;
}
.brits-confirmacao-premium-fechar:focus-visible {outline:3px solid #6eab8b;outline-offset:3px;}
.brits-confirmacao-premium-nota {display:block;margin-top:12px;font-size:.68rem;color:#927c6b;line-height:1.45;}
@media (max-width:520px) {
    #carrinho .checkout-pagamento-claro { padding:12px;gap:9px; }
    #carrinho .checkout-pagamento-claro-icone {flex-basis:34px;width:34px;height:34px;}
    .brits-confirmacao-premium {padding:12px;}
    .brits-confirmacao-premium-card {padding:22px 17px 19px;border-radius:20px;max-height:calc(100dvh - 24px);}
}
@media (prefers-reduced-motion:reduce) {.brits-confirmacao-premium *,#carrinho .checkout-pagamento-claro {transition:none!important;animation:none!important;}}

/* BRIT’S / R1 — Carrinho: botão “Remover” visível; somente apresentação. */
#carrinho.checkout-premium .btn-remover-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 68px;
    min-height: 40px;
    padding: 8px 6px;
    border: 0;
    background: transparent;
    color: #925033;
    font-size: .77rem;
    font-weight: 750;
    line-height: 1.25;
    white-space: nowrap;
    text-decoration: underline;
    text-underline-offset: 3px;
    opacity: 1;
    filter: none;
    cursor: pointer;
}
#carrinho.checkout-premium .btn-remover-item:hover {
    color: #74371e;
    opacity: 1;
    filter: none;
}
#carrinho.checkout-premium .btn-remover-item:focus-visible {
    outline: 2px solid #a0522d;
    outline-offset: 2px;
    border-radius: 5px;
}