/*!
Theme Name: Inovafio
Theme URI: http://underscores.me/
Author: KuryArt
Author URI: https://kuryart.com
Description: Tema do site institucional da Inovafio
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: inovafio
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Inovafio is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Inovafio
--------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	background: #1a1a1a;
	color: #fff;
	line-height: 1.6;
}

.container {
	max-width: 100%;
	margin: 0 auto;
}

/* HERO SECTION */
.hero-topbar {
	background:
		radial-gradient(ellipse 55% 160% at 50% 50%, rgba(144, 191, 100, 0.55) 0%, rgba(144, 191, 100, 0.18) 45%, rgba(26, 26, 26, 0) 75%),
		#1a1a1a;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hero-topbar .logo {
	max-width: 110px;
	height: auto;
	margin: 0;
}

.hero {
	background-color: #1a1a1a;
	background-image:
		radial-gradient(ellipse 80% 60% at center 30%, rgba(26, 26, 26, 0.1) 0%, rgba(26, 26, 26, 0.5) 50%, rgba(26, 26, 26, 0.95) 100%),
		linear-gradient(180deg, rgba(26, 26, 26, 0.4) 0%, rgba(26, 26, 26, 0.1) 22%, rgba(26, 26, 26, 0.55) 60%, #1a1a1a 92%),
		var(--hero-bg-image);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding: 50px 20px 80px;
	text-align: center;
	min-height: 95vh;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
}

.hero-content {
	max-width: 320px;
	margin: 0 auto;
}

.hero h1 {
	font-size: 2.8rem;
	font-weight: 700;
	margin-bottom: 20px;
	line-height: 1.2;
	letter-spacing: -0.5px;
}

.hero-image-placeholder {
	margin: 30px 0 40px;
	width: 100%;
	max-width: 400px;
	height: 350px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	border-radius: 8px;
}

.hero-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero p {
	font-size: 1.1rem;
	margin-bottom: 50px;
	max-width: 500px;
	color: #e0e0e0;
	line-height: 1.8;
}

.cta-button {
	background: linear-gradient(135deg, #a8d47f 0%, #8FBE64 45%, #5f8c42 100%);
	box-shadow: 0 6px 20px rgba(143, 190, 100, 0.35);
	color: #1a1a1a;
	padding: 18px 50px;
	font-size: 1.1rem;
	font-weight: 700;
	border: none;
	border-radius: 50px;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
	transition: all 0.3s ease;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.cta-button:hover {
	background: linear-gradient(135deg, #b6dd93 0%, #9ecb77 45%, #6c9b4a 100%);
	box-shadow: 0 8px 24px rgba(143, 190, 100, 0.5);
	transform: translateY(-2px);
	box-shadow: 0 10px 30px rgba(143, 190, 100, 0.3);
}

/* SECTION SPACING */
section {
	padding: 80px 20px;
	max-width: 1000px;
	margin: 0 auto;
}

section h2 {
	font-size: 2rem;
	margin-bottom: 50px;
	text-align: center;
	color: #fff;
	font-weight: 700;
}

/* PROBLEMS SECTION */
.problems {
	background: linear-gradient(135deg, #4a7a5e 0%, #23392c 100%);
}

.problems-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	margin-top: 50px;
}

@media (min-width: 768px) {
	.problems-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.problem-card {
	border-left: 4px solid #c8e6a0;
	padding: 30px;
	background: rgba(0, 0, 0, 0.22);
	border-radius: 2px;
}

.problem-card h3 {
	color: #c8e6a0;
	font-size: 1.3rem;
	margin-bottom: 15px;
	font-weight: 600;
}

.problem-card p {
	color: #e8e8e2;
	font-size: 1rem;
}

/* WHY SECTION */
.why {
	background: #f7f5f0;
}

.why h2 {
	color: #335648;
	margin-bottom: 60px;
	font-size: 2.4rem;
}

.why-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 35px;
	margin-top: 40px;
}

@media (min-width: 768px) {
	.why-list {
		grid-template-columns: 1fr 1fr;
	}
}

.why-item {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.why-item::before {
	content: '✓';
	color: #335648;
	font-size: 2rem;
	font-weight: bold;
	flex-shrink: 0;
	margin-top: -5px;
}

.why-item h4 {
	color: #1a1a1a;
	font-size: 1.1rem;
	margin-bottom: 8px;
	font-weight: 600;
}

.why-item p {
	color: #444;
	font-size: 0.95rem;
}

/* HOW IT WORKS */
.how-it-works {
	background: linear-gradient(135deg, #4a7a5e 0%, #23392c 100%);
}

.steps {
	display: grid;
	grid-template-columns: 1fr;
	gap: 50px;
	margin-top: 50px;
}

@media (min-width: 768px) {
	.steps {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

.step {
	text-align: center;
}

.step-number {
	background: #8FBE64;
	color: #1a1a1a;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
}

.step-number svg {
	width: 34px;
	height: 34px;
}

.step h3 {
	color: #fff;
	margin-bottom: 12px;
	font-size: 1.2rem;
	font-weight: 600;
}

.step p {
	color: #d5d8d3;
	font-size: 0.95rem;
	line-height: 1.7;
}

/* FAQ */
.faq {
	background: #f7f5f0;
}

.faq h2 {
	color: #335648;
}

.faq-item {
	margin-bottom: 30px;
	border-bottom: 1px solid rgba(51, 86, 72, 0.15);
	padding-bottom: 30px;
}

.faq-item:last-child {
	border-bottom: none;
}

.faq-item h3 {
	color: #335648;
	margin-bottom: 12px;
	font-size: 1.1rem;
	font-weight: 600;
	cursor: pointer;
	user-select: none;
}

.faq-item p {
	color: #444;
	font-size: 0.95rem;
	line-height: 1.7;
}

/* FINAL CTA */
.final-cta {
	background: linear-gradient(135deg, #4a7a5e 0%, #23392c 100%);
	padding: 80px 20px;
	text-align: center;
}

.final-cta h2 {
	font-size: 2.2rem;
	margin-bottom: 30px;
	color: #fff;
}

.final-cta p {
	font-size: 1.1rem;
	max-width: 600px;
	margin: 0 auto 50px;
	color: #d0d0d0;
}

/* FOOTER */
footer {
	background: linear-gradient(160deg, #23392c 0%, #1a2b21 55%, #10190f 100%);
	padding: 40px 20px;
	text-align: center;
	color: #a8b5ac;
	font-size: 0.9rem;
	border-top: 1px solid rgba(143, 190, 100, 0.15);
}

footer a {
	color: #8FBE64;
	text-decoration: none;
}

footer a:hover {
	text-decoration: underline;
}

/* RESPONSIVE */
@media (max-width: 768px) {
	.hero h1 {
		font-size: 2rem;
	}

	.hero .tagline {
		font-size: 1.2rem;
	}

	section {
		padding: 50px 20px;
	}

	section h2 {
		font-size: 1.6rem;
	}

	.cta-button {
		padding: 15px 40px;
		font-size: 1rem;
	}
}
