/* Secção «Loja» da página inicial (logo a seguir ao hero). Só é carregada quando a loja está aberta. */
.lj-home { background:#FAF9F6; position:relative; padding:76px 0 60px; overflow:hidden; }
.lj-home::before { content:''; position:absolute; inset:0 0 auto 0; height:1px; background:linear-gradient(90deg, transparent, rgba(197,160,67,.55), transparent); }
.lj-head { text-align:center; max-width:620px; margin:0 auto 34px; }
.lj-head h2 { font-size:clamp(28px, 3.6vw, 42px); margin:10px 0 12px; letter-spacing:-.01em; line-height:1.12; }
.lj-head p { color:#4d4d4d; font-size:16px; line-height:1.7; }

.lj-card, .lj-trust { max-width:900px; margin-left:auto; margin-right:auto; }
.lj-card { display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr); background:#fff; border:1px solid rgba(197,160,67,.28); border-radius:8px; overflow:hidden; box-shadow:0 28px 64px rgba(60,48,20,.12); }
.lj-media { position:relative; min-width:0; min-height:300px; background:#efece3; overflow:hidden; }
.lj-foto { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 58%; opacity:0; transform:scale(1.03); transition:opacity .9s ease, transform 6s ease; }
.lj-foto.on { opacity:1; transform:scale(1); }
.lj-ph { position:absolute; inset:0; display:grid; place-items:center; font-family:'Playfair Display', serif; font-size:44px; color:#8a6c1e; background:linear-gradient(160deg, #f4f1e8, #e6e0cf); }
.lj-novo { position:absolute; top:16px; left:16px; z-index:3; padding:6px 14px; border-radius:999px; background:#1a1a1a; color:#fff; font:600 11px 'Outfit', sans-serif; letter-spacing:.22em; text-transform:uppercase; }

.lj-info { padding:24px 26px 24px; display:flex; flex-direction:column; justify-content:center; min-width:0; }
.lj-tipo { font:600 11px 'Outfit', sans-serif; letter-spacing:.2em; text-transform:uppercase; color:#8a6c1e; margin:0 0 4px; }
.lj-info h3 { font-family:'Playfair Display', serif; font-weight:600; font-size:clamp(32px, 3.2vw, 42px); line-height:1.05; letter-spacing:-.01em; margin:0 0 12px; color:#1a1a1a; }
.lj-cores { display:flex; gap:2px; margin:0 0 2px -5px; }
.lj-sw { width:44px; height:44px; border-radius:50%; border:5px solid transparent; background:var(--c) var(--tex, none) center / cover; background-clip:padding-box; box-shadow:inset 0 0 0 1px rgba(0,0,0,.18); cursor:pointer; outline:1.5px solid transparent; transition:.2s; padding:0; position:relative; }
.lj-sw:hover { transform:translateY(-2px); } .lj-sw.on { outline-color:#c5a043; transform:scale(1.1); }
.lj-sw:focus-visible { outline:2px dashed #1a1a1a; outline-offset:3px; }
.lj-cor-nome { font:400 13px 'Outfit', sans-serif; color:#7a766d; margin:0 0 10px; min-height:20px; }
.lj-resumo { font:300 14.5px/1.65 'Outfit', sans-serif; color:#3d3d3d; margin:0 0 14px; padding-bottom:14px; border-bottom:1px solid #ece6d6; }

.lj-compra { margin-bottom:14px; }
.lj-precos { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.lj-precos b { font:400 clamp(32px, 3vw, 40px) 'Playfair Display', serif; color:#1a1a1a; line-height:1; letter-spacing:-.01em; }
.lj-ant { font:400 17px 'Playfair Display', serif; color:#9a958a; text-decoration:line-through; text-decoration-thickness:1.5px; }
.lj-pct { font:700 11px 'Outfit', sans-serif; font-style:normal; color:#fff; background:#a8321e; padding:3px 9px; border-radius:999px; }
.lj-linha { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; }
.lj-linha small { font:300 13px 'Outfit', sans-serif; color:#7a766d; }
.lj-gratis { display:inline-flex; align-items:center; gap:7px; padding:6px 12px 6px 9px; border-radius:999px; background:#1d6b43; color:#fff; font:700 11px 'Outfit', sans-serif; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.lj-gratis svg { width:17px; height:17px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.lj-promo { margin:10px 0 0; padding:2px 0 2px 10px; border-left:2px solid #c5a043; font:300 12px/1.55 'Outfit', sans-serif; color:#4d4d4d; } .lj-promo b { color:#1a1a1a; font-weight:600; }

.lj-btns { display:flex; gap:6px 14px; flex-wrap:wrap; align-items:center; }
.lj-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 20px; border-radius:999px; text-decoration:none; font:600 14px 'Outfit', sans-serif; transition:.25s; }
.lj-btn-p { background:#c5a043; color:#fff; box-shadow:0 8px 20px rgba(197,160,67,.34); } .lj-btn-p:hover { background:#b3913c; transform:translateY(-1px); }
.lj-btn-p svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s; } .lj-btn-p:hover svg { transform:translateX(3px); }
.lj-btn-s { background:transparent; color:#1a1a1a; padding:0 4px; text-decoration:underline; text-decoration-color:#cfc7b2; text-underline-offset:5px; } .lj-btn-s:hover { color:#8a6c1e; text-decoration-color:#c5a043; }
.lj-btn:focus-visible { outline:3px solid #1a1a1a; outline-offset:3px; }

.lj-trust { list-style:none; display:grid; grid-template-columns:repeat(4, 1fr); margin-top:22px; border-top:1px solid #e8e3d6; border-bottom:1px solid #e8e3d6; padding:0; }
.lj-trust li { padding:13px 10px; text-align:center; font:500 13px 'Outfit', sans-serif; color:#4d4d4d; border-right:1px solid #e8e3d6; } .lj-trust li:last-child { border-right:0; }
.lj-trust li::before { content:'✓'; color:#c5a043; font-weight:700; margin-right:7px; }

@media (max-width:860px) {
 .lj-home { padding:56px 0 44px; } .lj-head { margin-bottom:26px; }
 .lj-card { grid-template-columns:1fr; } .lj-media { min-height:0; aspect-ratio:4/3; } .lj-foto { object-position:50% 50%; }
 .lj-info { padding:22px 20px 24px; }
 .lj-trust { grid-template-columns:1fr 1fr; } .lj-trust li:nth-child(2) { border-right:0; } .lj-trust li:nth-child(-n+2) { border-bottom:1px solid #e8e3d6; }
}
@media (max-width:480px) { .lj-btns .lj-btn { width:100%; } .lj-trust li { font-size:12.5px; padding:12px 6px; } }
@media (prefers-reduced-motion:reduce) { .lj-foto { transition:none; transform:none; } }

/* a mesa inteira, sem cortes (a foto fica «contida»; os lados enchem com a própria foto desfocada) e card mais pequeno */
.lj-foto { object-fit:initial; object-position:initial; width:auto; height:auto; transform:none; transition:opacity .9s ease; display:block; }
.lj-foto.on { transform:none; }
.lj-foto img { position:absolute; inset:0; width:100%; height:100%; }
.lj-foto .lj-bg { object-fit:cover; filter:blur(26px) saturate(1.15) brightness(.97); transform:scale(1.25); }
.lj-foto .lj-fg { object-fit:contain; }
.lj-home { padding:68px 0 52px; } .lj-head { margin-bottom:26px; }
.lj-card, .lj-trust { max-width:880px; }
.lj-card { grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); }
.lj-media { min-height:300px; }
.lj-info { padding:22px 24px 22px; } .lj-info h3 { font-size:clamp(30px, 3vw, 38px); margin-bottom:10px; }
.lj-resumo { font-size:14px; line-height:1.6; margin-bottom:12px; padding-bottom:12px; }
.lj-btn { min-height:44px; padding:0 18px; font-size:13.5px; }
@media (max-width:860px) { .lj-card { grid-template-columns:1fr; } .lj-media { aspect-ratio:4/3; min-height:0; } }

/* card compacto: a coluna de informação não passa da altura da foto, e a mesa vê-se inteira */
.lj-card, .lj-trust { max-width:920px; }
.lj-card { grid-template-columns:minmax(0, 1.55fr) minmax(0, 1fr); }
.lj-sel { position:absolute; left:16px; bottom:16px; z-index:3; padding:7px 14px; border-radius:999px; background:rgba(255,255,255,.94); font:500 13px 'Outfit', sans-serif; color:#1a1a1a; box-shadow:0 6px 18px rgba(0,0,0,.18); }
.lj-info { padding:22px 22px 20px; } .lj-info h3 { margin-bottom:10px; }
.lj-cores { margin-bottom:12px; }
.lj-resumo { font-size:13.5px; line-height:1.55; margin-bottom:12px; padding-bottom:12px; }
.lj-compra { margin-bottom:12px; } .lj-linha { margin-top:8px; }
.lj-promo-fora { max-width:920px; margin:14px auto 0; text-align:center; font:300 12.5px/1.6 'Outfit', sans-serif; color:#4d4d4d; } .lj-promo-fora b { color:#1a1a1a; font-weight:600; }
.lj-trust { margin-top:14px; }

.lj-sw { flex:none; } .lj-cores { flex-wrap:wrap; }
@media (max-width:860px) { .lj-card { grid-template-columns:1fr; } .lj-media { aspect-ratio:4/3; min-height:0; } .lj-info { padding:20px 20px 22px; } .lj-sel { left:12px; bottom:12px; font-size:12px; } }

/* foto a encher o espaço, sem margens nem desfoque: o espaço tem a proporção exata da foto (4:3), por isso a mesa vê-se inteira */
.lj-foto .lj-fg { object-fit:cover; }
.lj-card, .lj-trust { max-width:1000px; }
.lj-card { grid-template-columns:minmax(0, 1.45fr) minmax(0, 1fr); align-items:stretch; }
.lj-media { aspect-ratio:4/3; min-height:0; align-self:start; }
.lj-info { padding:18px 22px; justify-content:center; }
.lj-resumo { font-size:13px; margin-bottom:10px; padding-bottom:10px; }
@media (max-width:860px) { .lj-card { grid-template-columns:1fr; } .lj-media { align-self:auto; } }

/* sem palavras isoladas no fim das linhas: títulos e frases curtas equilibradas; parágrafos sem «viúvas» */
.lj-head { max-width:720px; } .lj-head h2, .lj-head p, .lj-info h3, .lj-resumo, .lj-promo-fora, .lj-trust li { text-wrap:balance; }
.lj-resumo { text-wrap:pretty; }

.lj-lanc { margin:10px 0 0; font:300 13px/1.5 'Outfit', sans-serif; color:#4d4d4d; } .lj-lanc-tag { display:inline-block; margin-right:6px; padding:2px 9px; border-radius:999px; background:#1a1a1a; color:#fff; font:700 10px 'Outfit', sans-serif; letter-spacing:.12em; text-transform:uppercase; }

.lj-depois { font:400 clamp(20px, 2vw, 26px) 'Playfair Display', serif; color:#8c877b; white-space:nowrap; } .lj-depois i { font:600 11px 'Outfit', sans-serif; font-style:normal; letter-spacing:.14em; text-transform:uppercase; margin-right:4px; }

.lj-ref { font:400 clamp(18px, 1.8vw, 23px) 'Playfair Display', serif; color:#8c877b; white-space:nowrap; } .lj-ref i { font:600 10px 'Outfit', sans-serif; font-style:normal; letter-spacing:.12em; text-transform:uppercase; margin-right:5px; }

/* valor de referência compacto na linha do preço */
.lj-precos { flex-wrap:nowrap; gap:14px; } .lj-precos b { flex:none; }
.lj-refgrupo { display:inline-flex; align-items:center; gap:10px; flex:none; padding-left:14px; border-left:1px solid #e3ddcc; }
.lj-refval { display:flex; flex-direction:column; line-height:1.15; }
.lj-refval i { font:600 9px 'Outfit', sans-serif; font-style:normal; letter-spacing:.12em; text-transform:uppercase; color:#8a867b; }
.lj-refval b { font:400 clamp(17px, 1.6vw, 21px) 'Playfair Display', serif; color:#8c877b; margin-top:1px; }
.lj-refgrupo .lj-pct { font-size:11px; padding:4px 9px; }
@media (max-width:480px) { .lj-precos { flex-wrap:wrap; row-gap:8px; } }
.lj-refgrupo { display:inline-grid; grid-template-columns:auto auto; column-gap:9px; row-gap:1px; align-items:center; justify-content:start; } .lj-refval { display:contents; } .lj-refval i { grid-column:1 / -1; } .lj-refval b { grid-column:1; margin-top:0; } .lj-refgrupo .lj-pct { grid-column:2; justify-self:start; }

/* móvel: a caixa da foto não pode depender só de aspect-ratio (o Safari do iPhone deixava-a a zero); altura garantida por padding 4:3 */
@media (max-width:860px) { .lj-media { align-self:start; width:100%; height:0; min-height:0; padding-bottom:75%; aspect-ratio:auto; } }
.lj-desm { margin:10px 0 0; font-size:13px; line-height:1.5; color:#5d584c; }
.lj-sw [hidden] { display:none !important; }