/* Página "Quem é o Rubens" — complementa style.css */

.rb-hero { padding: 64px 0 40px; background: radial-gradient(900px 420px at 85% -10%, rgb(201 164 76 / 0.14), transparent 70%), radial-gradient(800px 500px at 0% 20%, rgb(44 95 220 / 0.2), transparent 70%); }
.rb-hero__grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 56px; align-items: center; }
.rb-hero h1 { margin: 0; font-size: clamp(40px, 6vw, 76px); line-height: 0.98; letter-spacing: -0.04em; font-weight: 800; }
.rb-cargo { max-width: 560px; margin: 20px 0 0; color: var(--texto-2); font-size: 18px; line-height: 1.55; }
.rb-selos { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; list-style: none; }
.rb-selos li { padding: 7px 12px; border-radius: 99px; border: 1px solid var(--linha); background: var(--bg-2); font-size: 13px; font-weight: 550; color: var(--texto); }
.rb-selos li:last-child { border-color: rgb(201 164 76 / 0.45); color: var(--ouro-2); }
.rb-acoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.rb-acoes .btn { height: 48px; padding: 0 20px; font-size: 15px; }

/* Retrato (placeholder com monograma até termos a foto) */
.rb-retrato { margin: 0; }
.rb-retrato__foto { position: relative; aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; border: 1px solid var(--linha);
  background:
    radial-gradient(120% 80% at 20% 0%, rgb(227 196 122 / 0.35), transparent 60%),
    radial-gradient(90% 70% at 100% 100%, rgb(225 48 108 / 0.22), transparent 60%),
    linear-gradient(160deg, #13243f, #0a1426);
  display: grid; place-items: center; }
.rb-retrato__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 28% 30%; }
.rb-retrato__foto::after { content: ''; position: absolute; inset: 14px; border-radius: 14px; border: 1px solid rgb(255 255 255 / 0.08); pointer-events: none; }
.rb-retrato figcaption { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; font-size: 14px; }
.rb-retrato figcaption a { display: inline-flex; align-items: center; gap: 6px; color: var(--texto-2); font-weight: 600; }
.rb-retrato figcaption a:hover { color: #e1306c; }
.rb-retrato figcaption svg { width: 18px; height: 18px; fill: none; stroke: #e1306c; stroke-width: 2; }

/* Intro */
.rb-intro { display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: center; padding: 48px 0 8px; border-top: 1px solid var(--linha); }
.rb-intro__foto { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 62% 25%; border-radius: 18px; border: 1px solid var(--linha); }
.rb-intro p { max-width: 900px; margin: 0; font-size: clamp(20px, 2.3vw, 27px); line-height: 1.45; letter-spacing: -0.01em; color: var(--texto-2); }
.rb-intro b { color: var(--texto); font-weight: 650; }

/* Seções numeradas */
.rb-secao { padding: 64px 0 8px; }
.rb-secao__cab { display: grid; grid-template-columns: 90px 1fr; gap: 20px; margin-bottom: 28px; }
.rb-num { font: 500 13px 'JetBrains Mono', monospace; letter-spacing: 0.1em; color: var(--ouro-2); padding-top: 10px; border-top: 2px solid var(--ouro); align-self: start; }
.rb-secao h2 { margin: 0; font-size: clamp(26px, 3.2vw, 38px); letter-spacing: -0.025em; line-height: 1.1; }
.rb-secao__cab p { max-width: 720px; margin: 12px 0 0; color: var(--texto-2); font-size: 16.5px; }

.rb-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-left: 110px; }
.rb-card { padding: 24px; border-radius: 16px; border: 1px solid var(--linha); background: var(--card); }
.rb-card__icone { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: rgb(201 164 76 / 0.12); }
.rb-card__icone svg { width: 22px; height: 22px; fill: none; stroke: var(--ouro-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rb-card h3 { margin: 18px 0 8px; font-size: 18px; line-height: 1.25; letter-spacing: -0.01em; }
.rb-card p { margin: 0; color: var(--texto-2); font-size: 14.5px; }

.rb-linha { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-left: 110px; }
.rb-linha__item { overflow: hidden; border-radius: 16px; border: 1px solid var(--linha); background: var(--card); }
.rb-linha__txt { padding: 24px 26px 26px; }
.rb-linha__foto { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.rb-linha__foto--painel { object-position: 50% 32%; }
.rb-linha__foto--congresso { object-position: 50% 38%; }
.rb-linha__item h3 { margin: 0 0 10px; font-size: 20px; letter-spacing: -0.015em; line-height: 1.2; }
.rb-linha__item p { margin: 0; color: var(--texto-2); font-size: 15px; }
.rb-linha__item--destaque { border-color: rgb(201 164 76 / 0.45); background: linear-gradient(150deg, rgb(201 164 76 / 0.12), var(--card) 60%); }
.rb-tag { display: inline-block; margin-bottom: 12px; padding: 3px 9px; border-radius: 99px; background: var(--ouro); color: #1a1405; font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.08em; text-transform: uppercase; }

/* Faixa de foto */
.rb-faixa { margin: 0 0 0 110px; }
.rb-faixa img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 9; object-fit: cover; object-position: 50% 35%; border-radius: 18px; border: 1px solid var(--linha); }
.rb-faixa figcaption { margin-top: 10px; font-size: 13px; color: var(--texto-3); }

/* Citação */
.rb-citacao { margin: 48px 0 0 110px; padding: 36px 40px; border-radius: 20px; border: 1px solid var(--linha); background: var(--bg-2); position: relative; }
.rb-citacao::before { content: '“'; position: absolute; top: -34px; left: 26px; font: 400 120px/1 'Instrument Serif', Georgia, serif; color: var(--ouro); }
.rb-citacao p { margin: 0; font: italic 400 clamp(22px, 2.6vw, 32px) / 1.35 'Instrument Serif', Georgia, serif; color: var(--texto); }
.rb-citacao footer { margin-top: 18px; color: var(--texto-2); font-size: 14px; font-weight: 600; }

/* CTA */
.rb-cta { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: 72px; padding: 32px; border-radius: 20px; border: 1px solid rgb(201 164 76 / 0.4); background: linear-gradient(110deg, rgb(201 164 76 / 0.16), rgb(201 164 76 / 0.03)); }
.rb-cta h2 { margin: 0; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -0.02em; }
.rb-cta p { margin: 8px 0 0; color: var(--texto-2); max-width: 560px; }
.rb-cta .rb-acoes { margin-top: 0; flex: none; }

@media (max-width: 900px) {
  .rb-hero__grid { grid-template-columns: 1fr; gap: 32px; }
  .rb-retrato { max-width: 380px; }
  .rb-cards, .rb-linha { grid-template-columns: 1fr; margin-left: 0; }
  .rb-faixa { margin-left: 0; }
  .rb-faixa img { aspect-ratio: 16 / 10; }
  .rb-intro { grid-template-columns: 1fr; gap: 28px; }
  .rb-intro__foto { max-width: 380px; }
  .rb-citacao { margin-left: 0; margin-top: 44px; }
  .rb-secao__cab { grid-template-columns: 1fr; gap: 12px; }
  .rb-num { width: 60px; }
  .rb-cta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
  .rb-hero { padding-top: 40px; }
  .rb-acoes .btn { flex: 1; }
  .rb-citacao { padding: 28px 22px; }
  .topo .js-wpp span { display: none; }
}
