/**
 * Asta Mobili — Página "Setores".
 *
 * Reprodução visual fiel do mockup aprovado (backups/mockup/rv07/"Asta
 * Mobili.dc.html", bloco `<sc-if value="{{ isSectors }}">`). Página
 * renderizada de uma vez só pelo shortcode [asta_sectors_page] (ver
 * includes/class-asta-sectors-page.php) — ETAPA VISUAL: conteúdo fixo no
 * código, sem admin/option/meta/taxonomia. 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-hero.css, asta-about-page.css,
 * asta-bids-page.css).
 *
 * Seções (nesta ordem):
 *   1. Hero — painel escuro full-bleed: eyebrow + título / parágrafo
 *   2. Grid — 5 cards de setor, grade assimétrica (ver breakpoints abaixo)
 *   3. CTA  — painel vermelho full-bleed: título/texto + botão
 *
 * 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.
 *
 * GRID — 3 layouts, igual ao mockup (`sectorGridCols` / `sectorLayout`):
 *   Desktop (>1024px): 6 colunas — card 0 (Corporativo) ocupa 4 colunas e
 *     420px de altura, card 1 (Educação) ocupa 2 colunas e 420px na mesma
 *     linha; cards 2‑4 (Saúde/Hospitalidade/Órgãos públicos) ocupam 2
 *     colunas e 300px cada, numa segunda linha.
 *   Tablet (641px‑1024px): 2 colunas — card 0 ocupa a largura toda (340px);
 *     cards 1‑4 em duas linhas de 2 colunas (280px cada).
 *   Mobile (≤640px): 1 coluna — todos os cards empilhados (260px cada).
 */

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

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

.asta-sectors-page a { text-decoration:none; }

.asta-sectors-page :focus-visible {
	outline:2px solid #A01C24;
	outline-offset:3px;
}

/* ======================================================================
 * 1. HERO
 * ====================================================================== */

.asta-sectors-page__hero {
	position:relative;
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	overflow:hidden;
	padding:clamp(28px, 3.6vw, 72px) clamp(20px, 4vw, 64px) clamp(24px, 3vw, 52px);
	background:#141311;
}
.asta-sectors-page__hero-symbol {
	position:absolute !important;
	right:-2%;
	top:-30%;
	width:min(38%, 420px) !important;
	height:auto !important;
	max-width:none !important;
	margin:0;
	opacity:.07;
	pointer-events:none;
}
.asta-sectors-page__hero-inner {
	position:relative;
	max-width:1180px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	gap:clamp(18px, 3vw, 60px);
	align-items:flex-end;
}
.asta-sectors-page__hero-col {
	flex:1 1 340px;
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:14px;
}
.asta-sectors-page__hero-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-sectors-page__hero-title {
	margin:0 !important;
	padding:0;
	font-family:Manrope, Helvetica, Arial, sans-serif !important;
	font-weight:600 !important;
	font-size:clamp(32px, 4.8vw, 62px) !important;
	line-height:1.0 !important;
	letter-spacing:-.035em !important;
	color:#fff !important;
	text-wrap:pretty;
}
.asta-sectors-page__hero-text {
	flex:1 1 300px;
	min-width:0;
	margin:0 !important;
	padding:0;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-weight:400 !important;
	font-size:clamp(13.5px, 1.35vw, 17px) !important;
	line-height:1.65 !important;
	color:rgba(255,255,255,.72) !important;
}

/* ======================================================================
 * 2. GRID DE SETORES
 * ====================================================================== */

.asta-sectors-page__grid {
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	padding:clamp(24px, 3vw, 56px) clamp(20px, 4vw, 64px) clamp(30px, 3.6vw, 72px);
	background:#FFFFFF;
}
.asta-sectors-page__grid-inner {
	max-width:1180px;
	margin:0 auto;
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:clamp(12px, 1.4vw, 20px);
}

.asta-sectors-page__card {
	position:relative;
	display:block;
	min-height:280px;
	overflow:hidden;
	background:#141311;
}
.asta-sectors-page__card-image {
	position:absolute !important;
	top:0;
	left:0;
	display:block;
	width:100% !important;
	height:100% !important;
	margin:0;
	max-width:none !important;
	object-fit:cover !important;
	object-position:center !important;
	transition:transform .4s ease;
}
.asta-sectors-page__card-overlay {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:linear-gradient(180deg, rgba(14,13,12,.15) 30%, rgba(14,13,12,.86) 100%);
	pointer-events:none;
}
/* Setor sem imagem válida no termo — preenchimento neutro (nunca uma imagem
   aleatória): fundo já é #141311 (.asta-sectors-page__card), só o símbolo
   Asta discreto centralizado. */
.asta-sectors-page__card-fallback {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	pointer-events:none;
}
.asta-sectors-page__card-fallback img {
	width:34%;
	max-width:120px;
	height:auto;
	opacity:.14;
}
.asta-sectors-page__card-body {
	position:relative;
	display:flex;
	flex-direction:column;
	gap:8px;
	height:100%;
	justify-content:flex-end;
	padding:clamp(18px, 2vw, 30px);
}
.asta-sectors-page__card-title {
	font-family:Manrope, Helvetica, Arial, sans-serif;
	font-weight:600;
	font-size:24px;
	line-height:1.05;
	letter-spacing:-.03em;
	color:#fff;
}
.asta-sectors-page__card-desc {
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:clamp(12.5px, 1.25vw, 15px);
	line-height:1.5;
	color:rgba(255,255,255,.78);
	max-width:400px;
}
.asta-sectors-page__card-cta {
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin-top:4px;
	font-family:Inter, Helvetica, Arial, sans-serif;
	font-size:12.5px;
	color:#fff;
}
.asta-sectors-page__card-arrow { color:#E4949A; transition:transform .18s ease; }

.asta-sectors-page__card:hover .asta-sectors-page__card-image,
.asta-sectors-page__card:focus-visible .asta-sectors-page__card-image {
	transform:scale(1.04);
}
.asta-sectors-page__card:hover .asta-sectors-page__card-arrow,
.asta-sectors-page__card:focus-visible .asta-sectors-page__card-arrow {
	transform:translateX(3px);
}

@media (prefers-reduced-motion: reduce) {
	.asta-sectors-page__card-image,
	.asta-sectors-page__card-arrow { transition:none; }
}

/* ---- Variantes por posição (grade assimétrica, igual ao mockup) ------- */

/* Tablet/desktop (>640px): card 0 = destaque, cards 1-4 = secundários. */
.asta-sectors-page__card--0 { min-height:340px; }
.asta-sectors-page__card--0 .asta-sectors-page__card-title { font-size:clamp(26px, 3.4vw, 34px); }
.asta-sectors-page__card--1,
.asta-sectors-page__card--2,
.asta-sectors-page__card--3,
.asta-sectors-page__card--4 { min-height:280px; }
.asta-sectors-page__card--1 .asta-sectors-page__card-title,
.asta-sectors-page__card--2 .asta-sectors-page__card-title,
.asta-sectors-page__card--3 .asta-sectors-page__card-title,
.asta-sectors-page__card--4 .asta-sectors-page__card-title { font-size:24px; }

@media (min-width:641px) {
	.asta-sectors-page__card--0 { grid-column:span 2; }
}

/* Desktop (>1024px): 6 colunas — 4+2 na 1ª linha, 2+2+2 na 2ª. */
@media (min-width:1025px) {
	.asta-sectors-page__grid-inner { grid-template-columns:repeat(6, minmax(0, 1fr)); }

	.asta-sectors-page__card--0 { grid-column:span 4; min-height:420px; }
	.asta-sectors-page__card--0 .asta-sectors-page__card-title { font-size:clamp(26px, 3vw, 38px); }

	.asta-sectors-page__card--1 { grid-column:span 2; min-height:420px; }
	.asta-sectors-page__card--1 .asta-sectors-page__card-title { font-size:clamp(22px, 2.2vw, 28px); }

	.asta-sectors-page__card--2,
	.asta-sectors-page__card--3,
	.asta-sectors-page__card--4 { grid-column:span 2; min-height:300px; }
	.asta-sectors-page__card--2 .asta-sectors-page__card-title,
	.asta-sectors-page__card--3 .asta-sectors-page__card-title,
	.asta-sectors-page__card--4 .asta-sectors-page__card-title { font-size:clamp(22px, 2.2vw, 28px); }
}

/* Mobile (≤640px): 1 coluna, todos os cards empilhados. */
@media (max-width:640px) {
	.asta-sectors-page__grid-inner { grid-template-columns:1fr; }
	.asta-sectors-page__card,
	.asta-sectors-page__card--0,
	.asta-sectors-page__card--1,
	.asta-sectors-page__card--2,
	.asta-sectors-page__card--3,
	.asta-sectors-page__card--4 { grid-column:auto; min-height:260px; }
	.asta-sectors-page__card--0 .asta-sectors-page__card-title,
	.asta-sectors-page__card--1 .asta-sectors-page__card-title,
	.asta-sectors-page__card--2 .asta-sectors-page__card-title,
	.asta-sectors-page__card--3 .asta-sectors-page__card-title,
	.asta-sectors-page__card--4 .asta-sectors-page__card-title { font-size:28px; }
}

/* ======================================================================
 * 3. CTA FINAL
 * ====================================================================== */

.asta-sectors-page__cta {
	position:relative;
	width:100vw;
	max-width:100vw;
	margin-left:calc(50% - 50vw);
	margin-right:calc(50% - 50vw);
	overflow:hidden;
	padding:clamp(34px, 4.2vw, 80px) clamp(20px, 4vw, 64px);
	background:#A01C24;
}
.asta-sectors-page__cta-symbol {
	position:absolute !important;
	right:-3%;
	bottom:-20%;
	width:min(40%, 440px) !important;
	height:auto !important;
	max-width:none !important;
	margin:0;
	opacity:.09;
	pointer-events:none;
}
.asta-sectors-page__cta-inner {
	position:relative;
	max-width:1180px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	gap:24px;
	align-items:flex-end;
	justify-content:space-between;
}
.asta-sectors-page__cta-text {
	flex:1 1 320px;
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:14px;
}
.asta-sectors-page__cta-title {
	margin:0 !important;
	padding:0;
	font-family:Manrope, Helvetica, Arial, sans-serif !important;
	font-weight:600 !important;
	font-size:clamp(25px, 3.6vw, 46px) !important;
	line-height:1.04 !important;
	letter-spacing:-.03em !important;
	color:#fff !important;
	text-wrap:pretty;
}
.asta-sectors-page__cta-desc {
	margin:0 !important;
	padding:0;
	max-width:440px;
	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:rgba(255,255,255,.85) !important;
}
.asta-sectors-page__btn {
	display:inline-flex !important;
	align-items:center;
	gap:10px;
	margin:0;
	padding:16px 28px !important;
	border:0 !important;
	border-radius:8px !important;
	background:#fff !important;
	color:#A01C24 !important;
	font-family:Inter, Helvetica, Arial, sans-serif !important;
	font-size:14px !important;
	font-weight:400 !important;
	line-height:1.2 !important;
	white-space:nowrap;
	text-decoration:none !important;
	cursor:pointer;
	transition:background .18s ease;
}
.asta-sectors-page__btn:hover,
.asta-sectors-page__btn:focus-visible {
	background:#F2E9E9 !important;
	color:#A01C24 !important;
}
.asta-sectors-page__arrow { color:#A01C24; }

@media (max-width:767px) {
	.asta-sectors-page__cta-inner { justify-content:flex-start; }
}
