/* Board stories now live in the page, with the same interactive scene. */
.how-i-work{margin:clamp(56px,7vw,112px) 0 clamp(72px,9vw,144px);scroll-margin-top:120px}
.about-subsection-heading{font:300 clamp(28px,3.2vw,46px)/1.05 'FAIRE Octave Trial Variable',serif;font-variation-settings:'wght' 300,'opsz' 12;font-feature-settings:'dlig' 1,'ss01' 1,'ss06' 1,'ss11' 1,'ss14' 1;text-transform:uppercase;letter-spacing:0;margin:0 0 clamp(32px,4vw,60px);color:var(--ink)}
.work-board-card{--card-inset:clamp(28px,4.5vw,72px);width:calc(100% + var(--card-inset) * 2);margin-inline:calc(-1 * var(--card-inset));display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,.66fr);gap:clamp(20px,3vw,48px);align-items:center;min-height:clamp(440px,36vw,560px);border-radius:24px;background:color-mix(in srgb,var(--paper) 91%,var(--ink));overflow:hidden;color:var(--ink)}
html[data-edition=sketch] .work-board-card{background:var(--sketch-surface,#eeedea)}
.work-board-copy{padding:clamp(36px,4.5vw,72px) 0 clamp(36px,4.5vw,72px) clamp(28px,4.5vw,72px);min-width:0}
.work-board-story{min-height:300px}
.work-board-story h3{font:300 clamp(30px,3.1vw,46px)/1.05 'FAIRE Octave Trial Variable',serif;font-variation-settings:'wght' 300,'opsz' 12;font-feature-settings:'dlig' 1,'ss01' 1,'ss06' 1,'ss11' 1,'ss14' 1;text-transform:uppercase;letter-spacing:0;margin:0 0 clamp(24px,3vw,40px)}
.work-board-cue,.work-board-description{font:300 16px/1.5 'ABC Oracle',Arial,sans-serif;text-wrap:pretty;margin:0}
.work-board-cue{font-weight:600;margin-bottom:6px}
.work-board-navigation{display:flex;align-items:center;gap:clamp(36px,4.5vw,80px);margin-top:28px}
.work-board-navigation button{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:color-mix(in srgb,var(--ink) 7%,transparent);padding:0;cursor:pointer;color:inherit;transition:background .2s,opacity .2s}
.work-board-navigation svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.work-board-navigation button:hover{background:color-mix(in srgb,var(--ink) 13%,transparent)}
.work-board-navigation button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.work-board-navigation button:disabled{opacity:.35;cursor:default}
.work-board-visual{position:relative;min-width:0;width:100%;height:clamp(370px,35vw,540px);align-self:center}
.work-board-scene{position:absolute;inset:-4% 0 30px -12px}
.work-board-scene queen-scene{opacity:1;pointer-events:auto}
.work-board-hint{position:absolute;bottom:12px;inset-inline:16px;margin:0;text-align:center;font:300 12px/1.4 'ABC Oracle',Arial,sans-serif;opacity:.65;pointer-events:none}
.home-about .working-glass.role-carousel{margin-top:0}
.team-section-heading{margin-bottom:clamp(32px,4vw,60px)}
.services-feature>.about-subsection-heading{margin-bottom:0}
/* A passive instruction uses the exact Download CV shell and inset fill. */
.octave-home .style-picker-board .piece-prompt.hero-action{position:absolute;left:50%;width:max-content;max-width:calc(100% - 32px);height:54px;min-height:54px;padding:4px 26px;translate:-50% 0;font:300 15px/1 'ABC Oracle',Arial,sans-serif;text-transform:none;letter-spacing:0;cursor:default;pointer-events:none;user-select:none;transition:opacity .24s}
.octave-home .style-picker-board .piece-prompt.is-visible{opacity:1!important}
@media(max-width:679px){.octave-home .style-picker-board .piece-prompt.hero-action{height:48px;min-height:48px;font-size:14px;padding-inline:22px}}
@media(max-width:1000px) and (min-width:761px){.work-board-card{grid-template-columns:minmax(0,.4fr) minmax(0,.6fr);gap:20px}.work-board-copy{padding-left:32px}.work-board-story h3{font-size:32px}.work-board-story{min-height:320px}}
@media(max-width:760px){
 .work-board-card{width:100%;margin-inline:0;grid-template-columns:minmax(0,1fr);gap:0;border-radius:20px;min-height:0}
 .work-board-copy{padding:32px 28px 0}
 .work-board-story{min-height:250px}
 .work-board-story h3{font-size:34px;margin-bottom:24px}
 .work-board-description,.work-board-cue{font-size:16px}
 .work-board-navigation{margin-top:24px;gap:36px}
 .work-board-visual{height:clamp(270px,67vw,450px)}
 .work-board-scene{inset:0 0 28px}
 .work-board-hint{bottom:18px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){.work-board-navigation button{transition:none}}

/* Wider landscape layouts give the board room to cross the card's right edge. */
@media(min-width:1000px) and (min-aspect-ratio:6/5){
 .work-board-card{overflow:visible}
 .work-board-copy{position:relative;z-index:1}
 .work-board-visual{height:clamp(400px,37vw,580px)}
 .work-board-scene{inset:-7% calc(-1 * min(7vw,110px)) 30px -24px}
 .work-board-hint{right:calc(-1 * min(7vw,110px));left:-24px}
}

/* Let mobile board stories hug their copy instead of reserving the longest bio. */
@media(max-width:760px){
 .work-board-copy{padding:24px 22px 0}
 .work-board-story{min-height:0}
 .work-board-story h3{font-size:28px;line-height:1.02;margin-bottom:16px}
 .work-board-description,.work-board-cue{font-size:14px;line-height:1.45}
 .work-board-navigation{margin-top:18px}
 .work-board-visual{height:clamp(220px,56vw,340px)}
 .work-board-hint{bottom:10px}
}

.work-board-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
/* Keep the board immediately beneath the story controls on narrow screens. */
@media(max-width:760px){.work-board-visual{height:clamp(170px,38vw,250px)}.work-board-scene{inset:-10px 0 24px}.work-board-hint{bottom:6px}}
/* Keep the visual instruction available to assistive tech without a caption. */
.work-board-hint{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(min-width:761px){
 .work-board-card{gap:12px;grid-template-columns:minmax(0,.36fr) minmax(0,.64fr)}
 .work-board-scene{inset:-4% 0 0 -40px}
}
@media(min-width:1000px) and (min-aspect-ratio:6/5){.work-board-scene{inset:-7% -40px 0 -66px}}
@media(max-width:760px){
 .work-board-copy{padding-top:40px}
 .work-board-visual{margin-top:-18px}
 .work-board-scene{inset:-10px 0 0}
}