/* Vitrine da Eva (estilo Stories). Mobile-first; no computador fica centralizada como um celular. */
:root{--vinho:#6d1f33;--vinho2:#3d0f1c;--tinta:#1d1418;--suave:#7b6a70;--creme:#faf6f2;--linha:#efe6de;--ouro:#f3dfab;--navy:#0e1629}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:Inter,system-ui,sans-serif;color:var(--tinta);background:#efe7df;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.app{max-width:480px;margin:0 auto;background:#fff;min-height:100vh;position:relative;padding-bottom:110px;box-shadow:0 0 60px rgba(29,20,24,.12)}

/* capa */
.capa{position:relative;height:min(78vw,380px);overflow:hidden;background:radial-gradient(circle at 50% 35%,#8e2b44,var(--vinho2))}
.capa img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.capa .mono{position:absolute;inset:0;display:grid;place-items:start center;padding-top:28px;font-family:Fraunces,serif;font-size:120px;color:rgba(243,223,171,.85)}
.capa:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(20,8,12,.88))}
.capa .txt{position:absolute;left:18px;right:18px;bottom:18px;color:#fff;z-index:2}
.capa .quem{display:flex;align-items:center;gap:8px;font-size:13px;opacity:.92}
.capa .quem .ia{font-size:10.5px;font-weight:700;border:1px solid rgba(255,255,255,.5);border-radius:999px;padding:2px 8px}
.capa h1{font-family:Fraunces,serif;font-weight:700;font-size:32px;line-height:1.02;margin:8px 0 0}
.redes{display:flex;gap:8px;margin-top:12px}
.redes a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);color:#fff}
.redes svg{width:18px;height:18px}

/* filtros */
.chips{display:flex;gap:8px;padding:16px 16px 4px;overflow-x:auto;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips button{flex:0 0 auto;font:600 13px Inter,sans-serif;padding:9px 15px;border-radius:999px;border:0;background:#f3eee9;color:#4a3a40;cursor:pointer;min-height:40px}
.chips button[aria-pressed="true"]{background:var(--tinta);color:#fff}
.chips button:focus-visible{outline:3px solid var(--ouro);outline-offset:2px}

h2.sec{margin:18px 16px 10px;font-size:16px;display:flex;justify-content:space-between;align-items:baseline}
h2.sec small{font-size:12px;color:var(--suave);font-weight:500}

/* carrossel */
.carrossel{display:flex;gap:12px;overflow-x:auto;padding:0 16px 6px;scroll-snap-type:x mandatory;scrollbar-width:none}
.carrossel::-webkit-scrollbar{display:none}
.card{flex:0 0 78%;max-width:300px;scroll-snap-align:start;border-radius:22px;background:var(--creme);overflow:hidden;border:1px solid var(--linha);display:flex;flex-direction:column}
.card[hidden]{display:none}
.foto{height:200px;position:relative;display:grid;place-items:center;overflow:hidden}
.foto.vinho{background:radial-gradient(circle at 50% 40%,#8e2b44,var(--vinho2))}
.foto.navy{background:var(--navy)}
.foto.navy img{width:100%;height:100%;object-fit:cover;opacity:.85}
.foto.creme{background:radial-gradient(circle at 50% 40%,#fff6ea,#ead8c4)}
.foto .estrela{font-family:Fraunces,serif;font-size:72px;color:var(--vinho)}
.capas{position:relative;width:190px;height:150px}
.capas img{position:absolute;width:84px;border-radius:3px 7px 7px 3px;box-shadow:0 12px 22px rgba(0,0,0,.45)}
.capas img:nth-child(1){left:0;top:18px;transform:rotate(-9deg)}
.capas img:nth-child(2){right:0;top:18px;transform:rotate(9deg)}
.capas img:nth-child(3){left:50px;top:4px;width:90px;z-index:2}
.badge{position:absolute;left:12px;top:12px;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:#fff;color:var(--tinta);padding:5px 9px;border-radius:999px;z-index:2}
.info{padding:14px 15px 15px;display:flex;flex-direction:column;flex:1}
.info h3{font-size:16px;margin:0}
.info p{font-size:13px;color:var(--suave);margin:5px 0 0;line-height:1.4;flex:1}
.linha{display:flex;align-items:center;justify-content:space-between;margin-top:14px;gap:10px}
.preco s{font-size:12px;color:var(--suave);display:block}
.preco strong{font-size:19px}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--tinta);color:#fff;font-weight:700;font-size:13px;padding:11px 15px;border-radius:999px;min-height:44px;white-space:nowrap;border:0;cursor:pointer;font-family:inherit}
.btn.ouro{background:var(--ouro);color:var(--vinho2)}
.btn:focus-visible{outline:3px solid var(--ouro);outline-offset:2px}

/* sobre e contato */
.bloco{margin:22px 16px 0;border-radius:22px;padding:18px;background:var(--creme);border:1px solid var(--linha)}
.bloco h3{margin:0 0 6px;font-family:Fraunces,serif;font-size:21px}
.bloco p{margin:0;font-size:14px;color:#5f4f55;line-height:1.5}
.contato{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.contato code{font:600 14px Inter,sans-serif;background:#fff;border:1px solid var(--linha);padding:10px 12px;border-radius:12px}
.ok{font-size:12px;color:#2f7a4a;font-weight:700;min-height:16px}
.rodape{text-align:center;color:var(--suave);font-size:12px;margin:24px 0 0}
.rodape a{text-decoration:underline}

/* botão fixo */
.cta{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;width:calc(100% - 32px);max-width:448px;background:var(--vinho);color:#fff;border-radius:18px;padding:12px 12px 12px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 14px 30px rgba(109,31,51,.4);z-index:10}
.cta b{font-size:14px;display:block}.cta span{font-size:12px;opacity:.85}
.cta .btn{background:#fff;color:var(--vinho)}
.foto-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.foto.navy.foto-img img{opacity:1}
.preco small{font-size:12px;color:var(--suave);display:block}