/**
 * Asta Mobili — Página "Contato".
 *
 * Reprodução visual fiel do mockup aprovado (backups/mockup/rv07/"Asta
 * Mobili.dc.html", bloco `<sc-if value="{{ isContact }}">`). Página
 * renderizada de uma vez só pelo shortcode [asta_contact_page] (ver
 * includes/class-asta-contact-page.php) — ETAPA VISUAL: conteúdo fixo no
 * código, sem admin/option/meta. Todos os valores (cores, tipografia,
 * espaçamentos, proporções) vêm do HTML do mockup; as unidades `cqw` foram
 * convertidas para `vw` seguindo a mesma convenção já usada nas demais
 * páginas do plugin (asta-bids-page.css, asta-about-page.css).
 *
 * Seções (nesta ordem):
 *   0. Intro    — eyebrow/título/texto (sem breadcrumb — ausente no mockup)
 *   1. Corpo    — card "Envie uma mensagem" (formulário ilustrativo) + coluna
 *                 lateral: informações de contato + mapa (embed)
 *   2. Canais   — painel escuro full-bleed "Canais diretos": grade de 4 itens
 *
 * Cada seção full-bleed usa o truque 100vw + margin negativo já padronizado
 * no plugin, realinhando o conteúdo ao container global de 1180px por dentro.
 */

.asta-contact-page,
.asta-contact-page *,
.asta-contact-page *::before,
.asta-contact-page *::after { box-sizing:border-box; }

.asta-contact-page {
	font-family:Inter, Helvetica, Arial, sans-serif;
	color:#17161A;
	overflow-x:hidden;
}

.asta-contact-page a { text-decoration:none; color:inherit; }

.asta-contact-page :focus-visible {
	outline:2px solid #17161A;
	outline-offset:3px;
}

/* ======================================================================
 * 0. INTRO
 * ====================================================================== */

.asta-contact-page__intro {
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	padding:clamp(28px, 3.6vw, 72px) clamp(20px, 4vw, 64px) clamp(22px, 2.6vw, 44px);
	background:#FFFFFF;
}
.asta-contact-page__intro-inner {
	max-width:1180px;
	margin:0 auto;
	display:flex;
	flex-direction:column;
	gap:12px;
}
.asta-contact-page__eyebrow {
	margin:0 !important;
	padding:0;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-size:10px !important;
	font-weight:400 !important;
	letter-spacing:.16em !important;
	line-height:1.2 !important;
	text-transform:uppercase;
	color:#A01C24 !important;
}
.asta-contact-page__title {
	margin:0 !important;
	padding:0;
	max-width:640px;
	font-family:Manrope, Helvetica, Arial, sans-serif !important;
	font-weight:600 !important;
	font-size:clamp(32px, 4.6vw, 58px) !important;
	line-height:1.0 !important;
	letter-spacing:-.035em !important;
	color:#17161A !important;
	text-wrap:pretty;
}
.asta-contact-page__text {
	margin:0 !important;
	padding:0;
	max-width:520px;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-weight:400 !important;
	font-size:clamp(13.5px, 1.35vw, 17px) !important;
	line-height:1.6 !important;
	color:#5E5A54 !important;
}

/* ======================================================================
 * 1. CORPO — formulário + informações + mapa
 * ====================================================================== */

.asta-contact-page__body {
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	padding:0 clamp(20px, 4vw, 64px) clamp(30px, 3.6vw, 72px);
	background:#FFFFFF;
}
.asta-contact-page__body-inner {
	max-width:1180px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	gap:clamp(18px, 2.4vw, 44px);
	align-items:flex-start;
}

/* ---- Card do formulário ------------------------------------------------ */

.asta-contact-page__form-card {
	flex:1 1 340px;
	min-width:0;
	background:#F7F5F1;
	border:1px solid #EAE6DF;
	padding:clamp(20px, 2.4vw, 36px);
	display:flex;
	flex-direction:column;
	gap:14px;
}
.asta-contact-page__form-title {
	font-family:Manrope, Helvetica, Arial, sans-serif;
	font-weight:500;
	font-size:clamp(18px, 2vw, 24px);
	letter-spacing:-.02em;
	color:#17161A;
}
.asta-contact-page__form {
	display:flex;
	flex-direction:column;
	gap:14px;
}
.asta-contact-page__form-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
}
.asta-contact-page__field {
	display:flex;
	flex-direction:column;
	gap:6px;
	grid-column:span 1;
	min-width:0;
}
.asta-contact-page__field--full { grid-column:1 / -1; }

.asta-contact-page__field label {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:9.5px;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#8C867C;
}
.asta-contact-page__field input,
.asta-contact-page__field textarea {
	border:1px solid #E0DBD3 !important;
	background:#fff !important;
	border-radius:8px !important;
	padding:13px 14px !important;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-size:13.5px !important;
	color:#17161A !important;
	outline:none;
	width:100%;
	box-shadow:none !important;
}
.asta-contact-page__field input::placeholder,
.asta-contact-page__field textarea::placeholder { color:#A39C91; opacity:1; }
.asta-contact-page__field input:focus-visible,
.asta-contact-page__field textarea:focus-visible {
	outline:2px solid #17161A;
	outline-offset:2px;
	border-color:#17161A !important;
}
.asta-contact-page__field textarea { resize:vertical; }

.asta-contact-page__btn {
	width:100%;
	display:inline-flex !important;
	align-items:center;
	justify-content:center;
	gap:10px;
	margin:0;
	border:0 !important;
	border-radius:8px !important;
	padding:16px 22px !important;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-size:14px !important;
	font-weight:400 !important;
	letter-spacing:.02em !important;
	line-height:1.2 !important;
	cursor:pointer;
	transition:background .18s ease;
}
.asta-contact-page__btn--primary {
	background:#A01C24 !important;
	color:#fff !important;
}
.asta-contact-page__btn--primary:hover,
.asta-contact-page__btn--primary:focus-visible {
	background:#7E1319 !important;
	color:#fff !important;
}
.asta-contact-page__btn--whatsapp {
	gap:11px;
	background:#25623B !important;
	color:#fff !important;
}
.asta-contact-page__btn--whatsapp:hover,
.asta-contact-page__btn--whatsapp:focus-visible {
	background:#1F5231 !important;
	color:#fff !important;
}
.asta-contact-page__btn--whatsapp svg { flex:none; display:block; }
.asta-contact-page__arrow { display:inline-block; line-height:1; color:currentColor; }

.asta-contact-page__disclaimer {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:9.5px;
	letter-spacing:.06em;
	color:#A39C91;
}

@media (max-width:767px) {
	.asta-contact-page__form-grid { grid-template-columns:1fr; }
	.asta-contact-page__field { grid-column:1 / -1; }
}

/* ---- Coluna de informações + mapa --------------------------------------- */

.asta-contact-page__info-col {
	flex:1 1 260px;
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:clamp(16px, 1.8vw, 26px);
}
.asta-contact-page__info-list {
	display:flex;
	flex-direction:column;
	gap:14px;
}
.asta-contact-page__info-item {
	display:flex;
	flex-direction:column;
	gap:5px;
	border-top:1px solid #E4E0D9;
	padding-top:14px;
}
.asta-contact-page__info-label {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:9.5px;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#8C867C;
}
.asta-contact-page__info-value {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:clamp(14px, 1.4vw, 17px);
	color:#17161A;
}
.asta-contact-page__info-value--link:hover,
.asta-contact-page__info-value--link:focus-visible { color:#A01C24; }

.asta-contact-page__map {
	width:100%;
	aspect-ratio:4 / 3;
	border-radius:10px;
	overflow:hidden;
	border:1px solid #E4E0D9;
}
.asta-contact-page__map iframe { display:block; width:100%; height:100%; border:0; }

/* ======================================================================
 * 2. CANAIS DIRETOS (painel escuro)
 * ====================================================================== */

.asta-contact-page__channels {
	position:relative;
	overflow:hidden;
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	padding:clamp(30px, 3.8vw, 76px) clamp(20px, 4vw, 64px);
	background:#141311;
}
.asta-contact-page__channels-symbol {
	position:absolute;
	right:-2%;
	bottom:-22%;
	width:min(36%, 440px);
	height:auto !important;
	max-width:none !important;
	margin:0;
	border:0;
	opacity:.07;
	pointer-events:none;
	user-select:none;
}
.asta-contact-page__channels-inner {
	position:relative;
	z-index:1;
	max-width:1180px;
	margin:0 auto;
	display:flex;
	flex-direction:column;
	gap:clamp(18px, 2vw, 30px);
}
.asta-contact-page__channels-eyebrow {
	margin:0 !important;
	padding:0;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-size:10px !important;
	font-weight:400 !important;
	letter-spacing:.18em !important;
	line-height:1.2 !important;
	text-transform:uppercase;
	color:#C98A8E !important;
}
.asta-contact-page__channels-grid {
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap:clamp(10px, 1.2vw, 18px);
}
.asta-contact-page__channel {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:14px;
	border:1px solid #33302B;
	padding:18px 20px;
	cursor:pointer;
	transition:border-color .18s ease;
}
.asta-contact-page__channel:hover,
.asta-contact-page__channel:focus-visible { border-color:#A01C24; }
.asta-contact-page__channel-left { display:flex; align-items:center; gap:12px; min-width:0; }
.asta-contact-page__channel-icon { color:#E4949A; display:flex; flex:none; }
.asta-contact-page__channel-icon svg { display:block; }
.asta-contact-page__channel-icon-img {
	display:block;
	width:20px;
	height:20px;
	max-width:none !important;
	object-fit:contain;
}
.asta-contact-page__channel-text { display:flex; flex-direction:column; gap:3px; min-width:0; }
.asta-contact-page__channel-label {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:14px;
	color:#fff;
}
.asta-contact-page__channel-value {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:11.5px;
	color:#7C7669;
	overflow-wrap:anywhere;
}
.asta-contact-page__channel-arrow { flex:none; color:#A01C24; }

@media (prefers-reduced-motion: reduce) {
	.asta-contact-page__btn--primary,
	.asta-contact-page__btn--whatsapp,
	.asta-contact-page__channel { transition:none; }
}