/* HCP Sign Up redesign (SERB-273)
   Page chrome (wrapper, container, H1, intro) for
   /Professional/Contact-Us/Request-Information. Loaded only on this page,
   alongside formstack_overrides.css which re-skins the embedded Formstack form.
   Mirrors hcp_dosing_redesign.css conventions (design tokens, container). The
   HCP section loads main_style.css, so typography is pinned explicitly per
   element rather than inherited.

   NOTE: the design tokens below (--vg-*) are also consumed by
   formstack_overrides.css, which is scoped under the same `.vg-hcp` wrapper and
   inherits them. */

.vg-hcp {
  --vg-darkest-blue: #08213D;
  --vg-dark-blue: #12365E;
  --vg-yellow: #EDDD24;
  --vg-text: #333333;
  --vg-link: #337AB7;
  --vg-light-gray: #D1D1D1;
  --vg-font-black: 'Gotham-Black', Arial, sans-serif;
  --vg-font-medium: 'Gotham-Medium', Arial, sans-serif;
  --vg-font-book: 'Gotham-Book', Arial, sans-serif;
  color: var(--vg-text);
}

.vg-hcp * { box-sizing: border-box; }

.vg-hcp__container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 42px;
}

/* SERB-346: trimmed bottom padding 64px → 24px so the Submit button sits the
   Figma distance above the ISI tray (the old 64px left a large empty band). */
.vg-hcp__section { padding: 48px 0 24px; }

/* Superscript ® markers — match the body text color, non-interactive. */
.vg-hcp sup {
  font-size: 0.65em;
  vertical-align: super;
  top: 0;
  line-height: 0;
}

/* ---------- H1 ---------- */
.vg-hcp__h1 {
  font-family: var(--vg-font-black);
  font-size: 40px;
  line-height: 63px;
  font-weight: normal;
  text-transform: uppercase;
  color: var(--vg-dark-blue);
  margin: 0 0 16px;
}

/* ---------- Intro ---------- */
.vg-hcp__intro {
  font-family: var(--vg-font-book);
  font-size: 24px;
  line-height: 26px;
  font-weight: normal;
  color: var(--vg-dark-blue);
  margin: 0 0 32px;
}

/* Formstack embed mount point. The form document.write()s itself in here. */
.vg-hcp__formstack { margin: 0; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 991px) {
  .vg-hcp__container { padding: 0 24px; }
  .vg-hcp__h1 { font-size: 30px; line-height: 1.2; }
}
