/* Real people, complementary experience. About is a portrait-led working wall. */
.about-page .about-opening {
  padding:var(--ha-space-support) var(--ha-gutter);
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(36px,5vw,76px); align-items:center;
  background:var(--ha-bone-alt); color:var(--ha-ink); overflow:hidden; --ha-text:var(--ha-support-on-paper); --ha-text-strong:var(--ha-ink); --ha-text-meta:var(--ha-support-on-paper); }
.about-page .about-opening h1 { color:var(--ha-ink); font-size:var(--ha-type-page-title); line-height:1.12; letter-spacing:-.03em; max-width:13ch; margin:0; }
.about-page .about-opening-copy > p { color:var(--ha-support-on-paper); max-width:40ch; margin:28px 0 0; font-size:var(--ha-type-lede); line-height:1.6; }
.about-opening-people { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:center; padding:20px 5px; }
.about-person-note { display:block; padding:10px 10px 14px; color:var(--ha-ink); background:var(--ha-paper); box-shadow:6px 9px 0 color-mix(in srgb,var(--ha-ink) 12%,transparent); text-decoration:none; transform:rotate(-4deg); transition:box-shadow 180ms,background 180ms; position:relative; }
.about-person-note-dave { transform:rotate(4deg); margin-top:64px; }
.about-person-note img { display:block; width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; object-position:52% center; }
.about-person-note-dave img { object-position:57% center; }
.about-person-note span { display:block; font-weight:800; font-size:28px; padding:10px 4px 0; }
.about-person-note::after { content:'↘'; position:absolute; bottom:17px; right:15px; font-size:24px; font-weight:800; }
.about-person-note:hover { background:var(--ha-white); box-shadow:6px 9px 0 color-mix(in srgb,var(--ha-ink) 24%,transparent); }
.about-person-note:focus-visible,.about-background summary:focus-visible { outline:3px solid var(--ha-bloom-deep); outline-offset:7px; }
.about-page .about-shared { padding-block:clamp(40px,5vw,72px); align-items:start; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); }
.about-page .about-shared h2 { font-size:var(--ha-type-long); margin:0; line-height:1.12; letter-spacing:-.03em; }
.about-page .about-shared > div:last-child { display:grid; grid-template-columns:1fr 1fr; gap:0 32px; }
.about-page .about-shared p { margin:0 0 20px; font-size:17px!important; line-height:1.65!important; }
.about-page .about-shared p:first-child { grid-column:1/-1; font-size:clamp(28px,3vw,42px)!important; font-weight:800; line-height:1.2!important; color:var(--ha-ink); letter-spacing:-.035em; }
.about-page .about-shared p:nth-child(2),.about-page .about-shared p:last-child { grid-column:1/-1; }
.about-page .about-biography { padding-block:var(--ha-space-support); gap:clamp(32px,7vw,108px); grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); border-bottom:0; }
.about-page .about-biography h2 { font-size:var(--ha-type-long); margin:28px 0 0; line-height:1.12; letter-spacing:-.03em; }
.about-page .about-biography > div > p { font-size:var(--ha-type-body); line-height:1.65; margin:0 0 22px; }
.about-page .about-biography > div > p:first-child { font-size:var(--ha-type-lede); line-height:1.5; font-weight:700; letter-spacing:-.025em; color:var(--ha-white); }
.about-page .about-biography-lee { background:var(--ha-ink); color:var(--ha-vapour); --ha-text:var(--ha-vapour); --ha-text-strong:var(--ha-white); --ha-text-meta:var(--ha-meta-on-dark); }
.about-page .about-biography-lee h2 { color:var(--ha-vapour); }
.about-page .about-biography-lee > div > p { color:var(--ha-vapour); }
.about-page .about-biography-dave { background:var(--ha-ink-raised); color:var(--ha-vapour); --ha-text:var(--ha-vapour); --ha-text-strong:var(--ha-white); --ha-text-meta:var(--ha-meta-on-dark); }
.about-page .about-biography-dave h2 { color:var(--ha-vapour); }
.about-page .about-biography-dave > div > p { color:var(--ha-vapour); }
.about-page .about-portrait-frame { margin:0; max-width:440px; --image-fold:38px; }
.about-page .about-portrait { aspect-ratio:1/1; object-position:50% center; }
.about-page .about-biography .person-email { padding-top:20px; border-color:color-mix(in srgb,var(--ha-paper) 35%,transparent); font-size:18px; margin-bottom:0; }
.about-page .person-email a { color:var(--ha-paper); text-decoration:underline; text-underline-offset:6px; text-decoration-color:var(--ha-bloom); }
.about-page .person-email a:hover { text-decoration-thickness:3px; }
.about-page .person-email a:focus-visible { outline:3px solid var(--ha-paper); outline-offset:6px; }
.about-page .about-together { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:32px 64px; padding-block:var(--ha-space-chapter); background:var(--ha-paper); --ha-text:var(--ha-support-on-paper); --ha-text-strong:var(--ha-ink); --ha-text-meta:var(--ha-support-on-paper); color:var(--ha-ink); }
.about-page .about-together h2 { font-size:var(--ha-type-long); max-width:12ch; letter-spacing:-.03em; line-height:1.12; }
.about-page .about-together > div > p { font-size:var(--ha-type-body); line-height:1.65; margin:0 0 16px; color:var(--ha-support-on-paper); }
.about-page .about-together .about-overlap { grid-column:1/-1; padding:0; }

.about-page .about-background { padding-block:0; background:var(--ha-bone-alt); border-bottom:1px solid color-mix(in srgb,var(--ha-ink) 20%,transparent); --ha-text:var(--ha-support-on-paper); --ha-text-strong:var(--ha-ink); --ha-text-meta:var(--ha-support-on-paper); color:var(--ha-ink); }
.about-background details { padding:0; }
.about-background summary { display:flex; gap:28px; align-items:center; justify-content:space-between; cursor:pointer; list-style:none; padding:30px 0; }
.about-background summary::-webkit-details-marker { display:none; }
.about-background summary::after { content:'+'; display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border:1px solid currentColor; border-radius:50%; font-size:28px; transition:background 180ms; }
.about-background details[open] summary::after { content:'−'; background:var(--ha-paper); }
.about-background summary:hover::after { background:var(--ha-paper); }
.about-background summary h2 { font-size:var(--ha-type-long); line-height:1.12; letter-spacing:-.03em; margin:0; }
.about-background-copy { max-width:760px; padding-bottom:30px; margin-left:auto; }
.about-background-copy p { font-size:var(--ha-type-body); line-height:1.7; color:var(--ha-support-on-paper); margin:0 0 18px; }
.about-background-copy a { color:var(--ha-ink); text-decoration-color:var(--ha-bloom-deep); text-underline-offset:4px; }
.about-page .final-conversation { padding-block:clamp(50px,6vw,85px); }
@media (max-width:900px) {
  .about-page .about-opening { grid-template-columns:1fr; gap:22px; }
  .about-page .about-opening h1 { max-width:17ch; font-size:var(--ha-type-page-title); line-height:1.12; letter-spacing:-.03em; }
  .about-opening-people { max-width:600px; width:100%; justify-self:center; }
  .about-person-note img { aspect-ratio:1/1; }
  .about-page .about-shared { grid-template-columns:1fr; gap:20px; }
  .about-page .about-biography { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:30px; }
  .about-page .about-together { gap:24px; }
}
@media (max-width:600px) {
  .about-page .about-opening { padding-block:34px 40px; }
  .about-page .about-opening h1 { font-size:var(--ha-type-page-title); line-height:1.12; letter-spacing:-.03em; }
  .about-page .about-opening-copy > p { font-size:var(--ha-type-lede); line-height:1.55; margin-top:22px; color:var(--ha-support-on-paper); }
  .about-opening-people { padding:9px 3px; gap:10px; }
  .about-person-note { padding:7px 7px 10px; }
  .about-person-note span { font-size:22px; padding:8px 2px 0; }
  .about-person-note::after { font-size:22px; right:10px; bottom:11px; }
  .about-person-note-dave { margin-top:32px; }
  .about-page .about-shared > div:last-child { display:block; }
  .about-page .about-biography { grid-template-columns:1fr; padding-block:42px; gap:28px; }
  .about-page .about-biography > div > p { font-size:var(--ha-type-body); line-height:1.65; }
  .about-page .about-biography > div > p:first-child { font-size:var(--ha-type-lede); color:var(--ha-white); line-height:1.5; }
  .about-page .about-portrait-frame { max-width:270px; }
  .about-page .about-biography h2 { margin-top:24px; font-size:var(--ha-type-long); line-height:1.12; letter-spacing:-.03em; }
  .about-page .about-together { grid-template-columns:1fr; }
  .about-page .about-together h2 { max-width:16ch; font-size:var(--ha-type-long); line-height:1.12; letter-spacing:-.03em; }
  .about-page .about-together > div > p { font-size:var(--ha-type-body); color:var(--ha-support-on-paper); }
  .about-background summary { padding:24px 0; gap:16px; }
  .about-background summary::after { width:34px; height:34px; flex-basis:34px; font-size:24px; }
  .about-background-copy p { font-size:var(--ha-type-body); line-height:1.65; color:var(--ha-support-on-paper); }
}
@media (max-width:350px) { .about-page .about-opening h1 { font-size:var(--ha-type-page-title); line-height:1.12; letter-spacing:-.03em; } }
@media (prefers-reduced-motion:reduce) { .about-person-note,.about-background summary::after { transition:none; } }


/* A real Venn: the shared creativity stays in the overlap at every width. */
.about-highlighter { color:var(--ha-ink); font-weight:700; padding:2px 5px; background-color:transparent; -webkit-box-decoration-break:clone; box-decoration-break:clone; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 38' preserveAspectRatio='none'%3E%3Cpath fill='%23f5897c' fill-opacity='.65' d='M0 8 L21 5 L67 7 L95 3 L140 5 L182 2 L216 5 L267 4 L300 7 L298 32 L277 35 L235 32 L193 36 L149 33 L104 36 L58 33 L22 35 L2 32 Z'/%3E%3C/svg%3E"); background-size:100% 100%; }
.founder-creativity { margin:12px 0 0; background:var(--ha-ink); color:var(--ha-vapour); --ha-text:var(--ha-vapour); --ha-text-strong:var(--ha-white); --ha-text-meta:var(--ha-meta-on-dark); }
.founder-creativity summary { display:block; list-style:none; cursor:pointer; }
.founder-creativity summary::-webkit-details-marker { display:none; }
.founder-creativity summary:focus-visible { outline:4px solid var(--ha-bloom-deep); outline-offset:7px; }
.creativity-stage { position:relative; display:block; aspect-ratio:1000/660; overflow:hidden; isolation:isolate; }
.creativity-scrawl { position:absolute; left:32px; top:18px; font-size:var(--ha-type-support); font-weight:700; font-style:normal; color:var(--ha-vapour); transform:none; z-index:3; }
.creativity-venn { position:absolute; inset:0; width:100%; height:100%; z-index:-1; overflow:visible; }
.creativity-venn-tall { display:none; }
.creativity-ring { stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; transition:fill 400ms,stroke-width 400ms; }
.creativity-ring-lee { fill:color-mix(in srgb,var(--ha-lee) 13%,transparent); stroke:var(--ha-lee); }
.creativity-ring-dave { fill:color-mix(in srgb,var(--ha-dave) 24%,transparent); stroke:var(--ha-dave); }
.creativity-lens { fill:var(--ha-bloom); opacity:.82; transition:opacity 500ms; }
.creativity-retrace { fill:none; stroke:var(--ha-paper); stroke-width:1; opacity:.4; vector-effect:non-scaling-stroke; }
.creativity-rays { fill:none; stroke:var(--ha-ink); stroke-width:3; stroke-linecap:round; transform-origin:500px 330px; transform:scale(.7); opacity:0; transition:transform 650ms cubic-bezier(.2,.8,.2,1.2),opacity 350ms; }
.creativity-founder { position:absolute; top:50%; width:23%; display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center; z-index:2; transition:transform 650ms cubic-bezier(.2,.8,.2,1.2); }
.creativity-lee { left:8%; transform:translateY(-50%) rotate(-2deg); }
.creativity-dave { right:8%; transform:translateY(-50%) rotate(2deg); }
.creativity-founder > strong { font-size:27px; line-height:1.15; }
.creativity-founder > span:last-child { font-size:14px; line-height:1.5; max-width:20ch; color:var(--ha-vapour); }
.creativity-photo { padding:7px 7px 20px; background:var(--ha-paper); transform:rotate(-6deg); box-shadow:7px 7px 0 #0003; }
.creativity-photo img { display:block; width:clamp(85px,9vw,126px); height:auto; aspect-ratio:1; object-fit:cover; }
.creativity-dave .creativity-photo { transform:rotate(6deg); }
.creativity-core { position:absolute; left:50%; top:50%; width:24%; height:40%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:var(--ha-ink); z-index:1; transform:translate(-50%,-50%); --ha-text:var(--ha-support-on-paper); --ha-text-strong:var(--ha-ink); --ha-text-meta:var(--ha-support-on-paper); }
.creativity-burst { position:absolute; width:100%; height:100%; z-index:-1; fill:var(--ha-paper-face); transform:rotate(-7deg) scale(.82); opacity:0; transition:transform 700ms cubic-bezier(.2,.8,.2,1.2),opacity 300ms; }
.creativity-ai { font-size:14px; font-weight:700; padding-bottom:12px; }
.creativity-core > strong { font-size:clamp(21px,2.8vw,40px); line-height:1.06; letter-spacing:-.055em; max-width:10ch; }
.creativity-idea { position:absolute; width:95px; color:var(--ha-ink); background:var(--ha-paper-face); padding:3px 5px 9px; box-shadow:5px 6px 0 #0003; text-align:center; opacity:.45; transition:transform 650ms cubic-bezier(.2,.8,.2,1.25),opacity 400ms; }
.creativity-idea svg { display:block; width:100%; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.creativity-idea .idea-accent { stroke:var(--ha-bloom-deep); stroke-width:3; }
.creativity-idea > span { font-size:14px; font-style:italic; font-weight:800; }
.creativity-idea-sketch { left:20%; top:12%; transform:translate(18px,12px) rotate(-12deg) scale(.85); }
.creativity-idea-build { right:20%; bottom:10%; transform:translate(-18px,-12px) rotate(12deg) scale(.85); }
.creativity-idea-spark { right:18%; top:12%; transform:translate(-18px,12px) rotate(10deg) scale(.85); }
.about-page .creativity-outcome { margin:23px 0 0; font-size:var(--ha-type-subheading); font-weight:800; text-align:center; color:var(--ha-ink); letter-spacing:-.035em; }
.founder-creativity[open] .creativity-lee { transform:translate(8px,-50%) rotate(1deg); }
.founder-creativity[open] .creativity-dave { transform:translate(-8px,-50%) rotate(-1deg); }
.founder-creativity[open] .creativity-burst { transform:rotate(4deg) scale(1); opacity:.9; }
.founder-creativity[open] .creativity-rays { transform:scale(1); opacity:1; }
.founder-creativity[open] .creativity-lens { opacity:1; }
.founder-creativity[open] .creativity-ring { stroke-width:3; }
.founder-creativity[open] .creativity-idea { opacity:1; }
.founder-creativity[open] .creativity-idea-sketch { transform:translate(-8px,-4px) rotate(-9deg); }
.founder-creativity[open] .creativity-idea-build { transform:translate(8px,4px) rotate(9deg); }
.founder-creativity[open] .creativity-idea-spark { transform:translate(8px,-4px) rotate(7deg); }
@media (hover:hover) and (pointer:fine) {
  .founder-creativity summary:hover .creativity-lee { transform:translate(8px,-50%) rotate(1deg); }
  .founder-creativity summary:hover .creativity-dave { transform:translate(-8px,-50%) rotate(-1deg); }
  .founder-creativity summary:hover .creativity-burst { transform:rotate(4deg) scale(1); opacity:.9; }
  .founder-creativity summary:hover .creativity-rays { transform:scale(1); opacity:1; }
  .founder-creativity summary:hover .creativity-lens { opacity:1; }
  .founder-creativity summary:hover .creativity-ring { stroke-width:3; }
  .founder-creativity summary:hover .creativity-idea { opacity:1; }
  .founder-creativity summary:hover .creativity-idea-sketch { transform:translate(-8px,-4px) rotate(-9deg); }
  .founder-creativity summary:hover .creativity-idea-build { transform:translate(8px,4px) rotate(9deg); }
  .founder-creativity summary:hover .creativity-idea-spark { transform:translate(8px,-4px) rotate(7deg); }
}
@media (max-width:500px) {
  .creativity-stage { aspect-ratio:400/690; }
  .creativity-venn-wide { display:none; }
  .creativity-venn-tall { display:block; }
  .creativity-scrawl { left:16px; top:7px; font-size:var(--ha-type-support); font-style:normal; color:var(--ha-vapour); transform:none; }
  .creativity-founder { left:14%; right:auto; width:72%; gap:6px; }
  .creativity-lee { top:25%; }
  .creativity-dave { top:75%; }
  .creativity-founder > strong { font-size:clamp(20px,4.8vw,28px); }
  .creativity-founder > span:last-child { font-size:14px; line-height:1.5; max-width:24ch; color:var(--ha-vapour); }
  .creativity-photo { padding:5px 5px 12px; }
  .creativity-photo img { width:clamp(64px,13vw,90px); }
  .creativity-core { width:58%; height:15%; --ha-text:var(--ha-support-on-paper); --ha-text-strong:var(--ha-ink); --ha-text-meta:var(--ha-support-on-paper); color:var(--ha-ink); }
  .creativity-core > strong { font-size:clamp(21px,5.9vw,28px); max-width:12ch; }
  .creativity-ai { font-size:14px; padding-bottom:6px; }
  .creativity-burst,.creativity-idea { display:none; }
  .founder-creativity[open] .creativity-lee { transform:translate(0,-50%) rotate(1deg); }
  .founder-creativity[open] .creativity-dave { transform:translate(0,-50%) rotate(-1deg); }
}
@media (prefers-reduced-motion:reduce) {
  .founder-creativity *, .founder-creativity *::before, .founder-creativity *::after { transition:none!important; animation:none!important; }
  .creativity-idea { opacity:1; }
  .creativity-lens { opacity:1; }
  .creativity-rays { opacity:1; transform:scale(1); }
}

@media (min-width:501px) and (max-width:900px) {
  .creativity-idea { display:none; }
}

.about-person-note-lee span { color:var(--ha-lee-text); }
.about-person-note-dave span { color:var(--ha-dave); }