/*!
 * Delegada Sato — CSS de produção.
 *
 * Este arquivo foi escrito à mão reproduzindo exatamente as classes utilitárias
 * do Tailwind CSS usadas nos templates do tema (equivalente ao output que o
 * `tailwindcss` CLI geraria a partir de assets/src/input.css + tailwind.config.js).
 * Isso permite que o tema funcione imediatamente em qualquer hospedagem, mesmo
 * sem Node.js disponível no servidor.
 *
 * Para adicionar NOVAS classes Tailwind no futuro:
 *   1) instale Node.js na sua máquina de desenvolvimento
 *   2) rode `npm install`
 *   3) rode `npm run build` (ou `npm run watch` durante o desenvolvimento)
 * O comando irá reler assets/src/input.css e regravar este arquivo por completo.
 */

/* ==========================================================================
   0. Variáveis de marca (sobrescritas pelo WP Customizer via inc/customizer.php)
   ========================================================================== */
:root {
	--dsato-primary-rgb: 0 87 184;        /* #0057B8 */
	--dsato-primary-dark-rgb: 0 59 115;   /* #003b73 */
	--dsato-secondary-rgb: 255 209 0;     /* #FFD100 */
}

/* ==========================================================================
   1. Reset / Preflight (baseado no Tailwind Preflight)
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: currentColor; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: "Public Sans", ui-sans-serif, system-ui, sans-serif; color: #1e293b; background-color: #f5f7f8; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; margin: 0; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: inherit; }
button { font-family: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; color: inherit; margin: 0; padding: 0; background-color: transparent; background-image: none; cursor: pointer; }
img, svg { display: block; max-width: 100%; height: auto; vertical-align: middle; }
input, textarea, select { font-family: inherit; font-size: 100%; line-height: inherit; color: inherit; margin: 0; }
table { border-collapse: collapse; }

h1, h2, h3, h4 { font-family: "Inter", ui-sans-serif, system-ui, sans-serif; }

/* ==========================================================================
   2. Componentes (equivalentes ao @layer components do input.css)
   ========================================================================== */
.site-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 50;
	transition: background-color .3s ease, box-shadow .3s ease, backdrop-filter .3s ease;
	background-color: rgb(var(--dsato-primary-rgb) / .95);
}
.site-header.header-scrolled {
	background-color: rgba(255, 255, 255, .9);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}
.site-header .nav-link { color: #ffffff; transition: color .2s ease; text-decoration: none; }
.site-header.header-scrolled .nav-link { color: rgb(var(--dsato-primary-dark-rgb)); }
.site-header.header-scrolled .logo-text { color: rgb(var(--dsato-primary-dark-rgb)); }

.hero-clip { clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%); }

.dot-pattern {
	background-image: radial-gradient(rgba(255, 255, 255, .12) 1.5px, transparent 1.5px);
	background-size: 22px 22px;
}

.btn-primary, .btn-outline {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	border-radius: .375rem; padding: .875rem 1.75rem;
	font-family: "Inter", sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .025em;
	text-decoration: none; cursor: pointer;
}
.btn-primary {
	background-color: rgb(var(--dsato-secondary-rgb)); color: rgb(var(--dsato-primary-dark-rgb)); box-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
	transition: transform .15s ease, filter .15s ease; border: none;
}
.btn-primary:hover { transform: translateY(-2px); filter: brightness(.92); }
.btn-outline {
	border: 2px solid rgba(255, 255, 255, .8); color: #ffffff; background: transparent;
	transition: background-color .2s ease, color .2s ease;
}
.btn-outline:hover { background-color: #ffffff; color: rgb(var(--dsato-primary-dark-rgb)); }

.section-label { display: inline-block; font-family: "Inter", sans-serif; font-size: .875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: rgb(var(--dsato-primary-rgb)); }
.section-title { margin-top: .5rem; font-family: "Inter", sans-serif; font-size: 1.875rem; font-weight: 900; text-transform: uppercase; color: rgb(var(--dsato-primary-dark-rgb)); }
.section-underline { margin-top: 1rem; height: .25rem; width: 4rem; border-radius: .25rem; background-color: rgb(var(--dsato-secondary-rgb)); }

.pillar-card {
	position: relative; border-radius: .5rem; border-top: 4px solid rgb(var(--dsato-secondary-rgb)); background-color: #ffffff;
	padding: 1.75rem; box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	transition: transform .2s ease, box-shadow .2s ease; text-decoration: none; color: inherit; display: block;
}
.pillar-card:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1); }

.stat-block { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 1rem 1.5rem; }

.skip-link {
	position: absolute; left: -9999px; top: -9999px; z-index: 100;
	background: #ffffff; color: rgb(var(--dsato-primary-dark-rgb)); padding: .5rem 1rem; border-radius: .25rem; font-weight: 700;
}
.skip-link:focus { left: 1rem; top: 1rem; }

.entry-content { font-size: 1.125rem; line-height: 1.75rem; color: #334155; }
.entry-content h2 { margin-top: 2rem; font-family: "Inter", sans-serif; font-size: 1.5rem; font-weight: 900; text-transform: uppercase; color: rgb(var(--dsato-primary-dark-rgb)); }
.entry-content h3 { margin-top: 1.5rem; font-family: "Inter", sans-serif; font-size: 1.25rem; font-weight: 700; color: rgb(var(--dsato-primary-dark-rgb)); }
.entry-content p { margin-top: 1rem; }
.entry-content ul, .entry-content ol { margin-top: 1rem; margin-left: 1.5rem; list-style: disc; }
.entry-content ul > li, .entry-content ol > li { margin-top: .5rem; }
.entry-content a { color: rgb(var(--dsato-primary-rgb)); text-decoration: underline; }
.entry-content a:hover { color: rgb(var(--dsato-primary-dark-rgb)); }
.entry-content img { margin-top: 1.5rem; border-radius: .75rem; }

/* ==========================================================================
   3. Utilitários (equivalentes às classes Tailwind usadas nos templates)
   ========================================================================== */

/* Layout / display */
.block { display: block; }
.inline-block { display: inline-block; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid { display: grid; }
.hidden { display: none; }

/* Position */
.relative { position: relative; }
.absolute { position: absolute; }
.pointer-events-none { pointer-events: none; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.top-6 { top: 1.5rem; }
.bottom-6 { bottom: 1.5rem; }
.left-6 { left: 1.5rem; }
.right-6 { right: 1.5rem; }
.z-10 { z-index: 10; }

/* Flex / Grid */
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-shrink-0 { flex-shrink: 0; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Gap */
.gap-1 { gap: .25rem; }
.gap-1\.5 { gap: .375rem; }
.gap-2 { gap: .5rem; }
.gap-3 { gap: .75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-12 { gap: 3rem; }
.gap-y-10 { row-gap: 2.5rem; }

/* Spacing (margin / padding) */
.mx-auto { margin-left: auto; margin-right: auto; }
.mb-1 { margin-bottom: .25rem; }
.mb-2 { margin-bottom: .5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mt-2 { margin-top: .5rem; }
.mt-3 { margin-top: .75rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-10 { margin-top: 2.5rem; }
.\!mt-12 { margin-top: 3rem !important; }
.-mx-7 { margin-left: -1.75rem; margin-right: -1.75rem; }
.-mt-7 { margin-top: -1.75rem; }
.ml-1 { margin-left: .25rem; }
.p-8 { padding: 2rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.py-1\.5 { padding-top: .375rem; padding-bottom: .375rem; }
.py-2\.5 { padding-top: .625rem; padding-bottom: .625rem; }
.py-3 { padding-top: .75rem; padding-bottom: .75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.py-32 { padding-top: 8rem; padding-bottom: 8rem; }
.pb-6 { padding-bottom: 1.5rem; }
.pb-8 { padding-bottom: 2rem; }
.pb-16 { padding-bottom: 4rem; }
.pb-24 { padding-bottom: 6rem; }
.pt-4 { padding-top: 1rem; }
.pt-6 { padding-top: 1.5rem; }
.pt-32 { padding-top: 8rem; }
.space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
.space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
.space-y-10 > :not([hidden]) ~ :not([hidden]) { margin-top: 2.5rem; }

/* Sizing */
.w-full { width: 100%; }
.h-full { height: 100%; }
.w-7 { width: 1.75rem; }
.h-0\.5 { height: .125rem; }
.w-12 { width: 3rem; }
.h-12 { height: 3rem; }
.max-w-sm { max-width: 24rem; }
.max-w-md { max-width: 28rem; }
.max-w-lg { max-width: 32rem; }
.max-w-xl { max-width: 36rem; }
.max-w-2xl { max-width: 42rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-6xl { max-width: 72rem; }
.max-w-7xl { max-width: 80rem; }
.aspect-\[4\/5\] { aspect-ratio: 4 / 5; }
.aspect-\[4\/3\] { aspect-ratio: 4 / 3; }
.aspect-\[16\/10\] { aspect-ratio: 16 / 10; }
.aspect-\[16\/9\] { aspect-ratio: 16 / 9; }

/* Borders / radius */
.border { border-width: 1px; }
.border-t { border-top-width: 1px; }
.border-b { border-bottom-width: 1px; }
.border-slate-200 { border-color: #e2e8f0; }
.border-slate-300 { border-color: #cbd5e1; }
.border-white\/10 { border-color: rgba(255, 255, 255, .1); }
.rounded-full { border-radius: 9999px; }
.rounded-md { border-radius: .375rem; }
.rounded-t-md { border-top-left-radius: .375rem; border-top-right-radius: .375rem; }
.rounded-xl { border-radius: .75rem; }
.rounded-2xl { border-radius: 1rem; }

/* Backgrounds / colors */
.bg-surface { background-color: #f5f7f8; }
.bg-white { background-color: #ffffff; }
.bg-white\/10 { background-color: rgba(255, 255, 255, .1); }
.bg-primary { background-color: rgb(var(--dsato-primary-rgb)); }
.bg-primary\/5 { background-color: rgb(var(--dsato-primary-rgb) / .05); }
.bg-primary\/10 { background-color: rgb(var(--dsato-primary-rgb) / .1); }
.bg-primary-dark { background-color: rgb(var(--dsato-primary-dark-rgb)); }
.bg-primary-dark\/60 { background-color: rgb(var(--dsato-primary-dark-rgb) / .6); }
.text-primary { color: rgb(var(--dsato-primary-rgb)); }
.text-primary-dark { color: rgb(var(--dsato-primary-dark-rgb)); }
.text-secondary { color: rgb(var(--dsato-secondary-rgb)); }
.text-white { color: #ffffff; }
.text-white\/50 { color: rgba(255, 255, 255, .5); }
.text-white\/60 { color: rgba(255, 255, 255, .6); }
.text-white\/70 { color: rgba(255, 255, 255, .7); }
.text-white\/80 { color: rgba(255, 255, 255, .8); }
.text-white\/85 { color: rgba(255, 255, 255, .85); }
.text-slate-500 { color: #64748b; }
.text-slate-600 { color: #475569; }
.text-slate-700 { color: #334155; }

/* Gradients */
.bg-gradient-to-t { background-image: linear-gradient(to top, var(--tw-gradient-stops)); }
.from-primary { --tw-gradient-from: rgb(var(--dsato-primary-rgb)); --tw-gradient-to: rgb(var(--dsato-primary-rgb) / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-primary-dark\/90 { --tw-gradient-from: rgb(var(--dsato-primary-dark-rgb) / .9); --tw-gradient-to: rgb(var(--dsato-primary-dark-rgb) / 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-primary\/10 { --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--dsato-primary-rgb) / .1), var(--tw-gradient-to); }
.via-primary-dark\/10 { --tw-gradient-stops: var(--tw-gradient-from), rgb(var(--dsato-primary-dark-rgb) / .1), var(--tw-gradient-to); }
.to-transparent { --tw-gradient-to: transparent; }

/* Shadows */
.shadow-lg { box-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1); }
.shadow-xl { box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1); }

/* Object fit / overflow */
.object-cover { object-fit: cover; }
.overflow-hidden { overflow: hidden; }

/* Typography */
.font-heading { font-family: "Inter", ui-sans-serif, system-ui, sans-serif; }
.font-black { font-weight: 900; }
.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }
.uppercase { text-transform: uppercase; }
.normal-case { text-transform: none; }
.underline { text-decoration-line: underline; }
.text-center { text-align: center; }
.align-top { vertical-align: top; }
.tracking-wide { letter-spacing: .025em; }
.leading-tight { line-height: 1.25; }
.leading-relaxed { line-height: 1.625; }
.leading-\[0\.95\] { line-height: .95; }
.text-xs { font-size: .75rem; line-height: 1rem; }
.text-sm { font-size: .875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-5xl { font-size: 3rem; line-height: 1; }
.text-6xl { font-size: 3.75rem; line-height: 1; }
.text-7xl { font-size: 4.5rem; line-height: 1; }

/* Transitions */
.transition-opacity { transition-property: opacity; transition-duration: .2s; transition-timing-function: ease; }
.transition-transform { transition-property: transform; transition-duration: .2s; transition-timing-function: ease; }

/* Hover / focus states */
.hover\:opacity-70:hover { opacity: .7; }
.hover\:text-primary:hover { color: rgb(var(--dsato-primary-rgb)); }
.hover\:text-primary-dark:hover { color: rgb(var(--dsato-primary-dark-rgb)); }
.hover\:text-white:hover { color: #ffffff; }
.focus\:border-primary:focus { border-color: rgb(var(--dsato-primary-rgb)); }
.focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; }
.focus\:ring-2:focus { box-shadow: 0 0 0 2px var(--tw-ring-color, rgb(var(--dsato-primary-rgb) / .3)); }
.focus\:ring-primary\/30:focus { --tw-ring-color: rgb(var(--dsato-primary-rgb) / .3); }

/* ==========================================================================
   4. Responsivo — sm (>= 640px)
   ========================================================================== */
@media (min-width: 640px) {
	.sm\:flex-row { flex-direction: row; }
	.sm\:justify-center { justify-content: center; }
	.sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.sm\:gap-y-0 { row-gap: 0; }
	.sm\:px-8 { padding-left: 2rem; padding-right: 2rem; }
	.sm\:pt-40 { padding-top: 10rem; }
	.sm\:w-auto { width: auto; }
	.sm\:text-xl { font-size: 1.25rem; line-height: 1.75rem; }
	.sm\:text-2xl { font-size: 1.5rem; line-height: 2rem; }
	.sm\:text-5xl { font-size: 3rem; line-height: 1; }
	.sm\:text-6xl { font-size: 3.75rem; line-height: 1; }
	.section-title { font-size: 2.25rem; }
	.stat-block { border-left: 1px solid rgba(255, 255, 255, .15); }
	.stat-block:first-child { border-left: 0; }
}

/* ==========================================================================
   5. Responsivo — lg (>= 1024px)
   ========================================================================== */
@media (min-width: 1024px) {
	.lg\:flex { display: flex; }
	.lg\:hidden { display: none; }
	.lg\:flex-row { flex-direction: row; }
	.lg\:items-center { align-items: center; }
	.lg\:justify-start { justify-content: flex-start; }
	.lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.lg\:gap-8 { gap: 2rem; }
	.lg\:mx-0 { margin-left: 0; margin-right: 0; }
	.lg\:max-w-none { max-width: none; }
	.lg\:py-0 { padding-top: 0; padding-bottom: 0; }
	.lg\:text-left { text-align: left; }
	.lg\:text-7xl { font-size: 4.5rem; line-height: 1; }
}

/* ==========================================================================
   6. Impressão de segurança: garante que o menu mobile funcione mesmo se
   JS falhar em carregar (estado inicial via classe utilitária .hidden acima)
   ========================================================================== */
#mobile-menu.flex { display: flex; }
