/* About: equal editorial spreads, with a furniture plan that explains the mix. */
.page-about .about-page{padding-top:104px}
.about-chapter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,6.5vw,104px);align-items:center;padding:88px var(--gutter);min-height:650px}
.about-chapter>*{min-width:0}
.about-copy{width:100%;max-width:none}
.about-copy h1{font-size:clamp(64px,6.55vw,110px);line-height:1.015;letter-spacing:-.06em;text-wrap:initial}
.about-copy h2{font-size:clamp(43px,4.55vw,72px);line-height:1.04;letter-spacing:-.05em;text-wrap:initial}
.about-copy p{font-size:17px;line-height:1.7;max-width:455px;margin-top:28px}
.about-copy p+p{margin-top:17px}
.about-copy .text-link,.about-copy .button{margin-top:32px}
.about-title-line{display:block;overflow:hidden;padding-bottom:.075em;margin-bottom:-.075em}
.about-title-line>span{display:block}
.about-photo{margin:0;overflow:hidden;height:540px;max-height:44vw;position:relative;background:#d9d9ce}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:49% center;transform:scale(1.015)}
.about-purpose{background:var(--surface-green)}
.about-purpose .about-copy{grid-column:2;grid-row:1}
.about-workspace{grid-column:1;grid-row:1;margin:0;align-self:center}
.about-plan{position:relative;width:100%;aspect-ratio:600/460}
.about-plan img{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.about-plan-note{position:absolute;left:0;right:0;bottom:5.5%;text-align:center;color:var(--ink);font-size:clamp(16px,1.6vw,22px);letter-spacing:-.03em;font-weight:500}
.about-plan-key{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:24px}
.about-plan-key a{display:inline-flex;align-items:center;gap:10px;padding:10px 0;font-size:13px;font-weight:600;line-height:1.5;border-bottom:1px solid transparent}
.about-plan-key a:hover{border-color:currentColor}
.about-plan-key a span{display:block;width:21px;height:7px;background:#cfb28d}
.about-plan-key [data-about-piece=used] span{background:#5d806a}
.about-plan-new,.about-plan-used{transition:opacity .2s ease}
.about-workspace:has([data-about-piece=new]:hover) .about-plan-used,.about-workspace:has([data-about-piece=new]:focus-visible) .about-plan-used{opacity:.24}
.about-workspace:has([data-about-piece=used]:hover) .about-plan-new,.about-workspace:has([data-about-piece=used]:focus-visible) .about-plan-new{opacity:.24}
.about-four{position:relative;min-height:460px;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;overflow:hidden}
.about-four-number{font-size:clamp(270px,31vw,470px);font-weight:400;line-height:.84;letter-spacing:-.075em;padding-right:.055em;color:var(--accent)}
.about-four-label{font-size:17px;letter-spacing:-.02em;margin-top:28px}
.about-four-lines{position:absolute;inset:20px 15px;z-index:-1;display:flex;justify-content:space-around;gap:22px;align-items:stretch}
.about-four-lines span{width:1px;background:var(--line);transform-origin:50% 100%}
.about-four-lines span:nth-child(2){margin-top:25px;margin-bottom:25px}
.about-four-lines span:nth-child(3){margin-top:50px;margin-bottom:50px}
.about-four-lines span:nth-child(4){margin-top:75px;margin-bottom:75px}
.about-chapter[data-about-state=ready] .about-plan-new{transform:translateY(-20px);opacity:.65}
.about-chapter[data-about-state=ready] .about-plan-used{transform:translateY(20px);opacity:.65}
.about-chapter[data-about-state=ready] .about-four-lines span{transform:scaleY(.55)}
.about-chapter[data-about-state=done] .about-plan-new,.about-chapter[data-about-state=done] .about-plan-used{transform:none}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.about-photo img{transition:transform .65s cubic-bezier(.22,1,.36,1)}.about-photo:hover img{transform:scale(1.055)}}
@media(prefers-reduced-motion:no-preference) and (scripting:enabled){
 .about-title-line>span{animation:about-title-arrive .85s cubic-bezier(.22,1,.36,1) both}
 .about-title-line:nth-child(2)>span{animation-delay:.09s}.about-title-line:nth-child(3)>span{animation-delay:.18s}
 .about-photo{animation:about-photo-arrive 1.1s cubic-bezier(.22,1,.36,1) both}
 .about-chapter[data-about-state=entering] .about-plan-new{animation:about-new-arrive .9s cubic-bezier(.22,1,.36,1) both}
 .about-chapter[data-about-state=entering] .about-plan-used{animation:about-used-arrive .9s cubic-bezier(.22,1,.36,1) .1s both}
 .about-chapter[data-about-state=entering] .about-four-lines span{animation:about-lines-arrive .9s cubic-bezier(.22,1,.36,1) both}
 .about-chapter[data-about-state=entering] .about-four-lines span:nth-child(2){animation-delay:.08s}.about-chapter[data-about-state=entering] .about-four-lines span:nth-child(3){animation-delay:.16s}.about-chapter[data-about-state=entering] .about-four-lines span:nth-child(4){animation-delay:.24s}
}
@keyframes about-title-arrive{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes about-photo-arrive{from{clip-path:inset(0 0 18% 0)}to{clip-path:inset(0)}}
@keyframes about-new-arrive{from{transform:translateY(-20px);opacity:.65}to{transform:none;opacity:1}}
@keyframes about-used-arrive{from{transform:translateY(20px);opacity:.65}to{transform:none;opacity:1}}
@keyframes about-lines-arrive{from{transform:scaleY(.55)}to{transform:scaleY(1)}}
@media(max-width:1100px){.about-chapter{gap:44px;padding-top:72px;padding-bottom:72px;min-height:580px}.about-photo{height:460px;max-height:none}.about-copy p{font-size:16px}.about-copy h1{font-size:clamp(60px,6.9vw,82px)}.about-four{min-height:420px}.about-four-number{font-size:340px}}
@media(max-width:940px){.page-about .about-page{padding-top:88px}.about-chapter{gap:36px}.about-copy h1{font-size:60px}.about-copy h2{font-size:43px}.about-photo{height:450px}.about-plan-key{gap:20px}.about-plan-key a{font-size:12px;gap:7px}.about-four-number{font-size:300px}}
@media(max-width:760px){
 .about-chapter{grid-template-columns:minmax(0,1fr);gap:42px;min-height:0;padding:60px 24px}
 .about-copy{max-width:560px}.about-copy h1{font-size:clamp(57px,10.8vw,76px)}.about-copy h2{font-size:clamp(40px,7.7vw,55px)}.about-copy p{font-size:15px;line-height:1.7;margin-top:24px;max-width:500px}
 .about-copy .text-link,.about-copy .button{margin-top:26px}.about-photo{height:auto;max-height:none;aspect-ratio:1.18}.about-photo img{object-position:48% center}
 .about-purpose .about-copy,.about-workspace{grid-column:auto;grid-row:auto}.about-plan-key{gap:28px;margin-top:6px}.about-plan-note{font-size:20px}
 .about-four{min-height:340px}.about-four-number{font-size:310px}.about-four-label{font-size:16px;margin-top:20px}.about-four-lines{inset:0 22px}
}
@media(max-width:359px){.about-chapter{padding-left:20px;padding-right:20px;gap:34px}.about-copy h1{font-size:53px}.about-copy h2{font-size:38px}.about-copy p{font-size:14px}.about-plan-key{gap:20px}.about-plan-key a{font-size:11px}.about-four{min-height:300px}.about-four-number{font-size:270px}}
@media(prefers-reduced-motion:reduce),(scripting:none){.about-page *{animation:none!important;transition:none!important}.about-title-line>span,.about-photo img,.about-plan-new,.about-plan-used,.about-four-lines span{transform:none!important;opacity:1!important}.about-photo{clip-path:none!important}}
@media(scripting:none){.page-about .about-page{padding-top:145px!important}}
@media(scripting:none) and (max-width:359px){.page-about .about-page{padding-top:180px!important}}

/* Bring each pair inward by equal amounts, preserving the centered spread. */
.about-opening,.about-beginnings{gap:clamp(28px,3.2vw,52px);padding-left:max(var(--gutter),calc((100vw - 1160px)/2));padding-right:max(var(--gutter),calc((100vw - 1160px)/2))}
.about-beginnings .about-copy h2{font-size:clamp(40px,4.1vw,65px)}
.about-reuse-map{width:100%;height:auto;display:block}
.about-reuse-caption{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:8px 20px 0;font-size:15px;line-height:1.5}
.about-reuse-caption b{font-weight:600}
.about-reuse-caption .text-link{font-size:12px}
.about-founders{margin:0;min-width:0;align-self:center}
.about-founders img{width:100%;height:auto}
.about-founders figcaption{display:flex;justify-content:center;gap:22px;margin-top:12px;font-size:14px;letter-spacing:-.01em;color:var(--muted)}
@media(max-width:1100px){.about-opening,.about-beginnings{gap:32px}.about-beginnings .about-copy h2{font-size:43px}.about-reuse-caption{margin:8px 0 0;gap:16px}}
@media(max-width:760px){.about-opening,.about-beginnings{padding-left:24px;padding-right:24px;gap:32px}.about-beginnings .about-copy h2{font-size:clamp(38px,7.7vw,55px)}.about-reuse-caption{font-size:13px}.about-founders figcaption{font-size:12px;gap:18px}.about-purpose{gap:32px}}
@media(max-width:359px){.about-opening,.about-beginnings{padding-left:20px;padding-right:20px}.about-reuse-caption{flex-wrap:wrap;gap:15px}.about-founders figcaption{gap:12px;font-size:11px}}

.about-opening .about-copy{align-self:start}
.about-beginnings .about-copy{padding-left:15px}
.about-reuse-caption{display:block;font-size:clamp(24px,2.5vw,36px);line-height:1.12;letter-spacing:-.035em}
.about-reuse-map{position:relative;top:5px}

/* Reduce the opening gap without changing the space inside each spread. */
@media(scripting:enabled){.page-about .about-page{padding-top:86px}}
@media(scripting:enabled) and (max-width:940px){.page-about .about-page{padding-top:70px}}

/* Keep both reuse columns balanced, with left-aligned explanatory copy. */
.about-purpose .about-copy{max-width:560px;margin-inline:auto;text-align:left;position:relative;top:-12px}
.about-purpose .about-copy p{margin-inline:0}
.about-purpose .about-workspace{width:100%;max-width:720px;margin-inline:auto;text-align:center}
.about-purpose .about-reuse-caption{text-align:left;margin-inline:0}
.about-team {
  position: relative;
  padding: 72px max(var(--gutter), calc((100vw - 1160px) / 2)) 88px;
}
.about-team::before { content: ""; position: absolute; top: 0; inset-inline: max(var(--gutter), calc((100vw - 1160px) / 2)); border-top: 1px solid rgba(36, 59, 49, .12); }
.about-team-heading { margin-bottom: 36px; text-align: center; }
.about-team-heading h2 { margin: 0 0 14px; font-size: clamp(36px, 4vw, 56px); line-height: 1.08; letter-spacing: -.045em; font-weight: 500; }
.about-team-heading p { margin: 0; font-size: 16px; color: #60716a; }
.about-team-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.about-team-member { min-width: 0; text-align: center; }
.about-team-member img { display: block; width: 100%; height: auto; aspect-ratio: 1122 / 1402; object-fit: contain; background: #cfd3d0; }
.about-team-portrait { aspect-ratio: 1122 / 1402; overflow: hidden; background: #cfd3d0; }
.about-team-member--shane img { transform: scale(1.12); transform-origin: 50% 30%; }
.about-team-member h3 { margin: 22px 0 7px; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.25; letter-spacing: -.025em; font-weight: 500; }
.about-team-role { margin: 0; font-size: 14px; line-height: 1.4; color: #137c57; }
.about-team-degree { margin: 8px 0 0; font-size: 13px; line-height: 1.4; color: #243b31; }
.about-team-bio { margin: 8px 0 0; font-size: 14px; line-height: 1.4; color: #60716a; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .about-team-member { transition: transform 280ms cubic-bezier(.22,1,.36,1); }
  .about-team-member > img, .about-team-portrait { transition: box-shadow 280ms ease; }
  .about-team-member:hover { transform: translateY(-4px); }
  .about-team-member:hover > img, .about-team-member:hover .about-team-portrait { box-shadow: 0 8px 20px rgba(36,59,49,.09); }
}
@media (max-width: 1000px) {
  .about-team { padding: 60px var(--gutter) 72px; }
  .about-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 24px; max-width: 720px; margin-inline: auto; }
}
@media (max-width: 520px) {
  .about-team { padding: 48px 24px 60px; }
  .about-team-heading { margin-bottom: 28px; }
  .about-team-grid { grid-template-columns: minmax(0, 1fr); max-width: 340px; gap: 36px; }
  .about-team-member h3 { font-size: 22px; }
}