/* Selected hero and experience components. Provenance: site-components/EDITORIAL-MOTION.md. */
body.personal-journal :is([data-hero-decryption],[data-hero-focus],[data-experience-timeline]) [hidden] { display: none !important; }
body.personal-journal .editorial-motion-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
body.personal-journal #home-intro .hero-decrypted { display: inline-block; }
body.personal-journal #home-intro .hero-focus { margin: 0 0 1.25rem; color: var(--fg); font-family: var(--journal-serif); font-size: 1.45rem; font-weight: 400; line-height: 1.5; letter-spacing: -.025em; }
body.personal-journal #home-intro .hero-focus__line { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .55rem; }
body.personal-journal #home-intro .hero-focus__phrase { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .45rem; min-width: 0; max-width: 100%; }
body.personal-journal #home-intro .hero-focus__words { --flip-padding-inline: .55em; --flip-padding-block: .05em; --flip-min-height: 1.7em; --flip-border-width: 1px; vertical-align: middle; min-width: 0; max-width: 100%; }
body.personal-journal #home-intro .hero-focus__words .container-text-flip__pill { border-style: solid; border-color: #dde1e7; border-radius: 9px; background: #f0f2f6; color: #242933; white-space: nowrap; }
body.personal-journal #home-intro .hero-focus__text { font: inherit; }
body.personal-journal #home-intro .hero-focus__static { font-size: 1.15rem; }

body.personal-journal #experience .experience-timeline { position: relative; isolation: isolate; margin-top: 1.25rem; }
body.personal-journal #experience .experience-timeline__entries { position: relative; }
body.personal-journal #experience .experience-timeline__row { position: relative; display: grid; grid-template-columns: 12rem minmax(0,1fr); gap: 2rem; margin: 0; padding: 1.7rem 0 1.7rem 2.75rem; }
body.personal-journal #experience .experience-timeline__row + .experience-timeline__row { border-top: 1px solid var(--journal-rule); }
body.personal-journal #experience .experience-timeline__date { position: sticky; top: 24px; align-self: start; padding-top: .15rem; color: var(--muted); font-family: var(--journal-mono); font-size: .78rem; font-weight: 400; line-height: 1.6; }
body.personal-journal #experience .experience-timeline__period { margin: 0; }
body.personal-journal #experience .experience-timeline__content { min-width: 0; }
body.personal-journal #experience .experience-timeline__content .entry-heading { display: flex; flex-direction: column; align-items: flex-start; margin: 0; gap: .2rem; }
body.personal-journal #experience .experience-timeline__content > p { max-width: 72ch; margin: .8rem 0 0; color: var(--muted); font-size: .95rem; line-height: 1.7; }
body.personal-journal #experience .experience-timeline__content a { display: inline; border-radius: 3px; color: var(--journal-accent); text-decoration: none; }
body.personal-journal #experience .experience-timeline__content a:is(:hover,:focus-visible) { background: rgba(0,0,0,.045); }
body.personal-journal #experience .experience-timeline__track { position: absolute; z-index: -1; left: 8px; top: 0; width: 2px; overflow: hidden; background: linear-gradient(to bottom,transparent,#dfdfdf 8%,#dfdfdf 92%,transparent); }
body.personal-journal #experience .experience-timeline__beam { position: absolute; left: 0; top: 0; width: 2px; max-height: 100%; background: linear-gradient(to top,#515e78,#9faeca 65%,transparent); border-radius: 999px; }
body.personal-journal #experience .experience-timeline__dot { position: absolute; top: .3rem; left: calc(-2.75rem + 2px); width: 14px; height: 14px; border: 4px solid #f9f9f8; border-radius: 50%; background: #727781; box-shadow: 0 0 0 1px #dedede; }
@media (max-width:960px) {
  body.personal-journal #experience .experience-timeline__row { grid-template-columns: 9rem minmax(0,1fr); gap: 1.5rem; }
}
@media (max-width:600px) {
  body.personal-journal #home-intro .hero-focus { font-size: 1.3rem; margin-bottom: 1rem; }
  body.personal-journal #experience .experience-timeline__row { grid-template-columns: minmax(0,1fr); gap: .7rem; padding: 1.4rem 0 1.4rem 2.2rem; }
  body.personal-journal #experience .experience-timeline__date { position: relative; top: auto; font-size: .73rem; }
  body.personal-journal #experience .experience-timeline__dot { top: .3rem; left: calc(-2.2rem + 2px); }
}
@media print {
  body.personal-journal #experience .experience-timeline__date { position: relative; top: auto; }
  body.personal-journal #experience .experience-timeline__row { break-inside: avoid; }
}