/* Horizontal timeline styles. Shared fonts and base artwork styles are in ../style.css.
   Rules remain in cascade order; responsive variants stay beside their original overrides. */

html,
body {
  height:100%;
  overflow:hidden;
}

body {
  font-size:14px;
  background:#f7f5f3;
}

main {
  max-width:none;
  height:100svh;
  position:relative;
}

.skip {
  z-index:50;
}

.top {
  position:fixed;
  right:0;
  top:0;
  z-index:30;
  border:0;
  background:transparent;
}

.top .wordmark {
  display:none;
}

.top button {
  color:white;
  font-size:24px;
  line-height:1;
}

#chapters {
  position:fixed;
  top:60px;
  right:12px;
  z-index:40;
  width:min(360px,calc(100vw - 24px));
  display:block;
  box-shadow:0 8px 30px #0003;
  border:0;
}

#chapters a {
  display:block;
  padding:20px 24px;
  font-size:1rem;
}

#chapters a:first-child {
  border-color:#00605f;
}

#chapters a[aria-current] {
  background:#eeeae5;
}

.timeline-header {
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:64px;
  background:#f28c10;
  color:white;
  z-index:15;
  padding:14px 76px 12px 22px;
  pointer-events:none;
}

.timeline-header.growth {
  background:#006990;
}

.timeline-header .timeline-header-title {
  font-size:14px;
  line-height:1.2;
  letter-spacing:0;
  text-transform:uppercase;
  font-weight:900;
}

.period-rail {
  display:flex;
  position:relative;
  width:100%;
  height:100%;
  overflow:auto;
  align-items:flex-start;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
  /* Continue the intro colour through the full scrollable height without
     moving its absolutely positioned logo, headline or chevron. */
  background-image:linear-gradient(to right,#00605f 0 var(--panel-width),transparent var(--panel-width));
  background-attachment:local;
}

.introduction {
  background:#00605f;
  color:white;
  flex:0 0 var(--panel-width);
  width:var(--panel-width);
  padding:90px 28px 40px;
  scroll-snap-align:start;
  position:relative;
}

.introduction>img {
  width:230px;
  max-width:85%;
  height:auto;
}

.introduction .intro-statement {
  font-size:28px;
  font-weight:500;
  letter-spacing:.1em;
  margin:20px 0;
}

.period-rail .period {
  flex:0 0 var(--panel-width);
  width:var(--panel-width);
  min-height:100svh;
  padding-top:64px;
  scroll-snap-align:start;
  --accent:#f28c10;
  --band:#f7ba70;
}

.period-rail .period.growth {
  --accent:#006990;
  --band:#84b2c4;
}

[data-route="foundation-1976"] {
  flex-basis:calc(var(--panel-width)*2);
  width:calc(var(--panel-width)*2);
}

.date {
  display:block;
  font-size:14px;
  font-weight:700;
  letter-spacing:0;
  line-height:20px;
  padding:10px 22px;
  color:#414140;
  background:var(--band);
}

.growth .date {
  color:#414140;
}

.period-rail .composition {
  display:block;
  padding:22px;
  gap:0;
}

.period-rail .foundation-layout {
  display:grid;
  padding:0;
  gap:0;
}

.editorial-column {
  padding:22px;
  min-width:0;
}

.period-rail .story {
  height:auto;
  width:auto;
  columns:auto;
}

.period-rail h3,
.period-rail .foundation-layout h3 {
  font-size:18px;
  line-height:1.2;
  letter-spacing:0;
  margin:0 0 12px;
}

.period-rail p,
.period-rail li {
  line-height:1.45;
}

.period-rail p {
  margin:0 0 12px;
}

.period-rail ol,
.period-rail ul {
  margin:12px 0;
  padding-left:1.3em;
}

.period-rail li {
  margin-bottom:7px;
  padding-left:2px;
}

.period-rail .small {
  width:48%;
  margin-top:28px;
  padding:12px;
}

.period-rail .strip {
  width:100%;
  margin-top:30px;
  max-width:none;
}

.period-rail .archive-column>figure:first-child {
  width:72%;
  margin:0 auto;
}

.period-rail figcaption {
  font-size:11px;
  line-height:1.4;
}

.period-rail .historic-logo {
  width:80%;
  margin:20px 0 24px;
}

.period-rail .conference {
  width:100%;
  margin:24px 0 0;
}

.period-rail .portrait-group {
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top:24px;
}

.period-rail .text-pair .story+.story {
  margin-top:26px;
}

.period-rail .documents {
  margin-top:24px;
  width:100%;
}

.period-rail .mounted {
  padding:14px;
}

.period-rail:focus-visible {
  outline:3px solid #164dcc;
  outline-offset:-3px;
}

footer {
  display:none;
}

:root {
  --panel-width:100vw;
}

@media(min-width:641px) {
  :root {
    --panel-width:360px;
  }

  .introduction {
    padding-top:100px;
  }

  .timeline-header {
    padding-left:26px;
  }

  .period-rail .editorial-column {
    padding:24px;
  }

  .period-rail .composition:not(.foundation-layout) {
    padding:24px;
  }
}

@media(max-height:600px) {
  .introduction {
    padding-top:65px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
}

.native-image img {
  position:static;
  max-width:100%;
  width:100%;
  height:auto;
  pointer-events:none;
}

.introduction .intro-statement {
  color:#b5d1d1;
}

.period-rail .period {
  align-self:stretch;
}

.period-rail .date {
  position:sticky;
  top:64px;
  z-index:10;
}

.conference-galleries {
  grid-column:1 / -1;
  display:flex;
  gap:22px;
  padding:0 22px 28px;
  align-items:stretch;
}

.period-rail .conference-gallery {
  flex:0 0 calc(var(--panel-width)*.65);
  width:calc(var(--panel-width)*.65);
  margin:0;
  padding:14px;
  align-self:stretch;
}

.period-rail .conference-gallery .image-button {
  height:110px;
  display:flex;
  align-items:center;
}

.period-rail .conference-gallery .crop {
  width:100%;
}

.period-rail .press-gallery .crop {
  width:60%;
}

.period-rail .conference-gallery figcaption {
  margin-top:9px;
}

.period-rail [data-route="foundation-1978"] .conference-gallery {
  margin-top:24px;
}

@media(min-width:641px) {
  .conference-galleries {
    padding-left:24px;
    padding-right:24px;
  }
}

.period-rail {
  scroll-snap-type:none;
  overflow-anchor:none;
}

.fixed-dates {
  position:absolute;
  top:64px;
  left:0;
  right:0;
  height:40px;
  overflow:hidden;
  z-index:20;
  pointer-events:none;
}

.fixed-date-band {
  position:absolute;
  top:0;
  height:40px;
  margin:0;
  white-space:nowrap;
  background:#f7ba70;
  color:#414140;
}

.fixed-date-band.growth {
  background:#84b2c4;
}

.period-rail .period>.date {
  /* Blank year labels must reserve the same 40px as the fixed date strip. */
  height:40px;
  visibility:hidden;
  position:static;
}

.top button {
  display:flex;
}

.top button svg {
  display:block;
}

.timeline-header {
  padding-right:84px;
}

.period-rail .conference-gallery .image-button {
  justify-content:flex-start;
}

.period-rail .conference-gallery figcaption {
  font-size:12px;
  line-height:1.45;
}

.introduction {
  height:100svh;
  min-height:620px;
  display:flex;
  flex-direction:column;
  padding-bottom:0;
}

.introduction>img,
.introduction>.intro-statement {
  flex-shrink:0;
}

@media(max-height:600px) {
  .introduction {
    min-height:500px;
  }
}

.period-rail .archive-column>figure:first-child figcaption {
  font-size:13px;
  line-height:1.5;
}

.period-rail .foundation-layout {
  grid-template-columns:repeat(2,var(--panel-width));
  width:calc(var(--panel-width)*2);
}

.period-rail .composition:not(.foundation-layout) {
  width:var(--panel-width);
  max-width:var(--panel-width);
}

.period-rail .story {
  min-width:0;
  overflow-wrap:break-word;
}

.period-rail .conference-gallery .crop {
  max-height:none;
}

@media(min-width:400px) and (max-width:640px) {
  body {
    font-size:15px;
  }

  .period-rail h3,
  .period-rail .foundation-layout h3 {
    font-size:19px;
  }
}

@media(min-width:430px) and (max-width:640px) {
  body {
    font-size:16px;
  }

  .period-rail h3,
  .period-rail .foundation-layout h3 {
    font-size:20px;
  }

  .period-rail figcaption {
    font-size:12px;
  }

  .period-rail .conference-gallery figcaption {
    font-size:13px;
  }

  .period-rail .archive-column>figure:first-child figcaption {
    font-size:14px;
  }
}

.introduction.introduction-redesign {
  display:block;
  position:relative;
  height:100svh;
  padding:0;
}

.introduction-redesign>.intro-logo {
  position:absolute;
  max-width:none;
  height:auto;
}

.introduction-redesign>.intro-statement {
  position:absolute;
  left:10%;
  width:80%;
  margin:0;
  color:#b5d1d1;
  font-weight:500;
  line-height:1.24;
  letter-spacing:-.025em;
  text-transform:none;
  overflow-wrap:normal;
}

.intro-statement>span {
  display:block;
  white-space:nowrap;
}

.introduction.introduction-redesign {
  min-height:calc(var(--panel-width)*1.75);
}

.introduction-redesign>.intro-logo {
  top:5.6%;
  width:46%;
  left:10.5%;
}

.introduction-redesign>.intro-statement {
  top:22%;
  font-size:calc(var(--panel-width)*.132);
}

.intro-start {
  position:absolute;
  left:11.5%;
  bottom:10%;
  width:42%;
  display:block;
}

.intro-start img {
  display:block;
  width:100%;
  height:auto;
}

.growth-editorial .story+.story {
  margin-top:26px;
}

.growth-figure {
  margin-top:28px;
  width:100%;
  max-width:100%;
}

.growth-figure img {
  object-fit:contain;
}

.growth-photo-pair {
  display:flex;
  gap:10px;
  margin-top:28px;
  padding:14px;
  background:#eae6e2;
  border-top:4px solid #c4bfba;
}

.growth-photo-pair .growth-figure {
  width:calc(50% - 5px);
  margin:0;
}

.growth-photo-pair .image-button {
  height:90px;
  display:flex;
  align-items:center;
}

.growth-photo-pair .crop {
  width:100%;
}

.presidents-cta {
  display:block;
  margin-top:42px;
  background:#006990;
  color:#f28c10;
  text-align:left;
  border:0;
  clip-path:polygon(0 0,80% 0,100% 50%,80% 100%,0 100%);
  width:100%;
  padding:26px 44px 26px 24px;
  font-size:23px;
  font-weight:700;
  line-height:1.2;
  min-height:170px;
}

.presidents-cta:focus-visible {
  outline:none;
  filter:drop-shadow(0 0 5px #164dcc);
}

.period-rail .growth-reflection {
  background:#006990;
  color:#f28c10;
}

.growth-reflection .asset-statement {
  background:#f28c10;
  color:#006990;
  text-transform:uppercase;
  padding:30px 36px 30px 22px;
  clip-path:polygon(0 0,78% 0,100% 50%,78% 100%,0 100%);
  font-size:20px;
  line-height:1.3;
  margin:0 -22px 36px;
}

.growth-reflection blockquote {
  margin:0;
  padding:0;
}

.growth-reflection blockquote p {
  font-size:20px;
  font-weight:700;
  font-style:italic;
  line-height:1.4;
}

.growth-reflection cite {
  color:#b5d1d1;
  font-style:normal;
  font-size:14px;
}

.fixed-date-band.reflection-date {
  background:#006990;
}

.presidents-cta {
  text-decoration:underline;
  text-decoration-thickness:1.5px;
  text-underline-offset:4px;
}

.period-rail figure figcaption,
.period-rail .conference-gallery figcaption {
  margin:10px 0 0;
  line-height:1.45;
}

.period-rail .growth-photo-pair .image-button {
  height:auto;
  align-items:flex-start;
}

.period-rail .house-card .crop {
  aspect-ratio:3 / 2;
}

.period-rail .house-card .crop img {
  height:100%;
  width:100%;
  object-fit:cover;
  object-position:center 22%;
}

.period-rail .certificate-card {
  display:grid;
  grid-template-columns:minmax(0,38%) minmax(0,1fr);
  gap:10px 16px;
  align-items:start;
  width:calc(var(--panel-width)*1.6 - 44px);
  max-width:none;
  position:relative;
  z-index:2;
}

.period-rail .certificate-card figcaption {
  margin:0;
  font-size:12px;
  line-height:1.45;
}

@media(min-width:430px) and (max-width:640px) {
  .period-rail .certificate-card figcaption {
    font-size:13px;
  }
}

.timeline-header[data-theme="renewal"] {
  background:#fab712;
  color:#ffffff;
}

.timeline-header[data-theme="modern"] {
  background:#066364;
  color:#b5d1d1;
}

.fixed-date-band[data-theme="renewal"] {
  background:#fbc94d;
  color:#414140;
}

.fixed-date-band[data-theme="modern"] {
  background:#448a8b;
  color:#ffffff;
}

.period-rail .renewal-period {
  --accent:#5b5a5a;
  --band:#fbc94d;
}

.period-rail .modern-period {
  --accent:#066364;
  --band:#448a8b;
}

.period-rail [data-route="renewal-2006"] h3 {
  color:#fab712;
  font-size:24px;
}

.period-rail [data-route="modern-2016"] .story:first-child h3 {
  font-size:24px;
}

.renewal-editorial .story+.story {
  margin-top:26px;
}

.renewal-photo {
  margin:28px 0 0;
  max-width:100%;
}

.renewal-photo.lead-portrait {
  width:78%;
}

.renewal-photo.gareth-portrait {
  width:68%;
  margin-bottom:26px;
}

.renewal-photo.qualifications-brand {
  width:82%;
  margin:24px 0;
}

.renewal-photo.moving-pensions-brand {
  width:70%;
  margin-top:18px;
}

.renewal-photo-strip {
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:36px;
}

.renewal-photo-strip .renewal-photo {
  width:62%;
  margin:0;
}

.renewal-photo-strip .portrait-in-strip {
  width:38%;
}

.renewal-photo.gareth-portrait+.story {
  margin-top:26px;
}

#chapters {
  max-height:calc(100svh - 80px);
  overflow-y:auto;
}

#chapters a[href="#renewal"] {
  border-color:#fab712;
}

#chapters a[href="#modern"] {
  border-color:#066364;
}

.modern-period .story:first-child p strong {
  color:#066364;
}

.latest-editorial .story+.story,
.awards-copy .story+.story {
  margin-top:26px;
}

.latest-photo {
  margin:28px 0 0;
  max-width:100%;
}

.period-rail .awards-period {
  flex-basis:calc(var(--panel-width)*2);
  width:calc(var(--panel-width)*2);
}

.period-rail .period .awards-composition {
  display:grid;
  grid-template-columns:repeat(2,var(--panel-width));
  width:calc(var(--panel-width)*2);
  max-width:none;
  padding:0;
  gap:0;
}

.awards-copy {
  padding:22px;
  min-width:0;
}

.awards-feature {
  margin:0;
  background:#066364;
  color:#b5d1d1;
  min-width:0;
}

.awards-feature .latest-photo {
  margin:0;
}

.awards-feature blockquote {
  margin:0;
  padding:28px;
  font-size:26px;
  font-weight:900;
  line-height:1.18;
}

.latest-photo.brand-refresh {
  width:82%;
  margin:28px 0 32px;
}

.president-profile {
  display:grid;
  grid-template-columns:minmax(0,36%) minmax(0,1fr);
  gap:14px;
  align-items:start;
  margin-top:30px;
}

.president-profile .latest-photo {
  margin:0;
}

.president-profile p {
  font-size:13px;
  line-height:1.5;
}

.anniversary-collage {
  position:relative;
  width:100%;
}

.anniversary-collage>img {
  display:block;
  width:100%;
  height:auto;
}

.anniversary-message {
  position:absolute;
  left:20.34%;
  top:14.61%;
  width:59.34%;
  height:42.44%;
  background:#066364;
  color:#b5d1d1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:8px;
}

.period-rail .anniversary-message h3 {
  color:#f28c10;
  font-size:calc(var(--panel-width)*.105);
  font-weight:900;
  line-height:1.1;
  margin:0 0 16px;
  white-space:nowrap;
}

.period-rail .anniversary-message p {
  font-size:calc(var(--panel-width)*.045);
  line-height:1.25;
  margin:0;
}

.anniversary-message sup {
  font-size:.6em;
}

@media(min-width:430px) and (max-width:640px) {
  .president-profile p {
    font-size:14px;
  }

  .awards-feature blockquote {
    font-size:29px;
  }
}

@media(min-width:641px) {
  .awards-copy {
    padding:24px;
  }
}

.awards-feature {
  min-height:calc(100svh - 104px);
  align-self:stretch;
}

#imageViewer,
#presidentsViewer {
  position:fixed;
  inset:0;
  width:calc(100vw - 80px);
  max-width:620px;
  max-height:calc(100svh - 80px);
  margin:40px auto auto;
  border:0;
  padding:0;
  overscroll-behavior:contain;
  overflow-x:hidden;
  overflow-y:auto;
  box-shadow:none;
  border-radius:0;
}

#imageViewer::backdrop,
#presidentsViewer::backdrop {
  background:rgba(0,0,0,.56);
}

#imageViewer {
  background:#fff;
  color:#5b5a5a;
}

.overlay-heading {
  min-height:106px;
  padding:66px 20px 22px;
}

#imageCaption {
  margin:0;
  font-size:14px;
  font-weight:500;
  font-style:italic;
  line-height:1.4;
}

#closeImage,
#closePresidents {
  position:absolute;
  right:10px;
  top:8px;
  display:block;
  margin:0;
  width:44px;
  height:44px;
  min-height:44px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
}

.overlay-close::before,
.overlay-close::after {
  content:'';
  position:absolute;
  left:4px;
  top:21px;
  width:36px;
  height:2px;
  background:currentColor;
  transform:rotate(45deg);
}

.overlay-close::after {
  transform:rotate(-45deg);
}

#enlarged {
  width:100%;
  max-width:none;
  margin:0;
}

#enlarged>.crop {
  display:block;
  width:100%!important;
  max-height:none!important;
  margin:0;
  border:0;
}

#enlarged>img {
  display:block;
  width:100%;
  height:auto;
}

#enlarged .native-image img {
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}

#presidentsViewer {
  background:#006990;
  color:#b5d1d1;
  max-width:620px;
  padding:0 20px 28px;
}

.presidents-heading {
  margin:0 -20px;
  padding:70px 20px 32px;
}

#presidentsViewer h2 {
  margin:0;
  color:#f28c10;
  text-transform:uppercase;
  font-size:24px;
  line-height:1.15;
  letter-spacing:-.035em;
  font-weight:700;
}

.presidents-grid {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:20px;
  row-gap:20px;
}

.presidents-grid li {
  margin:0;
  min-width:0;
  text-align:center;
  font-size:12px;
  line-height:1.4;
}

.presidents-grid img {
  display:block;
  width:100%;
  max-width:150px;
  aspect-ratio:1;
  height:auto;
  object-fit:cover;
  border-radius:50%;
  margin:0 auto 10px;
}

.presidents-grid strong {
  display:block;
  font-size:inherit;
  font-weight:700;
}

.presidents-grid span {
  display:block;
  font-variant-numeric:lining-nums;
}

@media(min-width:430px) {
  #imageCaption {
    font-size:16px;
  }

  .presidents-grid li {
    font-size:14px;
  }
}

@media(min-width:700px) {
  #presidentsViewer {
    padding:0 36px 36px;
  }

  .presidents-heading {
    margin:0 -36px;
    padding-left:36px;
    padding-right:36px;
  }

  .presidents-grid {
    column-gap:44px;
    row-gap:28px;
  }

  .presidents-grid li {
    font-size:16px;
  }

  #presidentsViewer h2 {
    font-size:30px;
  }

  .overlay-heading {
    padding-left:28px;
    padding-right:28px;
  }
}

.overlay-heading {
  position:sticky;
  top:0;
  z-index:2;
  background:#fff;
}

.presidents-heading {
  position:sticky;
  top:0;
  z-index:2;
  background:#006990;
}

@media(max-width:699px) {
  #imageViewer,
  #presidentsViewer {
    inset:0;
    width:100%;
    max-width:none;
    height:100vh;
    height:100dvh;
    max-height:100vh;
    max-height:100dvh;
    margin:0;
  }

  #imageViewer::backdrop {
    background:#fff;
  }

  #presidentsViewer::backdrop {
    background:#006990;
  }

  #presidentsViewer {
    padding:0 max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));
  }

  .overlay-heading {
    min-height:134px;
    padding:calc(82px + env(safe-area-inset-top)) max(40px,env(safe-area-inset-right)) 28px max(40px,env(safe-area-inset-left));
  }

  #closeImage,
  #closePresidents {
    top:calc(12px + env(safe-area-inset-top));
    right:max(18px,env(safe-area-inset-right));
  }

  .presidents-heading {
    padding-top:calc(70px + env(safe-area-inset-top));
    text-align:center;
  }

  .presidents-grid {
    max-width:340px;
    margin-inline:auto;
    row-gap:20px;
  }

  .presidents-grid img {
    width:clamp(94px,27vw,120px);
    max-width:100%;
  }
}

.period-rail .closing-period {
  background:#066364;
}

.fixed-date-band.closing-date {
  background:#066364;
}

.closing-editorial .story+.story {
  margin-top:28px;
}

.closing-figure {
  margin:28px 0 0;
  width:100%;
}

.period-rail .closing-period .story p strong.brand-highlight {
  color:#f28c10;
}

.brand-highlight .brand-link {
  color:inherit;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}

.find-out-more {
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:4px;
  padding:4px 8px;
  background:#f28c10;
  color:#066364;
  font-size:12px;
  font-weight:700;
  line-height:18px;
  text-decoration:none;
}

/* Preserve the compact visual button while providing a generous tap area. */
.find-out-more::after {
  content:"";
  position:absolute;
  inset:-9px -4px;
}

.find-out-more svg {
  width:16px;
  height:14px;
}

.find-out-more:hover {
  background:#fab712;
}

.closing-figure.lsi-cover {
  width:68%;
  margin-top:18px;
}

.closing-figure.factito-website {
  width:85%;
  box-shadow:0 3px 12px #0003;
}

.closing-figure.development-partnership-logo {
  width:62%;
  margin-top:18px;
}

.closing-figure .image-button {
  display:block;
  width:100%;
}

.closing-figure img {
  display:block;
  width:100%;
  height:auto;
}

.period-rail .closing-period h3 {
  color:#b5d1d1;
}

.period-rail .purpose-arrow {
  background:#f28c10;
  color:#fff;
  text-align:center;
  padding:28px 22px 120px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 110px),50% 100%,0 calc(100% - 110px));
}

.period-rail .purpose-arrow h3 {
  color:#066364;
  margin-bottom:24px;
}

.period-rail .purpose-arrow p {
  margin:0;
}

.closing-logo {
  display:block;
  width:84%;
  height:auto;
  margin:36px auto 0;
}

.period-rail .future-intro {
  color:#f28c10;
  font-size:18px;
  font-weight:700;
  line-height:1.3;
  margin:0 0 36px;
}

.closing-figure.factito-logo {
  width:76%;
  margin-top:28px;
  margin-bottom:34px;
}

.future-quote {
  margin:0;
  padding:0;
}

.period-rail .future-quote p {
  color:#f28c10;
  font-weight:700;
}

.future-quote cite {
  font-size:13px;
  font-style:normal;
  line-height:1.4;
}

.fixed-date-band[data-theme="tomorrow"] {
  background:#066364;
  color:#b5d1d1;
}

.timeline-header[data-theme="tomorrow"] {
  background:#066364;
  color:#fff;
}

#chapters a[href="#tomorrow"] {
  border-color:#066364;
}

.period-rail .anniversary-period {
  background:#f7f5f3;
}

.timeline-header[data-theme="tomorrow"] .timeline-header-title {
  font-size:clamp(20px,4vw,26px);
  line-height:1.1;
}

.period-rail .closing-photo-finale {
  flex-basis:calc(var(--panel-width)*5.417948718);
  width:calc(var(--panel-width)*5.417948718);
}

.closing-photo-strip {
  display:block;
  width:100%;
  height:auto;
}


.period-rail .closing-period {
  color:#fff;
  --accent:#fff;
}

.period-rail .closing-period .story h3 {
  color:#fff;
}

button.image-button {
  position:relative;
}

.zoom-indicator {
  position:absolute;
  right:6px;
  bottom:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  color:#5b5a5a;
  box-shadow:0 1px 4px #0003;
  pointer-events:none;
}

.zoom-indicator svg {
  display:block;
  width:20px;
  height:20px;
}

.static-image,
.static-image:hover {
  cursor:default;
  filter:none;
}

[data-route="modern-2026"] .latest-photo {
  width:100%;
  max-width:none;
}

[data-route="modern-2026"] .latest-photo img {
  display:block;
  width:100%;
  height:auto;
  box-shadow:0 3px 12px #0002;
}

[data-route="modern-2026"] .crop {
  overflow:visible;
}

#imageViewer.document-gallery {
  background:#f7f5f3;
}

#imageViewer.document-gallery #enlarged {
  padding:56px 40px 90px;
  display:flex;
  flex-direction:column;
  gap:44px;
}

#imageViewer.document-gallery #enlarged>img {
  width:100%;
  height:auto;
  box-shadow:0 10px 20px #0003;
}

@media(min-width:700px) {
  #imageViewer.document-gallery #enlarged {
    padding:56px 50px 90px;
    gap:52px;
  }
}

.growth-photo-pair>figure:first-child button[data-caption="1999 PMI Conference"] .zoom-indicator,
.growth-photo-pair>figure:first-child button[data-caption="2001 PMI Conference"] .zoom-indicator,
.growth-photo-pair>figure:first-child button[data-caption="2003 PMI Conference"] .zoom-indicator {
  display:none;
}

.top {
  padding:0 12px;
}

.top button {
  height:64px;
  width:56px;
  align-items:flex-start;
  justify-content:center;
  padding:14px 0 0;
}

.top button svg {
  width:38px;
  height:28px;
  flex:none;
}

/* Persistent return link. Its right edge follows the hamburger's visible strokes. */
.back-to-pmi {
  position:fixed;
  right:22px;
  bottom:calc(20px + env(safe-area-inset-bottom, 0px));
  z-index:30;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:12px 18px;
  background:#414140;
  color:#f7f5f3;
  border:0;
  border-radius:0;
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  text-decoration:none;
}
.back-to-pmi:hover {
  background:#30302f;
}
.back-to-pmi:focus-visible {
  outline:2px solid #f7f5f3;
  outline-offset:3px;
}

.heading-visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.intro-cue {
  position:absolute;
  left:11.5%;
  right:7%;
  bottom:4%;
  margin:0;
  color:#fff;
  font-size:clamp(14px,2vw,16px);
  line-height:1.25;
}
.desktop-cue { display:none }
@media (hover:hover) and (pointer:fine) {
  .desktop-cue { display:inline }
  .touch-cue { display:none }
  .period-rail { cursor:grab }
  .period-rail.is-dragging, .period-rail.is-dragging * {
    cursor:grabbing;
    user-select:none;
  }
}
html[data-pointer] :is(a,button,.period-rail):focus {
  outline:none;
}
html[data-keyboard] :is(a,button):focus {
  outline:2px solid #fff;
  outline-offset:2px;
  box-shadow:0 0 0 6px #414140;
}
html[data-keyboard] .period-rail:focus {
  outline:2px solid #fff;
  outline-offset:-3px;
  box-shadow:inset 0 0 0 5px #414140;
}

/* Give the swipe cue more room on narrow touch screens. */
@media (max-width:640px) and (pointer:coarse) {
  .introduction-redesign>.intro-statement {
    top:19%;
    font-size:calc(var(--panel-width)*.125);
  }

  .intro-start {
    bottom:16%;
    width:35%;
  }
}