/* Enfeites dos fundos (js/enfeites.js) e a ilustração no lugar da foto que falta (js/ilustra.js) */
.deco { position: relative; overflow: hidden; }
.deco > .caixa, .deco > p, .deco > img { position: relative; z-index: 1; }
.enfeites { position: absolute; inset: 0; z-index: 0; pointer-events: none; }

/* bolinhas bem fracas no bege e listrinha de bala no vinho */
.deco-creme { background-image: radial-gradient(rgba(110, 20, 35, .055) 1.6px, transparent 1.8px); background-size: 26px 26px; }
.bolo-sec.deco-creme { background-image: radial-gradient(rgba(110, 20, 35, .055) 1.6px, transparent 1.8px), linear-gradient(180deg, var(--creme) 0%, var(--creme2) 100%); background-size: 26px 26px, auto; }
.onde-sec.deco-creme { background-color: var(--creme2); }
.deco-vinho { background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .035) 0 14px, transparent 14px 34px); }

/* desenhos de confeitaria (traço) */
.rabisco { position: absolute; height: auto; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transform: rotate(var(--gira)); animation: flutua 7s ease-in-out infinite; }
.deco-creme .rabisco { opacity: .32; } .deco-creme .rabisco.c0 { color: var(--vinho); } .deco-creme .rabisco.c1 { color: var(--laranja); opacity: .42; } .deco-creme .rabisco.c2 { color: #e0708a; opacity: .45; } .deco-creme .rabisco.c3 { color: #3fa77a; opacity: .38; }
.deco-vinho .rabisco { opacity: .4; } .deco-vinho .rabisco.c0, .deco-vinho .rabisco.c3 { color: var(--ouro); } .deco-vinho .rabisco.c1 { color: #fbf3e6; opacity: .3; } .deco-vinho .rabisco.c2 { color: #f39bb0; }
.deco-choco .rabisco { opacity: .32; } .deco-choco .rabisco.c0, .deco-choco .rabisco.c3 { color: var(--ouro); } .deco-choco .rabisco.c1 { color: var(--laranja); } .deco-choco .rabisco.c2 { color: #f39bb0; }
@keyframes flutua { 0%, 100% { transform: rotate(var(--gira)) translateY(0); } 50% { transform: rotate(calc(var(--gira) + 6deg)) translateY(-8px); } }

/* granulado e confete */
.granulado, .confete { position: absolute; display: block; border-radius: 99px; }
.granulado { width: 15px; height: 5px; }
.confete { width: 8px; height: 8px; }
.deco-creme .granulado, .deco-creme .confete { opacity: .85; }
.deco-creme .granulado[style*="#ffffff"], .deco-creme .confete[style*="#ffffff"] { background: var(--vinho) !important; opacity: .25; }
.deco-vinho .granulado, .deco-vinho .confete, .deco-choco .granulado, .deco-choco .confete { opacity: .55; }

/* calda escorrendo no topo do vinho */
.calda { position: absolute; left: 0; right: 0; top: -1px; height: 54px; z-index: 0; pointer-events: none; }
.calda svg { width: 100%; height: 100%; display: block; }
.festa-sec.deco { padding-top: 96px; }

/* bandeirinhas na loja */
.bandeiras { position: absolute; left: 0; right: 0; top: 0; height: 64px; z-index: 0; pointer-events: none; }
.bandeiras svg { width: 100%; height: 100%; display: block; }
.loja-sec.deco { padding-top: 104px; }

@media (prefers-reduced-motion: reduce) { .rabisco { animation: none; } }

/* foto que ainda falta: ilustração na cor do sabor + "sua foto aqui" */
.foto-falta { position: relative; min-height: 120px; height: 100%; display: grid; place-items: center; overflow: hidden;
  background: radial-gradient(rgba(110, 20, 35, .07) 1.4px, transparent 1.6px) 0 0 / 16px 16px, linear-gradient(160deg, #fff7ec, var(--tom, #fde7d6)); }
.foto-falta svg { width: 78%; max-width: 150px; height: auto; filter: drop-shadow(0 4px 6px rgba(43, 26, 23, .08)); }
.foto-falta span { position: absolute; left: 6px; bottom: 6px; background: rgba(255, 255, 255, .92); color: var(--suave); font-size: 10.5px; font-weight: 700; padding: 3px 8px; border-radius: 99px; box-shadow: 0 1px 4px rgba(0, 0, 0, .08); white-space: nowrap; }
@media (min-width: 960px) { .foto-falta { aspect-ratio: 4 / 3; min-height: 0; height: auto; } .foto-falta svg { width: 46%; } .foto-falta span { font-size: 12px; left: 10px; bottom: 10px; } }
@media (max-width: 959px) { .foto-falta span { font-size: 9.5px; padding: 2px 6px; left: 4px; right: 4px; bottom: 5px; text-align: center; } }

/* botão do iFood no topo (pedido rápido; festa e pedido grande vão pela encomenda do site) */
.btn-ifood { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; padding: 10px 14px; background: #ea1d2c; color: #fff; text-decoration: none; font-weight: 600; font-size: 14px; line-height: 1; white-space: nowrap; box-shadow: 0 2px 8px rgba(234, 29, 44, .3); transition: transform .15s, background .2s; }
.btn-ifood b { font-weight: 800; letter-spacing: -.02em; font-size: 15px; }
.btn-ifood:hover { background: #c8141f; transform: translateY(-1px); }
.btn-ifood .mais { display: none; }
@media (min-width: 640px) { .btn-ifood .mais { display: inline; } }

/* vitrine: carrossel dos bolos mais bonitos, antes do "Monte o bolo" */
.vitrine-sec { padding: 60px 0 34px; }
.vitrine-sec .caixa { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0 20px; }
.vitrine-sec .caixa .kicker { flex-basis: 100%; }
.vitrine-sec h2 { margin-bottom: 18px; flex: 1; }
.vt-setas { display: none; gap: 8px; margin: 0 0 22px auto; }
.vt-setas button { width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--linha); background: #fff; color: var(--vinho); font-size: 26px; line-height: 1; display: grid; place-items: center; box-shadow: 0 3px 10px rgba(43, 26, 23, .08); }
.vt-setas button:hover { border-color: var(--vinho); }
.vt-trilho { position: relative; z-index: 1; display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 6px max(16px, calc((100vw - 1180px) / 2)) 18px; scroll-padding: 0 max(16px, calc((100vw - 1180px) / 2)); }
.vt-trilho::-webkit-scrollbar { display: none; }
.vt-card { flex: 0 0 min(74vw, 290px); margin: 0; scroll-snap-align: start; background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 8px 24px rgba(43, 26, 23, .12); display: flex; flex-direction: column; }
.vt-card img { width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: cover; display: block; transition: transform .5s; }
.vt-card:hover img { transform: scale(1.04); }
.vt-card figcaption { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 2px; }
.vt-card b { font: 800 18px/1.15 var(--serif); }
.vt-card small { color: var(--suave); font-size: 13px; }
.vt-card .btn { align-self: flex-start; margin-top: 8px; padding: 8px 14px; font-size: 14px; }
@media (min-width: 960px) { .vt-setas { display: flex; } .vt-card { flex-basis: 268px; } }

/* 12 anos, acima do carrossel */
.vitrine-sec .anos { display: grid; grid-template-columns: auto 1fr; gap: 18px 26px; align-items: center; background: #fff; border-radius: 26px; padding: 22px 22px 22px 18px; box-shadow: 0 10px 30px rgba(43, 26, 23, .08); margin-bottom: 44px; border: 1px solid rgba(110, 20, 35, .08); }
.anos-num { position: relative; width: 112px; height: 112px; border-radius: 50%; background: var(--vinho); color: #fff; display: grid; place-items: center; align-content: center; box-shadow: 0 0 0 6px #fbeee0, 0 0 0 8px var(--laranja); flex: none; }
.anos-num b { font: 800 54px/0.9 var(--serif); }
.anos-num span { font: 700 13px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--ouro); margin-top: 2px; }
.anos-frase { margin: 0; font: 800 23px/1.2 var(--serif); color: var(--texto); }
.anos-frase em { color: var(--laranja); font-style: italic; }
.anos-sub { margin: 8px 0 0; font-size: 14.5px; color: var(--suave); line-height: 1.5; }
.anos-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.anos-chips span { background: var(--creme); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 600; color: var(--texto); }
@media (max-width: 639px) { .vitrine-sec .anos { grid-template-columns: 1fr; text-align: center; justify-items: center; padding: 26px 18px; } .anos-chips { justify-content: center; } }
@media (min-width: 960px) { .anos-num { width: 150px; height: 150px; } .anos-num b { font-size: 74px; } .anos-frase { font-size: 32px; } .anos-sub { font-size: 16.5px; max-width: 760px; } .vitrine-sec .anos { padding: 30px 36px; gap: 36px; } }

/* "Como chegar" no topo (Google Maps ou Waze) */
.chegar { position: relative; }
.chegar summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 10px 12px; background: #fff; color: var(--vinho); font-weight: 700; font-size: 14px; cursor: pointer; box-shadow: 0 2px 8px rgba(43, 26, 23, .18); white-space: nowrap; }
.chegar summary::-webkit-details-marker { display: none; }
.chegar summary svg { width: 18px; height: 18px; fill: currentColor; }
.chegar .mais { display: none; }
.chegar[open] summary { background: var(--vinho); color: #fff; }
.chegar-menu { position: absolute; right: -84px; top: calc(100% + 10px); z-index: 60; width: 250px; background: #fff; color: var(--texto); border-radius: 18px; padding: 12px; box-shadow: 0 14px 40px rgba(43, 26, 23, .25); }
.chegar-menu p { margin: 0 4px 8px; font-size: 12.5px; color: var(--suave); }
.chegar-menu a { display: flex; align-items: center; gap: 10px; padding: 11px 10px; border-radius: 12px; text-decoration: none; color: var(--texto); font-weight: 700; font-size: 15px; }
.chegar-menu a:hover { background: var(--creme); }
.chegar-menu b { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; font-size: 15px; flex: none; }
.ic-maps { background: #1a73e8; } .ic-waze { background: #33ccff; color: #0b2a3a !important; }
@media (min-width: 640px) { .chegar .mais { display: inline; } .chegar-menu { right: 0; } }