/*
Theme Name: Egenese Theme
Theme URI: https://github.com/brmagrinipc/egenese-theme
Author: Bruno Willow
Author URI: https://brunomagrini.com.br
Description: Tema customizado institucional da E-Gênese.
Version: 0.2.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 8.1
Text Domain: egenese-theme
*/

:root {
  --bg: #0A2540;
  --bg-soft: #0f3358;
  --surface: rgba(255,255,255,0.06);
  --surface-strong: rgba(255,255,255,0.1);
  --accent: #00C896;
  --accent-dark: #00a97e;
  --text: #FFFFFF;
  --text-soft: rgba(255,255,255,0.78);
  --border: rgba(255,255,255,0.12);
  --shadow: 0 20px 60px rgba(0,0,0,0.24);
  --radius: 22px;
  --container: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Poppins', 'Raleway', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: linear-gradient(180deg, #071a2d 0%, var(--bg) 22%, #0d2c4d 100%);
  color: var(--text);
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
.container { width: min(calc(100% - 2rem), var(--container)); margin: 0 auto; }
.section { padding: 88px 0; position: relative; }
.section-title { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.08; margin: 0 0 1rem; }
.section-subtitle { max-width: 760px; color: var(--text-soft); font-size: 1.05rem; line-height: 1.7; }
.eyebrow { display: inline-flex; align-items: center; gap: .55rem; margin-bottom: 1rem; padding: .5rem .9rem; border-radius: 999px; background: rgba(0,200,150,0.12); color: #c9fff1; border: 1px solid rgba(0,200,150,0.2); font-size: .88rem; letter-spacing: .08em; text-transform: uppercase; }
.site-header { position: sticky; top: 0; z-index: 40; backdrop-filter: blur(18px); background: rgba(7, 26, 45, 0.72); border-bottom: 1px solid rgba(255,255,255,0.06); }
.header-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: flex; align-items: center; gap: 1rem; }
.brand-mark { width: 54px; height: 54px; border-radius: 18px; position: relative; background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.03)); border: 1px solid rgba(255,255,255,0.10); overflow: hidden; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12); }
.brand-bars { position: absolute; inset: 12px; display: flex; align-items: end; gap: 6px; }
.brand-bars span { flex: 1; display: block; border-radius: 10px 10px 2px 2px; background: linear-gradient(180deg, #4ef3c7 0%, var(--accent) 100%); box-shadow: 0 0 18px rgba(0,200,150,0.35); }
.brand-bars span:nth-child(1) { height: 42%; }
.brand-bars span:nth-child(2) { height: 68%; }
.brand-bars span:nth-child(3) { height: 100%; }
.brand-name { font-weight: 700; letter-spacing: .03em; }
.brand-tagline { color: var(--text-soft); font-size: .86rem; display:block; }
.main-nav { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.main-nav a { color: rgba(255,255,255,0.88); font-size: .96rem; }
.main-nav a:hover { color: var(--accent); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 52px; padding: 0 1.3rem; border-radius: 999px; font-weight: 600; transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease; border: 1px solid transparent; cursor: pointer; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: linear-gradient(135deg, var(--accent), #2df1bf); color: #052234; box-shadow: 0 16px 34px rgba(0,200,150,.28); }
.btn-primary:hover { background: linear-gradient(135deg, #21dbac, #62ffd5); }
.btn-secondary { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.14); color: var(--text); }
.btn-secondary:hover { border-color: rgba(255,255,255,0.28); background: rgba(255,255,255,0.08); }
.hero { min-height: calc(100vh - 82px); display: grid; align-items: center; overflow: hidden; background: radial-gradient(circle at top right, rgba(0,200,150,0.16), transparent 28%), radial-gradient(circle at bottom left, rgba(0,200,150,0.12), transparent 24%); }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 3rem; align-items: center; }
.hero h1 { font-size: clamp(2.8rem, 7vw, 5.3rem); line-height: .98; margin: 0 0 1.25rem; }
.hero p { font-size: 1.12rem; line-height: 1.8; color: var(--text-soft); max-width: 720px; margin: 0 0 2rem; }
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero-panel { background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)); border: 1px solid var(--border); border-radius: 28px; padding: 1.5rem; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.hero-panel::before { content: ''; position: absolute; inset: auto -20% -40% auto; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(0,200,150,.35) 0%, transparent 70%); }
.metric-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; position: relative; z-index: 1; }
.metric-card, .card, .benefit, .step, .contact-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.metric-card { padding: 1.2rem; }
.metric-label { color: var(--text-soft); font-size: .9rem; }
.metric-value { font-size: 1.9rem; font-weight: 700; margin-top: .45rem; }
.hero-lines { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero-lines span { position: absolute; bottom: -160px; width: 2px; height: 210px; background: linear-gradient(180deg, rgba(0,200,150,0), rgba(0,200,150,.7), rgba(255,255,255,0)); animation: rise 7s linear infinite; opacity: .55; }
.hero-lines span:nth-child(1) { left: 10%; animation-duration: 8s; animation-delay: -1s; }
.hero-lines span:nth-child(2) { left: 24%; animation-duration: 6.8s; animation-delay: -4s; }
.hero-lines span:nth-child(3) { left: 42%; animation-duration: 7.4s; animation-delay: -2s; }
.hero-lines span:nth-child(4) { left: 61%; animation-duration: 6.5s; animation-delay: -3s; }
.hero-lines span:nth-child(5) { left: 78%; animation-duration: 8.4s; animation-delay: -5s; }
.hero-lines span:nth-child(6) { left: 90%; animation-duration: 7.2s; animation-delay: -2.5s; }
@keyframes rise { from { transform: translateY(0); opacity: 0; } 12% { opacity: .55; } to { transform: translateY(-115vh); opacity: 0; } }
.grid-2 { display: grid; grid-template-columns: .95fr 1.05fr; gap: 2rem; align-items: start; }
.card { padding: 1.6rem; transition: transform .28s ease, border-color .28s ease, background .28s ease; }
.card:hover, .benefit:hover, .step:hover, .contact-card:hover { transform: translateY(-4px); border-color: rgba(0,200,150,.35); }
.cards-4 { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1.2rem; }
.cards-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.2rem; }
.icon { width: 52px; height: 52px; display: inline-grid; place-items: center; border-radius: 16px; margin-bottom: 1rem; background: linear-gradient(180deg, rgba(0,200,150,.24), rgba(0,200,150,.08)); color: #c9fff1; font-weight: 700; font-size: 1.1rem; transition: transform .25s ease; }
.card:hover .icon, .benefit:hover .icon { transform: translateY(-3px) scale(1.04); }
.card h3, .benefit h3, .contact-card h3 { margin: 0 0 .75rem; font-size: 1.22rem; }
.card p, .benefit p, .contact-card p, .step p { margin: 0; color: var(--text-soft); line-height: 1.75; }
.benefit { padding: 1.4rem; }
.step { padding: 1.4rem; position: relative; }
.step-number { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(0,200,150,.14); color: #d8fff4; font-weight: 700; margin-bottom: 1rem; }
.cta { padding: 2rem; border-radius: 32px; border: 1px solid rgba(0,200,150,.25); background: linear-gradient(135deg, rgba(0,200,150,.16), rgba(255,255,255,.05)); box-shadow: var(--shadow); display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 1.4rem; }
.contact-card { padding: 1.4rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.form-grid .full { grid-column: 1 / -1; }
label { display: block; font-size: .92rem; margin-bottom: .4rem; color: rgba(255,255,255,.88); }
input, textarea { width: 100%; border-radius: 16px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.04); color: var(--text); padding: .95rem 1rem; outline: none; }
input:focus, textarea:focus { border-color: rgba(0,200,150,.6); box-shadow: 0 0 0 4px rgba(0,200,150,.12); }
textarea { min-height: 140px; resize: vertical; }
.site-footer { padding: 2rem 0 3rem; background: rgba(4, 15, 25, .55); border-top: 1px solid rgba(255,255,255,.08); }
.footer-grid { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; flex-wrap: wrap; }
.footer-links, .social-links { display: flex; gap: 1rem; flex-wrap: wrap; }
.footer-links a, .social-links a { color: var(--text-soft); }
.footer-links a:hover, .social-links a:hover { color: var(--accent); }
.fade-up { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s ease; }
.fade-up.is-visible { opacity: 1; transform: translateY(0); }
@media (max-width: 1080px) { .hero-grid, .grid-2, .contact-grid, .cards-4, .cards-3 { grid-template-columns: 1fr 1fr; } .hero-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .section { padding: 68px 0; } .header-inner { min-height: auto; padding: 1rem 0; align-items: flex-start; flex-direction: column; } .main-nav { width: 100%; gap: .9rem; } .cards-4, .cards-3, .grid-2, .contact-grid, .form-grid, .metric-grid { grid-template-columns: 1fr; } .hero { min-height: auto; padding: 3rem 0 1rem; } .hero h1 { font-size: clamp(2.5rem, 13vw, 3.7rem); } .brand { align-items: flex-start; } }