:root {
  --ink: #171742;
  --ink-deep: #111132;
  --gold: #b89a28;
  --gold-soft: #e1ca72;
  --paper: #f8f4e9;
  --paper-deep: #ebe3d2;
  --text: #27262e;
  --muted: #526268;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--text); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; }
img { display: block; max-width: 100%; height: auto; }

.connect-page { min-height: 100vh; }
.connect-nav {
  height: 96px;
  padding: 0 max(24px, calc(50vw - 590px));
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: white;
  background: var(--ink);
  border-bottom: 3px solid var(--gold);
}
.connect-nav > a { text-decoration: none; }
.connect-brand img { width: 205px; height: 78px; object-fit: contain; object-position: left center; }

.connect-hero {
  padding: clamp(5rem, 10vw, 9rem) max(24px, calc(50vw - 590px));
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  align-items: end;
  gap: 5rem;
  color: white;
  background: radial-gradient(circle at 80% 15%, rgba(184,154,40,.14), transparent 30%), linear-gradient(140deg, #171742 0%, #211a63 70%, #4a3b28 140%);
}
.connect-kicker { color: var(--gold); font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.connect-hero h1 { margin: .7rem 0; font: 400 clamp(3.6rem, 8vw, 7rem)/.92 Georgia, serif; letter-spacing: -.04em; }
.connect-hero > p { color: #c6d6d9; font-size: 1.15rem; line-height: 1.7; }

.connect-intro,
.connect-form-section { padding: clamp(4rem, 8vw, 7rem) max(24px, calc(50vw - 590px)); }
.connect-intro h2,
.form-heading h2 { margin: .5rem 0 2.5rem; font: 400 clamp(2.8rem, 5vw, 4.8rem)/1 Georgia, serif; }
.connect-reasons { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #bdc2bd; }
.connect-reasons article { padding: 1.8rem; border-right: 1px solid #bdc2bd; }
.connect-reasons article:last-child { border: 0; }
.connect-reasons b { color: var(--gold); }
.connect-reasons h3 { font: 400 1.8rem Georgia, serif; }
.connect-reasons p,
.form-heading > p:last-child { color: var(--muted); line-height: 1.6; }
.form-heading a { color: #211a63; text-underline-offset: 4px; }

.connect-form-section { display: grid; grid-template-columns: .78fr 1.22fr; gap: 5rem; background: var(--paper-deep); }
.connect-form { padding: clamp(1.5rem, 4vw, 3.2rem); display: flex; flex-direction: column; gap: 1.2rem; background: white; box-shadow: 0 18px 50px rgba(7,26,34,.08); }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.connect-form label { display: flex; flex-direction: column; gap: .5rem; font-size: .79rem; font-weight: 700; }
.connect-form input,
.connect-form textarea { width: 100%; padding: .85rem; border: 1px solid #b9c2c2; border-radius: 0; color: #071a22; background: #fbfaf7; font: 400 1rem Arial, sans-serif; }
.connect-form input:focus,
.connect-form textarea:focus { outline: 2px solid #211a63; outline-offset: 1px; }
.connect-form textarea { resize: vertical; }
.connect-form .check { display: grid; grid-template-columns: 20px 1fr; color: var(--muted); font-weight: 400; line-height: 1.45; }
.connect-form .check input { width: 18px; height: 18px; }
.connect-form button { padding: 1rem 1.4rem; border: 0; color: var(--ink); background: var(--gold); cursor: pointer; font-size: .95rem; font-weight: 700; }
.connect-form button:disabled { opacity: .65; }
.form-status { min-height: 1.4rem; margin: 0; color: #211a63; font-weight: 700; }

.connect-footer { padding: 3rem max(24px, calc(50vw - 590px)); display: flex; justify-content: space-between; gap: 1.5rem; color: #bdc9cc; background: var(--ink-deep); border-top: 3px solid var(--gold); }
.connect-footer span { color: var(--gold-soft); font-family: Georgia, serif; }
.connect-footer a { color: #bdc9cc; text-underline-offset: 4px; }
.connect-footer a:hover,
.connect-footer a:focus { color: var(--gold-soft); }

@media (max-width: 820px) {
  .connect-hero,
  .connect-form-section { grid-template-columns: 1fr; gap: 2rem; }
  .connect-reasons { grid-template-columns: 1fr; }
  .connect-reasons article { border-right: 0; border-bottom: 1px solid #bdc2bd; }
  .field-pair { grid-template-columns: 1fr; }
  .connect-footer { flex-direction: column; gap: 1rem; }
  .connect-nav > a:last-child { font-size: .8rem; }
}

@media (max-width: 640px) {
  .connect-nav { height: 82px; }
  .connect-brand img { width: 150px; height: 62px; }
}