.about-page { --about-rule: rgba(203, 163, 92, 0.34); }
.about-page main > section { scroll-margin-top: var(--header-h); }
.desktop-nav a[aria-current="page"] { color: var(--action); }

.breadcrumb { display: flex; gap: 9px; margin-bottom: 34px; color: var(--text-muted); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.breadcrumb a { color: var(--action); }
.about-hero { padding: clamp(52px, 7vw, 98px) max(var(--pad), calc((100vw - var(--max)) / 2)) 0; overflow: clip; }
.about-hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr); gap: clamp(44px, 7vw, 108px); align-items: center; }
.about-hero-copy h1 { max-width: 13ch; margin: 20px 0 28px; font-size: clamp(3.55rem, 7.2vw, 7.35rem); line-height: .94; }
.about-lead { max-width: 62ch; color: var(--text-soft); font-size: clamp(1.05rem, 1.3vw, 1.25rem); }
.about-hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 38px; }
.portrait-frame { position: relative; margin: 0; border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow); }
.portrait-frame::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 67%, rgba(13, 10, 8, .72)); }
.portrait-frame img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 19%; }
.portrait-index, .portrait-frame figcaption { position: absolute; z-index: 1; right: 18px; left: 18px; display: flex; justify-content: space-between; color: #f3eee3; font-size: .56rem; font-weight: 700; letter-spacing: .15em; }
.portrait-index { top: 16px; }
.portrait-frame figcaption { bottom: 16px; margin: 0; }
.fact-strip { display: grid; grid-template-columns: repeat(4, 1fr); max-width: var(--max); margin: clamp(54px, 7vw, 88px) auto 0; border-block: 1px solid var(--line); }
.fact-strip div { display: flex; min-height: 110px; padding: 22px; flex-direction: column; justify-content: space-between; border-left: 1px solid var(--line); }
.fact-strip div:first-child { border-left: 0; }
.fact-strip dt { color: var(--text-muted); font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.fact-strip dd { margin: 20px 0 0; font: 400 clamp(1.35rem, 2vw, 2rem)/1.05 var(--display); }

.practice-section, .support-section, .about-programs { position: relative; display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: clamp(28px, 7vw, 98px); padding: var(--section-y) max(var(--pad), calc((100vw - var(--max)) / 2)); }
.practice-section > div:not(.section-marker), .support-section > div:not(.section-marker), .about-programs > div:not(.section-marker) { grid-column: 2; min-width: 0; }
.practice-copy { max-width: 910px; }
.practice-copy h2 { max-width: 13ch; }
.practice-copy > p:last-child { max-width: 68ch; margin: 34px 0 0 auto; color: var(--paper-muted); font-size: clamp(1.05rem, 1.35vw, 1.24rem); }

.career-section { padding: var(--section-y) 0; overflow: clip; }
.career-heading { display: grid; grid-template-columns: 1.3fr .7fr; gap: 36px; align-items: end; }
.career-heading .eyebrow { grid-column: 1 / -1; }
.career-heading h2 { max-width: 11ch; margin: 0; }
.career-heading > p:last-child { max-width: 55ch; margin: 0; color: var(--text-soft); }
.career-contact-sheet { position: relative; margin-top: 86px; }
.career-line { position: absolute; top: 88px; right: 0; left: 0; height: 1px; overflow: hidden; background: var(--line); }
.career-line i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--warm), var(--gold), var(--signal)); transform: scaleX(var(--career-progress, 0)); transform-origin: left; transition: transform 900ms var(--ease); }
.career-line i.is-complete { transform: scaleX(1); }
.career-timeline { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; }
.career-timeline li { position: relative; min-height: 245px; padding: 0 26px 30px; opacity: 1; border-left: 1px solid var(--line); transform: translateY(18px); transition: transform 620ms var(--ease); }
.career-timeline li:first-child { padding-left: 0; border-left: 0; }
.career-timeline li::before { content: ""; position: absolute; top: 82px; left: -5px; width: 9px; height: 9px; border: 1px solid var(--gold); background: var(--canvas); transform: rotate(45deg); }
.career-timeline li:first-child::before { left: 0; }
.career-timeline li.is-active { opacity: 1; transform: none; }
.frame-number { display: block; margin-bottom: 40px; color: var(--text-muted); font-size: .56rem; font-weight: 700; letter-spacing: .14em; }
.career-timeline time { display: block; margin-bottom: 53px; color: var(--action); font: 400 clamp(2rem, 3.4vw, 3.5rem)/1 var(--display); }
.career-timeline p { max-width: 18ch; margin: 0; color: var(--text-soft); }

.support-heading h2 { max-width: 12ch; }
.support-sheet { grid-column: 2; margin-top: 48px; border-top: 1px solid var(--paper-line); }
.support-sheet details { border-bottom: 1px solid var(--paper-line); }
.support-sheet summary { display: grid; grid-template-columns: 42px 1fr 44px; gap: 12px; align-items: center; min-height: 82px; cursor: pointer; list-style: none; }
.support-sheet summary::-webkit-details-marker { display: none; }
.support-sheet summary > span { color: var(--gold-deep); font: 400 1rem/1 var(--display); }
.support-sheet summary strong { font: 400 clamp(1.4rem, 2.2vw, 2.2rem)/1.1 var(--display); }
.support-sheet summary i { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--paper-line); font-style: normal; transition: transform 220ms var(--ease); }
.support-sheet details[open] summary i { transform: rotate(45deg); }
.support-sheet details p { max-width: 64ch; margin: 0; padding: 4px 56px 34px 54px; color: var(--paper-muted); }

.experience-section { padding: var(--section-y) 0; }
.experience-heading { display: grid; grid-template-columns: .7fr 1.3fr; gap: 36px; align-items: end; }
.experience-heading .eyebrow { grid-column: 1 / -1; }
.experience-heading h2 { grid-column: 2; max-width: 15ch; margin: 0; }
.experience-notes { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 72px; border-block: 1px solid var(--line); }
.experience-notes article { min-height: 330px; padding: 30px; border-left: 1px solid var(--line); }
.experience-notes article:first-child { border-left: 0; }
.experience-notes span { display: block; margin-bottom: 72px; color: var(--gold); font-family: var(--display); }
.experience-notes p { margin: 0; color: var(--text-soft); }
.experience-note { margin-top: 28px; color: var(--text-muted); font-size: .78rem; }

.today-section { padding: 0 max(var(--pad), calc((100vw - var(--max)) / 2)) var(--section-y); }
.today-frame { position: relative; min-height: 570px; padding: clamp(48px, 8vw, 108px); overflow: hidden; border: 1px solid rgba(203,163,92,.45); background: radial-gradient(circle at 83% 8%, rgba(203,163,92,.2), transparent 29%), linear-gradient(145deg,#21190f,#090806 70%); color: #f3eee3; box-shadow: var(--shadow); }
.today-frame::before { content: ""; position: absolute; right: -7%; bottom: -24%; width: 48%; aspect-ratio: 1; border: 1px solid rgba(230,205,142,.16); transform: rotate(45deg); }
.today-index { position: absolute; top: 22px; right: 24px; left: 24px; display: flex; justify-content: space-between; color: #b7ad99; font-size: .56rem; letter-spacing: .15em; }
.today-frame h2 { position: relative; z-index: 1; max-width: 11ch; margin: 32px 0; font-size: clamp(3rem, 6vw, 6rem); }
.today-frame > p:last-child { position: relative; z-index: 1; max-width: 63ch; margin: 0; color: #c9c1b1; }

.about-programs-heading { max-width: 850px; }
.program-index { grid-column: 2; margin-top: 56px; border-top: 1px solid var(--paper-line); }
.program-index a { display: grid; grid-template-columns: 44px 1fr 44px; gap: 12px; align-items: center; min-height: 92px; border-bottom: 1px solid var(--paper-line); color: var(--paper-ink); }
.program-index a > span { color: var(--gold-deep); font-family: var(--display); }
.program-index a strong { font: 400 clamp(1.35rem, 2.25vw, 2.3rem)/1.1 var(--display); }
.program-index a b { color: var(--gold-deep); font-size: 1.2rem; text-align: center; transition: transform 220ms var(--ease); }
.program-index a:hover b { transform: translate(4px,-4px); }
.program-index .program-contact { margin-top: 22px; padding-inline: 18px; border: 1px solid var(--paper-line); background: var(--paper-raised); }

/* O mnie uses a deliberate dark/light cadence at section level. */
.today-section { padding-top: clamp(64px, 8vw, 112px); background: var(--paper); }
.about-programs:not(.paper-section) .section-marker { border-top-color: var(--text); }
.about-programs:not(.paper-section) .section-marker small { color: var(--text-muted); }
.about-programs:not(.paper-section) .program-index { border-top-color: var(--line); }
.about-programs:not(.paper-section) .program-index a { border-bottom-color: var(--line); color: var(--text); }
.about-programs:not(.paper-section) .program-index a > span,
.about-programs:not(.paper-section) .program-index a b { color: var(--gold); }
.about-programs:not(.paper-section) .program-index .program-contact { border-color: var(--line); background: var(--surface-raised); }

@media (min-width: 1024px) {
  .career-line { top: 118px; }
  .career-timeline li::before { top: 112px; }
}

@media (max-width: 1023px) {
  .about-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .about-hero-copy, .portrait-frame { min-width:0; max-width:100%; }
  .about-hero-copy h1 { max-width: 14ch; }
  .portrait-frame { width: min(100%, 650px); }
  .portrait-frame img { aspect-ratio: 4 / 5; object-position: 50% 18%; }
  .fact-strip { grid-template-columns: 1fr 1fr; }
  .fact-strip div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .fact-strip div:nth-child(4) { border-top: 1px solid var(--line); }
  .career-heading, .experience-heading { grid-template-columns: 1fr; }
  .career-heading .eyebrow, .experience-heading .eyebrow, .experience-heading h2 { grid-column: auto; }
  .career-timeline { grid-template-columns: 1fr 1fr; }
  .career-line { display: none; }
  .career-timeline li { min-height: 220px; opacity: 1; transform: none; border-top: 1px solid var(--line); }
  .career-timeline li:nth-child(odd) { border-left: 0; }
  .career-timeline li::before { display: none; }
}

@media (max-width: 767px) {
  .about-page .site-footer { grid-template-columns:minmax(0,1fr); }
  .about-page .site-footer > *, .about-page .footer-brand, .about-page .footer-brand > *, .about-page .site-footer nav, .about-page .site-footer nav > *, .about-page .footer-bottom, .about-page .footer-bottom > * { min-width:0; max-width:100%; overflow-wrap:anywhere; }
  .about-page .footer-brand, .about-page .footer-bottom { grid-column:auto; }
  .about-page .footer-bottom { align-items:flex-start; }
  .about-hero { padding-top: 38px; }
  .about-hero-grid { gap: 38px; }
  .about-hero-grid > *, .about-hero-copy > *, .portrait-frame > *, .practice-copy, .practice-copy > *, .support-heading, .support-heading > *, .support-heading h2, .career-heading, .career-heading > *, .experience-heading, .experience-heading > *, .support-sheet, .support-sheet details, .support-sheet details > *, .support-sheet summary, .support-sheet summary > *, .today-frame > *, .today-index > *, .about-programs-heading, .about-programs-heading > *, .about-programs-heading h2, .program-index, .program-index > *, .program-index a > * { min-width:0; max-width:100%; overflow-wrap:anywhere; }
  .about-hero-copy h1 { margin-top: 17px; font-size: clamp(3rem, 14vw, 4.6rem); line-height: .95; }
  .about-hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; }
  .portrait-frame { order: 2; }
  .portrait-frame img { aspect-ratio: 4 / 5; object-position: 50% 17%; }
  .fact-strip { grid-template-columns: 1fr; }
  .fact-strip, .fact-strip div, .fact-strip dt, .fact-strip dd, .fact-strip div:nth-child(2), .fact-strip div:nth-child(3), .fact-strip div:nth-child(4) { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  .fact-strip div, .fact-strip div:nth-child(2), .fact-strip div:nth-child(3), .fact-strip div:nth-child(4) { min-height: 92px; border-top: 1px solid var(--line); border-left: 0; }
  .fact-strip div:first-child { border-top: 0; }
  .practice-section, .support-section, .about-programs { display: block; }
  .practice-section > div:not(.section-marker), .support-section > div:not(.section-marker), .about-programs > div:not(.section-marker) { grid-column: auto; }
  .practice-copy > p:last-child { margin-left: 0; }
  .career-contact-sheet { margin-top: 48px; }
  .career-timeline { display: block; }
  .career-timeline li { min-height: 0; padding: 28px 0 34px 62px; border-top: 1px solid var(--line); border-left: 0; }
  .career-timeline li::before { display: block; top: 32px; left: 11px; }
  .career-timeline li::after { content: ""; position: absolute; top: 42px; bottom: -1px; left: 15px; width: 1px; background: var(--line); }
  .career-timeline li:last-child::after { display: none; }
  .frame-number { margin-bottom: 12px; }
  .career-timeline time { margin-bottom: 18px; font-size: 2.4rem; }
  .career-timeline p { max-width: none; }
  .support-sheet, .program-index { margin-top: 38px; }
  .support-sheet summary { grid-template-columns: 32px minmax(0,1fr) 44px; }
  .support-sheet details p { padding: 0 0 30px 44px; }
  .experience-notes { display: block; margin-top: 46px; }
  .experience-notes article { min-height: 0; padding: 28px 0; border-top: 1px solid var(--line); border-left: 0; }
  .experience-notes article:first-child { border-top: 0; }
  .experience-notes span { margin-bottom: 22px; }
  .today-frame { min-height: 520px; padding: 74px 24px 42px; }
  .support-heading h2, .career-heading h2, .about-programs-heading h2 { font-size: clamp(2rem, 10vw, 2.65rem); text-wrap: wrap; hyphens: auto; }
  .today-index { flex-wrap: wrap; gap: 8px 16px; }
  .today-frame h2 { margin-top: 42px; font-size: clamp(2.35rem, 11vw, 3.35rem); text-wrap: wrap; hyphens: auto; }
  .program-index a { grid-template-columns: 32px minmax(0,1fr) 32px; min-width:0; max-width:100%; min-height:84px; }
}

@media (max-width: 370px) {
  .about-hero-copy h1 { font-size: 2.85rem; }
  .portrait-index, .portrait-frame figcaption { right: 10px; left: 10px; font-size: .49rem; }
  .support-sheet summary strong { font-size: 1.2rem; }
  .program-index a strong { font-size: 1.17rem; }
}

html:not(.js) .career-timeline li { opacity: 1; transform: none; }
html:not(.js) .career-line i { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  .career-timeline li { opacity: 1; transform: none; }
  .career-line i { transform: scaleX(1); }
  .support-sheet summary i, .program-index a b { transition: none; }
}