:root {
  --navy: #14293c;
  --deep-ink: #172b3d;
  --teal: #16888a;
  --teal-dark: #106f72;
  --cool: #edf4f4;
  --muted: #536a76;
  --soft-line: #cbd9d9;
  --brass: #d3a76e;
  --page-white: #f8fbfa;
}
body { background: var(--page-white); color: var(--deep-ink); }
.shell { width: min(1296px, calc(100% - 64px)); }
.site-header { background: var(--navy); border-bottom: 0; }
.nav { min-height: 94px; }
.wjm-brand { display: inline-flex; flex-direction: row; align-items: center; gap: 8px; white-space: nowrap; line-height: 1; }
.wjm-brand-initials { color: #fff; font: 700 49px/1 Georgia, "Times New Roman", serif; letter-spacing: -.08em; }
.wjm-brand-divider { display: block; width: 17px; height: 54px; flex: none; margin: 0 3px; }
.wjm-brand-name { color: #fff; font: 700 25px/1 Arial, Helvetica, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.nav-links { gap: 24px; }
.nav-links a { color: #fff; font-size: 15px; }
.nav-links .contact-link { border-color: #c8d6d7; padding: 11px 19px; }
.nav-links a:hover, .nav-links a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.nav-links .contact-link:hover, .nav-links .contact-link:focus-visible { background: rgba(255,255,255,.1); text-decoration: none; }
.wjm-logo { width: 242px; }
h1, h2, h3 { color: var(--deep-ink); }
.eyebrow { color: var(--teal); font-size: 14px; font-weight: 800; letter-spacing: .15em; }

.home-hero { padding: 50px 0; background: #fff; }
.home-hero-grid { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(360px, .84fr); align-items: center; gap: clamp(34px, 4vw, 64px); }
.home-hero-copy { padding: 16px 0; }
.home-hero .eyebrow { display: flex; align-items: center; gap: 12px; }
.home-hero .eyebrow::before { content: ""; width: 43px; height: 4px; background: var(--teal); }
.home-hero h1 { max-width: none; margin: 42px 0 28px; font-size: clamp(46px, 5.2vw, 70px); letter-spacing: -.045em; }
.home-hero h1 span { display: block; }
.home-hero .lead { max-width: 680px; margin: 0; color: var(--muted); font-size: clamp(19px, 1.65vw, 22px); line-height: 1.58; }
.home-hero .hero-actions { align-items: center; gap: 22px; margin-top: 38px; }
.button { border-radius: 8px; }
.home-hero .button.primary, .aa-home-cta { background: var(--teal); color: #fff; }
.home-hero .button.primary { padding: 17px 28px; }
.home-hero .button.primary:hover, .home-hero .button.primary:focus-visible, .aa-home-cta:hover, .aa-home-cta:focus-visible { background: var(--teal-dark); }
.home-hero .button.secondary { border: 0; padding: 12px 0; color: var(--deep-ink); }
.home-hero .button.secondary:hover, .home-hero .button.secondary:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.hero-visual { position: relative; height: clamp(450px, 42vw, 552px); margin: 0; overflow: hidden; border: 2px solid #d6e4e4; border-radius: 16px; background: var(--cool); }
.hero-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; }
.hero-visual figcaption { position: absolute; bottom: 13px; left: 15px; padding: 5px 10px; border-radius: 4px; background: rgba(20,41,60,.85); color: #fff; font-size: 12px; line-height: 1.3; }

.services-section { background: var(--cool); }
.services-section .section-intro { max-width: 1000px; margin-bottom: 32px; }
.services-section h2 { max-width: 920px; margin: 22px 0 18px; font-size: clamp(39px, 4.4vw, 58px); }
.services-section .section-intro p { margin: 0; color: var(--muted); font-size: 19px; }
.service-row { display: grid; grid-template-columns: 46px minmax(300px, 390px) minmax(0, 1fr); align-items: center; gap: 24px; padding: 27px 0; border-top: 1px solid var(--soft-line); }
.service-row .number { color: var(--teal); font-size: 16px; font-weight: 800; }
.service-row h3 { margin: 0; font-size: clamp(27px, 2.5vw, 34px); }
.service-row p { margin: 0; color: var(--muted); font-size: 18px; line-height: 1.5; }

.aa-section { background: var(--navy); color: #d6e5e7; }
.aa-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(350px, .88fr); align-items: center; gap: clamp(42px, 8vw, 120px); }
.aa-section-label { margin: 0 0 36px; color: #70cece; font-size: 14px; font-weight: 800; letter-spacing: .15em; }
.aa-section .aa-brand { display: block; width: min(548px, 100%); padding: 2px 4px; margin: 0 0 16px; border-radius: 11px; background: #fff; }
.aa-section .aa-brand img { display: block; width: 100%; height: auto; max-width: none; }
.aa-section h2 { max-width: 650px; margin: 0; color: #fff; font-size: clamp(39px, 3.8vw, 54px); }
.aa-summary { transform: translateY(-30px); }
.aa-summary p { max-width: 440px; margin: 0 0 24px; font-size: 20px; line-height: 1.55; }
.aa-home-cta { margin: 0; padding: 16px 24px; }

.education-section { background: #fff; }
.education-section p, .contact p { color: var(--muted); }
.education-section .button.secondary { border-color: var(--navy); color: var(--navy); }
.education-section .button.secondary:hover, .education-section .button.secondary:focus-visible { background: var(--cool); }
.contact-section { background: var(--cool); }
.contact-box { border-color: var(--soft-line); border-radius: 10px; }
.contact-box a { color: var(--navy); }
.site-footer { background: var(--navy); color: #d6e5e7; }
.site-footer a { color: #fff; }
.legal h1, .legal h2, .legal h3 { color: var(--navy); }
.legal .updated { color: var(--muted); }

@media (max-width: 1000px) {
  .home-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); gap: 28px; }
  .home-hero h1 { font-size: clamp(42px, 5vw, 60px); }
  .service-row { grid-template-columns: 36px minmax(240px, 330px) 1fr; gap: 18px; }
  .aa-layout { gap: 40px; }
}
@media (max-width: 800px) {
  .shell { width: min(100% - 36px, 1296px); }
  .nav { gap: 15px; }
  .home-hero { padding: 44px 0 58px; }
  .home-hero-grid, .aa-layout { grid-template-columns: 1fr; }
  .home-hero h1 { margin-top: 30px; font-size: clamp(43px, 7vw, 62px); }
  .hero-visual { height: min(570px, 75vw); min-height: 370px; }
  .service-row { grid-template-columns: 38px 1fr; }
  .service-row p { grid-column: 2; }
  .aa-section .aa-brand { padding: 4px; }
  .aa-summary { transform: none; }
  .aa-summary p { max-width: 650px; }
}
@media (max-width: 520px) {
  .shell { width: min(100% - 28px, 1296px); }
  .nav { padding: 14px 0; }
  .wjm-brand-initials { font-size: 41px; }
  .wjm-brand-divider { width: 14px; height: 45px; margin: 0 1px; }
  .wjm-brand-name { font-size: 20px; letter-spacing: .09em; }
  .nav-links { gap: 8px 15px; }
  .nav-links a { font-size: 13px; }
  .nav-links .contact-link { padding: 7px 13px; }
  .home-hero h1 { font-size: clamp(37px, 10vw, 52px); }
  .home-hero h1 span { display: inline; }
  .home-hero h1 span + span::before { content: " "; }
  .home-hero .lead { font-size: 18px; }
  .home-hero .hero-actions { gap: 10px 20px; }
  .hero-visual { min-height: 340px; height: 100vw; max-height: 480px; }
  .services-section h2 { font-size: 36px; }
  .service-row { gap: 7px 12px; }
  .service-row h3 { font-size: 26px; }
  .service-row p { font-size: 17px; }
  .aa-section .aa-brand { margin-bottom: 14px; }
  .aa-section-label { margin-bottom: 25px; }
  .aa-section h2 { font-size: 38px; }
  .aa-summary p { font-size: 18px; }
  .education-grid .button { white-space: normal; }
}

/* Centered brand preview, October 14, 2026. */
.aa-brand-heading { text-align: center; margin-bottom: 54px; }
.aa-brand-heading .aa-brand { width: min(600px, 100%); margin: 0 auto 18px; }
.aa-brand-heading .aa-section-label { margin: 0; }
.aa-section .aa-layout { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(44px, 6vw, 88px); }
.aa-section h2 { max-width: 700px; font-size: clamp(40px, 4.1vw, 58px); }
.aa-section .aa-summary { transform: none; }
.aa-section .aa-summary p { max-width: 500px; font-size: 21px; line-height: 1.55; }
.aa-section .aa-home-cta { padding: 18px 27px; font-size: 17px; }
@media (max-width: 800px) {
 .aa-brand-heading { margin-bottom: 38px; }
 .aa-section .aa-layout { grid-template-columns: 1fr; gap: 28px; }
 .aa-section h2 { max-width: 650px; font-size: clamp(36px, 6.5vw, 50px); }
 .aa-section .aa-summary p { max-width: 650px; font-size: 19px; }
}
@media (max-width: 520px) {
 .aa-brand-heading .aa-section-label { font-size: 12px; letter-spacing: .13em; }
 .aa-section h2 { font-size: 38px; }
 .aa-section .aa-summary p { font-size: 18px; }
 .aa-section .aa-home-cta { font-size: 16px; padding: 16px 22px; max-width: 100%; white-space: normal; text-align: center; }
}