/* Tema Torra (premium, 4a onda): torrefacao de cafes especiais contada como uma historia - cafe torrado, creme e laranja
   queimado, DM Serif Display nos titulos e Outfit no texto. Topo da familia "linha": logotipo, menu e icones numa linha so.
   Origem, torra e xicara em imagem e texto alternando os lados com numeros grandes, planos de assinatura, guia de moagem e
   rodape com o cartao de visita da torrefacao. Carregado depois do CSS do Vitrine e do premium.css. */

.tema-torra { --tr-cafe: var(--titulos, #2a1a12); --tr-laranja: var(--loja, #b5562b); --tr-creme: #f6efe6; --tr-creme2: #efe6da; --tr-fio: #e2d5c4; --tr-sub: #8a705d; }
body.tema-torra { background: var(--tr-creme); }

/* ---------- topo em uma linha */
.tr-topo .vt-aviso { font-size: 12px; font-weight: 600; letter-spacing: .06em; }
.tr-topo .vt-marca img { width: auto; height: var(--logo-altura, 46px); max-width: 220px; border: 0; border-radius: 0; background: none; object-fit: contain; }
.tr-nav { display: flex; gap: 4px; margin: 0 auto; }
.tr-nav a { padding: 8px 14px; border-radius: 999px; color: #e9dccb !important; font-size: 14.5px; font-weight: 500; text-decoration: none !important; white-space: nowrap; }
.tr-nav a:hover { background: rgba(243, 233, 220, .1); color: #fff !important; }
.tr-nav a.vt-ofertas { color: #f0a477 !important; }
body.vitrine .tr-topo .vt-busca input { height: 40px; border: 1px solid rgba(243, 233, 220, .18); border-radius: 999px; background: rgba(243, 233, 220, .06); color: #f3e9dc; }
body.vitrine .tr-topo .vt-busca input::placeholder { color: #a9917c; }
body.vitrine .tr-topo .vt-busca button { background: transparent !important; color: #f3e9dc !important; }
.tr-topo .vt-sacola .counter { background: var(--tr-laranja); }
@media (min-width: 992px) {
	.tr-topo .vt-barra .container { min-height: 78px; gap: 18px; }
	body.vitrine .tr-topo .vt-busca { flex: 0 1 200px; margin: 0; }
	.tr-topo .vt-menu { display: none; }
}

/* ---------- abertura e capitulos (imagem e texto alternando) */
body.vitrine.tema-torra .hdl-hero { border-radius: 0; }
body.vitrine.tema-torra .hdl-b-banner-texto:first-child .container { width: 100%; max-width: none; padding: 0; }
body.vitrine.tema-torra .hdl-b-banner-texto:first-child .hdl-hero { padding-left: max(32px, calc((100vw - 1240px) / 2 + 15px)); background-color: #1e130d; }
body.vitrine.tema-torra .hdl-hero h2 { font-size: clamp(46px, 6vw, 92px); font-weight: 400; line-height: .95; color: #fff7ee !important; text-shadow: 0 2px 30px rgba(0, 0, 0, .35); }
body.vitrine.tema-torra .hdl-hero p { color: #f0e3d3 !important; font-size: 18px; }
body.vitrine.tema-torra .hdl-hero a, body.vitrine.tema-torra .hdl-it a { border-radius: 999px !important; background: var(--tr-laranja) !important; color: #fff !important; }
.tema-torra .hdl-b-imagem-texto .hdl-it { gap: 70px; align-items: center; }
body.vitrine.tema-torra .hdl-it-img, body.vitrine.tema-torra .hdl-it-img img { border-radius: 50% !important; }
.tema-torra .hdl-it-img { position: relative; }
.tema-torra .hdl-it-img::after { content: ""; position: absolute; inset: -14px; border: 1px dashed var(--tr-laranja); border-radius: 50%; pointer-events: none; }
.tema-torra .hdl-it-chamada { font-family: var(--fonte-titulos), serif; font-size: 22px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--tr-laranja); }
body.vitrine.tema-torra .hdl-it h2 { font-size: clamp(34px, 4vw, 52px); font-weight: 400; line-height: 1.05; }
.tema-torra .hdl-it-txt p { font-size: 17px; line-height: 1.75; color: #5a4334; }

/* ---------- titulos de secao */
.tema-torra .vt-secao-cab h2 { font-size: 40px; font-weight: 400 !important; color: var(--tr-cafe); }
.tema-torra .vt-secao-cab a { color: var(--tr-laranja) !important; font-weight: 600; }

/* ---------- cartao: saco de cafe com a origem em destaque */
.tema-torra .vt-card { border: 1px solid var(--tr-fio); border-radius: 18px; background: #fffaf3; box-shadow: none !important; overflow: hidden; }
.tema-torra .vt-card:hover { border-color: var(--tr-laranja); }
.tema-torra .vt-card-img { background: var(--tr-creme2); border-radius: 0; }
.tema-torra .vt-card-info { padding: 14px 16px 6px; }
.tema-torra .ppc-marca { color: var(--tr-laranja); font-size: 11.5px; font-weight: 700; letter-spacing: .1em; }
.tema-torra .vt-card-nome { font-family: var(--fonte-titulos), serif; font-size: 19px; font-weight: 400; color: var(--tr-cafe); }
.tema-torra .vt-card-preco strong { font-size: 18px; font-weight: 700; color: var(--tr-cafe); }
.tema-torra .vt-card-botao { margin: 6px 16px 16px; border-radius: 999px; background: var(--tr-cafe); color: #f3e9dc; font-weight: 600; }
.tema-torra .vt-card:hover .vt-card-botao { background: var(--tr-laranja); }
.tema-torra .ppc .ppc-ver { display: none; }
.tema-torra .vt-selo { border-radius: 999px; background: var(--tr-laranja); }

/* ---------- planos de assinatura (bloco Destaques) */
.tr-planos { display: grid; justify-items: center; gap: 34px; padding: 64px 40px; border-radius: 28px; color: #f3e9dc; text-align: center; background: radial-gradient(circle at 20% 0, rgba(181, 86, 43, .35), transparent 55%), #2a1a12; }
.tr-planos-cab small { color: #f0a477; font-size: 12.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
body.vitrine .tr-planos-cab h2 { max-width: 640px; margin: 10px auto 8px; font-family: var(--fonte-titulos), serif; font-size: 46px; font-weight: 400; line-height: 1.05; color: #fff7ee; }
.tr-planos-cab p { margin: 0; color: #c9b8a6; }
.tr-planos-grade { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 18px; width: 100%; max-width: 940px; }
.tr-plano { position: relative; display: grid; gap: 6px; padding: 30px 22px; border: 1px solid rgba(243, 233, 220, .16); border-radius: 20px; color: inherit !important; text-decoration: none !important; transition: transform .25s, border-color .25s; }
.tr-plano:hover { transform: translateY(-4px); border-color: #f0a477; }
.tr-plano small { color: #c9b8a6; font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.tr-plano b { font-family: var(--fonte-titulos), serif; font-size: 40px; font-weight: 400; color: #fff7ee; }
.tr-plano span { color: #c9b8a6; font-size: 14.5px; }
.tr-plano-top { background: var(--tr-laranja); border-color: var(--tr-laranja); }
.tr-plano-top small, .tr-plano-top span { color: #ffe6d4; }
.tr-plano em { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); padding: 4px 12px; border-radius: 999px; background: #fff7ee; color: var(--tr-laranja); font-size: 11.5px; font-style: normal; font-weight: 800; white-space: nowrap; }
.tr-planos-link { color: #f3e9dc !important; font-weight: 600; text-decoration: underline !important; text-underline-offset: 5px; }
@media (max-width: 767px) { .tr-planos { padding: 46px 18px; } .tr-planos-grade { grid-auto-flow: row; } body.vitrine .tr-planos-cab h2 { font-size: 32px; } }

/* ---------- guia de moagem */
.tema-torra .hdl-med { padding: 34px; border-radius: 22px; background: #fffaf3; border: 1px solid var(--tr-fio); }
.tema-torra .hdl-med-tab th { background: var(--tr-cafe); color: #f3e9dc; }
.tema-torra .hdl-med-tab td:first-child { font-weight: 700; color: var(--tr-cafe); }

/* ---------- carrinho: a xicara enchendo */
.tr-frete { display: flex; align-items: center; gap: 18px; padding: 14px 20px; border-radius: 18px; background: #fffaf3; border: 1px solid var(--tr-fio); }
.tr-frete p { margin: 0; color: var(--tr-cafe); }
.tr-xicara { position: relative; flex: none; width: 40px; height: 32px; margin: 12px 12px 0 0; border: 3px solid var(--tr-cafe); border-top: 0; border-radius: 0 0 14px 14px; }
.tr-xicara::after { content: ""; position: absolute; right: -13px; top: 5px; width: 10px; height: 13px; border: 3px solid var(--tr-cafe); border-left: 0; border-radius: 0 8px 8px 0; }
.tr-xicara i { position: absolute; left: 0; right: 0; bottom: 0; border-radius: 0 0 10px 10px; background: #6b3a1f; transition: height .6s; }
.tr-xicara b { position: absolute; left: 10px; top: -16px; width: 14px; height: 12px; border-left: 2px solid var(--tr-sub); border-right: 2px solid var(--tr-sub); border-radius: 50%; opacity: 0; transition: opacity .4s; }
.tr-frete-ok .tr-xicara b { opacity: 1; }

/* ---------- rodape: cartao de visita da torrefacao */
.tr-visita { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 30px; align-items: center; padding-top: 56px; padding-bottom: 26px; }
.tr-visita-cartao { padding: 32px 34px; border-radius: 20px; background: #2a1a12; border: 1px solid rgba(243, 233, 220, .1); }
.tr-visita-cartao small { color: #f0a477; font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.tr-visita-cartao p { margin: 8px 0 16px; font-family: var(--fonte-titulos), serif; font-size: 30px; line-height: 1.1; color: #fff7ee; }
.tr-visita-cartao ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; color: #c9b8a6; font-size: 14.5px; }
.tr-visita-cartao i { color: #f0a477; }
.tr-visita-cartao a { color: #f3e9dc !important; }
.tr-selos { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.tr-selos li { padding: 12px 16px; border: 1px dashed rgba(243, 233, 220, .22); border-radius: 999px; color: #e9dccb; font-size: 14px; text-align: center; }
.tr-rodape .vt-rodape-grade h3 { font-family: var(--fonte-titulos), serif; font-size: 20px; font-weight: 400; text-transform: none; letter-spacing: 0; color: #fff7ee; }
@media (max-width: 767px) { .tr-visita { grid-template-columns: 1fr; } .tema-torra .hdl-b-imagem-texto .hdl-it { gap: 34px; } }
