/*
 * Aurus × Elementor Design System Bridge — v12.0
 * ─────────────────────────────────────────────────────────────────────
 * Este arquivo formata TODOS os widgets do Elementor automaticamente
 * para seguir a identidade visual "Silent Luxury" inspirada na Vivara.
 *
 * Regra: qualquer widget colocado no Elementor ja sai com o estilo
 * correto sem precisar configurar manualmente.
 * ─────────────────────────────────────────────────────────────────────
 */

/* ── 1. TOKENS GLOBAIS DO ELEMENTOR ────────────────────────────────── */
:root {
	/* Cores sincronizadas com o tema filho */
	--e-global-color-primary:   #004b43;  /* Verde Vivara */
	--e-global-color-secondary: #1a1a1a;
	--e-global-color-text:      #555555;
	--e-global-color-accent:    #c5a36f;  /* Ouro Fosco */

	/* Tipografia sincronizada */
	--e-global-typography-primary-font-family:   "Cormorant Garamond", serif;
	--e-global-typography-primary-font-weight:   600;
	--e-global-typography-secondary-font-family: "Manrope", sans-serif;
	--e-global-typography-secondary-font-weight: 700;
	--e-global-typography-text-font-family:      "Manrope", sans-serif;
	--e-global-typography-text-font-weight:      400;
	--e-global-typography-accent-font-family:    "Manrope", sans-serif;
	--e-global-typography-accent-font-weight:    700;
}

/* ── 2. LAYOUT: SEÇÕES E CONTAINERS ────────────────────────────────── */

/* Remove padding padrão excessivo do Elementor */
.elementor-section.elementor-section-boxed > .elementor-container {
	max-width: 1280px;
}

/* Seção padrão: respiro correto de alto luxo */
.elementor-section > .elementor-container {
	padding-left: 2rem;
	padding-right: 2rem;
}

/* Remove sombra de containers e seções */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget-wrap {
	box-shadow: none !important;
}

/* ── 3. TIPOGRAFIA ──────────────────────────────────────────────────── */

/* Títulos H1–H6 em Cormorant Garamond Editorial */
.elementor-widget-heading .elementor-heading-title {
	font-family: "Cormorant Garamond", serif !important;
	font-weight: 600 !important;
	letter-spacing: -0.02em !important;
	line-height: 1.1 !important;
	color: #1a1a1a;
}

/* Subtítulos em Manrope leve */
.elementor-widget-text-editor,
.elementor-widget-text-editor p {
	font-family: "Manrope", sans-serif !important;
	font-size: 1.05rem !important;
	line-height: 1.75 !important;
	color: #555555 !important;
}

/* Eyebrow / label acima de título */
.elementor-widget-heading .elementor-heading-title.is-eyebrow,
.elementor-widget-heading[class*="eyebrow"] .elementor-heading-title {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: #004b43 !important;
}

/* ── 4. BOTÕES ──────────────────────────────────────────────────────── */

/* Botão principal: Verde Vivara com borda fina */
.elementor-widget-button .elementor-button {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	padding: 1rem 2.5rem !important;
	border-radius: 0 !important;                /* Sem borda arredondada — luxo é reto */
	background-color: #004b43 !important;
	color: #ffffff !important;
	border: 1.5px solid #004b43 !important;
	transition: background 300ms ease, color 300ms ease !important;
	box-shadow: none !important;
}

.elementor-widget-button .elementor-button:hover {
	background-color: #ffffff !important;
	color: #004b43 !important;
	border-color: #004b43 !important;
	transform: none !important;
}

/* Botão ghost (contorno) */
.elementor-widget-button .elementor-button.e-btn-ghost,
.elementor-widget-button .elementor-button[class*="ghost"] {
	background-color: transparent !important;
	color: #1a1a1a !important;
	border: 1.5px solid #1a1a1a !important;
}

.elementor-widget-button .elementor-button.e-btn-ghost:hover {
	background-color: #1a1a1a !important;
	color: #ffffff !important;
}

/* ── 5. IMAGENS ─────────────────────────────────────────────────────── */

/* Remove borda arredondada e sombra das imagens */
.elementor-widget-image img {
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Efeito de zoom suave ao hover em imagens de card */
.elementor-widget-image:hover img {
	transform: scale(1.03);
	transition: transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* ── 6. CARDS / ICON BOXES ──────────────────────────────────────────── */

.elementor-widget-icon-box .elementor-icon-box-wrapper {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.06) !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	padding: 2.5rem !important;
	transition: border-color 300ms ease !important;
}

.elementor-widget-icon-box .elementor-icon-box-wrapper:hover {
	border-color: #004b43 !important;
}

.elementor-widget-icon-box .elementor-icon-box-title {
	font-family: "Cormorant Garamond", serif !important;
	font-weight: 600 !important;
	font-size: 1.4rem !important;
	letter-spacing: -0.01em !important;
}

.elementor-widget-icon-box .elementor-icon-box-description {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.9rem !important;
	line-height: 1.7 !important;
	color: #555555 !important;
}

/* ── 7. FORMULÁRIOS ─────────────────────────────────────────────────── */

.elementor-field-group input,
.elementor-field-group select,
.elementor-field-group textarea {
	font-family: "Manrope", sans-serif !important;
	border: 1px solid #dddddd !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0.85rem 1.1rem !important;
	background: #ffffff !important;
	transition: border-color 200ms ease !important;
}

.elementor-field-group input:focus,
.elementor-field-group textarea:focus {
	border-color: #004b43 !important;
	outline: none !important;
	box-shadow: none !important;
}

/* ── 8. MENU DE NAVEGAÇÃO ───────────────────────────────────────────── */

.elementor-nav-menu--main .elementor-item {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	color: #1a1a1a !important;
}

.elementor-nav-menu--main .elementor-item:hover,
.elementor-nav-menu--main .elementor-item.elementor-item-active {
	color: #004b43 !important;
}

/* ── 9. DIVISORES ───────────────────────────────────────────────────── */

.elementor-widget-divider .elementor-divider-separator {
	border-color: rgba(0, 0, 0, 0.08) !important;
}

/* ── 10. WooCommerce DENTRO DO ELEMENTOR ─────────────────────────────── */

/* Card de produto: sem sombra, borda sutil */
.elementor-widget-woocommerce-products .product,
.woocommerce ul.products li.product {
	box-shadow: none !important;
	border: none !important;
	border-radius: 0 !important;
}

/* Nome do produto */
.elementor-widget-woocommerce-products .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: "Cormorant Garamond", serif !important;
	font-size: 1.15rem !important;
	font-weight: 600 !important;
	letter-spacing: -0.01em !important;
	color: #1a1a1a !important;
}

/* Preço do produto */
.elementor-widget-woocommerce-products .price,
.woocommerce ul.products li.product .price {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.9rem !important;
	font-weight: 700 !important;
	color: #004b43 !important;
}

/* Botão "Adicionar ao carrinho" */
.elementor-widget-woocommerce-products .button,
.woocommerce ul.products li.product .button {
	font-family: "Manrope", sans-serif !important;
	font-size: 0.7rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	background-color: #004b43 !important;
	color: #ffffff !important;
	border-radius: 0 !important;
	padding: 0.75rem 1.5rem !important;
	border: 1.5px solid #004b43 !important;
	box-shadow: none !important;
	transition: all 300ms ease !important;
}

.elementor-widget-woocommerce-products .button:hover,
.woocommerce ul.products li.product .button:hover {
	background-color: #ffffff !important;
	color: #004b43 !important;
}

/* ── 11. HEADER E FOOTER DO ELEMENTOR THEME BUILDER ─────────────────── */

/* Garante que o fundo seja branco puro e sem sombras extras */
.elementor-location-header {
	background: #ffffff !important;
	box-shadow: none !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.elementor-location-footer {
	background: #004b43 !important;
	color: #ffffff;
}

/* Texto dentro do footer do Elementor herda cor branca */
.elementor-location-footer .elementor-widget-heading .elementor-heading-title,
.elementor-location-footer .elementor-widget-text-editor,
.elementor-location-footer .elementor-widget-text-editor p {
	color: rgba(255, 255, 255, 0.85) !important;
}

.elementor-location-footer .elementor-widget-heading .elementor-heading-title {
	color: #ffffff !important;
}

/* Links no footer */
.elementor-location-footer a {
	color: rgba(255, 255, 255, 0.6) !important;
	transition: color 250ms ease !important;
}

.elementor-location-footer a:hover {
	color: #ffffff !important;
}

/* ── 12. POPUP / OVERLAY ─────────────────────────────────────────────── */

.elementor-popup-modal .dialog-widget-content {
	border-radius: 0 !important;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.15) !important;
}

/* ── 13. ANIMAÇÕES DE ENTRADA SUAVES ─────────────────────────────────── */

.elementor-invisible {
	opacity: 0;
}

/* Velocidade e easing suave para animações do Elementor */
.elementor-animated-item {
	transition-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

/* ── 14. RESPONSIVO MOBILE ───────────────────────────────────────────── */

@media (max-width: 768px) {
	.elementor-section > .elementor-container {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}

	.elementor-widget-heading .elementor-heading-title {
		letter-spacing: -0.01em !important;
	}

	.elementor-widget-button .elementor-button {
		padding: 0.85rem 1.75rem !important;
	}
}

/* ══════════════════════════════════════════════════════════════════════════
   AX COMPONENTS — sistema de tokens e componentes Aurus
   Usado pelos widgets customizados (Vitrine, Hero, Promessa, Pilares)
   e pela home PHP. Carregar aqui garante funcionamento no editor Elementor.
   ══════════════════════════════════════════════════════════════════════════ */

.ax,
.ax-section,
.ax-section--white,
.ax-section--stone,
.elementor-widget-aurus_vitrine,
.elementor-widget-aurus_hero,
.elementor-widget-aurus_promise,
.elementor-widget-aurus_pillars {
	--cream:  #FAFAF8;
	--warm:   #F5EDE3;
	--stone:  #EDE7DF;
	--white:  #FFFFFF;
	--dark:   #181410;
	--ink:    #2B231B;
	--mid:    #7C7168;
	--border: rgba(43,35,27,.08);
	--gold:   #B98E55;
	--gold-l: #D9C49E;
	--gold-d: #8C6A38;
	--teal:   #00504A;
	--serif:  'Cormorant Garamond', Georgia, serif;
	--sans:   'Manrope', system-ui, sans-serif;
}

/* ── Layout wrapper ─────────────────────────────────────────────────────── */
.ax-section {
	padding: 112px 0;
	background: var(--cream, #FAFAF8);
}
.ax-section--white { background: #fff; }
.ax-section--stone { background: #EDE7DF; }

.ax-wrap {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 52px;
}

/* ── Eyebrow ────────────────────────────────────────────────────────────── */
.ax-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: 'Manrope', system-ui, sans-serif;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .26em;
	color: #B98E55;
	margin: 0 0 18px;
	line-height: 1;
}
.ax-eyebrow__rule {
	display: inline-block;
	width: 32px; height: 1px;
	background: currentColor;
	flex-shrink: 0;
}

/* ── Título de seção ────────────────────────────────────────────────────── */
.ax-sec-title {
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: clamp(2rem, 3vw, 2.9rem);
	font-weight: 500;
	color: #2B231B;
	margin: 0;
	line-height: 1.12;
}
.ax-sec-title em { font-style: italic; color: #8C6A38; }

.ax-sec-head { margin-bottom: 56px; }
.ax-sec-head--split {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
}
.ax-sec-head--split > div { flex: 1; }

/* ── Link de texto ──────────────────────────────────────────────────────── */
.ax-text-link {
	font-family: 'Manrope', system-ui, sans-serif;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .2em;
	color: #2B231B;
	text-decoration: none;
	border-bottom: 1px solid rgba(43,35,27,.08);
	padding-bottom: 3px;
	transition: border-color .2s, color .2s;
	white-space: nowrap;
}
.ax-text-link:hover { border-color: #B98E55; color: #B98E55; }

/* ── Grid de produtos ───────────────────────────────────────────────────── */
.ax-product-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

/* ── Card de produto ────────────────────────────────────────────────────── */
.ax-card {
	display: flex;
	flex-direction: column;
	isolation: isolate;
}
.ax-card__img-wrap {
	display: block;
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
	text-decoration: none;
	flex-shrink: 0;
	margin-bottom: 20px;
}
.ax-card__img-wrap img {
	width: 100%; height: 100%;
	object-fit: contain; object-position: center;
	mix-blend-mode: multiply;
	filter: contrast(1.02);
	transition: transform 1s cubic-bezier(.2,.8,.2,1);
}
.ax-card:hover .ax-card__img-wrap img { transform: scale(1.07); }

.ax-badge {
	position: absolute; top: 12px; left: 12px; z-index: 2;
	font-size: 7.5px; font-weight: 800;
	text-transform: uppercase; letter-spacing: .14em;
	padding: 5px 12px;
	background: #B98E55; color: #fff;
}
.ax-badge--sale { background: #8C6A38; }
.ax-badge--new  { background: #00504A; }

.ax-card__body { text-align: center; display: flex; flex-direction: column; flex: 1; }
.ax-card__cat {
	font-size: 8px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .2em;
	color: #B98E55; margin-bottom: 7px;
}
.ax-card__name {
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: 1.18rem; font-weight: 500;
	color: #2B231B; margin-bottom: 10px;
	line-height: 1.28; flex: 1;
}
.ax-card__name a { color: inherit; transition: color .2s; text-decoration: none; }
.ax-card__name a:hover { color: #8C6A38; }

.ax-card__action {
	display: block;
	font-size: 8.5px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .18em;
	color: #7C7168;
	text-decoration: none;
	border-bottom: 1px solid rgba(43,35,27,.08);
	padding-bottom: 2px;
	margin: 8px auto 0;
	opacity: 0;
	transform: translateY(4px);
	transition: opacity .25s, transform .25s, color .2s, border-color .2s;
}
.ax-card:hover .ax-card__action { opacity: 1; transform: translateY(0); }
.ax-card__action:hover { color: #B98E55; border-color: #B98E55; }

.ax-card__price { font-size: .9rem; font-weight: 700; color: #2B231B; margin-bottom: 4px; }
.ax-card__price-na { font-size: .8rem; font-weight: 400; color: #7C7168; font-style: italic; }

.ax-empty {
	grid-column: 1 / -1; text-align: center;
	padding: 72px 0; color: #7C7168;
}
.ax-empty a { color: #B98E55; }

/* ── Botões ─────────────────────────────────────────────────────────────── */
.ax-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: 'Manrope', system-ui, sans-serif;
	font-size: 9.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .22em;
	text-decoration: none;
	padding: 16px 36px;
	border: 1px solid transparent;
	transition: background .22s, border-color .22s, color .22s;
	white-space: nowrap;
}
.ax-btn--dark { background: #181410; border-color: #181410; color: #fff; }
.ax-btn--dark:hover { background: #2B231B; border-color: #2B231B; }
.ax-btn--outline-dark { background: transparent; border-color: #2B231B; color: #2B231B; }
.ax-btn--outline-dark:hover { background: #181410; color: #fff; border-color: #181410; }
.ax-btn--gold { background: #B98E55; border-color: #B98E55; color: #fff; }
.ax-btn--gold:hover { background: #8C6A38; border-color: #8C6A38; }

/* ── Responsivo ─────────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
	.ax-product-grid { grid-template-columns: repeat(2, 1fr); gap: 22px; }
	.ax-section { padding: 80px 0; }
	.ax-wrap { padding: 0 36px; }
}
@media (max-width: 680px) {
	.ax-product-grid { gap: 14px; }
	.ax-section { padding: 60px 0; }
	.ax-wrap { padding: 0 20px; }
	.ax-sec-head--split { flex-direction: column; align-items: flex-start; gap: 12px; }
}