/* Uses the typography, flush panels, and navy card section from aaron4az.com/facts. */
:root {
  --navy: #001b50;
  --navy-2: #10275b;
  --orange: #e38612;
  --cream: #f4f1ea;
  --ink: #111827;
  --muted: #5f6877;
  --line: #d9dde6;
  --white: #ffffff;
  --max: 1180px;
  color-scheme: light only;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { margin: 0; background: var(--navy); color: var(--ink); font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.45; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, p, blockquote { margin: 0; }
h1, h2 { color: var(--navy); font-family: "Arial Narrow", "Helvetica Neue Condensed", Arial, Helvetica, sans-serif; font-stretch: condensed; font-weight: 700; text-transform: uppercase; letter-spacing: -.035em; line-height: .98; }
a:focus-visible { outline: 3px solid var(--navy); outline-offset: 5px; }
.wrap { width: min(var(--max), calc(100% - 42px)); margin-inline: auto; }
.skip { position: fixed; z-index: 10; top: 10px; left: 10px; padding: 10px 20px; color: var(--navy); background: var(--white); transform: translateY(-200%); }
.skip:focus { transform: translateY(0); }
.eyebrow { color: var(--orange); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .13em; line-height: 1.45; }

/* The parent website provides the logo, navigation, and footer. */
.page-intro { padding: 30px 0 32px; background: var(--cream); }
.page-intro .wrap { padding-left: 24px; border-left: 2px solid var(--orange); }
.page-intro h1 { font-size: clamp(34px, 4.2vw, 52px); line-height: .98; letter-spacing: -.04em; margin: 9px 0 14px; }
.page-intro h1 span { color: var(--orange); white-space: nowrap; }
.intro-description { max-width: 940px; color: #3d4757; font-size: 17px; line-height: 1.55; }
.intro-description strong { color: var(--navy); }

/* White endorsement cards on the same continuous navy field as the Facts panels. */
.testimonial-section, .testimonial-section.warm { padding: 0 0 20px; background: var(--navy); }
.page-intro + .testimonial-section { padding-top: 40px; }
.testimonial-section:last-child { padding-bottom: 64px; }
.testimonial-row { display: grid; grid-template-columns: 340px minmax(0, 1fr); align-items: stretch; background: var(--white); box-shadow: 0 14px 30px rgba(0, 0, 0, .11); overflow: hidden; }
.speaker { min-width: 0; background: var(--cream); }
.speaker-photo { position: relative; width: 100%; overflow: hidden; background: #dfe4ec; }
.speaker-photo img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: center top; }
#paul-johnson .speaker-photo img { object-position: center 24%; }
.speaker-number { display: none; }
.speaker-info { padding: 26px 26px 30px; }
.party-label { color: var(--navy-2); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; line-height: 1.4; }
.speaker-info h2 { font-size: 35px; line-height: .98; margin: 10px 0 15px; }
.speaker-title { color: var(--navy); font-size: 15px; font-weight: 700; line-height: 1.4; }
.speaker-credentials { color: var(--muted); font-size: 14px; line-height: 1.5; margin-top: 7px; }
/* Keep every endorsement heading at the same top inset, regardless of message length. */
.testimonial { position: relative; display: flex; flex-direction: column; justify-content: flex-start; min-width: 0; padding: 28px 38px 32px; border-top: 8px solid var(--orange); background: var(--white); }
.testimonial > .eyebrow { font-size: 12px; font-weight: 900; letter-spacing: .12em; margin-bottom: 17px; }
.testimonial-mark, .testimonial-rule { display: none; }
.full-message { color: #4b5565; font-size: 18px; line-height: 1.65; font-weight: 400; }
.full-message p + p { margin-top: 18px; }
.full-message strong { color: var(--navy); font-weight: 700; }
.full-message a { color: var(--navy); font-size: 16px; font-weight: 700; text-underline-offset: 3px; }
.full-message a:hover { text-decoration-thickness: 2px; }

/* Match the reference's 0.72-second reveals without changing normal scrolling. */
.scroll-reveal-enabled .reveal-face { opacity: 0; transform: translate3d(-34px, 0, 0); transition: opacity .72s cubic-bezier(.2, .65, .25, 1), transform .72s cubic-bezier(.2, .65, .25, 1); }
.scroll-reveal-enabled .reveal-message { opacity: 0; transform: translate3d(34px, 0, 0); transition: opacity .72s cubic-bezier(.2, .65, .25, 1) .08s, transform .72s cubic-bezier(.2, .65, .25, 1) .08s; }
.scroll-reveal-enabled .is-visible .reveal-face,
.scroll-reveal-enabled .is-visible .reveal-message,
.testimonial-row:focus-within .reveal-face,
.testimonial-row:focus-within .reveal-message { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .page-intro h1 { max-width: 820px; }
  .testimonial-row { grid-template-columns: 292px minmax(0, 1fr); }
  .testimonial { padding: 28px 30px 32px; }
  .speaker-info { padding: 24px 22px 28px; }
  .speaker-info h2 { font-size: 31px; }
  .full-message { font-size: 17px; line-height: 1.6; }
}
@media (max-width: 720px) {
  html { scroll-padding-top: 16px; }
  .wrap { width: calc(100% - 28px); }
  .page-intro { padding: 22px 0 26px; }
  .page-intro .wrap { border-left: 0; border-top: 4px solid var(--orange); padding: 18px 0 0; }
  .page-intro .eyebrow { font-size: 11px; letter-spacing: .12em; }
  .page-intro h1 { font-size: clamp(32px, 8.5vw, 39px); line-height: .96; letter-spacing: -.04em; margin: 9px 0 14px; }
  .intro-description { font-size: 15.5px; line-height: 1.5; }
  .testimonial-section, .testimonial-section.warm { padding-bottom: 16px; }
  .page-intro + .testimonial-section { padding-top: 26px; }
  .testimonial-section:last-child { padding-bottom: 42px; }
  .testimonial-row { grid-template-columns: minmax(0, 1fr); box-shadow: 0 10px 22px rgba(0, 0, 0, .11); }
  .speaker-photo { height: 280px; }
  .speaker-photo img { height: 100%; aspect-ratio: auto; }
  .speaker-info { padding: 22px 20px 24px; }
  .party-label { font-size: 10.5px; }
  .speaker-info h2 { font-size: 31px; margin: 9px 0 12px; }
  .speaker-title { font-size: 15px; }
  .speaker-credentials { font-size: 14px; margin-top: 6px; }
  .testimonial { padding: 24px 20px 27px; border-top-width: 6px; }
  .testimonial > .eyebrow { font-size: 11px; margin-bottom: 14px; }
  .full-message { font-size: 16px; line-height: 1.65; }
  .full-message p + p { margin-top: 16px; }
  .full-message a { font-size: 15px; }
  .scroll-reveal-enabled .reveal-face, .scroll-reveal-enabled .reveal-message { transform: translate3d(0, 24px, 0); }
  .scroll-reveal-enabled .is-visible .reveal-face,
  .scroll-reveal-enabled .is-visible .reveal-message,
  .testimonial-row:focus-within .reveal-face,
  .testimonial-row:focus-within .reveal-message { transform: none; }
}
@media (max-width: 430px) {
  .wrap { width: calc(100% - 24px); }
  .speaker-photo { height: 260px; }
  .speaker-info, .testimonial { padding-left: 18px; padding-right: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .scroll-reveal-enabled .reveal-face, .scroll-reveal-enabled .reveal-message { opacity: 1 !important; transform: none !important; }
}
@media print {
  body, .testimonial-section, .testimonial-section.warm { background: white; }
  .reveal-face, .reveal-message { opacity: 1 !important; transform: none !important; }
  .testimonial-row { box-shadow: none; border: 1px solid var(--line); }
  .testimonial-section { break-inside: avoid; }
}
