/* About: scoped chapter layout. All content remains CMS managed. */
.about-page { --about-ink:#20231f; --about-muted:#50564e; --about-gold:#775a0e; --about-line:#ded9cd; --about-yellow:#facc15; color:var(--about-ink); background:#fff; }
/* The legacy overflow:hidden creates a non-scrolling sticky ancestor. */
.about-page { overflow:visible; }

/* Barely-visible ambient background, scoped to the hero so it actually renders above
   the hero's own opaque background instead of sitting uselessly behind it. */
.bg-engagement-canvas { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.blob { position:absolute; border-radius:50%; filter:blur(80px); opacity:.2; mix-blend-mode:multiply; animation:blobFloat 40s linear infinite alternate; }
.blob--warm { top:10%; left:-10%; width:420px; height:420px; background-color:var(--color-accent-primary,#facc15); }
.blob--cool { right:-10%; bottom:-10%; width:340px; height:340px; background-color:#b3b09d; animation-delay:-10s; }
@keyframes blobFloat {
  0% { transform:translate(0,0) rotate(0deg); }
  33% { transform:translate(30px,-50px) rotate(10deg); }
  66% { transform:translate(-20px,30px) rotate(-10deg); }
  100% { transform:translate(0,0) rotate(0deg); }
}
@media (prefers-reduced-motion:reduce) {
  .blob { animation:none; }
}
.about-page .container { width:calc(100% - 80px); max-width:1140px; margin-inline:auto; }
.about-page h1,.about-page h2,.about-page h3 { color:var(--about-ink); }
.about-page a:focus-visible { outline:3px solid #775a0e; outline-offset:5px; }
.about-page .about-hero { position:relative; overflow:hidden; padding:72px 0; background:#f7f5ef; border-bottom:1px solid var(--about-line); }
.about-page .about-hero .container { position:relative; z-index:1; }
.about-page .about-hero__grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr); gap:72px; align-items:center; }
.about-page .about-hero__content { order:1; min-width:0; }
.about-page .about-hero__visual { order:2; min-width:0; }
.about-page .about-hero__image { width:100%; margin:0; padding:0; overflow:hidden; border:1px solid var(--about-line); border-radius:16px; background:#fff; box-shadow:0 16px 40px -15px rgba(0,0,0,.07); transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease; }
.about-page .about-hero__image:hover { transform:translateY(-5px); box-shadow:0 20px 48px -15px rgba(0,0,0,.1); }
.about-page .about-hero__image img { display:block; width:100%; height:auto; border-radius:0; }
.about-page .about-hero__eyebrow { display:block; margin:0 0 20px; color:var(--about-gold); font:600 12px/1.5 var(--font-sans); letter-spacing:.14em; text-transform:uppercase; }
.about-page .about-hero__title { max-width:16ch; margin:0; font:500 clamp(36px,4.1vw,58px)/1.08 var(--font-sans); letter-spacing:-.045em; }
.about-page .about-hero__intro { margin:24px 0 0; max-width:54ch; color:var(--about-muted); font:400 19px/1.65 var(--font-serif); }
.about-page .about-hero__positioning { margin:22px 0 0; color:var(--about-gold); font:600 12px/1.7 var(--font-sans); }
.about-page .about-hero__nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; margin:28px 0 0; }
.about-page .about-hero__nav a { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:48px; padding:12px 0; border-bottom:1px solid #ccc6b7; color:var(--about-ink); font:500 13px/1.4 var(--font-sans); text-decoration:none; }
.about-page .about-hero__nav a:hover { color:var(--about-gold); }
.about-page .about-hero__nav-icon { color:var(--about-gold); }
.about-page .journey-section { padding:80px 0; scroll-margin-top:110px; }
.about-page .journey-chapter { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr); gap:0 72px; align-items:start; }
.about-page .about-page__content { --about-line:#dce1e5; background:#fff; }
.about-page #product-journey,.about-page #accessibility,.about-page #community-impact { background:#f5f7f8; }
.about-page .journey-section + .journey-section { border-top:1px solid var(--about-line); }
.about-page .journey-heading { position:sticky; top:120px; align-self:start; grid-column:1; grid-row:1 / span 2; max-width:none; margin:0; padding:0; border:0; }
.about-page .journey-heading::after { content:none; }
.about-page .journey-kicker { display:flex; flex-direction:column; align-items:flex-start; gap:20px; margin:0 0 20px; color:var(--about-gold); font:600 11px/1.6 var(--font-sans); letter-spacing:.1em; text-transform:uppercase; }
.about-page .journey-kicker span { display:block; width:auto; height:auto; border-radius:0; background:none; color:#775a0e; font:400 72px/1 var(--font-serif); letter-spacing:-.06em; }
.about-page .journey-heading h2 { margin:0; max-width:32ch; font:500 clamp(28px,2.8vw,39px)/1.18 var(--font-sans); letter-spacing:-.035em; }
.about-page .journey-records { display:grid; gap:40px; min-width:0; }
.about-page .journey-record,.about-page .journey-record--with-image { display:flex; flex-direction:column; gap:0; min-width:0; padding:0 0 40px; border:0; border-bottom:1px solid #d3cdbf; border-radius:0; background:transparent; }
.about-page .journey-record:last-child { border-bottom:0; padding-bottom:0; }
.about-page .journey-record__rail { position:relative; padding:0; margin-bottom:24px; border:0; }
.about-page .journey-record__rail > div { display:flex; flex-direction:row-reverse; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 24px; }
.about-page .journey-record__index { display:none; }
.about-page .journey-record__type { display:block; margin:0; color:#606770; font:500 10px/1.5 var(--font-sans); letter-spacing:.13em; text-transform:uppercase; }
.about-page .journey-record__rail time { display:flex; align-items:center; gap:10px; padding:0; border:0; border-radius:0; background:transparent; color:#283747; font:500 19px/1.4 var(--font-sans); letter-spacing:-.01em; }
.about-page .journey-record__rail time::before { content:""; display:block; flex:0 0 17px; width:17px; height:17px; background:currentColor; opacity:.8; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 11h18M8 15h2M14 15h2'/%3E%3C/svg%3E") center/contain no-repeat; }
.about-page .journey-record__rail::after { content:none; }
.about-page .journey-record__content { min-width:0; padding:0; }
.about-page .journey-record__meta { display:flex; flex-wrap:wrap; gap:6px 12px; margin:0 0 12px; color:var(--about-gold); font:600 10px/1.6 var(--font-sans); letter-spacing:.05em; text-transform:uppercase; }
.about-page .journey-record h3 { margin:0; max-width:34ch; font:500 30px/1.2 var(--font-sans); letter-spacing:-.03em; }
.about-page .journey-record__body { margin-top:16px; max-width:68ch; color:var(--about-muted); font:400 16px/1.75 var(--font-sans); }
.about-page .journey-record__body p,.about-page .journey-record__body li { color:inherit; font:inherit; }
.about-page .journey-record__body > :first-child { margin-top:0; }
.about-page .journey-record__body > :last-child { margin-bottom:0; }
.about-page .journey-record__media { display:grid; place-items:center; align-self:stretch; min-width:0; width:100%; margin:26px 0 0; padding:20px; background:#edf0f2; border:0; border-radius:4px; }
.about-page .journey-record__media img { display:block; width:100%; height:auto; max-height:380px; object-fit:contain; }
.about-page .journey-empty { padding:24px; color:var(--about-muted); }
.about-page .about-section-actions { grid-column:2; display:flex; flex-direction:column; align-items:flex-start; gap:14px; margin-top:28px; padding:24px; background:#edf0f2; border-radius:4px; }
.about-page .about-section-actions > strong { color:var(--about-gold); font:500 13px/1.5 var(--font-sans); }
.about-page .about-inline-links { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:10px; margin:0; }
.about-page .about-inline-links a { display:inline-flex; justify-content:space-between; align-items:center; gap:22px; min-height:46px; padding:12px 16px; border:1px solid #c7c1b2; border-radius:7px; background:#fff; color:var(--about-ink); font:600 12px/1.5 var(--font-sans); text-decoration:none; }
.about-page .about-inline-links a:first-child { background:var(--about-yellow); border-color:#d7ac00; }
.about-page .about-inline-links a:hover { background:#20231f; color:#fff; border-color:#20231f; }
.about-page .about-motto { padding:90px 0; background:#20251f; border-block:5px solid #facc15; }
.about-page .about-motto__inner { max-width:840px; margin:auto; text-align:center; }
.about-page .about-motto__kicker { margin:0 0 24px; color:#f1d466; font:600 12px/1.5 var(--font-sans); letter-spacing:.14em; text-transform:uppercase; }
.about-page .about-motto blockquote { margin:0; padding:0; border:0; color:#fff; font:400 clamp(34px,4.5vw,60px)/1.12 var(--font-serif); letter-spacing:-.025em; }
.about-page .about-motto__body { max-width:60ch; margin:24px auto 0; color:#d9ddd6; font:400 18px/1.7 var(--font-serif); }
.about-page .about-motto__resume { margin:30px 0 0; color:#f1d466; font:500 12px/1.5 var(--font-sans); }
.about-page .about-motto__resume span { margin-left:10px; }
.about-page .about-closing { padding:80px 0; background:#fff; border-top:1px solid var(--about-line); }
.about-page .about-closing__content { max-width:100%; margin:auto; padding:48px; background:#f5f7f8; border-left:4px solid #64748b; text-align:center; }
.about-page .about-section-kicker { display:block; margin:0 0 18px; color:var(--about-gold); font:600 12px/1.5 var(--font-sans); letter-spacing:.1em; text-transform:uppercase; }
.about-page .about-closing h2 { margin:0; font:500 clamp(28px,3vw,40px)/1.2 var(--font-sans); letter-spacing:-.03em; }
.about-page .about-closing p { max-width:62ch; margin:22px auto 0; color:var(--about-muted); font:400 18px/1.7 var(--font-serif); }
.about-page .about-closing__actions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:24px; margin:28px 0 0; }
.about-page .about-closing .arrow-link { color:var(--about-ink); }
@media(max-width:1100px) and (min-width:1025px) {
 .about-page .journey-chapter { gap:0 40px; }
 .about-page .about-hero__grid { gap:40px; }
}
@media(max-width:1024px) {
 .about-page .container { width:calc(100% - 48px); }
 .about-page .about-hero { padding:44px 0; }
 .about-page .about-hero__grid { grid-template-columns:1fr; gap:32px; max-width:680px; margin:auto; }
 .about-page .about-hero__visual { order:1; width:min(62vw,320px); margin:auto; }
 .about-page .about-hero__image { aspect-ratio:1; overflow:hidden; padding:7px; border-radius:50%; box-shadow:0 18px 42px rgba(25,30,34,.14); }
 .about-page .about-hero__image picture { display:block; height:100%; } /* so the img's own height:100% below has a real box to resolve against */
 .about-page .about-hero__image img { width:100%; height:100%; border-radius:50%; object-fit:cover; object-position:center 18%; }
 .about-page .about-hero__content { order:2; text-align:center; }
 .about-page .about-hero__title { margin-inline:auto; max-width:20ch; }
 .about-page .about-hero__intro { margin-inline:auto; }
 .about-page .about-hero__nav { max-width:540px; margin-inline:auto; }
 .about-page .journey-section { padding:44px 0; }
 .about-page .journey-chapter { grid-template-columns:1fr; gap:34px; max-width:720px; }
 .about-page .journey-heading { position:static; grid-column:auto; grid-row:auto; margin-inline:auto; text-align:center; }
 .about-page .journey-kicker { justify-content:center; align-items:center; gap:14px; }
 .about-page .journey-heading h2 { margin-inline:auto; }
 .about-page .journey-record,.about-page .journey-record--with-image { width:100%; max-width:680px; margin:auto; padding:0 0 32px; text-align:center; }
 .about-page .journey-record__rail > div { flex-direction:column-reverse; justify-content:center; gap:7px; }
 .about-page .journey-record__rail { padding:0; }
 .about-page .journey-record__rail::after { margin-inline:auto; }
 .about-page .journey-record__rail time { font-size:19px; }
 .about-page .journey-record__content { padding:0; }
 .about-page .journey-record__meta { justify-content:center; }
 .about-page .journey-record h3,.about-page .journey-record__body { margin-inline:auto; }
 .about-page .journey-record__media { width:100%; margin:24px auto 0; overflow:hidden; }
 .about-page .journey-record__media img { width:auto; max-width:100%; height:auto; max-height:none; object-fit:contain; object-position:center; }
 .about-page .about-section-actions { grid-column:1; align-items:center; margin-top:0; text-align:center; gap:14px; }
 .about-page .about-inline-links { justify-content:center; }
}
@media(max-width:600px) {
 .about-page .container { width:calc(100% - 32px); }
 .about-page .about-hero__visual { width:min(72vw,280px); }
 .about-page .about-hero__title { font-size:35px; }
 .about-page .about-hero__intro { font-size:18px; }
 .about-page .about-hero__nav { gap:0 16px; }
 .about-page .about-hero__nav a { font-size:12px; }
 .about-page .journey-heading h2 { font-size:28px; }
 .about-page .journey-kicker { font-size:10px; letter-spacing:.05em; }
 .about-page .journey-record,.about-page .journey-record--with-image { padding:0 0 30px; }
 .about-page .journey-record__media { padding:12px; }
 .about-page .journey-record h3 { font-size:23px; }
 .about-page .journey-record__body { font-size:16px; }
 .about-page .about-inline-links { width:100%; }
 .about-page .about-inline-links a { width:100%; }
 .about-page .about-motto { padding:48px 0; }
 .about-page .about-motto blockquote { font-size:30px; }
 .about-page .about-closing { padding:48px 0; }
 .about-page .about-closing__content { padding:30px 20px; }
}
@media print {
 .about-page .about-hero__nav,.about-page .about-section-actions,.about-page .about-closing__actions { display:none; }
 .about-page .journey-record { break-inside:avoid; }
}