:root {
  --blue: #3778b3;
  --light-blue: #7db8d5;
  --ink: #393939;
  --pink: #f8eded;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
}

.site-shell {
  width: min(94%, 1510px);
  margin: 50px auto;
  box-shadow: 0 0 0 1px rgba(0,0,0,.02);
}

.topbar {
  min-height: 158px;
  padding: 23px 60px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: var(--blue);
  color: var(--pink);
}

.topbar p {
  margin: 0;
  padding-top: 2px;
  font: italic 27px Georgia, "Times New Roman", serif;
}

.crest { width: 71px; height: auto; }

.page-body {
  padding: 86px 58px 0;
  background: linear-gradient(100deg, var(--light-blue) 0%, #c5d9e4 58%, var(--pink) 100%);
}

.hero {
  display: grid;
  grid-template-columns: minmax(310px, 430px) 1fr;
  gap: 80px;
  align-items: start;
  padding-bottom: 33px;
  border-bottom: 1px solid rgba(80,80,80,.16);
}

.portrait-frame {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 13px;
  background: var(--pink);
  border: 1px solid #333;
}

.portrait-frame::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 14px -15px -15px 14px;
  background: var(--pink);
  border: 1px solid #333;
}

.portrait-frame img { display: block; width: 100%; height: auto; }

.intro h1 {
  margin: -25px 0 -3px;
  color: #75b8dd;
  font: bold italic clamp(64px, 7vw, 105px)/1 Georgia, "Times New Roman", serif;
}

.subtitle {
  margin: 0;
  font: italic 27px Georgia, "Times New Roman", serif;
}

.professional-summary {
  max-width: 690px;
  margin: 24px 0 0;
  font: 20px/1.55 Arial, Helvetica, sans-serif;
}

.hero-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

.contact-button {
  display: inline-block;
  margin-top: 66px;
  padding: 22px 50px;
  border-radius: 999px;
  background: var(--blue);
  color: white;
  font-size: 24px;
  text-decoration: none;
  transition: transform .15s ease, filter .15s ease;
}

.secondary-button {
  display: inline-block;
  margin-top: 66px;
  padding: 19px 31px;
  border: 2px solid var(--blue);
  border-radius: 999px;
  color: var(--blue);
  font-size: 20px;
  font-weight: bold;
  text-decoration: none;
}

.secondary-button:hover, .secondary-button:focus-visible { background: rgba(255,255,255,.45); }

.text-button {
  display: inline-block;
  margin-top: 66px;
  padding: 17px 4px;
  color: var(--blue);
  font-size: 17px;
  font-weight: bold;
  text-decoration: none;
  border-bottom: 2px solid currentColor;
}
.text-button:hover, .text-button:focus-visible { color: #245d8d; }

.contact-button:hover, .contact-button:focus-visible { filter: brightness(1.08); transform: translateY(-2px); }

.contact-details { margin-top: 124px; font-style: normal; }
.compact-contact { margin-top: 72px; }
.contact-details a, .contact-details p {
  display: flex;
  align-items: center;
  gap: 21px;
  margin: 0 0 24px;
  color: var(--ink);
  font-size: clamp(21px, 2.2vw, 35px);
  text-decoration: none;
}
.contact-details svg { width: 35px; min-width: 35px; fill: none; stroke: currentColor; stroke-width: 1.7; }

.about {
  padding-top: 83px;
  font: italic 27px/1.22 Georgia, "Times New Roman", serif;
}

.professional-profile {
  padding: 78px 0 72px;
  border-bottom: 1px solid rgba(80,80,80,.16);
}

.section-heading { max-width: 900px; }
.section-heading h2 {
  margin: 8px 0 34px;
  color: #2f3a40;
  font: bold clamp(31px, 3.5vw, 48px)/1.12 Georgia, "Times New Roman", serif;
}

.credential-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.credential-grid article {
  min-height: 190px;
  padding: 27px;
  border-top: 5px solid var(--blue);
  background: rgba(255,250,250,.76);
  box-shadow: 0 8px 22px rgba(55,96,120,.08);
}

.credential-grid strong { display: block; margin-bottom: 17px; color: var(--blue); font: bold 27px Georgia, "Times New Roman", serif; }
.credential-grid span { font-size: 17px; line-height: 1.55; }
.profile-cta { display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-top: 29px; padding: 25px 29px; border-left: 5px solid var(--blue); background: rgba(255,255,255,.36); }
.profile-cta p { max-width: 800px; margin: 0; font-size: 18px; line-height: 1.55; }
.profile-cta a { color: var(--blue); font-weight: bold; text-decoration: none; white-space: nowrap; }

.about h2 { margin: 0 0 43px; font: bold 36px Arial, Helvetica, sans-serif; }
.about p { margin: 0 0 32px; }
.about .identity { display: flex; gap: 26px; flex-wrap: wrap; }
.about a { color: var(--blue); text-decoration: none; }
.about a:hover, .about a:focus-visible { text-decoration: underline; }

.panorama { margin: 56px 0 0; }
.panorama img { display: block; width: 100%; max-height: 370px; object-fit: cover; }

.main-nav {
  min-height: 112px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 31px;
}
.main-nav a { color: #333; font-size: 24px; text-decoration: none; text-transform: uppercase; }
.main-nav a:hover, .main-nav a:focus-visible, .main-nav .active { color: var(--blue); }

footer {
  min-height: 273px;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: start;
  padding: 42px 60px 15px;
  background: var(--blue);
  color: var(--pink);
}

.crest-footer { align-self: start; }
.socials { display: flex; justify-content: center; gap: 0; margin-top: 14px; }
.socials a {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--pink);
  color: var(--blue);
  font-weight: bold;
  font-size: 31px;
  text-decoration: none;
}
.socials a:nth-child(2) { font-size: 25px; }
.socials svg { width: 27px; fill: none; stroke: currentColor; stroke-width: 2; }
.socials .dot { fill: currentColor; stroke: none; }
.footer-email { justify-self: end; margin-top: 26px; color: white; font-size: 20px; text-decoration: none; }
.copyright { grid-column: 1 / -1; align-self: end; margin: 51px 0 0; text-align: center; font-size: 34px; }

@media (max-width: 900px) {
  .site-shell { width: 100%; margin: 0; }
  .topbar { min-height: 110px; padding: 20px 25px; }
  .topbar p { font-size: 20px; }
  .crest { width: 55px; }
  .page-body { padding: 45px 25px 0; }
  .hero { grid-template-columns: 1fr; gap: 45px; }
  .portrait-frame { max-width: 430px; margin: 0 auto; }
  .intro h1 { margin-top: 0; }
  .contact-button { margin-top: 35px; }
  .secondary-button { margin-top: 35px; }
  .text-button { margin-top: 35px; }
  .contact-details { margin-top: 55px; }
  .about { padding-top: 55px; font-size: 22px; }
  .credential-grid { grid-template-columns: repeat(2, 1fr); }
  .about h2 { margin-bottom: 30px; }
  .main-nav { justify-content: center; flex-wrap: wrap; gap: 18px 25px; padding: 25px 0; }
  .main-nav a { font-size: 18px; }
  footer { grid-template-columns: 1fr; justify-items: center; gap: 22px; }
  .footer-email { justify-self: center; margin-top: 0; }
  .copyright { grid-column: 1; margin-top: 15px; font-size: 23px; }
}

@media (max-width: 480px) {
  .intro h1 { font-size: 57px; }
  .subtitle { font-size: 22px; }
  .contact-details a, .contact-details p { align-items: flex-start; font-size: 19px; }
  .about { font-size: 19px; }
  .professional-summary { font-size: 18px; }
  .hero-actions { align-items: stretch; }
  .contact-button, .secondary-button, .text-button { width: 100%; margin-top: 22px; padding: 16px 22px; text-align: center; }
  .secondary-button { margin-top: 0; }
  .text-button { margin-top: 0; }
  .credential-grid { grid-template-columns: 1fr; }
  .credential-grid article { min-height: 0; }
  .profile-cta { align-items: flex-start; flex-direction: column; }
  .panorama img { min-height: 190px; }
}

/* Selected work */
.work-body {
  padding: 74px 58px 0;
  background: linear-gradient(100deg, var(--light-blue) 0%, #c5d9e4 58%, var(--pink) 100%);
}
.work-intro { max-width: 1070px; padding: 5px 45px 70px; }
.work-intro h1 { margin: 7px 0 18px; color: var(--blue); font: bold italic clamp(58px, 7vw, 96px)/1 Georgia, "Times New Roman", serif; }
.work-intro > p:last-of-type { max-width: 900px; margin: 0; font: 25px/1.45 Georgia, "Times New Roman", serif; }
.work-intro .hero-actions { margin-top: 3px; }
.work-intro .secondary-button { background: rgba(255,255,255,.24); }

.case-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; padding: 72px 45px; border-top: 1px solid rgba(80,80,80,.16); }
.case-study { padding: 36px; background: rgba(255,250,250,.84); box-shadow: 0 9px 25px rgba(55,96,120,.10); }
.featured-case { grid-column: 1 / -1; border-top: 6px solid var(--blue); }
.case-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 21px; }
.case-meta span { padding: 7px 10px; background: #dcecf4; color: #315f7a; font-size: 12px; font-weight: bold; letter-spacing: .04em; text-transform: uppercase; }
.case-study h2 { margin: 0 0 15px; color: #2f3a40; font: bold 31px/1.15 Georgia, "Times New Roman", serif; }
.case-study h3 { margin: 0 0 8px; color: var(--blue); font-size: 14px; letter-spacing: .08em; text-transform: uppercase; }
.case-study p, .case-study li { font-size: 17px; line-height: 1.62; }
.case-study p { margin: 0 0 17px; }
.case-study .case-lead { font: 20px/1.48 Georgia, "Times New Roman", serif; }
.case-study ul { margin: 12px 0 0; padding-left: 22px; }
.case-study li + li { margin-top: 10px; }
.case-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 30px; padding-top: 27px; border-top: 1px solid rgba(55,120,179,.2); }
.case-columns p { margin: 0; font-size: 16px; }

.work-proof { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0 45px 72px; background: rgba(255,255,255,.6); }
.work-proof div { min-height: 145px; display: flex; flex-direction: column; justify-content: center; padding: 24px; background: var(--blue); color: #fff; }
.work-proof strong { font: bold 25px Georgia, "Times New Roman", serif; }
.work-proof span { margin-top: 9px; color: #d8e9f3; font-size: 14px; line-height: 1.4; }

@media (max-width: 900px) {
  .work-body { padding: 45px 25px 0; }
  .work-intro, .case-list { padding-left: 8px; padding-right: 8px; }
  .case-list { grid-template-columns: 1fr; }
  .featured-case { grid-column: auto; }
  .case-columns { grid-template-columns: 1fr; }
  .work-proof { grid-template-columns: repeat(2, 1fr); margin-left: 8px; margin-right: 8px; }
}

@media (max-width: 620px) {
  .work-intro { padding-bottom: 55px; }
  .work-intro > p:last-of-type { font-size: 21px; }
  .case-list { padding-top: 48px; padding-bottom: 48px; }
  .case-study { padding: 27px 23px; }
  .case-study h2 { font-size: 26px; }
  .case-study .case-lead { font-size: 18px; }
  .work-proof { grid-template-columns: 1fr; }
  .work-proof div { min-height: 112px; }
}

/* Professional experience */
.experience-body {
  padding: 74px 58px 0;
  background: linear-gradient(100deg, var(--light-blue) 0%, #c5d9e4 58%, var(--pink) 100%);
}

.experience-intro { max-width: 1050px; padding: 5px 45px 76px; }
.experience-intro h1 { margin: 7px 0 15px; color: var(--blue); font: bold italic clamp(68px, 8vw, 108px)/1 Georgia, "Times New Roman", serif; }
.experience-intro .lead { max-width: 900px; margin: 0; font: 25px/1.45 Georgia, "Times New Roman", serif; }
.experience-intro .hero-actions { margin-top: 3px; }

.expertise, .career { padding: 72px 45px; border-top: 1px solid rgba(80,80,80,.16); }
.expertise-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.expertise-grid article { position: relative; min-height: 250px; padding: 34px 34px 30px 78px; background: rgba(255,250,250,.82); box-shadow: 0 8px 22px rgba(55,96,120,.08); }
.expertise-number { position: absolute; top: 34px; left: 27px; color: var(--blue); font-size: 14px; font-weight: bold; letter-spacing: .12em; }
.expertise-grid h3 { margin: 0 0 14px; font: bold 27px Georgia, "Times New Roman", serif; }
.expertise-grid p { margin: 0; font-size: 17px; line-height: 1.6; }

.career-timeline { max-width: 950px; margin: 0; padding: 0; list-style: none; }
.career-timeline li { position: relative; display: grid; grid-template-columns: 145px 1fr; gap: 30px; padding: 0 0 38px; }
.career-timeline li::before { content: ""; position: absolute; top: 9px; bottom: -9px; left: 124px; width: 2px; background: rgba(55,120,179,.35); }
.career-timeline li::after { content: ""; position: absolute; top: 7px; left: 118px; width: 14px; height: 14px; border-radius: 50%; background: var(--blue); }
.career-timeline li:last-child::before { display: none; }
.career-timeline time { color: var(--blue); font-size: 16px; font-weight: bold; }
.career-timeline h3 { margin: -5px 0 8px; font: bold 25px Georgia, "Times New Roman", serif; }
.career-timeline p { margin: 0; font-size: 17px; line-height: 1.6; }

.opportunity { display: grid; grid-template-columns: 1fr auto; gap: 55px; align-items: center; margin: 0 45px; padding: 50px; background: var(--blue); color: #fff; }
.opportunity h2 { margin: 7px 0 13px; font: bold 36px/1.15 Georgia, "Times New Roman", serif; }
.opportunity p:last-child { max-width: 780px; margin: 0; font-size: 18px; line-height: 1.55; }
.opportunity .eyebrow { color: #d8e9f3; }
.opportunity .contact-button { margin: 0; background: #fff; color: var(--blue); white-space: nowrap; }

@media (max-width: 900px) {
  .experience-body { padding: 45px 25px 0; }
  .experience-intro, .expertise, .career { padding-left: 8px; padding-right: 8px; }
  .opportunity { margin: 0 8px; grid-template-columns: 1fr; gap: 25px; padding: 35px; }
  .opportunity .contact-button { width: max-content; }
}

@media (max-width: 620px) {
  .experience-intro { padding-bottom: 55px; }
  .experience-intro .lead { font-size: 21px; }
  .expertise-grid { grid-template-columns: 1fr; }
  .expertise-grid article { min-height: 0; padding: 28px 24px 27px 62px; }
  .expertise-number { top: 29px; left: 21px; }
  .career-timeline li { grid-template-columns: 86px 1fr; gap: 23px; }
  .career-timeline li::before { left: 75px; }
  .career-timeline li::after { left: 69px; }
  .opportunity { padding: 29px 24px; }
  .opportunity .contact-button { width: 100%; }
}

/* Articles */
.articles-topbar { align-items: flex-start; }
.articles-topbar a { line-height: 0; }

.articles-body {
  padding: 74px 58px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 85% 12%, rgba(255,255,255,.48) 0 2px, transparent 3px) 0 0 / 22px 22px,
    linear-gradient(100deg, var(--light-blue) 0%, #c5d9e4 58%, var(--pink) 100%);
}

.articles-intro {
  display: grid;
  grid-template-columns: 1fr 290px;
  gap: 55px;
  align-items: center;
  min-height: 310px;
  padding: 0 45px 58px;
  border-bottom: 1px solid rgba(80,80,80,.16);
}

.eyebrow {
  margin: 0 0 6px;
  color: var(--blue);
  font-size: 16px;
  font-weight: bold;
  letter-spacing: .22em;
}

.articles-intro h1 {
  margin: 0;
  color: var(--blue);
  font: bold italic clamp(65px, 8vw, 108px)/1 Georgia, "Times New Roman", serif;
}

.articles-intro > div:first-child > p:last-child {
  max-width: 780px;
  margin: 22px 0 0;
  font: italic 25px/1.4 Georgia, "Times New Roman", serif;
}

.paper-decoration {
  position: relative;
  width: 225px;
  height: 238px;
  justify-self: center;
  transform: rotate(2deg);
}

.paper {
  position: absolute;
  inset: 12px 4px 4px 12px;
  display: block;
  border: 1px solid rgba(42,62,73,.42);
  background: #fffafa;
  box-shadow: 0 12px 24px rgba(29,70,94,.16);
}

.paper-back { transform: rotate(-10deg) translate(-13px, 9px); background: #add1e3; }
.paper-middle { transform: rotate(6deg) translate(10px, 3px); background: #e7eff3; }
.paper-front { padding: 32px 24px; }
.paper-front::before {
  content: "PRESS";
  display: block;
  padding-bottom: 7px;
  border-bottom: 5px double var(--blue);
  color: var(--blue);
  font: bold 13px Arial, sans-serif;
  letter-spacing: .24em;
}
.paper-front i { display: block; height: 5px; margin-top: 14px; background: #b9c7cf; }
.paper-front i:nth-of-type(2) { width: 82%; }
.paper-front i:nth-of-type(3) { width: 92%; }
.paper-front b {
  display: block;
  margin-top: 22px;
  color: #4c7086;
  font: bold italic 29px/1 Georgia, "Times New Roman", serif;
}

.article-timeline {
  position: relative;
  max-width: 1120px;
  margin: 0 auto;
  padding: 82px 0 50px;
}

.article-timeline::before {
  content: "";
  position: absolute;
  top: 82px;
  bottom: 80px;
  left: 95px;
  width: 2px;
  background: linear-gradient(var(--blue), rgba(55,120,179,.16));
}

.article-card {
  position: relative;
  display: grid;
  grid-template-columns: 190px 1fr;
  margin-bottom: 46px;
}

.article-year {
  position: relative;
  z-index: 1;
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  margin-left: 55px;
  border: 7px solid rgba(232,243,247,.92);
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  font-size: 19px;
  font-weight: bold;
}

.article-copy {
  position: relative;
  padding: 30px 38px 33px;
  border: 1px solid rgba(55,120,179,.18);
  border-radius: 2px;
  background: rgba(255,250,250,.84);
  box-shadow: 0 9px 25px rgba(55,96,120,.10);
}

.article-copy::before {
  content: "";
  position: absolute;
  top: 31px;
  left: -12px;
  width: 22px;
  height: 22px;
  border-left: 1px solid rgba(55,120,179,.18);
  border-bottom: 1px solid rgba(55,120,179,.18);
  background: rgba(255,250,250,.95);
  transform: rotate(45deg);
}

.publication {
  margin: 0 0 10px;
  color: var(--blue);
  font-size: 14px;
  font-weight: bold;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.article-copy h2 {
  margin: 0 0 17px;
  color: #333;
  font: bold 30px/1.16 Georgia, "Times New Roman", serif;
}

.article-copy > p:not(.publication) {
  margin: 0 0 24px;
  font: 19px/1.55 Georgia, "Times New Roman", serif;
}

.pdf-link {
  display: inline-block;
  padding: 12px 19px;
  border-radius: 999px;
  background: var(--blue);
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
}

.pdf-link:hover, .pdf-link:focus-visible { filter: brightness(1.1); }
.pdf-link span { margin-left: 5px; }
.articles-nav { padding-right: 3px; }

/* Individual newspaper article readers */
.article-reader {
  background: #eef3f6;
}

.reader-shell {
  width: min(94%, 1180px);
  margin: 34px auto;
}

.reader-header {
  min-height: 112px;
  display: grid;
  grid-template-columns: 75px 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 20px 38px;
  background: var(--blue);
  color: #fff;
}

.reader-header .crest { width: 55px; }
.reader-heading p { margin: 0 0 4px; color: #d8e9f3; font-size: 14px; font-weight: bold; letter-spacing: .1em; text-transform: uppercase; }
.reader-heading h1 { margin: 0; font: bold clamp(22px, 3.2vw, 38px)/1.12 Georgia, "Times New Roman", serif; }
.reader-back { padding: 11px 18px; border: 1px solid rgba(255,255,255,.6); border-radius: 999px; color: #fff; font-weight: bold; text-decoration: none; white-space: nowrap; }
.reader-back:hover, .reader-back:focus-visible { background: #fff; color: var(--blue); }

.newspaper-pages {
  padding: 34px;
  background: linear-gradient(105deg, #bdd9e8, #f9eeee);
}

.reader-summary {
  padding: 27px 38px 29px;
  border-bottom: 1px solid rgba(55,120,179,.18);
  background: #fff;
}
.reader-summary .eyebrow { margin-bottom: 8px; }
.reader-summary > p:not(.eyebrow) { max-width: 850px; margin: 0 0 13px; font: 18px/1.55 Georgia, "Times New Roman", serif; }
.reader-summary a { color: var(--blue); font-weight: bold; text-decoration: none; }
.reader-summary a:hover, .reader-summary a:focus-visible { text-decoration: underline; }

.newspaper-page {
  display: block;
  width: min(100%, 980px);
  height: auto;
  margin: 0 auto 32px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(38,65,80,.22);
}
.newspaper-page:last-child { margin-bottom: 0; }

.reader-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 22px;
  padding: 28px 38px;
  background: var(--blue);
  color: #fff;
}
.reader-footer a { color: #fff; }

@media (max-width: 700px) {
  .reader-shell { width: 100%; margin: 0; }
  .reader-header { grid-template-columns: 48px 1fr; gap: 16px; padding: 18px; }
  .reader-header .crest { width: 44px; }
  .reader-back { grid-column: 1 / -1; justify-self: start; }
  .newspaper-pages { padding: 15px 10px; }
  .newspaper-page { margin-bottom: 15px; box-shadow: 0 5px 18px rgba(38,65,80,.18); }
  .reader-footer { flex-direction: column; text-align: center; padding: 24px 18px; }
  .reader-summary { padding: 23px 18px 25px; }
}

@media print {
  .reader-shell { width: 100%; margin: 0; }
  .reader-header, .reader-footer { display: none; }
  .newspaper-pages { padding: 0; background: #fff; }
  .newspaper-page { width: 100%; margin: 0; box-shadow: none; break-after: page; }
  .newspaper-page:last-child { break-after: auto; }
}

@media (max-width: 900px) {
  .articles-body { padding: 45px 25px 0; }
  .articles-intro { grid-template-columns: 1fr 190px; padding: 0 8px 45px; }
  .paper-decoration { width: 165px; height: 190px; }
  .paper-front { padding: 25px 17px; }
  .paper-front b { font-size: 23px; }
  .article-timeline::before { left: 35px; }
  .article-card { grid-template-columns: 88px 1fr; }
  .article-year { width: 70px; height: 70px; margin-left: 0; border-width: 6px; font-size: 16px; }
  .article-copy { padding: 25px 27px 28px; }
  .article-copy h2 { font-size: 25px; }
}

@media (max-width: 620px) {
  .articles-intro { grid-template-columns: 1fr; }
  .paper-decoration { display: none; }
  .articles-intro > div:first-child > p:last-child { font-size: 21px; }
  .article-timeline { padding-top: 55px; }
  .article-timeline::before { left: 25px; top: 55px; }
  .article-card { grid-template-columns: 55px 1fr; margin-bottom: 35px; }
  .article-year { width: 50px; height: 50px; border-width: 4px; font-size: 12px; }
  .article-copy { padding: 22px 20px 25px; }
  .article-copy::before { top: 19px; }
  .article-copy h2 { font-size: 22px; }
  .article-copy > p:not(.publication) { font-size: 17px; }
}

/* Compact typography — September 2026
   Body copy is approximately one third smaller; major headings are about half size. */
.intro h1 { font-size: clamp(36px, 3.5vw, 53px); }
.subtitle { font-size: 19px; }
.professional-summary { font-size: 15px; line-height: 1.5; }
.contact-details a,
.contact-details p { font-size: clamp(16px, 1.45vw, 23px); }

.section-heading h2 { font-size: clamp(22px, 2vw, 27px); }
.about { font-size: 18px; line-height: 1.35; }
.about h2 { font-size: 24px; }
.credential-grid strong { font-size: 20px; }
.credential-grid span,
.profile-cta p { font-size: 14px; }

.articles-intro h1 { font-size: clamp(36px, 4vw, 54px); }
.articles-intro > div:first-child > p:last-child { font-size: 17px; }
.article-copy h2 { font-size: 20px; }
.article-copy > p:not(.publication) { font-size: 14px; line-height: 1.5; }

.experience-intro h1 { font-size: clamp(36px, 4vw, 54px); }
.experience-intro .lead { font-size: 17px; }
.expertise-grid h3 { font-size: 19px; }
.expertise-grid p,
.career-timeline p { font-size: 14px; line-height: 1.5; }
.career-timeline h3 { font-size: 18px; }
.opportunity h2 { font-size: 24px; }
.opportunity p:last-child { font-size: 14px; }

.work-intro h1 { font-size: clamp(32px, 3.5vw, 48px); }
.work-intro > p:last-of-type { font-size: 17px; }
.case-study h2 { font-size: 21px; }
.case-study h3 { font-size: 13px; }
.case-study p,
.case-study li { font-size: 14px; line-height: 1.5; }
.case-study .case-lead { font-size: 15px; }
.case-columns p { font-size: 14px; }

.reader-heading h1 { font-size: clamp(18px, 1.7vw, 23px); }
.reader-summary > p:not(.eyebrow) { font-size: 14px; }
.copyright { font-size: 23px; }

@media (max-width: 620px) {
  .intro h1,
  .articles-intro h1,
  .experience-intro h1,
  .work-intro h1 { font-size: 34px; }
  .about { font-size: 16px; }
  .professional-summary,
  .articles-intro > div:first-child > p:last-child,
  .experience-intro .lead,
  .work-intro > p:last-of-type { font-size: 16px; }
  .article-copy h2,
  .case-study h2 { font-size: 19px; }
  .copyright { font-size: 18px; }
}

/* Stern Software — homepage and consulting page */
.company-intro {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 38px;
  align-items: center;
  margin-top: 46px;
  padding: 38px;
  border-top: 1px solid rgba(55,120,179,.18);
  border-bottom: 1px solid rgba(55,120,179,.18);
  background: rgba(255,255,255,.28);
}

.company-intro > img {
  display: block;
  width: 190px;
  max-width: 100%;
  height: 190px;
  object-fit: cover;
  border-radius: 3px;
}

.company-intro h2 { margin: 5px 0 10px; font: bold 24px/1.15 Georgia, "Times New Roman", serif; }
.company-intro > div > p:not(.eyebrow) { max-width: 790px; margin: 0; font-size: 14px; line-height: 1.55; }
.company-links { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 18px; }
.company-links .contact-button,
.company-links .text-button { margin-top: 0; }

.consulting-body {
  padding: 64px 58px 0;
  background: linear-gradient(100deg, var(--light-blue) 0%, #c5d9e4 58%, var(--pink) 100%);
}

.consulting-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 58px;
  align-items: center;
  padding: 10px 45px 68px;
}

.consulting-hero h1 { margin: 7px 0 14px; color: var(--blue); font: bold italic clamp(36px, 4vw, 54px)/1 Georgia, "Times New Roman", serif; }
.consulting-hero .lead { max-width: 760px; margin: 0; font: 17px/1.5 Georgia, "Times New Roman", serif; }
.consulting-logo {
  display: block;
  width: 280px;
  max-width: 100%;
  height: auto;
  justify-self: end;
  border-radius: 3px;
  box-shadow: 0 12px 28px rgba(25,63,91,.16);
}

.service-section,
.engagement-section,
.linkedin-section { padding: 62px 45px; border-top: 1px solid rgba(55,120,179,.18); }
.service-grid,
.linkedin-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.service-card,
.linkedin-grid article { padding: 30px; background: rgba(255,250,250,.84); box-shadow: 0 8px 22px rgba(55,96,120,.08); }
.service-card h3,
.engagement-grid h3,
.linkedin-grid h3 { margin: 0 0 11px; font: bold 19px/1.2 Georgia, "Times New Roman", serif; }
.service-card p,
.engagement-grid p,
.linkedin-grid p { margin: 0; font-size: 14px; line-height: 1.55; }
.technology-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.technology-list span { padding: 8px 11px; background: var(--blue); color: #fff; font-size: 12px; font-weight: bold; }
.engagement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.engagement-grid article { padding: 27px; border-top: 4px solid var(--blue); background: rgba(255,255,255,.56); }
.company-facts { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 25px; padding: 20px 24px; background: rgba(255,255,255,.38); font-size: 13px; line-height: 1.5; }
.linkedin-label { margin-bottom: 8px !important; color: var(--blue); font-size: 12px !important; font-weight: bold; letter-spacing: .08em; text-transform: uppercase; }
.linkedin-grid .contact-button,
.linkedin-grid .secondary-button { margin-top: 22px; padding: 14px 21px; font-size: 14px; }

@media (max-width: 900px) {
  .company-intro { grid-template-columns: 145px 1fr; padding: 30px; }
  .company-intro > img { width: 145px; height: 145px; }
  .consulting-body { padding: 45px 25px 0; }
  .consulting-hero { grid-template-columns: 1fr 210px; gap: 32px; padding: 5px 8px 50px; }
  .consulting-logo { width: 200px; }
  .service-section,
  .engagement-section,
  .linkedin-section { padding-left: 8px; padding-right: 8px; }
  .engagement-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .company-intro { grid-template-columns: 1fr; gap: 23px; padding: 25px; }
  .company-intro > img { width: 130px; height: 130px; }
  .consulting-hero { grid-template-columns: 1fr; }
  .consulting-logo { width: 170px; justify-self: start; grid-row: 1; }
  .service-grid,
  .linkedin-grid { grid-template-columns: 1fr; }
}
