/**
 * Sobre 1 – layout editorial (tipografia configurável pelo tema via variáveis CSS).
 */

.shadcn-sobre1 {
	box-sizing: border-box;
	width: 100%;
	/* Tema: famílias (H1/H3 de título usam tipografia do GP; restantes abaixo) */
	--shadcn-sobre1-font-story: inherit;
	--shadcn-sobre1-font-body: inherit;
	--shadcn-sobre1-font-rail: inherit;
	--shadcn-sobre1-font-footer: inherit;
	/* Tema: tamanhos de texto (H1/H3: sem variáveis — GeneratePress aplica .entry-content h1/h3) */
	--shadcn-sobre1-rail-font-size: 1rem;
	--shadcn-sobre1-rail-line-height: 1.5;
	--shadcn-sobre1-intro-font-size: 1rem;
	--shadcn-sobre1-intro-line-height: 1.6;
	--shadcn-sobre1-story-font-size: clamp(1.25rem, 2.2vw, 1.875rem);
	--shadcn-sobre1-story-line-height: 1.35;
	--shadcn-sobre1-story-font-weight: 500;
	--shadcn-sobre1-story-letter-spacing: -0.02em;
	--shadcn-sobre1-person-role-font-size: 0.875rem;
	--shadcn-sobre1-person-role-line-height: 1.4;
	--shadcn-sobre1-footer-font-size: 1rem;
	--shadcn-sobre1-footer-line-height: 1.65;
	--shadcn-sobre1-footer-font-weight: 400;
	/* Tema: espaçamentos internos */
	--shadcn-sobre1-stack-gap: clamp(2.5rem, 6vw, 5rem);
	--shadcn-sobre1-top-grid-gap: clamp(1rem, 3vw, 2.5rem);
	--shadcn-sobre1-bottom-grid-gap: clamp(2rem, 5vw, 3rem);
	--shadcn-sobre1-bottom-grid-gap-lg: clamp(2rem, 4vw, 2.5rem);
	--shadcn-sobre1-aside-gap: 1.25rem;
	--shadcn-sobre1-person-gap: 1.25rem;
	--shadcn-sobre1-person-margin-top: 0.25rem;
	--shadcn-sobre1-person-margin-top-lg: 2rem;
	/* Desktop: colunas da grelha 6 (badge + H1). Espaço restante = 6 − este valor (ex.: 4 → ~67% para o título) */
	--shadcn-sobre1-top-copy-cols: 4;
	/* Espaço só entre grelha do título (H1) e imagem hero — menor que o gap geral da secção */
	--shadcn-sobre1-title-hero-gap: clamp(0.5rem, 2vw, 1.25rem);
	--shadcn-sobre1-footer-margin-top: 0;
	--shadcn-sobre1-footer-padding-top: clamp(1.5rem, 4vw, 2.5rem);
	--shadcn-sobre1-footer-padding-bottom: 0;
	--shadcn-sobre1-hero-min-height: 20rem;
	--shadcn-sobre1-hero-max-height: 33rem;
	padding-top: var(--shadcn-sobre1-padding-top, var(--sui-section-padding-top, 0));
	padding-bottom: var(--shadcn-sobre1-padding-bottom, var(--sui-section-padding-bottom, 0));
}

.shadcn-sobre1 *,
.shadcn-sobre1 *::before,
.shadcn-sobre1 *::after {
	box-sizing: border-box;
}

.shadcn-sobre1-container {
	width: 100%;
	max-width: 100rem;
	margin-left: auto;
	margin-right: auto;
}

.shadcn-sobre1-stack {
	display: flex;
	flex-direction: column;
	gap: var(--shadcn-sobre1-stack-gap);
}

/* Título + imagem: gap próprio (reduzido) em relação ao espaço até ao bloco inferior */
.shadcn-sobre1-head {
	display: flex;
	flex-direction: column;
	gap: var(--shadcn-sobre1-title-hero-gap);
	width: 100%;
}

/* Cabeçalho: título + coluna vazia (grelha 6 em desktop) */
.shadcn-sobre1-top-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--shadcn-sobre1-top-grid-gap);
	align-items: start;
}

@media (min-width: 1024px) {
	.shadcn-sobre1-top-grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

/* Ritmo badge → H1: mesmo stack que .shadcn-sobre2-copy / .shadcn-sobre3-copy-inner (gap em base.css) */
.shadcn-sobre1-top-copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--shadcn-sui-section-copy-stack-gap, 1rem);
	width: 100%;
	min-width: 0;
}

@media (min-width: 1024px) {
	.shadcn-sobre1-top-copy {
		grid-column: span var(--shadcn-sobre1-top-copy-cols);
		min-width: 0;
	}
}

.shadcn-sobre1-top-spacer {
	display: none;
}

@media (min-width: 1024px) {
	.shadcn-sobre1-top-spacer {
		display: block;
		grid-column: span calc(6 - var(--shadcn-sobre1-top-copy-cols));
		min-width: 0;
	}
}

/* H1: família, tamanho, peso, interlinha e margens — GeneratePress (Personalizar ▸ Tipografia ▸ Cabeçalho 1), como .sui-hero104__title */
.shadcn-sobre1-title {
	margin: 0;
	color: inherit;
	overflow-wrap: break-word;
	word-wrap: break-word;
	text-wrap: balance;
}

/* Imagem full width (espaço até ao H1: --shadcn-sobre1-title-hero-gap no .shadcn-sobre1-head) */
.shadcn-sobre1-hero {
	width: 100%;
	margin-top: 0;
	overflow: hidden;
	border-radius: 0;
	line-height: 0;
	background: var(--muted, #f4f4f5);
}

.shadcn-sobre1-hero-img {
	display: block;
	width: 100%;
	height: auto;
	min-height: var(--shadcn-sobre1-hero-min-height);
	max-height: var(--shadcn-sobre1-hero-max-height);
	object-fit: cover;
	object-position: center;
}

/* Opção no admin: imagem hero em P&B */
.shadcn-sobre1-hero-img.shadcn-sobre1-hero-img--grayscale {
	filter: grayscale(1);
	-webkit-filter: grayscale(1);
}

/* Bloco inferior: rail | aside | story */
.shadcn-sobre1-bottom-grid {
	display: flex;
	flex-direction: column;
	gap: var(--shadcn-sobre1-bottom-grid-gap);
}

@media (min-width: 1024px) {
	.shadcn-sobre1-bottom-grid {
		display: grid;
		grid-template-columns: repeat(6, minmax(0, 1fr));
		gap: var(--shadcn-sobre1-bottom-grid-gap-lg);
		align-items: start;
	}
}

.shadcn-sobre1-rail {
	display: none;
	margin: 0;
	font-family: var(--shadcn-sobre1-font-rail);
	font-size: var(--shadcn-sobre1-rail-font-size);
	line-height: var(--shadcn-sobre1-rail-line-height);
	color: var(--foreground, var(--sui-gp-text, #0f172a));
}

@media (min-width: 1024px) {
	.shadcn-sobre1-rail {
		display: block;
		grid-column: span 1;
	}
}

.shadcn-sobre1-aside {
	display: flex;
	flex-direction: column;
	gap: var(--shadcn-sobre1-aside-gap);
	order: 2;
}

@media (min-width: 1024px) {
	.shadcn-sobre1-aside {
		grid-column: span 2;
		order: 0;
		padding-right: clamp(1rem, 4vw, 6rem);
		padding-left: clamp(0.5rem, 2vw, 2.5rem);
	}
}

.shadcn-sobre1-story-wrap {
	order: 1;
}

@media (min-width: 1024px) {
	.shadcn-sobre1-story-wrap {
		grid-column: span 3;
		order: 0;
		padding-left: clamp(0.5rem, 2vw, 2.5rem);
		margin-top: 0;
	}
}

/* Texto final: mesma grelha 6 — ocupa colunas 2–6 (rail + aside + story), alinhado ao bloco de cima */
.shadcn-sobre1-footer-wrap {
	order: 3;
	width: 100%;
	margin-top: var(--shadcn-sobre1-footer-margin-top);
	padding-top: var(--shadcn-sobre1-footer-padding-top);
	padding-bottom: var(--shadcn-sobre1-footer-padding-bottom);
	border-top: 1px solid var(--shadcn-sobre1-footer-border-color, var(--border, #e4e4e7));
}

@media (min-width: 1024px) {
	.shadcn-sobre1-footer-wrap {
		grid-column: 2 / -1;
		/* Recuo esquerdo igual à coluna aside (texto alinha com intro / CEO) */
		padding-left: clamp(0.5rem, 2vw, 2.5rem);
		min-width: 0;
	}
}

.shadcn-sobre1-muted {
	color: var(--shadcn-sobre1-muted-fg, rgba(15, 23, 42, 0.45));
}

.shadcn-sobre1-intro {
	margin: 0;
	font-family: var(--shadcn-sobre1-font-body);
	font-size: var(--shadcn-sobre1-intro-font-size);
	line-height: var(--shadcn-sobre1-intro-line-height);
}

.shadcn-sobre1-person {
	display: flex;
	align-items: center;
	gap: var(--shadcn-sobre1-person-gap);
	margin-top: var(--shadcn-sobre1-person-margin-top);
}

@media (min-width: 1024px) {
	.shadcn-sobre1-person {
		margin-top: var(--shadcn-sobre1-person-margin-top-lg);
	}
}

.shadcn-sobre1-avatar {
	flex-shrink: 0;
	width: 3rem;
	height: 3rem;
	border-radius: 9999px;
	object-fit: cover;
}

.shadcn-sobre1-person-text {
	min-width: 0;
}

/* H3: tipografia no Personalizar ▸ Cabeçalho 3 (igual aos outros blocos) */
.shadcn-sobre1-person-name {
	margin: 0;
	color: inherit;
	overflow-wrap: break-word;
	word-wrap: break-word;
}

.shadcn-sobre1-person-role {
	margin: 0.125rem 0 0;
	font-size: var(--shadcn-sobre1-person-role-font-size);
	line-height: var(--shadcn-sobre1-person-role-line-height);
}

.shadcn-sobre1-story {
	margin: 0;
	font-family: var(--shadcn-sobre1-font-story);
	font-size: var(--shadcn-sobre1-story-font-size);
	font-weight: var(--shadcn-sobre1-story-font-weight);
	line-height: var(--shadcn-sobre1-story-line-height);
	letter-spacing: var(--shadcn-sobre1-story-letter-spacing);
	color: var(--foreground, var(--sui-gp-text, #0f172a));
}

.shadcn-sobre1-story > *:first-child {
	margin-top: 0;
}

.shadcn-sobre1-story > *:last-child {
	margin-bottom: 0;
}

.shadcn-sobre1-footer {
	margin: 0;
	font-family: var(--shadcn-sobre1-font-footer);
	font-size: var(--shadcn-sobre1-footer-font-size);
	font-weight: var(--shadcn-sobre1-footer-font-weight);
	line-height: var(--shadcn-sobre1-footer-line-height);
	color: var(--foreground, var(--sui-gp-text, #0f172a));
}

.shadcn-sobre1-footer > *:first-child {
	margin-top: 0;
}

.shadcn-sobre1-footer > *:last-child {
	margin-bottom: 0;
}
