:root {
  --navy: #061a37;
  --navy-2: #0b2d59;
  --gold: #d8aa43;
  --gold-light: #f3cf72;
  --ink: #11213a;
  --muted: #647084;
  --line: #dfe4eb;
  --white: #fff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: #edf1f5; }
button, input, textarea { font: inherit; }

.page-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(340px, .85fr) minmax(520px, 1.15fr); }
.brand-panel {
  position: relative; overflow: hidden; display: flex; align-items: center;
  padding: clamp(42px, 7vw, 100px); color: white;
  background: #061a37 url('/fundo-editorial-oaj.png') center center / cover no-repeat;
}
.brand-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(3,14,31,.34), rgba(5,24,50,.12) 52%, rgba(4,18,38,.25));
}
.brand-content { position: relative; z-index: 2; max-width: 540px; }
.logo {
  display: block;
  width: min(310px, 76%);
  height: auto;
  margin-bottom: clamp(42px, 7vh, 82px);
}
.eyebrow, .step { color: var(--gold-light); font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
h1 { margin: 15px 0 24px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3rem, 5.4vw, 5.8rem); line-height: .98; letter-spacing: -.045em; }
h1 span { color: var(--gold-light); }
.intro { max-width: 500px; font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.6; color: #dfe7f1; }

.form-panel { display: flex; align-items: center; padding: clamp(32px, 6vw, 84px); background: white; }
.form-wrap { width: min(720px, 100%); margin: auto; }
.step { color: #9b711f; margin: 0 0 9px; }
h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 3.4vw, 3.1rem); }
.form-note { margin: 12px 0 34px; color: var(--muted); line-height: 1.55; }
form { display: grid; grid-template-columns: 1fr 1fr; gap: 19px; }
.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.full { grid-column: 1 / -1; }
label, legend { color: #28374c; font-size: .9rem; font-weight: 750; }
input, textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; background: #f9fafc; padding: 14px 15px; color: var(--ink); outline: none; transition: border-color .2s, box-shadow .2s, background .2s; }
textarea { resize: vertical; }
input:focus, textarea:focus { border-color: #bb8c2f; background: white; box-shadow: 0 0 0 4px rgba(216,170,67,.14); }
.choice-group { margin: 2px 0 0; padding: 0; border: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.choice-group legend { margin-bottom: 9px; }
.choice { display: flex; align-items: flex-start; gap: 11px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.choice input, .consent input { width: 18px; height: 18px; accent-color: #aa791d; flex: 0 0 auto; }
.choice span { display: grid; gap: 3px; }
.choice small { color: var(--muted); font-weight: 450; line-height: 1.35; }
.consent { display: flex; gap: 10px; align-items: flex-start; color: var(--muted); font-weight: 500; line-height: 1.45; }
.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
button { grid-column: 1 / -1; border: 0; border-radius: 11px; padding: 17px 22px; background: linear-gradient(135deg, var(--gold-light), var(--gold)); color: var(--navy); font-weight: 900; letter-spacing: .04em; cursor: pointer; box-shadow: 0 12px 28px rgba(155,113,31,.22); transition: transform .2s, box-shadow .2s, opacity .2s; }
button:hover { transform: translateY(-2px); box-shadow: 0 15px 32px rgba(155,113,31,.3); }
button:disabled { cursor: wait; opacity: .65; transform: none; }
.status { grid-column: 1 / -1; margin: 0; min-height: 24px; text-align: center; font-weight: 650; }
.status.success { color: #167046; }
.status.error { color: #b02e37; }

@media (max-width: 900px) {
  .page-shell { grid-template-columns: 1fr; }
  .brand-panel { min-height: 560px; padding: 52px 28px; }
  .logo { width: 250px; margin-bottom: 45px; }
  .form-panel { padding: 48px 24px 64px; }
}
@media (max-width: 560px) {
  .brand-panel { min-height: 500px; }
  h1 { font-size: 3.1rem; }
  form, .choice-group { grid-template-columns: 1fr; }
  .field, .choice { grid-column: 1; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }