/**
 * Kat Blocks — shared.css
 * ATENÇÃO: Este arquivo NÃO é carregado automaticamente pelo plugin.
 * Inclua-o no seu tema ou num bloco que seja sempre exibido (ex: topbar).
 *
 * Contém: tokens globais, container, utilitários e estilos base
 * utilizados por todos os blocos Kat.
 */

/* ================================================
DESIGN TOKENS — Gauss
================================================ */

:root {
	/* Cores Gauss */
	--color-primary:     #a2235b;   /* azul marinho institucional */
	--color-primary-mid: #d14884;
	--color-accent:      #a78f30;   /* laranja energia */
	--color-accent-lt:   #f7ecaf;
	--color-accent-dk:   #8b751a;
	--color-bg:          #ffffff;
	--color-bg-alt:      #f5f7fb;
	--color-bg-dark:     #2a0534;
	--color-text:        #1b0421;
	--color-text-muted:  #5a6478;
	--color-border:      #dde3ed;
	--color-ice:        #EBF0F6;
	--color-gold:       #C8922A;
	--color-steel:      #4A6080;
	--color-white:      #FFFFFF;

	/* FNQ – tipografia e espaço */
	--font-base:         'Inter', sans-serif;
	--font-display:      'Merriweather', serif;
	--font-size-base:    1rem;
	--line-height-base:  1.65;

	/* Espaçamentos */
	--space-xs:  0.25rem;
	--space-sm:  0.5rem;
	--space-md:  1rem;
	--space-lg:  2rem;
	--space-xl:  4rem;
	--space-2xl: 6rem;

	/* Bordas */
	--radius-sm: 6px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--radius-pill: 999px;

	/* Sombras */
	--shadow-sm:  0 2px 8px rgba(11,46,94,.08);
	--shadow-md:  0 8px 24px rgba(11,46,94,.12);
	--shadow-lg:  0 16px 48px rgba(11,46,94,.16);
}

/* ================================================
	GENERIC — utilitários reutilizáveis
	================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
	font-family: var(--font-base);
	font-size: var(--font-size-base);
	line-height: var(--line-height-base);
	color: var(--color-text);
	background: var(--color-bg);
	-webkit-font-smoothing: antialiased;
}



.section-padding   { padding: var(--space-xl) 0; }
.section-padding-lg { padding: var(--space-2xl) 0; }

.section-eyebrow {
	display: inline-block;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: .75rem;
}

.section-title, h1, h2, h3, h4 {
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.25;
}

.section-title{
	color: var(--color-primary);
	margin-bottom: var(--space-md);
	font-size: clamp(1.6rem, 4vw, 2.6rem);
}

.section-title.light { color: var(--color-white); }

.section-subtitle {
	font-size: 1.1rem;
	color: var(--color-text-muted);
	max-width: 680px;
	margin-bottom: var(--space-lg);
}

.bg-alt   { background: var(--color-bg-alt); }
.bg-dark  { background: var(--color-bg-dark); }
.bg-primary { background: var(--color-primary); }

.btn-primary {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	background: var(--color-accent);
	color: var(--color-white);
	font-weight: 700;
	font-size: .95rem;
	padding: .85rem 2rem;
	border-radius: var(--radius-pill);
	border: none;
	text-decoration: none;
	transition: background .2s, transform .15s, box-shadow .2s;
	box-shadow: 0 4px 16px rgba(232,97,10,.35);
	text-align: center;
}

.btn-primary:hover {
	background: var(--color-accent-dk);
	color: var(--color-white);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(232,97,10,.4);
	text-decoration: none;
}
.btn-primary span{
	color: inherit;
	text-decoration: inherit;
	text-align: inherit;
	display: block;
	width: 100%;
}
.btn-outline {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	background: transparent;
	color: #fff;
	font-weight: 600;
	font-size: .9rem;
	padding: .75rem 1.75rem;
	border-radius: var(--radius-pill);
	border: 2px solid rgba(255,255,255,.5);
	text-decoration: none;
	transition: all .2s;
}
.btn-outline:hover {
	border-color: #fff;
	background: rgba(255,255,255,.1);
	color: #fff;
}