/* NICHO Trabalho · todos os kits (usa as variáveis --nx-* e as peças base do style.css do kit. */

.nx-tools-group {
	display: flex;
	flex-direction: column;
	gap: 20px;
	scroll-margin-top: 24px;
}

.nx-tools-group[hidden],
.nx-tools-group .nx-tool[hidden] {
	display: none;
}

.nx-tools-group__title {
	font-family: var(--nx-heading, var(--nx-font));
	font-size: 28px;
	font-weight: var(--nx-heading-weight, 800);
	letter-spacing: var(--nx-heading-ls, -0.02em);
}

.nx-tools-group__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.nx-tools-group .nx-tool {
	min-height: 220px;
	gap: 12px;
	padding: 28px;
}

.nx-tools-group .nx-tool__icon {
	width: 52px;
	height: 52px;
	border-radius: 26px;
}

.nx-tools-group .nx-tool__title {
	font-size: 19px;
}

.nx-tools-group .nx-tool__text,
.nx-tools-group .nx-tool__cta {
	font-size: 15px;
}

@media (max-width: 1180px) {
	.nx-tools-group__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 860px) {
	.nx-tools-group__title {
		font-size: 24px;
	}

	.nx-tools-group__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nx-tools-group .nx-tool {
		min-height: 0;
		padding: 22px;
	}
}

@media (max-width: 560px) {
	.nx-tools-group__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Páginas de ferramenta (comum a todas) ----------------------------------- */
.nx-tool-head {
	border-bottom: 0;
	padding-bottom: 40px;
}

.nx-tool-body {
	padding-bottom: 48px;
	background: #fff;
}

.nx-tool-grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 32px;
	align-items: start;
}

.nx-tool-form {
	grid-column: span 4;
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 32px;
	border: 0;
	box-shadow: var(--float);
	border-radius: 20px;
	background: var(--nx-bg);
	scroll-margin-top: 24px;
}

.nx-tool-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.nx-tool-field label,
.nx-tool-field__label {
	font-size: 15px;
	font-weight: 600;
}

.nx-tool-select {
	width: 100%;
	height: 56px;
	padding: 0 16px;
	border: 0;
	background-color: #fff;
	box-shadow: var(--float-sm);
	border-radius: 12px;
	background: #fff;
	color: var(--nx-ink);
	font: 17px var(--nx-font);
	cursor: pointer;
}

.nx-tool-select:focus {
	outline: none;
	border-color: var(--nx-accent);
	box-shadow: 0 0 0 4px var(--nx-tint-14);
}

.nx-tool-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.nx-tool-pill {
	height: 44px;
	padding: 0 18px;
	border: 0;
	box-shadow: var(--float-sm);
	border-radius: 999px;
	background: #fff;
	color: var(--nx-ink);
	font: 700 15px var(--nx-font);
	cursor: pointer;
}

.nx-tool-pill[aria-pressed="true"] {
	background: var(--nx-ink);
	color: #fff;
}

.nx-tool-pill--sm {
	height: 40px;
	padding: 0 16px;
	font-size: 14px;
}

.nx-tool-submit {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 4px;
}

.nx-tool-submit .nx-btn {
	width: 100%;
	font-size: 17px;
	font-weight: 800;
}

.nx-tool-submit span {
	font-size: 13px;
	line-height: 1.5;
	color: var(--nx-muted);
}

/* Botão com anúncio rewarded (assets/js/ferramenta-premio.js). */
.nx-premio-aviso {
	display: block;
	text-align: center;
	font-size: 13px;
	line-height: 1.5;
	color: var(--nx-muted);
}

.nx-premio-hint,
.nx-tool-submit .nx-premio-hint {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	color: var(--nx-accent-ink, #1d4ed8);
}

.nx-tool-result {
	grid-column: span 8;
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 32px;
	border: 0;
	box-shadow: var(--float);
	border-radius: 20px;
	background: #fff;
	scroll-margin-top: 24px;
}

.nx-tool-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 300px;
	padding: 40px 32px;
	border: 0;
	background: var(--nx-bg, #F7F7F7);
	border-radius: 16px;
	text-align: center;
	font-size: 15px;
	line-height: 1.5;
	color: var(--nx-muted);
}

.nx-tool-empty[hidden] {
	display: none;
}

.nx-tool-empty__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border: 0;
	box-shadow: var(--float-sm);
	border-radius: 28px;
	background: var(--nx-bg);
	color: var(--nx-accent-ink);
}

.nx-tool-empty strong {
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--nx-ink);
}

.nx-tool-empty b {
	color: var(--nx-ink);
}

.nx-tool-ad {
	display: flex;
	justify-content: center;
	padding: 56px 0 48px;
	background: #fff;
}

.nx-tool-ad[hidden] {
	display: none;
}

.nx-tool-info {
	padding: 80px 0;
}

.nx-tool-info__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: 48px;
	align-items: start;
}

.nx-tool-info__main {
	grid-column: span 7;
	display: flex;
	flex-direction: column;
	gap: 16px;
	font-size: 17px;
	line-height: 1.75;
	color: var(--nx-muted);
}

.nx-tool-info__title {
	font-family: var(--nx-heading, var(--nx-font));
	font-size: 32px;
	font-weight: var(--nx-heading-weight, 800);
	letter-spacing: var(--nx-heading-ls, -0.02em);
	line-height: 1.2;
	color: var(--nx-ink);
}

.nx-tool-faq {
	grid-column: 9 / span 4;
	display: flex;
	flex-direction: column;
}

.nx-tool-faq__title {
	margin-top: 20px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.nx-tool-faq details {
	margin-top: 12px;
	padding: 18px 22px;
	border-radius: 14px;
	background: var(--nx-white, #fff);
	box-shadow: var(--float);
}

.nx-tool-faq summary {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	cursor: pointer;
}

.nx-tool-faq p {
	margin-top: 10px;
	font-size: 16px;
	line-height: 1.65;
	color: var(--nx-muted);
}

.nx-tool-page > .nx-ad {
	padding-bottom: 56px;
}

.nx-tool-more {
	padding-bottom: 96px;
}

.nx-tool-more .nx-tools-group__grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1180px) {
	.nx-tool-grid,
	.nx-tool-info__grid {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 32px;
	}
}

@media (max-width: 860px) {
	.nx-tool-head {
		padding-bottom: 28px;
	}

	.nx-tool-form,
	.nx-tool-result {
		padding: 22px;
	}

	.nx-tool-info {
		padding: 56px 0;
	}

	.nx-tool-info__title {
		font-size: 26px;
	}

	.nx-tool-more .nx-tools-group__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.nx-tool-more .nx-tools-group__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.nx-env-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

@media (max-width: 560px) {
	.nx-env-row {
		grid-template-columns: minmax(0, 1fr);
	}
}

.nx-tool-field[hidden] {
	display: none;
}

.nx-cv-tip {
	margin-top: -8px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--nx-muted);
}