/*
Theme Name: Marina Ferreira Neuropsicóloga
Theme URI: https://marinaferreirapsi.com.br
Author: Marina Ferreira
Description: Site profissional da Psicóloga Marina Ferreira, especialista em Avaliação Neuropsicológica.
Version: 2.1.0
License: GNU General Public License v2 or later
Text Domain: marina-neuro
*/

:root {
  --verde:    #4C5236;
  --sage:     #8D8B72;
  --terracota:#BF4E30;
  --pessego:  #D6A07E;
  --laranja:  #DB6E36;
  --areia:    #DDC3AA;
  --creme:    #F5F0E8;
  --branco:   #FAFAF8;
  --texto:    #2C2C2C;
  --texto-cl: #5C5C5C;
  --display:  'Cormorant Garamond', Georgia, serif;
  --corpo:    'DM Sans', system-ui, sans-serif;
  --maxw:     1160px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--corpo); color: var(--texto); background: var(--branco); line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 2rem; }

/* ── NAV ─────────────────────────────────── */
.marina-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; padding: 1.5rem 0; transition: background .4s, padding .4s, box-shadow .4s; }
.marina-nav.scrolled { background: var(--verde); padding: 1rem 0; box-shadow: 0 2px 20px rgba(0,0,0,.18); }
.nav-inner { max-width: var(--maxw); margin: 0 auto; padding: 0 2rem; display: flex; align-items: center; justify-content: space-between; }
.nav-logo { font-family: var(--display); font-size: 1.1rem; font-weight: 500; color: var(--branco); letter-spacing: .02em; line-height: 1.2; }
.nav-logo span { display: block; font-size: .65rem; font-family: var(--corpo); font-weight: 300; letter-spacing: .15em; text-transform: uppercase; opacity: .7; margin-top: 2px; }
.nav-links { display: flex; gap: 2.2rem; list-style: none; }
.nav-links a { font-size: .76rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.8); transition: color .2s; }
.nav-links a:hover { color: var(--areia); }
.nav-toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 4px; }
.nav-toggle span { display: block; width: 24px; height: 1.5px; background: var(--branco); transition: transform .3s, opacity .3s; }

/* ── HERO ────────────────────────────────── */
.hero { min-height: 100vh; background: var(--verde); display: flex; align-items: center; position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 70% 25%, rgba(141,139,114,.18) 0%, transparent 55%), radial-gradient(ellipse at 15% 85%, rgba(191,78,48,.1) 0%, transparent 50%); }
.hero-inner { max-width: var(--maxw); margin: 0 auto; padding: 8rem 2rem 5rem; position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 0.82fr; gap: 4rem; align-items: center; }
.hero-foto { position: relative; justify-self: end; }
.hero-foto img { width: auto; max-width: 100%; max-height: 76vh; display: block; border-radius: 2px; box-shadow: 0 22px 55px rgba(0,0,0,.32); }
.hero-foto::after { content: ''; position: absolute; top: 16px; left: -16px; right: 16px; bottom: -16px; border: 1px solid rgba(221,195,170,.35); z-index: -1; border-radius: 2px; }
.hero-eyebrow { font-size: .74rem; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; color: var(--areia); opacity: .8; margin-bottom: 1.5rem; }
.hero h1 { font-family: var(--display); font-size: clamp(2.6rem, 6vw, 5rem); font-weight: 300; color: var(--branco); line-height: 1.05; letter-spacing: -.01em; margin-bottom: 1.5rem; }
.hero h1 em { font-style: italic; color: var(--areia); }
.hero-divider { width: 48px; height: 1px; background: var(--terracota); margin-bottom: 2.5rem; }
.hero-sub { font-size: 1.1rem; font-weight: 300; color: rgba(255,255,255,.68); max-width: 500px; line-height: 1.75; margin-bottom: 3rem; }
.btn-primary { display: inline-flex; align-items: center; gap: .65rem; background: var(--laranja); color: var(--branco); padding: 1rem 2.2rem; font-size: .83rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; border-radius: 1px; transition: background .25s, transform .2s; }
.btn-primary:hover { background: var(--terracota); transform: translateY(-2px); }
.hero-scroll { position: absolute; bottom: 2.5rem; left: 2rem; font-size: .7rem; letter-spacing: .15em; text-transform: uppercase; color: rgba(255,255,255,.35); display: flex; align-items: center; gap: 1rem; }
.hero-scroll::after { content: ''; display: block; width: 40px; height: 1px; background: rgba(255,255,255,.25); }

/* ── SEÇÕES GERAIS ───────────────────────── */
.section { padding: 7rem 0; }
.section--areia  { background: var(--areia); }
.section--creme  { background: var(--creme); }
.section--verde  { background: var(--verde); }
.section--branco { background: var(--branco); }
.section--sage   { background: var(--sage); }
.s-num { font-family: var(--display); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--sage); margin-bottom: 1rem; font-weight: 400; }
.s-num--light { color: rgba(221,195,170,.5); }
.s-tit { font-family: var(--display); font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 400; line-height: 1.15; letter-spacing: -.01em; margin-bottom: 1.5rem; }
.s-tit em { font-style: italic; }
.s-tit--branco { color: var(--branco); }
.s-tit--verde  { color: var(--verde); }
.s-corpo { font-size: 1.05rem; font-weight: 300; color: var(--texto-cl); line-height: 1.82; max-width: 600px; }
.s-corpo--branco { color: rgba(255,255,255,.72); }
.s-linha { width: 40px; height: 2px; background: var(--terracota); margin-bottom: 2rem; }
.center { text-align: center; }
.center .s-linha { margin-left: auto; margin-right: auto; }
.center .s-corpo { margin-left: auto; margin-right: auto; }

/* ── O QUE É ──────────────────────────────── */
.oque-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: start; }
.oque-quote { font-family: var(--display); font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 400; font-style: italic; color: var(--verde); line-height: 1.55; border-left: 2px solid var(--terracota); padding-left: 1.5rem; margin-top: 2rem; }

/* ── TRANSTORNOS (tags) ───────────────────── */
.tags { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 3rem; }
.tag { background: var(--branco); border: 1px solid rgba(76,82,54,.18); color: var(--verde); padding: .7rem 1.3rem; font-size: .9rem; font-weight: 400; border-radius: 40px; transition: background .2s, color .2s, border-color .2s; }
.tag:hover { background: var(--verde); color: var(--branco); border-color: var(--verde); }
.tag b { font-weight: 500; }

/* ── FUNÇÕES COGNITIVAS ───────────────────── */
.func-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5px; margin-top: 3.5rem; background: rgba(255,255,255,.15); }
.func { background: var(--verde); padding: 2.2rem 1.5rem; text-align: center; transition: background .25s; }
.func:hover { background: #424830; }
.func-ico { font-size: 1.7rem; margin-bottom: .8rem; }
.func-nome { font-family: var(--display); font-size: 1.25rem; color: var(--areia); font-weight: 500; }

/* ── PARA QUEM + AMBIENTE ─────────────────── */
.pq-wrap { display: grid; grid-template-columns: 1.4fr 1fr; gap: 5rem; align-items: center; }
.pq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5px; background: rgba(76,82,54,.12); }
.pq-card { background: var(--branco); padding: 1.8rem 1.6rem; transition: background .25s; }
.pq-card:hover { background: var(--creme); }
.pq-ico { font-size: 1.4rem; margin-bottom: .8rem; line-height: 1; }
.pq-tit { font-family: var(--display); font-size: 1.15rem; font-weight: 500; color: var(--verde); margin-bottom: .5rem; }
.pq-txt { font-size: .88rem; font-weight: 300; color: var(--texto-cl); line-height: 1.6; }
.ambiente { position: relative; }
.ambiente img { width: 100%; border-radius: 2px; box-shadow: 0 16px 40px rgba(76,82,54,.22); }
.ambiente::after { content: ''; position: absolute; top: 18px; left: 18px; right: -18px; bottom: -18px; border: 1px solid var(--pessego); z-index: -1; border-radius: 2px; }

/* ── ETAPAS ───────────────────────────────── */
.etapas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; margin-top: 3.5rem; }
.etapa { position: relative; }
.etapa-num { font-family: var(--display); font-size: 3.2rem; font-weight: 300; color: var(--pessego); line-height: 1; margin-bottom: .8rem; }
.etapa-tit { font-family: var(--display); font-size: 1.3rem; font-weight: 500; color: var(--verde); margin-bottom: .6rem; }
.etapa-txt { font-size: .9rem; font-weight: 300; color: var(--texto-cl); line-height: 1.6; }
.etapa::before { content: ''; position: absolute; top: 22px; left: -1.2rem; width: 1px; height: 70%; background: rgba(76,82,54,.12); }
.etapa:first-child::before { display: none; }

/* ── CREDENCIAIS ──────────────────────────── */
.cred-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.cred-lista { list-style: none; margin-top: 2.5rem; }
.cred-lista li { display: flex; align-items: flex-start; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid rgba(221,195,170,.12); font-size: .95rem; font-weight: 300; color: rgba(255,255,255,.82); line-height: 1.5; }
.cred-lista li::before { content: '—'; color: var(--pessego); flex-shrink: 0; margin-top: 1px; }
.stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: rgba(221,195,170,.1); }
.stat { background: rgba(76,82,54,.55); padding: 2.5rem 1.8rem; text-align: center; }
.stat-n { font-family: var(--display); font-size: 3.2rem; font-weight: 300; color: var(--areia); line-height: 1; margin-bottom: .5rem; }
.stat-l { font-size: .72rem; font-weight: 400; letter-spacing: .1em; text-transform: uppercase; color: rgba(221,195,170,.55); line-height: 1.4; }

/* ── SOBRE ────────────────────────────────── */
.sobre-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 5rem; align-items: center; }
.foto-wrap { position: relative; }
.foto-wrap img { width: 100%; border-radius: 2px; box-shadow: 0 16px 40px rgba(76,82,54,.22); }
.foto-wrap::after { content: ''; position: absolute; top: 16px; left: 16px; right: -16px; bottom: -16px; border: 1px solid var(--areia); z-index: -1; border-radius: 2px; }
.crp-badge { display: inline-flex; align-items: center; gap: .5rem; background: var(--verde); color: var(--areia); padding: .45rem 1rem; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 1.5rem; font-weight: 400; }
.bio { font-size: 1rem; font-weight: 300; color: var(--texto-cl); line-height: 1.85; }
.bio + .bio { margin-top: 1.2rem; }

/* ── FAQ ──────────────────────────────────── */
.faq { max-width: 760px; margin: 3rem auto 0; }
.faq-item { border-bottom: 1px solid rgba(76,82,54,.14); }
.faq-q { width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 1.4rem 0; font-family: var(--display); font-size: 1.2rem; font-weight: 500; color: var(--verde); display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.faq-q::after { content: '+'; font-size: 1.5rem; font-weight: 300; color: var(--terracota); transition: transform .3s; flex-shrink: 0; }
.faq-item.open .faq-q::after { transform: rotate(45deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-a p { font-size: .98rem; font-weight: 300; color: var(--texto-cl); line-height: 1.75; padding: 0 0 1.4rem; }

/* ── CONTATO ──────────────────────────────── */
.contato-c { text-align: center; max-width: 640px; margin: 0 auto; }
.btn-wpp { display: inline-flex; align-items: center; gap: .75rem; background: #25D366; color: var(--branco); padding: 1.2rem 3rem; font-size: 1rem; font-weight: 500; border-radius: 1px; transition: background .25s, transform .2s; margin: 2.5rem 0 1.5rem; }
.btn-wpp:hover { background: #1ebe5a; transform: translateY(-2px); }
.link-insta { display: inline-flex; align-items: center; gap: .5rem; font-size: .85rem; font-weight: 400; color: rgba(255,255,255,.65); letter-spacing: .04em; transition: color .2s; }
.link-insta:hover { color: var(--areia); }

/* ── RODAPÉ ───────────────────────────────── */
footer.rodape { background: #282C1A; padding: 2.5rem 0; text-align: center; }
.rodape-txt { font-size: .78rem; font-weight: 300; color: rgba(221,195,170,.4); letter-spacing: .04em; line-height: 1.9; }

/* ── WHATSAPP FLOAT ───────────────────────── */
.wpp-float { position: fixed; bottom: 2rem; right: 2rem; z-index: 999; width: 58px; height: 58px; background: #25D366; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(37,211,102,.35); transition: transform .25s, box-shadow .25s; animation: pulse 3s ease-in-out infinite; }
.wpp-float:hover { transform: scale(1.1); box-shadow: 0 6px 28px rgba(37,211,102,.55); animation: none; }
.wpp-float svg { width: 30px; height: 30px; fill: white; }
@keyframes pulse { 0%,100% { box-shadow: 0 4px 20px rgba(37,211,102,.35); } 50% { box-shadow: 0 4px 30px rgba(37,211,102,.6), 0 0 0 8px rgba(37,211,102,.08); } }

/* ── ANIMAÇÕES ────────────────────────────── */
.fade { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.fade.on { opacity: 1; transform: translateY(0); }
.fade:nth-child(2) { transition-delay: .1s; }
.fade:nth-child(3) { transition-delay: .2s; }
.fade:nth-child(4) { transition-delay: .3s; }

/* ── RESPONSIVO ───────────────────────────── */
@media (max-width: 900px) {
  .hero { min-height: auto; }
  .hero-inner { grid-template-columns: 1fr; gap: 2.5rem; padding: 8rem 2rem 4rem; }
  .hero-foto { justify-self: center; max-width: 300px; }
  .hero-foto img { max-height: none; width: 100%; }
  .hero-foto::after { left: -10px; right: 10px; top: 10px; bottom: -10px; }
  .oque-grid, .cred-grid, .sobre-grid, .pq-wrap { grid-template-columns: 1fr; gap: 3rem; }
  .func-grid { grid-template-columns: 1fr 1fr; }
  .etapas { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
  .etapa::before { display: none; }
  .ambiente { max-width: 420px; margin: 0 auto; }
  .foto-wrap { max-width: 360px; margin: 0 auto; }
  .nav-links { display: none; }
  .nav-toggle { display: flex; }
  .nav-links.open { display: flex; flex-direction: column; position: fixed; inset: 0; background: var(--verde); align-items: center; justify-content: center; gap: 2.2rem; z-index: 999; }
  .nav-links.open a { font-size: 1.1rem; }
  .nav-toggle.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .nav-toggle.open span:nth-child(2) { opacity: 0; }
  .nav-toggle.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
}
@media (max-width: 520px) {
  .section { padding: 4.5rem 0; }
  .pq-grid, .func-grid, .etapas, .stats-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .container { padding: 0 1.25rem; }
  .hero-inner { padding: 7rem 1.25rem 5rem; }
}
