// Corporate dedicated page
const CorporatePage = () => (
  <div style={{ background: 'var(--linho)', color: 'var(--terra)', width: '100%' }}>
    <Nav theme="linho" currentArea="corporate" />

    <section style={{ background: 'var(--terra)', color: 'var(--linho)', padding: '120px 56px 100px', position: 'relative' }}>
      <div className="eyebrow-mono" style={{ color: 'var(--terracota)', marginBottom: 24 }}>/02 — Corporate</div>
      <h1 className="display-serif" style={{ fontSize: 156, lineHeight: 0.9, letterSpacing: '-0.04em', maxWidth: 1200 }}>
        Liderança<br/><em>sustentável</em>,<br/>decisão consciente.
      </h1>
      <p className="body-lg" style={{ marginTop: 48, maxWidth: 620, opacity: 0.78, fontSize: 22 }}>
        Programas de bem-estar emocional e desempenho para empresas que recusam normalizar a exaustão.
      </p>
      <a className="btn btn-arrow" style={{ marginTop: 40, background: 'var(--terracota)', color: 'var(--terra)', padding: '16px 26px', fontSize: 15 }}>Pedir proposta</a>
    </section>

    <section style={{ padding: '120px 56px', background: 'var(--linho)' }}>
      <div className="eyebrow-mono" style={{ opacity: 0.55, marginBottom: 16 }}>(01) — Programas</div>
      <h2 className="display-serif" style={{ fontSize: 80, marginBottom: 60, lineHeight: 0.95 }}>
        Três caminhos.<br/>Um <em>diagnóstico</em> primeiro.
      </h2>
      <div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 24 }}>
        {[
          { tag: 'Diagnóstico', t: 'Mapa de saúde mental organizacional', d: 'Survey clínico + entrevistas qualitativas em 4 semanas. Relatório executivo com recomendações priorizadas.', dur: '4 sem · €4.800' },
          { tag: 'Formação', t: 'Liderança consciente para C-level', d: 'Programa intensivo de 12 semanas com supervisão individual e dinâmicas de grupo.', dur: '12 sem · sob proposta' },
          { tag: 'Intervenção', t: 'Apoio psicológico para colaboradores', d: 'Plataforma + rede de profissionais. Gestão centralizada e relatórios anonimizados.', dur: 'Mensal · €18/colab.' },
        ].map((p, i) => (
          <div key={i} style={{ padding: 32, border: '1px solid rgba(54,21,7,.15)', borderRadius: 4, display: 'flex', flexDirection: 'column', gap: 16, minHeight: 320 }}>
            <span className="eyebrow-mono" style={{ color: 'var(--terracota-deep)' }}>{p.tag}</span>
            <div className="display-serif" style={{ fontSize: 28, lineHeight: 1.05 }}>{p.t}</div>
            <p style={{ fontSize: 14, opacity: 0.72, lineHeight: 1.5, flex: 1 }}>{p.d}</p>
            <div className="small" style={{ fontFamily: 'var(--font-mono)', opacity: 0.6 }}>{p.dur}</div>
            <a className="btn btn-outline btn-arrow" style={{ alignSelf: 'flex-start', fontSize: 13 }}>Saber mais</a>
          </div>
        ))}
      </div>
    </section>

    <section style={{ padding: '100px 56px', background: 'var(--terra)', color: 'var(--linho)' }}>
      <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr 1fr', gap: 32 }}>
        {[
          { n: '+40', l: 'organizações' }, { n: '4.8/5', l: 'NPS de impacto' }, { n: '−32%', l: 'burnout reportado' }, { n: '12 wks', l: 'programa-base' },
        ].map(s => (
          <div key={s.l}>
            <div className="display-serif" style={{ fontSize: 84 }}>{s.n}</div>
            <div className="small" style={{ marginTop: 8, opacity: 0.6 }}>{s.l}</div>
          </div>
        ))}
      </div>
    </section>

    <Footer theme="terra" />
  </div>
);

// Sobre Nós (manifesto + fundadora + equipa)
const SobrePage = () => (
  <div style={{ background: 'var(--linho)', color: 'var(--terra)', width: '100%' }}>
    <Nav theme="linho" currentArea="sobre" />

    <section style={{ padding: '100px 56px 60px' }}>
      <div className="eyebrow-mono" style={{ opacity: 0.55, marginBottom: 24 }}>Sobre Nós</div>
      <h1 className="display-serif" style={{ fontSize: 132, lineHeight: 0.92, letterSpacing: '-0.03em', maxWidth: 1200 }}>
        Recusamos a cultura<br/>que normaliza<br/>a <em style={{ color: 'var(--terracota)' }}>exaustão</em>.
      </h1>
    </section>

    <section style={{ padding: '60px 56px 120px', display: 'grid', gridTemplateColumns: '1fr 1.4fr', gap: 80, alignItems: 'center' }}>
      <div style={{ position: 'relative', height: 560 }}>
        <div style={{ position: 'absolute', inset: 0, background: 'url(assets/fundadora.png) center top/cover' }}/>
        <div style={{ position: 'absolute', bottom: -24, right: -24, background: 'var(--terra)', color: 'var(--linho)', padding: '20px 24px', maxWidth: 260 }}>
          <div className="eyebrow-mono" style={{ opacity: 0.6 }}>Fundadora</div>
          <div style={{ fontFamily: 'var(--font-display)', fontSize: 28, marginTop: 6 }}>Filipa Jardim da Silva</div>
          <div className="small" style={{ marginTop: 6, opacity: 0.65 }}>Psicóloga Clínica · CEO & Diretora Clínica</div>
        </div>
      </div>
      <div>
        <p className="body-lg" style={{ fontSize: 22, opacity: 0.85, lineHeight: 1.5, maxWidth: 620 }}>
          A Academia Transformar nasceu da convicção de que prevenção é coragem. Romantizar o sacrifício e valorizar o silêncio emocional é uma escolha — uma escolha que recusamos diariamente, no consultório e fora dele.
        </p>
        <p className="body-lg" style={{ fontSize: 18, opacity: 0.7, lineHeight: 1.55, marginTop: 24, maxWidth: 600 }}>
          Trabalhamos com pessoas, equipas e organizações, promovendo bem-estar emocional, desempenho sustentável e tomada de decisão consciente em contextos de elevada exigência.
        </p>
      </div>
    </section>

    <section style={{ padding: '0 56px 140px' }}>
      <div className="eyebrow-mono" style={{ opacity: 0.55, marginBottom: 24 }}>Equipa</div>
      <h2 className="display-serif" style={{ fontSize: 72, marginBottom: 60, lineHeight: 0.95 }}>38 profissionais.<br/><em>Uma só</em> visão.</h2>
      <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 24 }}>
        {[
          { n: 'Tiago Monteiro', r: 'Psicólogo Clínico · Supervisor sénior', img: 'photo-1507003211169-0a1dd7228f2d' },
          { n: 'Sofia Almeida', r: 'Nutricionista · PhD Comportamento', img: 'photo-1573496359142-b8d87734a5a2' },
          { n: 'Pedro Vasconcelos', r: 'Coach de carreira clínica', img: 'photo-1500648767791-00dcc994a43e' },
          { n: 'Mariana Costa', r: 'Psicóloga clínica · Alumni', img: 'photo-1580489944761-15a19d654956' },
        ].map(p => (
          <div key={p.n}>
            <div style={{ aspectRatio: '3/4', background: `url(https://images.unsplash.com/${p.img}?w=600&q=80) center/cover`, marginBottom: 18, filter: 'saturate(0.85)' }}/>
            <div style={{ fontFamily: 'var(--font-display)', fontSize: 22, lineHeight: 1.1 }}>{p.n}</div>
            <div className="small" style={{ marginTop: 4, opacity: 0.65 }}>{p.r}</div>
          </div>
        ))}
      </div>
    </section>

    <Footer theme="terra" />
  </div>
);

Object.assign(window, { CorporatePage, SobrePage });