/* ==========================================================================
   Sousènsi — página de produto (inc/produto.php, js/produto.js)
   No topo, a compra: foto, nome, promessa, preço, versões, botão e garantias. Abaixo, as seções
   sd-produto-* na ordem do briefing. Títulos na tipografia global do Elementor (H1 a H6);
   rótulo e frase de apoio são os componentes de base.css (sd-eyebrow, sd-section__lead).
   ========================================================================== */

/* -------------------------------------------------------------- compra (coluna ao lado da foto) */

body.sd .c-product__title {
	font-size: var(--sd-step-4) !important;
	line-height: 1.08 !important;
	margin-bottom: 12px !important;
	text-wrap: balance;
}

/* Ordem da decisão: nome, estrelas, promessa, preço e pagamento, versões e botão, garantias, frete */
body.sd .summary.entry-summary { display: flex; flex-direction: column; }
/* A coluna de compra acompanha a rolagem pelas fotos com position: sticky, que não a tira do
   fluxo: quando ela cresce (resultado do frete), a página abre espaço. O tema a prendia com
   position: fixed (js-sticky-sidebar), e o conteúdo de baixo a cobria. O topo vem de
   js/produto.js: abaixo do cabeçalho ou, se a coluna for mais alta que a tela, presa pela base */
/* O tema corta a página com overflow: hidden, que desliga o sticky; clip corta igual sem isso */
body.sd.single-product .l-wrap { overflow: clip !important; }
body.sd .c-product__col-2 .js-sticky-sidebar {
	position: sticky !important;
	top: var(--sd-coluna-topo, 112px) !important;
	bottom: auto !important;
	width: auto !important;
	transform: none !important;
}
body.sd .summary.entry-summary > * { order: 20; }
body.sd .summary.entry-summary > .sd-produto__ancora { order: 0; }
body.sd .summary.entry-summary > .c-product__title { order: 1; }
body.sd .summary.entry-summary > .woocommerce-product-rating { order: 2; }
body.sd .summary.entry-summary > .c-product__short-description { order: 3; }
body.sd .summary.entry-summary > .price { order: 4; }
body.sd .summary.entry-summary > .sd-produto__pagamento { order: 5; }
body.sd .summary.entry-summary > .c-product__atc-wrap { order: 6; }
body.sd .summary.entry-summary > .c-product__custom-html { order: 7; }
body.sd .summary.entry-summary > #shipping-simulator { order: 8; }
body.sd .summary.entry-summary > .sd-frete { order: 9; }
body.sd .summary.entry-summary > .sd-produto__videos { order: 11; }
body.sd .summary.entry-summary > :is(.product_meta, .c-product__wishlist) { display: none; }

body.sd .summary .woocommerce-product-rating { display: flex; align-items: center; gap: 10px; margin: 0 0 20px !important; }
body.sd .summary .woocommerce-review-link { font-size: 0.875rem; color: var(--sd-ink-soft); text-decoration: underline; text-underline-offset: 4px; }

/* Promessa sensorial (primeiro parágrafo da breve descrição) e frase de apoio */
body.sd .c-product__short-description { margin: 0 0 24px !important; max-width: 34rem; }
body.sd .c-product__short-description p { margin: 0 0 10px; font-size: 0.9375rem; line-height: 1.65; color: var(--sd-ink-soft); }
body.sd .c-product__short-description p:last-child { margin-bottom: 0; }
body.sd .c-product__short-description p.sd-produto__promessa {
	margin-bottom: 12px;
	font-size: var(--sd-step-1);
	font-weight: var(--sd-light-weight);
	line-height: 1.45;
	color: var(--sd-ink);
	text-wrap: pretty;
}
body.sd .c-product__short-description strong { font-weight: 500; color: var(--sd-ink); }

body.sd .summary .price { font-size: var(--sd-step-2) !important; margin: 0 0 6px !important; }
/* Desconto ao lado do preço, como o selo de desconto dos cards (inc/produto.php); sobre a foto,
   os selos ficavam colados na borda */
body.sd.single-product .c-product__gallery .c-product__badges { display: none !important; }
/* Cabeçalho de página do tema: faixa branca de 100px com título e trilha escondidos. No lugar
   dela, o respiro do fundo da página (no celular, a foto logo abaixo do cabeçalho) */
body.sd.single-product .c-page-header--product-page { display: none !important; }
body.sd.single-product main.l-inner > .product { padding-top: clamp(0px, 4vw, 56px); }
body.sd .summary .price .sd-preco__desconto {
	display: inline-block;
	margin-left: 10px;
	padding: 5px 10px;
	border-radius: var(--sd-pill);
	background: var(--sd-blue-deep);
	color: var(--sd-white);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	vertical-align: 0.35em;
}
body.sd .sd-produto__pagamento { margin: 0 0 28px; font-size: 0.875rem; line-height: 1.6; color: var(--sd-ink-soft); } /* Pix e parcelas: base.css */

/* Versões e botão na largura da coluna (o tema limita a 500px), alinhados à caixa do frete abaixo */
body.sd .c-product__atc-wrap { max-width: none !important; margin-top: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; }
/* Quantidade e botão lado a lado em todas as larguras (o tema empilhava no tablet e no celular,
   com a quantidade na linha toda). O botão não estica até o fim da coluna: fica do tamanho de
   antes, alinhado à esquerda com a quantidade */
body.sd .summary :is(form.cart:not(.variations_form), .woocommerce-variation-add-to-cart) { container-type: inline-size; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center; gap: 10px; }
body.sd .summary .c-product__quantity { flex: 0 0 124px !important; width: 124px !important; margin: 0 !important; }
body.sd .summary .single_add_to_cart_button { flex: 1 1 0; min-width: 0; max-width: 240px !important; padding-inline: 16px !important; } /* base 0: com o botão do WhatsApp ao lado, encolhe no celular em vez de estourar */
@media (min-width: 768px) {
	body.sd .summary :is(form.cart:not(.variations_form), .woocommerce-variation-add-to-cart) { gap: 14px; }
	body.sd .summary .c-product__quantity { flex-basis: 150px !important; width: 150px !important; }
	body.sd .summary .single_add_to_cart_button { max-width: min(calc(100% - 164px), 240px) !important; padding-inline: 30px !important; }
}

/* Botão do WhatsApp (plugin Joinchat; texto "Dúvidas?" e posição no wp-admin › Joinchat › WooCommerce,
   migration 202611030948): o plugin o põe cheio de verde e na fonte do sistema. Aqui ele vira um
   botão de contorno do tema (mesma pílula, fonte e altura do "Comprar"), ao lado dele; o verde fica
   só no ícone e no fio. No celular não cabe texto: fica só o ícone, redondo */
/* O seletor leva form.cart por causa do produto simples (Soft Clean): o Luchiana tem uma regra só
   para ele (.product-type-simple .c-product__atc-wrap form > *, flex: 1 1 100%) que, com menos
   especificidade aqui, tomava a linha toda e espremia o "Comprar" (saía "COMPR" no desktop e
   34px no celular) */
body.sd .summary form.cart .joinchat__woo-btn__wrapper { flex: 0 0 auto; width: auto; margin: 0; }
body.sd .summary .joinchat__woo-btn {
	--sd-whats: #128c7e;   /* verde escuro do WhatsApp: 3,9:1 no off-white, só em fio e ícone */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: auto;
	max-width: 100%;
	padding: 14px 22px 14px 18px;
	background: transparent;
	border: 1px solid var(--sd-whats);
	border-radius: var(--sd-pill);
	color: var(--sd-ink);
	font: 500 var(--sd-caps-size) / 1.3 var(--sd-text);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: visible;
	transition: background-color .25s var(--sd-ease), color .25s var(--sd-ease), box-shadow .25s var(--sd-ease), transform .25s var(--sd-ease);
}
body.sd .summary .joinchat__woo-btn::before {
	content: "";
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	background: var(--sd-whats);
	-webkit-mask: var(--joinchat-ico) center / contain no-repeat;
	mask: var(--joinchat-ico) center / contain no-repeat;
}
body.sd .summary .joinchat__woo-btn:hover { background-color: var(--sd-whats); color: var(--sd-white); box-shadow: var(--sd-lift); transform: translateY(-1px); }
body.sd .summary .joinchat__woo-btn:hover::before { background: var(--sd-white); }
body.sd .summary .joinchat__woo-btn:active { box-shadow: none; transform: none; }
@media (max-width: 767px) {
	body.sd .summary .joinchat__woo-btn { width: 48px; height: 48px; padding: 0; gap: 0; font-size: 0; letter-spacing: 0; }
}

/* Versões: rótulo acima, botões abaixo (o menu do WooCommerce fica escondido e sincronizado) */
body.sd .variations_form table.variations,
body.sd .variations_form table.variations :is(tbody, tr, th, td) {
	display: block !important;
	width: 100% !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}
body.sd .variations_form table.variations tr { margin-bottom: 20px !important; }
body.sd .variations_form table.variations th.label label {
	display: block;
	margin: 0 0 12px !important;
	font-family: var(--sd-text) !important;
	font-size: 0.9375rem !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-align: left !important;
	color: var(--sd-ink) !important;
}
body.sd .variations_form td.sd-has-pills > *:not(.sd-pills):not(.sd-pills-msg) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	opacity: 0 !important;
	pointer-events: none !important;
}
body.sd .sd-pills { display: flex; flex-wrap: wrap; gap: 10px; }
/* Como os campos do formulário (sd-form): branco, contorno fino no Azul claro, cantos de 8px */
body.sd .sd-pill {
	flex: 1 1 150px;
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 52px;
	padding: 12px 16px;
	border: 1px solid var(--sd-sky);
	border-radius: 8px;
	background: var(--sd-white);
	color: var(--sd-ink);
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.3;
	text-align: left;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	transition: border-color .2s var(--sd-ease), box-shadow .2s var(--sd-ease);
}
body.sd .sd-pill::before {
	content: "";
	flex: 0 0 18px;
	height: 18px;
	border: 1px solid var(--sd-sky);
	border-radius: 50%;
	background: var(--sd-white);
	box-sizing: border-box;
	transition: all .2s var(--sd-ease);
}
body.sd .sd-pill:hover { border-color: var(--sd-blue); }
body.sd .sd-pill.is-active { border-color: var(--sd-blue-deep); box-shadow: 0 0 0 1px var(--sd-blue-deep) inset; }
body.sd .sd-pill.is-active::before { border-color: var(--sd-blue-deep); background: var(--sd-blue-deep); box-shadow: inset 0 0 0 3px var(--sd-white); }
body.sd .sd-pill[disabled] { opacity: .45; cursor: not-allowed; text-decoration: line-through; }
body.sd .sd-pills-msg { display: none; margin-top: 10px; font-size: 0.875rem; color: var(--sd-ink); }
body.sd .sd-pills-error .sd-pills-msg { display: block; }
body.sd .sd-pills-error .sd-pill { border-color: var(--sd-clay); }
body.sd .sd-shake { animation: sd-shake .4s ease; }
@keyframes sd-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }

/* Botão desabilitado (versão ainda não escolhida) continua legível */
body.sd .single_add_to_cart_button:is(.disabled, :disabled) {
	opacity: 1 !important;
	background-color: var(--sd-mist) !important;
	border-color: var(--sd-mist) !important;
	color: var(--sd-ink-soft) !important;
}
body.sd .single_add_to_cart_button:is(.disabled, :disabled):hover { box-shadow: none !important; transform: none; }
/* Sem versão escolhida ele ainda responde (js/produto.js pede a versão): mãozinha, não o bloqueio do tema */
body.sd .single_add_to_cart_button.wc-variation-selection-needed { cursor: pointer; }

/* Ícone de sacola, o mesmo do carrinho no cabeçalho (fonte de ícones do tema), nos botões de adicionar */
body.sd :is(.summary .single_add_to_cart_button, .sd-buybar__button, .sd-produto-convite .c-button) { display: inline-flex !important; align-items: center; justify-content: center; gap: 10px; }
body.sd :is(.summary .single_add_to_cart_button, .sd-buybar__button, .sd-produto-convite .c-button)::before {
	content: "\f109";
	font-family: theme-icons;
	font-size: 15px;
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1;
}

/* Garantias (Personalizar › Produto › HTML): linha técnica com ícone fino */
body.sd .c-product__custom-html { margin: 24px 0 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
body.sd .sd-produto-garantias { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 0; padding: 0; list-style: none; }
body.sd .sd-produto-garantias li { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 0.875rem; line-height: 1.4; color: var(--sd-ink-soft); }
body.sd .sd-produto-garantias svg { flex: none; color: var(--sd-blue); }
body.sd .sd-produto-garantias svg,
body.sd .sd-produto-garantias svg * { fill: none !important; stroke: currentColor !important; }
body.sd .sd-produto-garantias a { color: inherit; text-decoration: underline; text-decoration-color: var(--sd-line); text-underline-offset: 4px; }
body.sd .sd-produto-garantias a:hover { color: var(--sd-ink); text-decoration-color: currentColor; }

/* Calcular frete (plugin de frete): discreto, abaixo das garantias */
body.sd #shipping-simulator { align-self: stretch; width: 100% !important; max-width: none !important; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--sd-line); }
body.sd .frenet-shipping-simulator-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; width: 100% !important; max-width: 26rem; margin: 0; }
body.sd .frenet-shipping-simulator-form > br { display: none; }
body.sd .frenet-shipping-simulator-form label { display: flex !important; flex-direction: column; flex: 1 1 200px; margin: 0; font-size: 0.875rem; font-weight: 500; color: var(--sd-ink); }
body.sd .frenet-shipping-simulator-form label br { display: none; }
body.sd .frenet-simulator-zipcode-field { position: relative; display: block; width: 100% !important; margin-top: 8px; }
body.sd .frenet-simulator-zipcode-icon { position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--sd-blue); fill: none !important; stroke: currentColor !important; stroke-width: 1.25; }
body.sd .frenet-shipping-simulator-form input.input-text {
	width: 100% !important;
	max-width: none !important;
	min-height: 46px;
	padding: 10px 14px 10px 42px !important;
	background: var(--sd-white) !important;
	border: 1px solid var(--sd-sky) !important;
	border-radius: 8px !important;
	font-size: 1rem !important;
	color: var(--sd-ink) !important;
}
body.sd .frenet-shipping-simulator-form .button {
	padding: 13px 22px !important;
	background: transparent !important;
	border-color: var(--sd-ink) !important;
	color: var(--sd-ink) !important;
}
body.sd .frenet-shipping-simulator-form .button:hover { background: var(--sd-blue-deep) !important; border-color: var(--sd-blue-deep) !important; color: var(--sd-white) !important; }
body.sd .frenet-shipping-simulator-form :is(#loading_simulator, #simulator-data) { flex: 1 1 100%; font-size: 0.875rem; }

/* Frete grátis (inc/produto.php, js/produto.js): quando o pedido chega ao mínimo do WooCommerce,
   o aviso fica no lugar do simulador, que só abre em "Ver prazos", logo abaixo do aviso; antes do
   mínimo, a dica de quantas unidades bastam fica abaixo do simulador */
body.sd .summary:has(.sd-frete.is-gratis:not(.is-aberto)) #shipping-simulator { display: none !important; }
body.sd .summary.entry-summary:has(.sd-frete.is-gratis) > #shipping-simulator { order: 10; margin-top: 12px; padding-top: 0; border-top: 0; }
body.sd .sd-frete__ganhou > span { display: flex; flex-direction: column; gap: 2px; }
body.sd .sd-frete__opcoes {
	align-self: flex-start;
	margin: 0;
	padding: 0;
	font: inherit;
	font-size: 0.8125rem;
	color: var(--sd-blue-deep);
	background: none;
	border: 0;
	text-decoration: underline;
	text-decoration-color: var(--sd-sky);
	text-underline-offset: 4px;
	cursor: pointer;
}
body.sd .sd-frete__opcoes:hover { text-decoration-color: currentColor; }
body.sd .sd-frete.is-aberto .sd-frete__opcoes { display: none; }
body.sd #simulator-data .sd-frete__gratis .frenet-quote-price { font-weight: 500; color: var(--sd-blue-deep); }

/* Resultado do simulador como escolha (js/produto.js): marcador, nome e prazo, preço à direita.
   O plugin monta cada linha em grade com seletores de dois IDs; aqui, a mesma força */
body.sd #shipping-simulator #shipping-rates .li-frenet.sd-frete__opcao {
	display: flex !important;
	align-items: center;
	gap: 12px;
	cursor: pointer;
}
body.sd #shipping-simulator #shipping-rates .sd-frete__opcao > label {
	flex: 1 !important;
	display: flex !important;
	flex-direction: row !important;   /* o rótulo do CEP, mais acima, é em coluna */
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin: 0 !important;
	font-weight: 400 !important;
	text-align: left !important;
	cursor: pointer;
}
body.sd #shipping-simulator #shipping-rates .sd-frete__opcao .frenet-quote-service { align-items: flex-start !important; text-align: left !important; }
body.sd #shipping-simulator .frenet-quote-header { padding-left: 30px; }
/* Pesos mais leves que os do plugin (600 a 700): Medium no rótulo, no nome da entrega e no
   preço; o cabeçalho "Entrega / Custo" em regular, marrom suave */
body.sd .frenet-shipping-simulator-form label { font-weight: 500 !important; }
body.sd #shipping-simulator .frenet-quote-header > * { font-weight: 400 !important; color: var(--sd-ink-soft) !important; }
body.sd #shipping-simulator #shipping-rates .li-frenet :is(.span-frenet, .frenet-quote-price, .frenet-quote-price *) { font-weight: 500 !important; }
/* Marcador redondo no padrão do site: contorno azul claro; marcado, azul profundo com o centro */
body.sd #shipping-simulator .sd-frete__opcao input[type="radio"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	flex: none;
	width: 18px !important;
	height: 18px !important;
	margin: 0 !important;
	border: 1px solid var(--sd-sky) !important;
	border-radius: 50% !important;
	background: var(--sd-white) !important;
	cursor: pointer;
}
body.sd #shipping-simulator .sd-frete__opcao input[type="radio"]:checked {
	border-color: var(--sd-blue-deep) !important;
	box-shadow: inset 0 0 0 4px var(--sd-white), inset 0 0 0 9px var(--sd-blue-deep);
}
body.sd #shipping-simulator #simulator-data p.sd-frete__nota {
	margin: 12px 0 0 !important;
	padding: 0 !important;
	font-size: 0.8125rem !important;
	line-height: 1.5;
	color: var(--sd-ink-soft) !important;
	background: none !important;
}
body.sd .sd-frete { align-self: stretch; }
/* Dica "Com 2 unidades, o frete sai grátis.": dentro do rótulo "Calcular frete", antes do CEP */
body.sd .sd-frete__dica,
body.sd #shipping-simulator p.sd-frete__dica { display: block; margin: 2px 0 0 !important; font-size: 0.8125rem !important; font-weight: 400 !important; color: var(--sd-ink-soft) !important; }
body.sd .sd-frete__dica:empty,
body.sd .sd-frete:not(.is-gratis) .sd-frete__ganhou,
body.sd .sd-frete.is-gratis .sd-frete__dica { display: none; }
body.sd .sd-frete__ganhou {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 24px 0 0;
	padding: 14px 16px;
	border: 1px solid var(--sd-sky);
	border-radius: 8px;
	background: var(--sd-white);
	font-size: 0.9375rem;
	color: var(--sd-ink);
}
body.sd .sd-frete__ganhou svg { flex: none; color: var(--sd-blue-deep); }
body.sd .sd-frete__ganhou svg,
body.sd .sd-frete__ganhou svg * { fill: none !important; stroke: currentColor !important; }
body.sd .sd-frete__ganhou strong { font-weight: 500; }

@media (max-width: 767px) {
	body.sd .c-product__title { font-size: var(--sd-step-3) !important; }
	/* Cada versão numa linha: lado a lado, o nome quebrava em três */
	body.sd .sd-pill { flex-basis: 100%; }
}

/* -------------------------------------------------------------- seções abaixo da compra */

body.sd .sd-produto-secoes { margin-top: clamp(24px, 4vw, 56px) !important; }
body.sd .sd-produto-secoes .elementor-section { margin: 0 !important; }
body.sd .sd-produto-secoes .elementor-element-populated { padding: 0 !important; }
body.sd .sd-produto-secoes :is(.sd-produto-faq, .sd-produto-convite, .sd-produto-formula) > .elementor-container > .elementor-column > .elementor-widget-wrap { display: block !important; }
body.sd .sd-produto-secoes :is(h2, h3) { text-wrap: balance; }
body.sd .sd-produto-secoes h2 { margin: 0 0 24px !important; }
body.sd .sd-produto-secoes .elementor-heading-title.elementor-size-default { line-height: 1.15; }
body.sd .sd-produto-secoes p { text-wrap: pretty; }

/* Cada seção: respiro igual em cima e embaixo (entre duas seções, ~80px no desktop e ~56px no
   celular); rótulo e título centralizados */
body.sd .sd-produto-secao,
body.sd .sd-produto-secoes .elementor-top-section { padding: clamp(28px, 2.8vw, 40px) 16px !important; }
body.sd .sd-produto-secao__inner > :last-child,
body.sd .sd-produto-secao__inner > :last-child > :last-child { margin-bottom: 0 !important; }
body.sd .sd-produto-secao__inner { max-width: 680px; margin: 0 auto; }
body.sd .sd-produto-secao :is(.sd-eyebrow, h2) { text-align: center; }
body.sd .sd-produto-secao :is(p, li) { font-size: 1rem; line-height: 1.75; }
body.sd .sd-produto-secao p { margin: 0 0 1.1em; }
body.sd .sd-produto-secao strong { font-weight: 500; }
body.sd .sd-produto-secao ul { margin: 0 0 1.1em; padding-left: 1.2em; }

/* O ∞ abre os três momentos de "por que confiar" e as dúvidas */
body.sd :is(.sd-produto-formula, .sd-produto-avaliacoes, .sd-produto-faq)::before {
	content: "";
	display: block;
	width: 56px;
	height: 22px;
	margin: 0 auto clamp(22px, 2.5vw, 32px);
	background: var(--sd-blue);
	-webkit-mask: url("../img/simbolo-sousensi.svg") center / contain no-repeat;
	mask: url("../img/simbolo-sousensi.svg") center / contain no-repeat;
}

/* O que você sente: texto e os ícones de benefício numa faixa (widget "image list" do tema) */
body.sd .sd-produto-sente .e-con { --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; }
body.sd .sd-produto-sente .elementor-widget-text-editor { text-align: left; }
body.sd .sd-produto-sente .e-con:has(.elementor-widget-ideapark-image-list-1) {
	margin-top: 32px;
	padding-top: 32px !important;
	border-top: 1px solid var(--sd-line);
}
/* A grade do Elementor tinha linhas de altura fixa: aqui cada ícone ocupa só o que precisa */
body.sd .sd-produto-sente :is(.e-con, .e-con-inner):has(> .elementor-widget-ideapark-image-list-1) {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)) !important;
	grid-template-rows: none !important;
	grid-auto-rows: auto !important;
	gap: 24px 12px !important;
}
body.sd .sd-produto-sente .elementor-widget-ideapark-image-list-1 { width: auto !important; max-width: none !important; margin: 0 !important; }
body.sd .sd-produto-sente :is(.c-ip-image-list-1__wrap, .c-ip-image-list-1__list) { display: block !important; margin: 0 !important; padding: 0 !important; }
/* Um widget só com todos os ícones (Soft Clean): a mesma grade, dentro dele */
body.sd .sd-produto-sente .elementor-widget-ideapark-image-list-1:has(.c-ip-image-list-1__item + .c-ip-image-list-1__item) { grid-column: 1 / -1; }
body.sd .sd-produto-sente .c-ip-image-list-1__list:has(> .c-ip-image-list-1__item + .c-ip-image-list-1__item) {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
	gap: 24px 12px;
}
body.sd .sd-produto-sente .c-ip-image-list-1__item { width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; text-align: center; }
body.sd .sd-produto-sente .c-ip-image-list-1__thumb { width: auto !important; height: auto !important; margin: 0 0 10px !important; }
body.sd .sd-produto-sente .c-ip-image-list-1__image { display: block; width: 56px !important; height: 56px !important; margin: 0 auto !important; object-fit: contain; }
body.sd .c-ip-image-list-1__title {
	display: block;
	font-family: var(--sd-text) !important;
	font-size: 0.8125rem !important;
	font-weight: 400 !important;
	font-style: normal !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	line-height: 1.4 !important;
	color: var(--sd-ink-soft) !important;
	hyphens: manual;
}
body.sd .c-ip-image-list-1__title::first-letter { text-transform: uppercase; }
/* Sem quebrar palavra no meio: o título pode passar um pouco da coluna, centrado no ícone,
   para caber "dermatologicamente" inteira (no celular, duas colunas) */
body.sd .sd-produto-sente .c-ip-image-list-1__item { display: flex !important; flex-direction: column; align-items: center; }
body.sd .sd-produto-sente .c-ip-image-list-1__title { width: max-content; max-width: 9.5em; overflow-wrap: normal !important; word-break: normal !important; }

/* Na fórmula: um card por ingrediente */
body.sd .sd-produto-formula > .elementor-container { max-width: 1160px !important; }
body.sd .sd-produto-cards { margin-top: clamp(16px, 3vw, 40px) !important; }
body.sd .sd-produto-cards > .elementor-container {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: clamp(20px, 2.5vw, 32px);
}
body.sd .sd-produto-card { width: auto !important; }
body.sd .sd-produto-card .elementor-widget-wrap { display: block !important; }
body.sd .sd-produto-card__foto img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 4px; }
body.sd .sd-produto-card__nome { margin: 18px 0 8px !important; }
body.sd .sd-produto-card__nome .elementor-heading-title { font-size: var(--sd-step-1) !important; font-weight: 400 !important; line-height: 1.3 !important; }
body.sd .sd-produto-card .elementor-widget-text-editor,
body.sd .sd-produto-card .elementor-widget-text-editor p { font-size: 0.9375rem !important; line-height: 1.65 !important; color: var(--sd-ink-soft) !important; margin: 0; }

/* Quem criou: foto à esquerda, citação à direita */
body.sd .sd-produto-fundadora > .elementor-container {
	max-width: 1160px !important;
	gap: clamp(32px, 6vw, 96px);
	align-items: center;
}
body.sd .sd-produto-fundadora__content > .elementor-widget-wrap { display: block !important; max-width: 34rem; }
body.sd .sd-produto-fundadora :is(.sd-eyebrow, h2) .elementor-heading-title { text-align: left; }
body.sd .sd-produto-fundadora__foto img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 30% center; border-radius: 4px; }
/* Citação longa: no texto corrido, com o filete Terracota da citação da Sobre */
body.sd .sd-quote--longa { margin: 8px 0 0; }
body.sd .sd-quote.sd-quote--longa blockquote p {
	font-family: var(--sd-text) !important;
	font-style: normal !important;
	font-weight: 400;
	font-size: 1.0625rem;
	line-height: 1.75;
	margin: 0 0 16px;
}
body.sd .sd-produto-fundadora__assinatura { margin-top: 8px; }
body.sd .sd-produto-fundadora__assinatura img { display: block; width: 150px; height: auto; }
/* Na citação curta (página do Sérum), o nome em destaque e, abaixo da assinatura, as credenciais
   em linha técnica (a âncora de confiança do briefing) e o link para a Sobre */
body.sd .sd-produto-fundadora__papel { margin: 6px 0 0 !important; font-size: 0.9375rem; line-height: 1.5; color: var(--sd-ink-soft); }
body.sd .sd-produto-fundadora__credenciais {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 0;
	margin: 24px 0 0 !important;
	padding: 20px 0 0 !important;
	border-top: 1px solid var(--sd-line);
	list-style: none;
}
body.sd .sd-produto-fundadora__credenciais li { display: flex; align-items: center; gap: 9px; margin: 0; padding-right: 22px; font-size: 0.875rem; line-height: 1.4; color: var(--sd-ink-soft); }
body.sd .sd-produto-fundadora__credenciais svg { flex: none; width: 20px; height: 20px; color: var(--sd-blue); }
body.sd .sd-produto-fundadora__credenciais svg,
body.sd .sd-produto-fundadora__credenciais svg * { fill: none !important; stroke: currentColor !important; }
body.sd .sd-produto-fundadora__link { margin: 22px 0 0 !important; }
body.sd .sd-produto-fundadora__link a {
	display: inline-block;
	padding: 4px 0;
	border-bottom: 1px solid currentColor;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--sd-caps-tracking);
	text-transform: uppercase;
	text-decoration: none;
	color: var(--sd-ink);
}

/* Quem usa: vídeos de clientes e avaliações (inc/avaliacoes.php e templates single-product-reviews
   e single-product/review): resumo das notas, formulário guiado e cartões */
body.sd .sd-produto-avaliacoes > .elementor-container { max-width: 1000px !important; }
body.sd .sd-avaliacoes { display: block; }

/* Estrelas: contorno das cinco e, por cima, o preenchimento em terracota na largura da nota */
body.sd .sd-estrelas { position: relative; display: inline-flex; flex: none; line-height: 0; vertical-align: middle; }
body.sd .sd-estrelas > span { display: inline-flex; gap: 2px; }
body.sd .sd-estrelas__nota { position: absolute; inset: 0 auto 0 0; overflow: hidden; }
body.sd .sd-estrelas svg { flex: none; width: 16px; height: 16px; }
body.sd .sd-estrelas__base svg { fill: none; stroke: var(--sd-clay); stroke-width: 1.25; }
body.sd .sd-estrelas__nota svg { fill: var(--sd-clay); stroke: var(--sd-clay); stroke-width: 1.25; }

/* A nota ao lado do título: a coluna da seção vira uma grade, e os invólucros do widget de
   shortcode somem (display: contents) para que as partes das avaliações sejam itens dela.
   Rótulo e título à esquerda; a nota, as estrelas, o total e o botão à direita, alinhados pela
   base do título; o resto (formulário, destaque, lista) ocupa a largura toda */
body.sd .sd-produto-secoes .sd-produto-avaliacoes > .elementor-container > .elementor-column > .elementor-widget-wrap {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0 48px;
	align-items: end;
}
/* Com os invólucros em display: contents, os itens da grade são as partes de .sd-avaliacoes
   (e o painel de confirmação que o JS põe antes do formulário) */
body.sd .sd-produto-avaliacoes .elementor-widget-wrap > *,
body.sd .sd-produto-avaliacoes .sd-avaliacoes > *,
body.sd .sd-produto-avaliacoes .sd-form__done { grid-column: 1 / -1; }
body.sd .sd-produto-avaliacoes .elementor-widget-wrap > .sd-eyebrow { grid-column: 1; grid-row: 1; }
body.sd .sd-produto-avaliacoes .elementor-widget-wrap > .elementor-widget-heading:not(.sd-eyebrow) { grid-column: 1; grid-row: 2; }
body.sd .sd-produto-avaliacoes .elementor-widget-heading .elementor-heading-title { text-align: left !important; }
body.sd .sd-produto-avaliacoes .sd-eyebrow .elementor-heading-title { margin-bottom: 16px; }
body.sd .sd-produto-avaliacoes .elementor-widget-wrap > .elementor-widget-shortcode,
body.sd .sd-produto-avaliacoes .elementor-widget-shortcode > .elementor-widget-container,
body.sd .sd-produto-avaliacoes .elementor-shortcode,
body.sd .sd-produto-avaliacoes .sousensi-avaliacoes,
body.sd .sd-avaliacoes { display: contents !important; }
body.sd .sd-produto-avaliacoes .sd-avaliacoes > .sd-avaliacoes__resumo { grid-column: 2; grid-row: 1 / 3; display: grid; gap: 14px; justify-items: start; padding-bottom: 6px; }
body.sd .sd-avaliacoes__media { display: grid; grid-template-columns: auto auto; align-items: center; gap: 4px 16px; }
body.sd .sd-avaliacoes__numero { grid-row: 1 / 3; font-family: var(--sd-display); font-weight: var(--sd-display-weight); font-size: 3rem; line-height: 1; color: var(--sd-ink); }
body.sd .sd-avaliacoes__media .sd-estrelas { align-self: end; }
body.sd .sd-avaliacoes__media .sd-estrelas svg { width: 20px; height: 20px; }
body.sd .sd-avaliacoes__total { align-self: start; margin: 0 !important; font-size: 0.875rem; line-height: 1.4; color: var(--sd-ink-soft); }
/* Distribuição em barras finas, só com bastante avaliações (SOUSENSI_AVALIACOES_BARRAS_MIN) */
body.sd .sd-avaliacoes__barras { display: grid; gap: 8px; max-width: 420px; margin: 24px 0 0; padding: 0; list-style: none; }
body.sd .sd-avaliacoes__barras li { display: grid; grid-template-columns: 5.5em 1fr 1.5em; align-items: center; gap: 12px; margin: 0; font-size: 0.8125rem; line-height: 1.4; color: var(--sd-ink-soft); }
body.sd .sd-avaliacoes__barra { height: 6px; overflow: hidden; background: var(--sd-mist); border-radius: var(--sd-pill); }
body.sd .sd-avaliacoes__barra > span { display: block; height: 100%; background: var(--sd-clay); border-radius: inherit; }
body.sd .sd-avaliacoes__barra-n { text-align: right; }
body.sd :is(.sd-avaliacoes__vazio, .sd-avaliacoes__origem) { margin: 0 !important; font-size: 0.9375rem; line-height: 1.6; color: var(--sd-ink-soft); }
body.sd .sd-avaliacoes__escrever { justify-self: start; }
body.sd .sd-avaliacoes__escrever[hidden] { display: none !important; }   /* o .c-button do tema ganha do [hidden] */
@media (max-width: 767px) {
	/* No celular, tudo numa coluna: rótulo, título, a nota e o botão na largura toda */
	body.sd .sd-produto-secoes .sd-produto-avaliacoes > .elementor-container > .elementor-column > .elementor-widget-wrap { grid-template-columns: minmax(0, 1fr); }
	body.sd .sd-produto-avaliacoes .sd-avaliacoes > .sd-avaliacoes__resumo { grid-column: 1; grid-row: auto; margin-top: 4px; }
	body.sd .sd-avaliacoes__escrever { justify-self: stretch; padding-inline: 16px !important; white-space: nowrap; }
}

/* Em destaque: a avaliação que responde ao medo principal (meta sd_destaque), em Trirong, num
   painel branco, acima das demais */
body.sd .sd-avaliacoes__destaque {
	display: grid;
	gap: 14px;
	margin: clamp(8px, 1vw, 12px) 0 0 !important;   /* o tema mira #reviews: só o !important ganha; o título já traz 24px */
	padding: clamp(28px, 4vw, 40px) clamp(24px, 4vw, 48px) !important;
	background: var(--sd-white);
	border-radius: 8px;
}
body.sd .sd-avaliacoes__destaque .sd-estrelas svg { width: 18px; height: 18px; }
@media (max-width: 767px) { body.sd .sd-avaliacoes__destaque { margin-top: 16px !important; } }
body.sd .sd-avaliacoes__destaque blockquote { margin: 0; padding: 0; border: 0; background: none; quotes: none; }
body.sd .sd-avaliacoes__destaque blockquote::before,
body.sd .sd-avaliacoes__destaque blockquote::after { content: none; }
body.sd .sd-avaliacoes__destaque blockquote p {
	max-width: 30em;
	margin: 0 0 8px !important;
	font-family: var(--sd-accent) !important;
	font-style: italic !important;
	font-weight: var(--sd-accent-weight) !important;
	font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem) !important;
	line-height: 1.3 !important;
	color: var(--sd-ink);
	text-wrap: pretty;
}
body.sd .sd-avaliacoes__destaque blockquote p:last-child { margin-bottom: 0 !important; }
body.sd .sd-avaliacoes__destaque figcaption { margin: 0 !important; }

/* Cartões em duas colunas (uma no celular), com linhas de leitura curtas: estrelas e data numa
   linha, nome com "Compra verificada" e o tipo de pele, e o texto */
body.sd .sd-avaliacoes__lista { columns: 2; column-gap: 40px; margin: 8px 0 0 !important; padding: 0 !important; list-style: none; }
body.sd .sd-avaliacoes__lista > li { break-inside: avoid; margin: 0 !important; padding: 24px 0 !important; border-bottom: 1px solid var(--sd-line); }
body.sd .sd-avaliacoes__lista:not(.is-aberta) > li:nth-child(n+4) { display: none; }
@media (max-width: 767px) { body.sd .sd-avaliacoes__lista { columns: 1; } }
body.sd .sd-avaliacoes__lista .comment_container { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; outline: none; }
body.sd .sd-avaliacao__topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
body.sd .sd-avaliacao__data { font-size: 0.8125rem; color: var(--sd-ink-soft); }
body.sd .sd-avaliacao__autora { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 12px 0 0 !important; font-size: 0.9375rem; color: var(--sd-ink); }
body.sd .sd-avaliacao__autora strong { font-weight: 500; }
body.sd .sd-avaliacao__verificada { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; color: var(--sd-ink-soft); }
body.sd .sd-avaliacao__verificada svg { flex: none; }
body.sd .sd-avaliacao__pele { display: inline-block; padding: 4px 10px; border: 1px solid var(--sd-line); border-radius: var(--sd-pill); font-size: 0.75rem; line-height: 1.3; color: var(--sd-ink-soft); }
body.sd .sd-avaliacao__pendente { margin: 12px 0 0 !important; padding: 10px 14px; background: color-mix(in srgb, var(--sd-sky) 14%, var(--sd-paper)); border-radius: 8px; font-size: 0.8125rem; line-height: 1.5; color: var(--sd-ink); }
body.sd .sd-avaliacao__texto p { margin: 10px 0 0 !important; font-size: 1rem; line-height: 1.7; color: var(--sd-ink); }
/* Convite a escrever, no fim da lista (o mesmo botão em contorno do topo): frase e botão numa
   linha, sobre um fio; no celular, empilhados */
body.sd .sd-avaliacoes__convite {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 32px;
	margin: 32px 0 0;
	padding: 28px 0 0;
	border-top: 1px solid var(--sd-line);
}
body.sd .sd-avaliacoes__convite p { flex: 1 1 22em; margin: 0 !important; font-size: 1rem; line-height: 1.6; color: var(--sd-ink); }
body.sd .sd-avaliacoes__convite[hidden] { display: none !important; }
@media (max-width: 767px) {
	body.sd .sd-avaliacoes__convite .sd-avaliacoes__escrever { width: 100%; }
}
/* Se houver mais avaliações, "Ver todas" (a nota de onde vêm as avaliações saiu a pedido da fundadora, 28/10/2026) */
body.sd .sd-avaliacoes__mais {
	display: block;
	margin: 24px auto 0;
	padding: 4px 0;
	background: none !important;
	border: 0;
	border-bottom: 1px solid currentColor;
	border-radius: 0;
	font-family: var(--sd-text);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--sd-caps-tracking);
	text-transform: uppercase;
	color: var(--sd-ink);
}

/* Formulário guiado (#sd-avaliar), no visual do Fale conosco: rótulos acima, campos brancos com
   contorno no Azul claro, dicas curtas abaixo do rótulo. O tema esconde os rótulos de
   .comment-form (usa placeholders): aqui eles voltam com display !important */
body.sd .sd-produto-avaliacoes #review_form_wrapper { margin-top: 16px; }
body.sd .sd-produto-avaliacoes #review_form { padding: 0 !important; background: none !important; border: 0 !important; }
body.sd .sd-produto-avaliacoes #respond { margin: 0 !important; padding: 0 !important; }
body.sd .sd-avaliar {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	margin: 0 !important;
	padding: 24px !important;
	background: var(--sd-white);
	border: 1px solid var(--sd-line);
	border-radius: 8px;
}
body.sd .sd-avaliar > * { max-width: none !important; margin: 0 !important; padding: 0 !important; }
body.sd .sd-avaliar__grupo { min-width: 0; margin: 0 !important; padding: 0 !important; border: 0 !important; }
/* O tema põe a nota numa faixa cinza, em linha: aqui ela é um grupo como os outros */
body.sd .sd-avaliar .sd-avaliar__nota { display: block !important; background: none !important; }
body.sd .sd-avaliar :is(legend, label[for="comment"], label[for="author"], label[for="email"]) {
	display: block !important;
	float: none;
	width: auto;
	margin: 0 0 8px !important;
	padding: 0;
	font-family: var(--sd-text) !important;
	font-size: 0.9375rem !important;
	font-weight: 500 !important;
	line-height: 1.4;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: var(--sd-ink) !important;
}
body.sd .sd-avaliar .required { color: var(--sd-ink-soft); text-decoration: none; }
body.sd .sd-avaliar__opcional { font-weight: 400; color: var(--sd-ink-soft); }
body.sd .sd-avaliar__dica { display: block; margin: 0 0 10px; font-size: 0.8125rem; line-height: 1.5; color: var(--sd-ink-soft); }
body.sd .sd-avaliar input + .sd-avaliar__dica { margin: 6px 0 0; }
body.sd .sd-avaliar :is(input[type="text"], input[type="email"], textarea) {
	display: block;
	width: 100% !important;
	max-width: none !important;
	min-height: 48px;
	margin: 0 !important;
	padding: 12px 16px !important;
	background: var(--sd-white) !important;
	border: 1px solid var(--sd-sky) !important;
	border-radius: 8px !important;
	font-family: var(--sd-text) !important;
	font-size: 1rem !important;    /* 16px: o iPhone não dá zoom ao tocar */
	line-height: 1.5;
	color: var(--sd-ink) !important;
	box-shadow: none !important;
	transition: border-color .25s var(--sd-ease), box-shadow .25s var(--sd-ease);
}
body.sd .sd-avaliar textarea { min-height: 120px; resize: vertical; }
body.sd .sd-avaliar :is(input, textarea):focus { outline: none; border-color: var(--sd-blue-deep) !important; box-shadow: 0 0 0 3px rgba(111, 135, 161, 0.15) !important; }

/* Nota: cinco estrelas grandes (44px para o dedo), preenchidas até a escolhida; a palavra muda */
body.sd .sd-nota { display: flex; gap: 2px; margin-left: -6px; }
/* Os rádios ficam só para o teclado e o leitor de tela (o tema os desenha com tamanho fixo) */
body.sd .sd-nota input,
body.sd .sd-chips input {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	opacity: 0 !important;
	appearance: none;
	clip-path: inset(50%);
	pointer-events: none;
}
body.sd .sd-nota label { display: grid !important; place-items: center; width: 44px; height: 44px; margin: 0 !important; padding: 0 !important; cursor: pointer; }
body.sd .sd-nota svg { width: 32px; height: 32px; fill: none; stroke: var(--sd-clay); stroke-width: 1.25; transition: fill .15s var(--sd-ease), transform .15s var(--sd-ease); }
body.sd .sd-nota input:focus-visible + label { outline: 2px solid var(--sd-blue-deep); outline-offset: -2px; border-radius: 8px; }
body.sd .sd-nota:has(#sd-nota-1:checked) label:nth-of-type(-n+1) svg,
body.sd .sd-nota:has(#sd-nota-2:checked) label:nth-of-type(-n+2) svg,
body.sd .sd-nota:has(#sd-nota-3:checked) label:nth-of-type(-n+3) svg,
body.sd .sd-nota:has(#sd-nota-4:checked) label:nth-of-type(-n+4) svg,
body.sd .sd-nota:has(#sd-nota-5:checked) label:nth-of-type(-n+5) svg { fill: var(--sd-clay); }
@media (hover: hover) {
	/* Passar o mouse mostra a nota antes do clique */
	body.sd .sd-nota:has(label:nth-of-type(1):hover) label:nth-of-type(-n+1) svg,
	body.sd .sd-nota:has(label:nth-of-type(2):hover) label:nth-of-type(-n+2) svg,
	body.sd .sd-nota:has(label:nth-of-type(3):hover) label:nth-of-type(-n+3) svg,
	body.sd .sd-nota:has(label:nth-of-type(4):hover) label:nth-of-type(-n+4) svg,
	body.sd .sd-nota:has(label:nth-of-type(5):hover) label:nth-of-type(-n+5) svg { fill: color-mix(in srgb, var(--sd-clay) 55%, transparent); }
}
body.sd .sd-nota input:checked + label svg { transform: scale(1.08); }
body.sd .sd-nota__palavra { min-height: 1.5em; margin: 4px 0 0 !important; font-size: 0.875rem; color: var(--sd-ink-soft); }
body.sd .sd-nota__palavra [data-nota] { display: none; color: var(--sd-ink); font-weight: 500; }
body.sd .sd-avaliar__nota:has(.sd-nota input:checked) .sd-nota__vazia { display: none; }
body.sd .sd-avaliar__nota:has(#sd-nota-1:checked) [data-nota="1"],
body.sd .sd-avaliar__nota:has(#sd-nota-2:checked) [data-nota="2"],
body.sd .sd-avaliar__nota:has(#sd-nota-3:checked) [data-nota="3"],
body.sd .sd-avaliar__nota:has(#sd-nota-4:checked) [data-nota="4"],
body.sd .sd-avaliar__nota:has(#sd-nota-5:checked) [data-nota="5"] { display: inline; }

/* Tipo de pele: opções em pílula de contorno fino; a escolhida fica cheia no Azul profundo */
body.sd .sd-chips { display: flex; flex-wrap: wrap; gap: 6px; }
body.sd .sd-chips label {
	display: inline-flex !important;
	align-items: center;
	min-height: 40px;
	margin: 0 !important;
	padding: 8px 12px !important;
	background: var(--sd-white);
	border: 1px solid var(--sd-sky);
	border-radius: var(--sd-pill);
	font-size: 0.8125rem !important;
	font-weight: 400 !important;
	line-height: 1.2;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: var(--sd-ink) !important;
	cursor: pointer;
	transition: background-color .2s var(--sd-ease), border-color .2s var(--sd-ease), color .2s var(--sd-ease);
}
body.sd .sd-chips label:hover { border-color: var(--sd-blue-deep); }
body.sd .sd-chips input:checked + label { background: var(--sd-blue-deep); border-color: var(--sd-blue-deep); color: var(--sd-white) !important; }
body.sd .sd-chips input:focus-visible + label { outline: 2px solid var(--sd-blue-deep); outline-offset: 2px; }

/* Fechar: "×" no canto do cartão e "Cancelar" (link em caixa alta) ao lado do envio */
body.sd .sd-avaliar .sd-avaliar__fechar {
	position: absolute;
	top: 8px;
	right: 8px;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0 !important;
	background: none !important;
	border: 0;
	border-radius: 50%;
	color: var(--sd-ink-soft);
	transition: color .2s var(--sd-ease);
}
body.sd .sd-avaliar__fechar:hover { color: var(--sd-ink); }
body.sd .sd-avaliar__nota legend { padding-right: 40px; }
/* Envio recusado pelo WordPress (repetido, rápido demais): a mensagem acima do botão */
body.sd .sd-avaliar__erro { grid-column: 1 / -1; margin: 0 !important; font-size: 0.875rem; color: var(--sd-ink); }
body.sd .sd-avaliar .form-submit { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 0 !important; }
body.sd .sd-avaliar__cancelar {
	padding: 4px 0;
	background: none !important;
	border: 0;
	border-bottom: 1px solid currentColor;
	border-radius: 0;
	font-family: var(--sd-text);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--sd-caps-tracking);
	text-transform: uppercase;
	color: var(--sd-ink-soft);
}
body.sd .sd-avaliar__cancelar:hover { color: var(--sd-ink); }

/* A partir do tablet, o formulário ocupa a largura da seção em duas colunas: nota | tipo de pele,
   o texto inteiro, nome | e-mail e, por fim, o envio */
@media (min-width: 768px) {
	body.sd .sd-avaliar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; padding: 28px 32px !important; }
	body.sd .sd-avaliar :is(.comment-form-comment, .comment-form-cookies-consent, .form-submit) { grid-column: 1 / -1; }
	body.sd .sd-avaliar .form-submit [type="submit"] { width: auto !important; }
}
@media (max-width: 767px) {
	body.sd .sd-avaliar { padding: 20px !important; }
	body.sd .sd-avaliar .form-submit { flex-direction: column; }
	body.sd .sd-avaliar .form-submit [type="submit"] { width: 100% !important; }
}

/* Enviando a avaliação (js/produto.js), como no Fale conosco: campos esmaecidos e travados, botão
   "Enviando…" pulsando devagar. Depois do envio, o painel sd-form__done (contato.css) agradece. */
body.sd .sd-produto-avaliacoes .comment-form.is-enviando > :not(.form-submit) { opacity: .55; pointer-events: none; transition: opacity .3s var(--sd-ease); }
body.sd .sd-produto-avaliacoes .comment-form.is-enviando [type="submit"] { cursor: progress; pointer-events: none; animation: sd-sending 1.4s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
	body.sd .sd-produto-avaliacoes .comment-form.is-enviando [type="submit"] { animation: none; opacity: .75; }
}
body.sd .sd-produto-avaliacoes .sd-form__done { margin-top: 16px; }

/* Modo de uso: passos numerados */
body.sd .sd-passos { counter-reset: sd-passo; margin: 0 0 1.1em !important; padding: 0 !important; list-style: none; }
body.sd .sd-passos > li { counter-increment: sd-passo; position: relative; margin: 0 0 18px; padding-left: 48px; }
body.sd .sd-passos > li::before {
	content: counter(sd-passo);
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	height: 30px;
	border: 1px solid var(--sd-sky);
	border-radius: 50%;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 28px;
	text-align: center;
	color: var(--sd-blue-deep);
}

/* Composição: lista completa recolhida */
body.sd .sd-produto__inci { border-block: 1px solid var(--sd-line); }
body.sd .sd-produto__inci summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 0;
	font-size: 0.9375rem;
	font-weight: 500;
	cursor: pointer;
	list-style: none;
}
body.sd .sd-produto__inci summary::-webkit-details-marker { display: none; }
body.sd .sd-produto__inci summary::after { content: "+"; font-size: 1.25rem; font-weight: 300; color: var(--sd-blue-deep); }
body.sd .sd-produto__inci[open] summary::after { content: "−"; }
body.sd .sd-produto__inci h3 {
	margin: 8px 0 8px !important;
	font-family: var(--sd-text) !important;
	font-size: 0.9375rem !important;
	font-weight: 500 !important;
	line-height: 1.5 !important;
	text-align: left !important;
}
body.sd .sd-produto__inci p { font-size: 0.875rem !important; line-height: 1.7 !important; color: var(--sd-ink-soft); }
/* Logo abaixo dos cards de "Na fórmula", como o fim daquela seção */
body.sd .sd-produto-composicao--anexa { padding-top: 0 !important; }

/* Perguntas frequentes (acordeão do tema) */
body.sd .sd-produto-faq > .elementor-container { max-width: 760px !important; }
body.sd .sd-produto-faq .elementor-widget-ideapark-accordion { width: 100% !important; max-width: none !important; }
/* O acordeão divide as perguntas em duas listas lado a lado: aqui, uma coluna só */
body.sd .sd-produto-faq .c-ip-accordion__wrap { display: block !important; width: auto !important; margin: 0 !important; }
body.sd .sd-produto-faq .c-ip-accordion__list { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
/* O tema soma 20px de margem no item e mais 20px sob a pergunta, mesmo fechada: só a linha separa */
body.sd .sd-produto-faq .c-ip-accordion__item { margin: 0 !important; border: 0 !important; border-bottom: 1px solid var(--sd-line) !important; }
body.sd .sd-produto-faq .c-ip-accordion__list:first-child .c-ip-accordion__item:first-child { border-top: 1px solid var(--sd-line) !important; }
/* O tema apaga a pergunta aberta (30%) e a resposta (65%): ficavam abaixo do contraste mínimo */
body.sd .sd-produto-faq :is(.c-ip-accordion__header, .c-ip-accordion__content) { opacity: 1 !important; }
/* Seta no meio da pergunta (o tema a fixa a 8px do topo); o giro do tema continua no transform */
body.sd .sd-produto-faq .c-ip-accordion__arrow { top: calc(50% - 4.5px) !important; }
body.sd .sd-produto-faq .c-ip-accordion__header { margin: 0 !important; padding-block: 18px !important; font-size: 1.0625rem !important; font-weight: 400 !important; line-height: 1.45 !important; }
body.sd .sd-produto-faq .c-ip-accordion__content,
body.sd .sd-produto-faq .c-ip-accordion__content p { font-size: 1rem; line-height: 1.7; color: var(--sd-ink-soft); }
/* Em grupos (Para a sua pele, Sobre o sérum, A compra): o nome do grupo em rótulo pequeno no
   Azul profundo, cada grupo com o seu acordeão; o primeiro item já vem aberto (js/produto.js) */
body.sd .sd-produto-faq .sd-faq__grupo { margin: 40px 0 0 !important; }
body.sd .sd-produto-faq .sd-faq__grupo:first-of-type,
body.sd .sd-produto-faq .elementor-widget-heading:not(.sd-eyebrow) + .sd-faq__grupo { margin-top: 0 !important; }
body.sd .sd-produto-faq .sd-faq__grupo .elementor-heading-title {
	margin: 0 0 10px !important;
	font-family: var(--sd-text) !important;
	font-size: var(--sd-caps-size) !important;
	font-weight: 500 !important;
	letter-spacing: var(--sd-caps-tracking) !important;
	line-height: 1.4 !important;
	text-align: left !important;
	text-transform: uppercase !important;
	color: var(--sd-blue-deep) !important;
}
body.sd .sd-produto-faq .sd-faq__grupo + .elementor-widget-ideapark-accordion .c-ip-accordion__list:first-child .c-ip-accordion__item:first-child { border-top: 1px solid var(--sd-line) !important; }
/* Fecho: uma dúvida sem resposta é a saída mais comum antes de comprar */
body.sd .sd-faq__fim { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin: 36px 0 0 !important; font-size: 0.9375rem; line-height: 1.5; color: var(--sd-ink-soft); }
body.sd .sd-faq__fim a { color: var(--sd-ink); text-decoration: underline; text-underline-offset: 4px; }

/* Convite: estreito e centralizado, como o fechamento da Sobre */
body.sd .sd-produto-convite { text-align: center; }
body.sd .sd-produto-convite > .elementor-container { max-width: 620px !important; }
body.sd .sd-produto-convite .sd-section__lead { margin-bottom: 32px !important; }
body.sd .sd-produto-convite .sd-section__lead .elementor-heading-title { max-width: 46ch; margin-inline: auto; }

/* -------------------------------------------------------------- página do Sérum de 10/2026
   (bloco do produto inteiro, inc/produto.php). Ritmo: texto, foto ao lado do texto, o painel
   azul claro do ingrediente (o momento de destaque, com os números em Trirong itálico), foto de
   novo, passos e, no fim, o convite sobre a textura fluida do MIV. Ícones em traço fino, na cor
   do texto ou no Azul, sem círculos nem caixas */

body.sd .sd-produto-secoes :is(.sd-produto-para-quem, .sd-produto-sente, .sd-produto-ingrediente, .sd-produto-textura, .sd-produto-uso, .sd-produto-dupla, .sd-produto-uso__cabecalho) .elementor-widget-wrap { display: block !important; }
body.sd .sd-produto-secoes .sd-produto-uso > .elementor-container { max-width: 1160px !important; }
body.sd .sd-produto-uso .sd-section__lead .elementor-heading-title { font-size: 1.0625rem !important; line-height: 1.6 !important; color: var(--sd-ink-soft) !important; }
body.sd .sd-produto-secoes :is(.sd-produto-sente, .sd-produto-ingrediente, .sd-produto-textura) > .elementor-container { max-width: 1160px !important; }
body.sd .sd-produto-secoes .sd-produto-dupla .elementor-widget-text-editor p { margin: 0 0 1em; font-size: 1rem; line-height: 1.75; }
body.sd .sd-produto-secoes .sd-produto-dupla .elementor-widget-text-editor strong { font-weight: 500; }
body.sd .sd-produto-secoes :is(.sd-produto-provas, .sd-produto-passos) h3 {
	margin: 0 0 6px !important;
	font-family: var(--sd-text) !important;
	font-size: 1rem !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-align: inherit !important;
	color: var(--sd-ink);
}
body.sd .sd-produto-secoes :is(.sd-produto-provas, .sd-produto-passos) p { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: var(--sd-ink-soft); }
/* O tema preenche os SVG: aqui só o traço, como nas garantias */
body.sd .sd-produto-secoes .sd-produto-tecnica svg { flex: none; color: var(--sd-blue); }
body.sd .sd-produto-secoes .sd-produto-tecnica svg,
body.sd .sd-produto-secoes .sd-produto-tecnica svg * { fill: none !important; stroke: currentColor !important; }

/* Para quem é: os quatro perfis lado a lado, entre fios finos, com o nome em Trirong itálico e
   o detalhe abaixo, menor (no tablet, dois a dois; no celular, um embaixo do outro) */
body.sd .sd-produto-secoes .sd-produto-para-quem > .elementor-container { max-width: 1160px !important; }
body.sd .sd-produto-perfis {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: clamp(24px, 3vw, 40px) 0 0;
	padding: 0;
	list-style: none;
	border-block: 1px solid var(--sd-line);
}
body.sd .sd-produto-perfis li { margin: 0; padding: clamp(28px, 3vw, 36px) clamp(20px, 2.4vw, 28px) clamp(32px, 3.4vw, 40px); }
body.sd .sd-produto-perfis li + li { border-left: 1px solid var(--sd-line); }
body.sd .sd-produto-perfis strong {
	display: block;
	margin: 0 0 12px;
	font-family: var(--sd-accent);
	font-style: italic;
	font-weight: var(--sd-accent-weight);
	font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.625rem);
	line-height: 1.2;
	color: var(--sd-ink);
	text-wrap: balance;
}
body.sd .sd-produto-perfis span { display: block; font-size: 0.9375rem; line-height: 1.6; color: var(--sd-ink-soft); }

/* Foto de um lado, texto do outro (na textura, a foto à direita) */
body.sd .sd-produto-dupla > .elementor-container { gap: clamp(32px, 6vw, 96px); align-items: center; }
body.sd .sd-produto-dupla :is(.sd-eyebrow, h2) .elementor-heading-title { text-align: left; }
/* Foto com dois recortes (<picture>: 4:5 no desktop, 4:3 no celular) ou widget de imagem */
body.sd picture.sd-produto-dupla__foto { display: block; }
body.sd .sd-produto-dupla__foto img { display: block; width: 100%; aspect-ratio: 4 / 5; max-height: 640px; object-fit: cover; border-radius: 4px; }
body.sd .sd-produto-dupla__texto .elementor-widget-wrap { max-width: 32rem; }

/* Selo em pílula de contorno terracota (o prêmio, na pele) */
body.sd .sd-produto-selo { margin: -4px 0 28px !important; }
body.sd .sd-produto-selo span {
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid var(--sd-clay);
	border-radius: var(--sd-pill);
	font-size: var(--sd-caps-size);
	font-weight: 500;
	letter-spacing: var(--sd-caps-tracking);
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--sd-clay);
}

/* Linha técnica (MIV): ícone fino e texto pequeno, em frase, marrom suave */
body.sd .sd-produto-tecnica {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 24px;
	margin: 28px 0 0;
	padding: 24px 0 0;
	border-top: 1px solid var(--sd-line);
	list-style: none;
}
body.sd .sd-produto-tecnica li { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 0.875rem; line-height: 1.4; color: var(--sd-ink-soft); }
body.sd .sd-produto-tecnica svg { width: 22px; height: 22px; }

/* O ingrediente: o momento forte da página, imersivo. A foto da gota cobre a faixa inteira, de
   ponta a ponta, com o texto à direita sobre um véu do Azul profundo e os três destaques, em
   Trirong itálico, no pé da imagem. A faixa cabe numa tela de notebook (630px) */
body.sd .sd-produto-secoes section.sd-produto-ingrediente {
	position: relative;
	width: 100vw;
	max-width: none;
	min-height: 630px;
	margin: 0 0 clamp(8px, 2vw, 24px) calc(50% - 50vw) !important;
	padding: 0 !important;
	background: var(--sd-blue-deep);
	overflow: hidden;
}
/* A foto se posiciona pela seção inteira (e não só pelo bloco do texto): os contêineres do meio
   deixam de ser referência */
body.sd .sd-produto-secoes section.sd-produto-ingrediente > .elementor-container,
body.sd .sd-produto-secoes section.sd-produto-ingrediente > .elementor-container > .elementor-column,
body.sd .sd-produto-secoes section.sd-produto-ingrediente > .elementor-container > .elementor-column > .elementor-widget-wrap,
body.sd .sd-produto-ingrediente .sd-produto-dupla,
body.sd .sd-produto-ingrediente .sd-produto-dupla > .elementor-container { position: static !important; max-width: none !important; }
body.sd .sd-produto-ingrediente :is(p, h2, h3, li, strong, .elementor-heading-title) { color: var(--sd-white) !important; }
body.sd .sd-produto-ingrediente .sd-produto-dupla > .elementor-container { gap: 0; align-items: stretch; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__media { position: absolute !important; inset: 0; z-index: 0; width: 100% !important; overflow: hidden; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__media::after {
	content: "";
	position: absolute;
	inset: 0;
	/* Em cima, a foto nasce do azul (onde pousa a foto de "Na pele"); embaixo, escurece para os
	   destaques; à direita, o véu do texto */
	background:
		linear-gradient(180deg, var(--sd-blue-deep) 0%, rgba(86, 113, 139, 0) 18%),
		linear-gradient(0deg, rgba(86, 113, 139, 0.96) 0%, rgba(86, 113, 139, 0.6) 26%, rgba(86, 113, 139, 0) 46%),
		linear-gradient(90deg, rgba(86, 113, 139, 0) 38%, rgba(86, 113, 139, 0.85) 58%, var(--sd-blue-deep) 100%);
	pointer-events: none;
}
body.sd .sd-produto-ingrediente .sd-produto-dupla__media :is(.elementor-widget-wrap, .elementor-widget, .elementor-widget-container, .sd-produto-dupla__foto) { height: 100%; }
/* Textura sobre a faixa (foto e véu): luz e sombra de pétalas desfocadas e a foto de pétalas bem
   apagada, numa imagem em cinza (o cinza médio não muda nada no soft-light); só dá profundidade ao
   azul, dos dois lados */
body.sd .sd-produto-ingrediente .sd-produto-dupla__media::after { z-index: 2; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__media::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	background: url("../img/produto/serum-ingrediente-petalas.webp") center / cover no-repeat;
	mix-blend-mode: soft-light;
	opacity: 0.29;
	filter: blur(2px);
	pointer-events: none;
}
body.sd .sd-produto-ingrediente .sd-produto-dupla__foto picture { display: block; height: 100%; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__foto img { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; object-position: 30% center; border-radius: 0; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__texto { position: relative !important; z-index: 1; width: 46% !important; margin-left: auto; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__texto .elementor-widget-wrap { max-width: 38rem; padding: 96px clamp(24px, 6vw, 88px) 0 24px !important; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__texto h2 { font-size: 2rem !important; line-height: 1.15 !important; }
body.sd .sd-produto-ingrediente .sd-produto-dupla__texto h2 em { display: block; }
body.sd .sd-produto-ingrediente .elementor-widget:has(.sd-produto-provas) { position: relative; z-index: 1; }
/* Enquanto a foto não chega: um esboço do clima (o âmbar à esquerda, em luz fria) com o briefing */
body.sd .sd-produto-ingrediente .sd-foto-reservada {
	height: 100%;
	max-height: none;
	aspect-ratio: auto;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 0 0 40px 6%;
	border: 0;
	border-radius: 0;
	text-align: left;
	background:
		radial-gradient(ellipse at 28% 58%, rgba(214, 150, 96, 0.95) 0 9%, rgba(187, 103, 71, 0.55) 16%, transparent 32%),
		radial-gradient(ellipse at 20% 30%, rgba(255, 255, 255, 0.35), transparent 40%),
		linear-gradient(115deg, var(--sd-sky) 0%, var(--sd-blue) 45%, var(--sd-blue-deep) 100%);
}
body.sd .sd-produto-ingrediente .sd-foto-reservada figcaption { position: relative; z-index: 2; max-width: 24em; color: rgba(255, 255, 255, 0.92); }
body.sd .sd-produto-ingrediente .sd-foto-reservada :is(strong, .sd-foto-reservada__rotulo, .sd-foto-reservada__formato) { color: var(--sd-white) !important; }
body.sd .sd-produto-ingrediente .sd-foto-reservada svg { color: var(--sd-white); }
/* Pílula de contorno branco (o terracota não conversa com o Azul profundo), com a bandeira do
   Brasil (retângulo em traço, losango cheio e círculo vazado) antes de "Inédito no Brasil":
   SVG do tema como máscara, pintado na cor do texto */
body.sd .sd-produto-ingrediente .sd-produto-selo { margin: 0 0 24px !important; }
body.sd .sd-produto-ingrediente .sd-produto-selo span {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	border-color: rgba(255, 255, 255, 0.7);
	color: var(--sd-white);
}
body.sd .sd-produto-ingrediente .sd-produto-selo span::before {
	content: "";
	flex: none;
	width: 19px;
	height: 13.3px;
	background: currentColor;
	-webkit-mask: url("../img/bandeira-brasil.svg") center / contain no-repeat;
	mask: url("../img/bandeira-brasil.svg") center / contain no-repeat;
}
body.sd .sd-produto-provas {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	max-width: 1160px;
	margin: 64px auto 0;
	padding: 0 16px 28px;
	list-style: none;
}
body.sd .sd-produto-provas > li { margin: 0; padding: 4px clamp(20px, 3vw, 44px); }
body.sd .sd-produto-provas > li:first-child { padding-left: 0; }
body.sd .sd-produto-provas > li:last-child { padding-right: 0; }
body.sd .sd-produto-provas > li + li { border-left: 1px solid rgba(255, 255, 255, 0.3); }
body.sd .sd-produto-secoes .sd-produto-provas p.sd-produto-provas__destaque {
	margin: 0 0 12px;
	font-family: var(--sd-accent) !important;
	font-style: italic !important;
	font-weight: var(--sd-accent-weight) !important;
	font-size: 1.375rem !important;
	line-height: 1.2 !important;
	text-wrap: balance;
}
body.sd .sd-produto-secoes .sd-produto-ingrediente .sd-produto-provas p:not(.sd-produto-provas__destaque) { font-size: 0.875rem; line-height: 1.6; }

/* Na pele e o ingrediente costurados: a foto de "Na pele" começa na altura do título e desce
   até pousar no começo da faixa azul do ingrediente, com uma sombra discreta (do notebook em
   diante; no tablet e no celular, cada seção no seu lugar) */
@media (min-width: 1024px) {
	body.sd .sd-produto-secoes section.sd-produto-sente:has(.sd-produto-dupla) { position: relative; z-index: 3; padding-bottom: 40px !important; }
	/* A coluna da foto acompanha a altura do texto; a foto começa na altura do título e passa
	   80px do fim da seção (os 40px de respiro + 80px dentro do azul), qualquer que seja o texto */
	body.sd .sd-produto-sente .sd-produto-dupla > .elementor-container { align-items: stretch; }
	body.sd .sd-produto-sente .sd-produto-dupla__media > .elementor-widget-wrap { position: relative; height: 100%; }
	body.sd .sd-produto-sente .sd-produto-dupla__media .elementor-widget:has(picture) { position: absolute; top: 38px; bottom: -120px; left: 0; right: 0; margin: 0; }
	body.sd .sd-produto-sente .sd-produto-dupla__media .elementor-widget:has(picture) .elementor-widget-container,
	body.sd .sd-produto-sente picture.sd-produto-dupla__foto { height: 100%; }
	body.sd .sd-produto-sente .sd-produto-dupla__texto .elementor-widget-wrap { max-width: none; }
	body.sd .sd-produto-sente picture.sd-produto-dupla__foto img {
		height: 100%;
		aspect-ratio: auto;
		max-height: none;
		box-shadow: 0 1px 2px rgba(31, 45, 60, 0.08), 0 12px 28px -10px rgba(31, 45, 60, 0.22), 0 36px 72px -28px rgba(31, 45, 60, 0.42);
	}
	body.sd .sd-produto-sente .sd-produto-tecnica { grid-template-columns: repeat(4, auto); justify-content: start; gap: 12px 28px; }
	body.sd .sd-produto-sente .sd-produto-tecnica li:last-child { max-width: 15em; }
	/* A foto do ingrediente tem largura fixa, presa ao centro do layout (não à borda da janela), com
	   o ramo grande, saindo de baixo; as bordas se dissolvem no azul da faixa */
	body.sd .sd-produto-ingrediente .sd-produto-dupla__foto img {
		width: 1720px;
		max-width: none;
		margin-left: calc(50% - 720px + 20px);
		object-position: 30% 40%;
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 80%, transparent 100%);
		mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 80%, transparent 100%);
	}
}
/* Abaixo de 1192px o layout encolhe com a janela: o ramo acompanha o meio da coluna da esquerda */
@media (min-width: 1024px) and (max-width: 1191px) {
	body.sd .sd-produto-ingrediente .sd-produto-dupla__foto img { margin-left: calc(25% - 402px); }
}
/* Texto justificado, sem hifenização, nas colunas largas; no celular, alinhado à esquerda */
@media (min-width: 768px) {
	body.sd .sd-produto-sente .sd-produto-dupla .elementor-widget-text-editor p,
	body.sd .sd-produto-ingrediente .sd-produto-dupla__texto .elementor-widget-text-editor p { text-align: justify; text-align-last: left; hyphens: manual; }
}
body.sd .sd-produto-secoes .sd-produto-ingrediente .sd-produto-provas p { color: var(--sd-white) !important; }

/* Foto ainda a produzir: espaço reservado com a descrição da foto (sai quando a foto chegar) */
body.sd .sd-foto-reservada {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin: 0;
	padding: 32px;
	aspect-ratio: 4 / 5;
	max-height: 640px;
	background: color-mix(in srgb, var(--sd-sky) 22%, var(--sd-paper));
	border: 1px solid var(--sd-sky);
	border-radius: 4px;
	text-align: center;
}
body.sd .sd-foto-reservada svg { width: 36px; height: 36px; color: var(--sd-blue); }
body.sd .sd-foto-reservada svg,
body.sd .sd-foto-reservada svg * { fill: none !important; stroke: currentColor !important; }
body.sd .sd-foto-reservada figcaption { display: flex; flex-direction: column; gap: 8px; max-width: 22em; font-size: 0.875rem; line-height: 1.6; color: var(--sd-ink-soft); }
body.sd .sd-foto-reservada strong { font-family: var(--sd-accent); font-style: italic; font-weight: 300; font-size: var(--sd-step-1); line-height: 1.3; color: var(--sd-ink); }
body.sd .sd-foto-reservada__rotulo { font-size: var(--sd-caps-size); font-weight: 500; letter-spacing: var(--sd-caps-tracking); text-transform: uppercase; color: var(--sd-blue-deep); }
body.sd .sd-foto-reservada__formato { font-size: 0.8125rem; color: var(--sd-blue-deep); }

/* A textura, em tríptico: título centrado e a foto no meio, entre o que ela sente (com a ficha
   sensorial, em réguas finas) e a decisão de fórmula. No celular, a foto vem logo depois do título */
body.sd .sd-produto-textura .sd-produto-triptico { margin-top: clamp(32px, 5vw, 64px) !important; }
body.sd .sd-produto-triptico > .elementor-container { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 380px) minmax(0, 1fr); gap: clamp(40px, 5vw, 64px); align-items: center; }
body.sd .sd-produto-triptico > .elementor-container > .elementor-column { width: auto !important; }
body.sd .sd-produto-triptico__titulo .elementor-heading-title { margin: 0 0 14px; font-family: var(--sd-accent) !important; font-size: 1.5rem !important; font-style: italic !important; font-weight: 300 !important; line-height: 1.2 !important; color: var(--sd-ink); }
body.sd .sd-produto-triptico__lado .elementor-widget-text-editor p { margin: 0; }

body.sd .sd-produto-secoes :is(.sd-produto-ficha, .sd-produto-fatos) { margin: 22px 0 0; padding: 0; border-top: 1px solid var(--sd-line); list-style: none; }
body.sd .sd-produto-secoes :is(.sd-produto-ficha, .sd-produto-fatos) li { margin: 0; border-bottom: 1px solid var(--sd-line); }
body.sd .sd-produto-ficha li { display: grid; gap: 8px; padding: 12px 0 14px; }
body.sd .sd-produto-ficha__nome { font-size: var(--sd-caps-size); font-weight: 500; letter-spacing: var(--sd-caps-tracking); text-transform: uppercase; color: var(--sd-ink-soft); }
body.sd .sd-produto-ficha__escala { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; font-size: 0.8125rem; color: var(--sd-ink-soft); }
body.sd .sd-produto-ficha__escala b { font-family: var(--sd-accent); font-size: 1.0625rem; font-style: italic; font-weight: 300; color: var(--sd-ink); }
body.sd .sd-produto-ficha__regua { position: relative; height: 1px; background: var(--sd-sky); }
body.sd .sd-produto-ficha__regua i { position: absolute; top: 50%; width: 11px; height: 11px; border-radius: 50%; background: var(--sd-blue-deep); box-shadow: 0 0 0 4px var(--sd-paper); transform: translate(-50%, -50%); }
body.sd .sd-produto-fatos li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; font-size: 0.875rem; color: var(--sd-ink-soft); }
body.sd .sd-produto-fatos b { font-weight: 500; color: var(--sd-ink); }
@media (max-width: 767px) {
	body.sd .sd-produto-textura .elementor-heading-title { text-align: left !important; }
	body.sd .sd-produto-triptico > .elementor-container { grid-template-columns: minmax(0, 1fr); gap: 36px; }
	body.sd .sd-produto-triptico__foto { order: -1; }
}

/* Modo de uso, cinemático: título à esquerda e frase à direita, o vídeo da aplicação panorâmico
   de ponta a ponta e, abaixo, os quatro passos em colunas, com o nome em Trirong itálico */
body.sd .sd-produto-secoes .sd-produto-uso__cabecalho .elementor-widget-wrap { display: block !important; }
body.sd .sd-produto-uso__cabecalho > .elementor-container { gap: clamp(32px, 5vw, 64px); align-items: flex-end; }
body.sd .sd-produto-uso__cabecalho .elementor-heading-title { text-align: left !important; }
body.sd .sd-produto-uso__cabecalho h2 { margin: 0 !important; }
body.sd .sd-produto-uso .sd-section__lead { max-width: 30em; margin: 0 0 6px !important; }
body.sd .sd-produto-uso .sd-section__lead .elementor-heading-title { text-align: left !important; }
/* A seção ocupa a tela toda, como a faixa do ingrediente: as duas fotos (Limpe e Aplique)
   sangram até as bordas, e o cabeçalho e os passos ficam na largura de sempre */
body.sd .sd-produto-secoes section.sd-produto-uso { width: 100vw; max-width: none; margin-left: calc(50% - 50vw) !important; padding-inline: 0 !important; }
body.sd .sd-produto-secoes section.sd-produto-uso > .elementor-container { max-width: none !important; }
body.sd .sd-produto-uso__cabecalho > .elementor-container,
body.sd .sd-produto-uso .sd-produto-passos { max-width: 1160px; margin-inline: auto; padding-inline: 16px; }
/* As duas fotos dividem a faixa ao meio, encostadas uma na outra; altura de notebook,
   para as fotos e os quatro passos caberem juntos na tela */
body.sd .sd-produto-uso .elementor-widget:has(.sd-produto-uso__fotos) { margin-top: clamp(16px, 2vw, 28px) !important; }
body.sd .sd-produto-uso__fotos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; height: min(420px, 28vw); }
body.sd .sd-produto-uso__fotos picture { display: block; min-width: 0; height: 100%; overflow: hidden; }
body.sd .sd-produto-uso__fotos img { display: block; width: 100%; height: 100% !important; max-width: none; object-fit: cover; }
body.sd .sd-produto-passos {
	counter-reset: sd-passo;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: clamp(32px, 4vw, 48px) 0 0;
	padding: 0;
	list-style: none;
}
body.sd .sd-produto-passos > li { counter-increment: sd-passo; margin: 0; padding: 4px clamp(20px, 2.6vw, 36px); }
body.sd .sd-produto-passos > li:first-child { padding-left: 0; }
body.sd .sd-produto-passos > li:last-child { padding-right: 0; }
body.sd .sd-produto-passos > li + li { border-left: 1px solid var(--sd-line); }
/* Abaixo da largura máxima, o cabeçalho e os passos ficam na margem das outras seções: a seção
   sangra e não herda a margem da página (46px; no celular, 30px, no bloco de 767px) */
@media (max-width: 1189px) {
	body.sd .sd-produto-uso__cabecalho > .elementor-container,
	body.sd .sd-produto-uso .sd-produto-passos { max-width: none; padding-inline: 46px; }
}
body.sd .sd-produto-passos > li::before {
	content: "0" counter(sd-passo);
	display: block;
	margin-bottom: 18px;
	font-size: var(--sd-caps-size);
	font-weight: 500;
	letter-spacing: 0.14em;
	color: var(--sd-clay);
}
body.sd .sd-produto-secoes .sd-produto-passos h3 {
	margin: 0 0 10px !important;
	font-family: var(--sd-accent) !important;
	font-style: italic !important;
	font-weight: var(--sd-accent-weight) !important;
	font-size: clamp(1.625rem, 1.3rem + 1vw, 1.875rem) !important;
	line-height: 1.1 !important;
}
body.sd .sd-produto-passos a { color: inherit; text-decoration: underline; text-decoration-color: var(--sd-line); text-underline-offset: 4px; }
body.sd .sd-produto-passos a:hover { color: var(--sd-ink); text-decoration-color: currentColor; }

/* Na fórmula em índice: miniatura redonda e texto, em duas colunas separadas por fio fino; a lista
   completa (composição, logo abaixo) fecha o índice como a última linha */
body.sd .sd-produto-formula:has(.sd-produto-cards--indice) { padding-bottom: 0 !important; }
body.sd .sd-produto-formula:has(.sd-produto-cards--indice) > .elementor-container { max-width: 980px !important; }
body.sd .sd-produto-cards--indice > .elementor-container { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 64px; border-top: 1px solid var(--sd-line); }
body.sd .sd-produto-cards--indice .sd-produto-card { display: flex; border-bottom: 1px solid var(--sd-line); }
body.sd .sd-produto-cards--indice .sd-produto-card .elementor-widget-wrap { display: grid !important; grid-template-columns: 132px minmax(0, 1fr); grid-template-rows: 1fr auto auto 1fr; column-gap: 24px; padding: 28px 0 !important; }
body.sd .sd-produto-cards--indice .elementor-widget { margin: 0 !important; }
body.sd .sd-produto-cards--indice .sd-produto-card__foto { grid-row: 1 / -1; align-self: center; }
body.sd .sd-produto-cards--indice .sd-produto-card__nome { grid-row: 2; }
body.sd .sd-produto-cards--indice .elementor-widget-text-editor { grid-row: 3; }
body.sd .sd-produto-cards--indice .sd-produto-card__foto img { aspect-ratio: 1; border-radius: 50%; }
body.sd .sd-produto-cards--indice .sd-produto-card__nome { margin-bottom: 8px !important; }
body.sd .sd-produto-secoes > :has(.sd-produto-cards--indice) + .sd-produto-composicao--anexa .sd-produto-secao__inner { max-width: 980px; }
body.sd .sd-produto-secoes > :has(.sd-produto-cards--indice) + .sd-produto-composicao--anexa .sd-produto__inci { border-top: 0; }

/* Quem criou: citação curta, em Trirong itálico (sd-quote, como na Sobre) */
body.sd .sd-quote--curta { margin: 8px 0 0; }

/* Convite sobre a textura fluida (fundo da seção, no Elementor), num painel como o da newsletter */
body.sd .sd-produto-secoes .sd-produto-convite--textura { margin: 0 16px !important; padding: clamp(56px, 8vw, 104px) 20px !important; border-radius: 4px; background-position: center !important; }
body.sd .sd-produto-convite--textura .sd-section__lead .elementor-heading-title { color: var(--sd-ink) !important; }
/* A compra no próprio convite (js/produto.js): a versão em pílulas que espelham as do topo, o
   botão de sempre e, abaixo dele, o preço com as parcelas */
body.sd .sd-produto-convite__versoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 24px; }
body.sd .sd-produto-convite__versoes:empty { display: none; }
body.sd .sd-produto-convite__versao {
	padding: 9px 16px;
	border: 1px solid rgba(49, 38, 29, 0.35);
	border-radius: var(--sd-pill);
	background: rgba(255, 255, 255, 0.5);
	font: inherit;
	font-size: 0.8125rem;
	line-height: 1.3;
	color: var(--sd-ink);
	transition: background-color .2s var(--sd-ease), border-color .2s var(--sd-ease), color .2s var(--sd-ease);
}
body.sd .sd-produto-convite__versao:hover { border-color: var(--sd-ink); }
body.sd .sd-produto-convite__versao.is-active { background: var(--sd-ink); border-color: var(--sd-ink); color: var(--sd-white); }
body.sd .sd-produto-convite__preco { margin: 18px 0 0 !important; font-size: 0.9375rem; line-height: 1.5; color: var(--sd-ink); }
body.sd .sd-produto-convite__preco:empty { display: none; }
body.sd .sd-produto-convite__preco del { color: var(--sd-ink-soft); }
body.sd .sd-produto-convite__preco ins { margin-left: 6px; font-weight: 500; text-decoration: none; }
body.sd .sd-produto-convite .sd-section__lead { margin-bottom: 24px !important; }
@media (min-width: 1192px) {
	body.sd .sd-produto-secoes .sd-produto-convite--textura { max-width: 1160px; margin-inline: auto !important; }
}

@media (max-width: 1023px) {
	body.sd .sd-produto-perfis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.sd .sd-produto-perfis li:nth-child(3) { border-left: 0; }
	body.sd .sd-produto-perfis li:nth-child(n+3) { border-top: 1px solid var(--sd-line); }
	body.sd .sd-produto-provas > li { padding-inline: 20px; }
}
@media (max-width: 767px) {
	body.sd .sd-produto-perfis,
	body.sd .sd-produto-provas { grid-template-columns: minmax(0, 1fr); }
	body.sd .sd-produto-perfis li { padding: 24px 0; }
	body.sd .sd-produto-perfis li + li { border-left: 0; border-top: 1px solid var(--sd-line); }
	body.sd .sd-produto-provas { margin-top: 40px; padding: 0 30px 48px; }
	body.sd .sd-produto-provas > li { padding: 24px 0; }
	body.sd .sd-produto-provas > li:first-child { padding-top: 0; }
	body.sd .sd-produto-provas > li + li { border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.3); }
	body.sd .sd-produto-provas > li:last-child { padding-bottom: 0; }
	/* No celular, a imagem em cima (sem véu lateral, só se dissolvendo no azul) e, embaixo, o texto
	   e os destaques */
	body.sd .sd-produto-secoes section.sd-produto-ingrediente { min-height: 0; }
	body.sd .sd-produto-ingrediente .sd-produto-dupla__media { position: relative !important; inset: auto; height: auto; }
	body.sd .sd-produto-ingrediente .sd-produto-dupla__media::after { background: linear-gradient(180deg, rgba(86, 113, 139, 0) 60%, var(--sd-blue-deep) 96%); }
	/* No celular a textura acaba no pé da foto: some aos poucos, junto com a foto, para não marcar a emenda */
	body.sd .sd-produto-ingrediente .sd-produto-dupla__media::before {
		background-size: cover;
		background-position: left top;
		-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 45%, transparent 92%);
		mask-image: linear-gradient(180deg, #000 0%, #000 45%, transparent 92%);
	}
	body.sd .sd-produto-ingrediente .sd-produto-dupla__foto img { aspect-ratio: 4 / 3; height: auto; }
	body.sd .sd-produto-ingrediente .sd-foto-reservada { height: auto; min-height: 300px; aspect-ratio: auto; justify-content: flex-start; padding: 40px 24px 32px; }
	/* No celular, a foto tem recorte próprio (4:3, centrado na planta) */
	body.sd .sd-produto-ingrediente .sd-produto-dupla__foto img { object-position: center; }
	body.sd .sd-produto-ingrediente .sd-produto-dupla__texto { width: 100% !important; margin: 0; }
	/* A faixa vai de borda a borda; o texto fica na margem das outras seções (30px) */
	body.sd .sd-produto-ingrediente .sd-produto-dupla__texto .elementor-widget-wrap { padding: 40px 30px 0 !important; }
	body.sd .sd-foto-reservada { aspect-ratio: 4 / 3; padding: 24px; }
	body.sd .sd-produto-tecnica { grid-template-columns: minmax(0, 1fr); }
	body.sd .sd-produto-uso__cabecalho > .elementor-container { flex-direction: column; align-items: flex-start; }
	body.sd .sd-produto-uso__cabecalho .elementor-column { width: 100% !important; }
	/* No celular, um carrossel de duas fotos 4:3, com a segunda aparecendo na borda */
	body.sd .sd-produto-uso .elementor-widget:has(.sd-produto-uso__fotos) { margin-top: 14px !important; }
	body.sd .sd-produto-uso__cabecalho > .elementor-container,
	body.sd .sd-produto-uso .sd-produto-passos { padding-inline: 30px; }
	body.sd .sd-produto-uso__fotos { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 86%; gap: 8px; height: auto; overflow-x: auto; scroll-snap-type: x mandatory; padding-inline: 30px; scroll-padding-inline: 30px; scrollbar-width: none; }
	body.sd .sd-produto-uso__fotos::-webkit-scrollbar { display: none; }
	body.sd .sd-produto-uso__fotos picture { aspect-ratio: 4 / 3; height: auto; scroll-snap-align: start; border-radius: 4px; }
	/* Dois por linha, com o conteúdo centralizado em cada metade, dos dois lados do fio */
	body.sd .sd-produto-passos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 0; }
	body.sd .sd-produto-passos > li { padding: 0 10px !important; text-align: center; }
	body.sd .sd-produto-passos > li:nth-child(odd) { border-left: 0; }
	body.sd .sd-produto-passos p { text-wrap: balance; }
	body.sd .sd-produto-dupla > .elementor-container { flex-direction: column; }
	body.sd .sd-produto-dupla .elementor-column { width: 100% !important; }
	body.sd .sd-produto-dupla__foto img { aspect-ratio: 4 / 3; }
	body.sd .sd-produto-cards.sd-produto-cards--indice > .elementor-container { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); grid-auto-columns: auto; overflow: visible; margin-inline: 0; padding-inline: 0; }
	body.sd .sd-produto-cards--indice .sd-produto-card .elementor-widget-wrap { grid-template-columns: 84px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 18px; padding: 22px 0 !important; }
	body.sd .sd-produto-cards--indice .sd-produto-card__foto { align-self: start; }
	body.sd .sd-produto-cards--indice .sd-produto-card__nome { grid-row: 1; margin-bottom: 4px !important; }
	body.sd .sd-produto-cards--indice .elementor-widget-text-editor { grid-row: 2; }
	body.sd .sd-produto-cards--indice .sd-produto-card__nome .elementor-heading-title { font-size: 1.125rem !important; }
}

/* Para completar a rotina (relacionados, woocommerce/single-product/related.php): cabeçalho como
   o das seções (rótulo e título com o destaque), os cards na ordem da loja e, em cada um, a linha
   "por que combina" e o botão "Ver o produto" (inc/loja.php) */
body.sd.single-product .c-product__products--related { margin-top: 0 !important; padding-top: clamp(28px, 2.8vw, 40px); }
body.sd .sd-relacionados__cabecalho { text-align: center; }
body.sd .sd-relacionados__cabecalho .sd-eyebrow { margin: 0 0 20px; }
body.sd.single-product .c-product__products--related .c-product__products-title {
	margin: 0 0 clamp(24px, 3vw, 40px) !important;
	font-family: var(--sd-display) !important;
	font-weight: var(--sd-display-weight) !important;
	font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem) !important;
	line-height: 1.15 !important;
	letter-spacing: -0.01em !important;
	text-transform: none !important;
	text-align: center;
	color: var(--sd-ink);
}
body.sd .sd-relacionados .c-product__products-title em { font-family: var(--sd-accent); font-style: italic; font-weight: var(--sd-accent-weight); }
body.sd .sd-card__combina { margin: 10px 0 0 !important; font-size: 0.875rem !important; line-height: 1.5 !important; color: var(--sd-ink-soft) !important; }

@media (max-width: 767px) {
	/* No celular, as seções usam só a margem da página (a mesma da compra, no topo): o respiro
	   lateral delas somava 46px de cada lado e estreitava fotos e textos */
	body.sd .sd-produto-secao,
	body.sd .sd-produto-secoes .elementor-top-section { padding-inline: 0 !important; }
	body.sd .sd-produto-secoes .elementor-top-section.sd-produto-convite--textura { margin-inline: 0 !important; padding-inline: 20px !important; }
	body.sd .sd-produto-sente :is(.e-con, .e-con-inner):has(> .elementor-widget-ideapark-image-list-1),
	body.sd .sd-produto-sente .c-ip-image-list-1__list:has(> .c-ip-image-list-1__item + .c-ip-image-list-1__item) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	body.sd .sd-produto-fundadora > .elementor-container { flex-direction: column; }
	body.sd .sd-produto-fundadora .elementor-column { width: 100% !important; }
	/* No celular, os cards de ingrediente deslizam para o lado */
	body.sd .sd-produto-cards > .elementor-container {
		grid-template-columns: none;
		grid-auto-flow: column;
		grid-auto-columns: 74%;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		padding-bottom: 8px;
		margin-inline: -16px;
		padding-inline: 16px;
		scroll-padding-inline: 16px;
	}
	body.sd .sd-produto-card { scroll-snap-align: start; }
}

/* -------------------------------------------------------------- página nova do Soft Clean (11/2026)
   (bloco "Soft Clean (v2, 11/2026)", migration 202611*-soft-clean-pagina-nova-previa). O mesmo ritmo
   da página do Sérum, com duas peças próprias: o "Para quem é" com a frase como título e os perfis
   numerados, e o destaque num painel azul claro de borda a borda, o oposto da faixa escura do Sérum
   (clara, texto marrom, foto sangrando pela direita), para as páginas serem irmãs sem serem cópias */

/* Para quem é: a frase é o título (H2 grande, com o fecho em Trirong) e os perfis do Sérum ganham a
   numeração em terracota, como os passos */
body.sd .sd-produto-para-quem .sd-produto-para-quem__frase .elementor-heading-title { max-width: 24em; margin-inline: auto; font-size: clamp(1.875rem, 1.4rem + 1.6vw, 2.75rem) !important; line-height: 1.2 !important; }
body.sd .sd-produto-para-quem .sd-produto-para-quem__frase .elementor-heading-title em { display: block; }
body.sd .sd-produto-perfis--numerados { margin-top: clamp(32px, 4vw, 56px); }
body.sd .sd-produto-perfis__n { display: block; margin: 0 0 14px; font-size: var(--sd-caps-size); font-weight: 500; letter-spacing: 0.14em; color: var(--sd-clay); }
body.sd .sd-produto-perfis--numerados strong { font-size: clamp(1.25rem, 1rem + 0.7vw, 1.5rem); }

/* Destaque do Soft Clean: painel azul claro de borda a borda (o oposto da faixa escura do Sérum),
   texto marrom à esquerda, a foto sangrando pela direita e as três provas embaixo */
body.sd .sd-produto-secoes section.sd-produto-destaque { position: relative; width: 100vw; max-width: none; margin: 0 0 clamp(8px, 2vw, 24px) calc(50% - 50vw) !important; padding: 0 !important; background: var(--sd-sky); overflow: hidden; }
body.sd .sd-produto-secoes section.sd-produto-destaque > .elementor-container { max-width: none !important; }
body.sd .sd-produto-destaque .sd-produto-dupla > .elementor-container { max-width: none !important; gap: 0; align-items: stretch; }
body.sd .sd-produto-destaque .sd-produto-dupla__texto { width: 50% !important; }
body.sd .sd-produto-destaque .sd-produto-dupla__texto .elementor-widget-wrap { max-width: none; box-sizing: content-box; width: min(100% - 48px, 500px); margin-left: auto; padding: clamp(48px, 6vw, 80px) clamp(32px, 5vw, 72px) clamp(32px, 4vw, 56px) 24px !important; }
/* Do notebook em diante a foto de "Na pele" pousa 80px dentro do painel, na mesma coluna do texto:
   o texto desce para o selo não encostar nela */
@media (min-width: 1024px) { body.sd .sd-produto-destaque .sd-produto-dupla__texto .elementor-widget-wrap { padding-top: 136px !important; } }
@media (min-width: 1192px) { body.sd .sd-produto-destaque .sd-produto-dupla__texto .elementor-widget-wrap { padding-left: calc(50vw - 580px + 16px) !important; margin-left: 0; width: auto; max-width: 36rem; } }
body.sd .sd-produto-destaque .sd-produto-dupla__media { width: 50% !important; }
body.sd .sd-produto-destaque .sd-produto-dupla__media :is(.elementor-widget-wrap, .elementor-widget, picture) { height: 100%; }
body.sd .sd-produto-destaque .sd-produto-dupla__foto img { height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; border-radius: 0; }
body.sd .sd-produto-destaque .sd-foto-reservada { height: 100%; min-height: 460px; max-height: none; aspect-ratio: auto; border: 0; border-left: 1px solid rgba(255, 255, 255, 0.7); border-radius: 0; background: color-mix(in srgb, var(--sd-white) 16%, var(--sd-sky)); }
body.sd .sd-produto-destaque .sd-produto-selo { margin: 0 0 24px !important; }
/* Sobre o azul claro, só o marrom do texto passa no contraste (6,9:1); o azul profundo e o marrom
   suave ficavam abaixo de 3:1. O selo em contorno do marrom, o rótulo e as provas na cor do texto */
body.sd .sd-produto-destaque .sd-produto-selo span { border-color: rgba(49, 38, 29, 0.55); color: var(--sd-ink); }
body.sd .sd-produto-destaque .sd-produto-dupla__texto h2 { font-size: 2rem !important; line-height: 1.15 !important; }
body.sd .sd-produto-destaque .sd-produto-dupla__texto h2 em { display: block; }
body.sd .sd-produto-destaque .sd-produto-provas { margin-top: 0; padding: 32px 16px 56px; border-top: 1px solid rgba(49, 38, 29, 0.18); }
body.sd .sd-produto-destaque .sd-produto-provas > li + li { border-left-color: rgba(49, 38, 29, 0.18); }
body.sd .sd-produto-secoes .sd-produto-destaque .sd-produto-provas p { color: var(--sd-ink); }
body.sd .sd-produto-secoes .sd-produto-destaque .sd-produto-provas p:not(.sd-produto-provas__destaque) { font-size: 0.9375rem; line-height: 1.6; }
@media (min-width: 768px) { body.sd .sd-produto-destaque .sd-produto-dupla__texto .elementor-widget-text-editor p { text-align: justify; text-align-last: left; hyphens: manual; } }
@media (max-width: 767px) {
	body.sd .sd-produto-destaque .sd-produto-dupla > .elementor-container { flex-direction: column; }
	body.sd .sd-produto-destaque .sd-produto-dupla__texto, body.sd .sd-produto-destaque .sd-produto-dupla__media { width: 100% !important; }
	body.sd .sd-produto-destaque .sd-produto-dupla__texto .elementor-widget-wrap { width: auto; padding: 40px 30px 32px !important; }
	body.sd .sd-produto-destaque .sd-foto-reservada { min-height: 0; aspect-ratio: 16 / 9; border-left: 0; }
	body.sd .sd-produto-destaque .sd-produto-dupla__foto img { aspect-ratio: 16 / 9; height: auto; }
	body.sd .sd-produto-destaque .sd-produto-provas { margin-top: 0; padding: 32px 30px 48px; }
	body.sd .sd-produto-destaque .sd-produto-provas > li + li { border-top-color: rgba(49, 38, 29, 0.18); }
}
/* A foto de "Na pele" pousa no painel claro, como pousava na faixa do Sérum (também o espaço reservado) */
@media (min-width: 1024px) {
	body.sd .sd-produto-sente .sd-produto-dupla__media .elementor-widget:has(.sd-foto-reservada) { position: absolute; top: 38px; bottom: -120px; left: 0; right: 0; margin: 0; }
	body.sd .sd-produto-sente .sd-foto-reservada { height: 100%; max-height: none; aspect-ratio: auto; box-shadow: 0 1px 2px rgba(31, 45, 60, 0.08), 0 12px 28px -10px rgba(31, 45, 60, 0.22), 0 36px 72px -28px rgba(31, 45, 60, 0.42); }
}
/* Espaços reservados nas fotos do modo de uso e nas miniaturas da fórmula */
body.sd .sd-produto-uso__fotos .sd-foto-reservada { height: 100%; max-height: none; aspect-ratio: auto; border-radius: 0; }
body.sd .sd-produto-uso__fotos .sd-foto-reservada figcaption { max-width: 30em; }
@media (max-width: 767px) { body.sd .sd-produto-uso__fotos .sd-foto-reservada { aspect-ratio: 4 / 3; height: auto; scroll-snap-align: start; border-radius: 4px; } }
body.sd .sd-foto-reservada--mini { aspect-ratio: 1; max-height: none; width: 132px; padding: 10px; gap: 6px; border-radius: 50%; }
body.sd .sd-foto-reservada--mini svg { width: 22px; height: 22px; }
body.sd .sd-foto-reservada--mini figcaption { gap: 2px; font-size: 0.6875rem; line-height: 1.3; }
body.sd .sd-foto-reservada--mini strong { font-size: 0.875rem; }
body.sd .sd-foto-reservada--mini .sd-foto-reservada__rotulo { font-size: 0.5625rem; }
@media (max-width: 767px) { body.sd .sd-foto-reservada--mini { width: 84px; } body.sd .sd-foto-reservada--mini figcaption { display: none; } }

/* -------------------------------------------------------------- barra fixa de compra */

body.sd .sd-buybar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px max(16px, calc((100vw - 1160px) / 2)) calc(12px + env(safe-area-inset-bottom));
	background: color-mix(in srgb, var(--sd-paper) 94%, transparent);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-top: 1px solid var(--sd-line);
	transform: translateY(110%);
	visibility: hidden;
	transition: transform .35s var(--sd-ease), visibility 0s linear .35s;
}
body.sd .sd-buybar.is-visible { transform: none; visibility: visible; transition: transform .35s var(--sd-ease); }
body.sd .sd-buybar__info { display: flex; flex-direction: column; min-width: 0; }
/* Nome inteiro em até duas linhas (só corta com "…" se passar disso) */
body.sd .sd-buybar__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 0.9375rem; font-weight: 500; line-height: 1.3; }
body.sd .sd-buybar__detail { font-size: 0.875rem; line-height: 1.4; color: var(--sd-ink-soft); }
body.sd .sd-buybar__price .amount { color: var(--sd-ink); font-weight: 500; }
body.sd .sd-buybar__button { flex: none; }
/* A barra não cobre o fim da página */
body.sd.sd-buybar-on { padding-bottom: 88px; }
/* O botão de rever os cookies (CookieYes, no canto de baixo) sobe para cima da barra */
body.sd .cky-btn-revisit-wrapper { transition: bottom .35s var(--sd-ease); }
body.sd.sd-buybar-on .cky-btn-revisit-wrapper { bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
/* O balão do WhatsApp (plugin Joinchat, mesmo canto) também sobe: cobria o "Comprar" da barra no celular */
body.sd .joinchat { transition: bottom .35s var(--sd-ease); }
body.sd.sd-buybar-on .joinchat { --bottom: calc(96px + env(safe-area-inset-bottom)) !important; }

@media (max-width: 767px) {
	body.sd .sd-buybar { gap: 12px; }
	body.sd .sd-buybar__name { font-size: 0.875rem; }
	body.sd .sd-buybar__button { padding: 14px 22px !important; }
}
@media (prefers-reduced-motion: reduce) {
	body.sd .sd-shake { animation: none; }
	body.sd .sd-buybar { transition: none; }
}

/* -------------------------------------------------------------- vídeos de quem usa na coluna de compra
   O grupo do plugin de reels (círculos que abrem o vídeo), logo depois do frete */

body.sd .sd-produto__videos {
	align-self: stretch;
	min-width: 0;
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--sd-line);
}
body.sd .sd-produto__videos-titulo {
	margin: 0 0 14px;
	font-size: var(--sd-caps-size);
	font-weight: 500;
	letter-spacing: var(--sd-caps-tracking);
	text-transform: uppercase;
	color: var(--sd-ink);
}
/* Na coluna de compra, em círculo (como stories): pequenos, convidam a tocar. Na home, o
   mesmo plugin segue com cantos discretos (loja.css) */
body.sd .sd-produto__videos .ecr-thumb__frame { border-radius: 50% !important; box-shadow: 0 0 0 1px var(--sd-white), 0 0 0 2px var(--sd-sky); }
body.sd .sd-produto__videos .ecr-thumb { font-size: 0.75rem; color: var(--sd-ink-soft); }
body.sd .sd-produto__videos [style*="--thumbnail-size"] {
	--thumbnail-size: 84px !important;
	--thumbnail-size-tab: 84px !important;
	--thumbnail-size-mobile: 76px !important;
	--thumbnail-gap: 14px !important;
	--thumbnail-gap-tab: 14px !important;
	--thumbnail-gap-mobile: 12px !important;
}
