/* An editorial design conversation: large masked type, twelve needs and six spatial studies. */
@font-face{font-family:Kalam;src:url('/motion-study-8bdc189a81cf/assets/how-case/Kalam-Regular.ttf') format('truetype');font-display:swap;font-weight:400}
.how-process{--hp-paper:var(--paper,#f5f1e9);--hp-accent:var(--accent,#b7432c);--hp-ink:var(--ink,#292923);--hp-muted:#736e64;--hp-line:#b7ac984d;--hp-page:clamp(24px,4.7vw,90px);position:relative;height:1630svh;color:var(--hp-ink);font-family:'DM Sans',Arial,sans-serif;background:var(--hp-paper);isolation:isolate}
.how-process *{box-sizing:border-box}.how-process :is(p,h2,h3,h4,figure){margin:0}.how-process img{display:block;width:100%;max-width:100%;height:auto}.how-process button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}.how-process a{color:inherit;text-decoration:none}.how-process :is(button,a):focus-visible{outline:2px solid var(--hp-accent);outline-offset:5px}
.how-process :is(h2,h3){font-family:Fraunces,Georgia,serif;font-weight:480;letter-spacing:-.045em;font-variation-settings:'opsz' 72,'SOFT' 12,'WONK' 0;font-synthesis:none;line-height:1.02}.how-process em{font:inherit;color:var(--hp-accent)}.how-process h2 em,.how-process h3 em{font-style:italic}
.hp-stage{height:100svh;position:sticky;top:0;display:grid;grid-template-rows:116px 49px minmax(0,1fr) 74px;padding-inline:var(--hp-page);overflow:clip;background:var(--hp-paper)}
.hp-masthead{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid transparent;gap:24px}.hp-masthead h2{font-size:clamp(58px,5.3vw,100px);letter-spacing:-.055em}.hp-masthead>p{font-size:clamp(14px,1.1vw,20px);line-height:1.5;color:var(--hp-muted)}
/* A single ruled timeline, with a continuous fill across four chapter ticks. */
.hp-steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:0;overflow:visible}
.hp-steps::before{content:'';position:absolute;inset:auto 0 8px;height:1px;background:var(--hp-line)}
.hp-steps button{border:0;background:none;min-width:0;white-space:nowrap;min-height:44px;padding:0 10px 12px 0;text-align:left;font-size:clamp(12px,.88vw,16px);position:relative;color:var(--hp-muted);transition:color .2s}
.hp-steps button::before,.hp-steps button:last-child::after{content:'';position:absolute;left:0;bottom:4px;width:1px;height:9px;background:currentColor;z-index:1}
.hp-steps button:last-child::after{left:auto;right:0}
.hp-steps button[aria-current],.hp-steps button:hover{color:var(--hp-accent)}
.hp-step-track{position:absolute;left:0;right:0;bottom:8px;height:1px;pointer-events:none}
.hp-step-track i{display:block;width:100%;height:100%;background:var(--hp-accent);transform:scaleX(0);transform-origin:0 50%;will-change:transform}
.hp-chapters{position:absolute;inset:0}.hp-method-running{overflow:clip}
/* One anchored pronoun; a continuous stack of verbs opens the design conversation. */
.hp-method{position:absolute;inset:0;z-index:9;overflow:clip;background:var(--hp-paper);font-family:'DM Sans',Arial,sans-serif;--method-size:clamp(76px,11.8vw,260px);--method-row:1.15;--method-top:12%;}
.hp-method[hidden]{display:none}
.hp-method-we,.hp-method-words{font-size:var(--method-size);font-weight:550;letter-spacing:-.02em;line-height:var(--method-row)}
.hp-method-we{position:absolute;left:0;top:var(--method-top);color:var(--hp-accent)}
.hp-method-window{position:absolute;inset:var(--method-top) 0 0 29%;overflow:visible}
.hp-method-words{will-change:transform}
.hp-method-words>span{display:block;white-space:nowrap;will-change:transform;transform:translate3d(70%,0,0)}
.hp-method-caption{position:absolute;left:0;top:calc(var(--method-top) + var(--method-size)*1.35);font-size:clamp(13px,1.1vw,20px);line-height:1.4;color:var(--hp-muted)}

.hp-studio{position:relative;min-height:0}.hp-copy{position:absolute;left:0;top:clamp(24px,4vh,48px);transform:none;width:25%;opacity:0;pointer-events:none;z-index:4;will-change:opacity;transition:opacity .38s ease}.hp-copy.hp-active{pointer-events:auto}.hp-copy h3{font-size:clamp(39px,4vw,76px);text-wrap:balance}.hp-eyebrow{font-size:10px;letter-spacing:.1em;line-height:1.5;color:var(--hp-accent);font-weight:500;margin-bottom:26px!important}.hp-body{font-size:clamp(14px,1.05vw,19px);line-height:1.65;max-width:415px;margin-top:27px!important;color:#57574d}.hp-note{font-size:clamp(11px,.84vw,15px);line-height:1.65;color:var(--hp-accent);margin-top:26px!important}
.hp-desk{position:absolute;left:29%;right:0;top:3%;bottom:3%;perspective:2000px;perspective-origin:50% 45%}.hp-camera{position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d;transform-origin:50% 50%;will-change:transform}.hp-needs,.hp-analysis,.hp-moodboard,.hp-collection{position:absolute;inset:0;opacity:0;pointer-events:none}.hp-desk-label{position:absolute;left:0;top:0;font-size:9px;letter-spacing:.14em;color:var(--hp-muted)}
.hp-original{position:absolute;left:0;top:0;width:300px;transform-origin:0 0;opacity:0;will-change:transform,opacity}.hp-photo{position:relative;box-shadow:1px 8px 18px #3e302316;background:#ece5d8}.hp-original .hp-photo>img{width:300px;height:362px;object-fit:cover;border-radius:2px}.hp-photo::before{content:'';position:absolute;z-index:2;left:35%;top:-13px;width:95px;height:25px;background:#d8c7a478;transform:rotate(-5deg);clip-path:polygon(1% 5%,99% 0,96% 27%,100% 50%,97% 100%,0 95%,3% 64%,0 33%)}.hp-original figcaption{font:12px/1.5 Kalam,cursive;margin-top:14px;color:var(--hp-muted)}
.hp-needs{transform-style:preserve-3d;perspective:1400px;perspective-origin:50% 40%}
.hp-need{position:absolute;top:0;left:0;display:block;font:400 clamp(18px,1.27vw,24px)/1.24 Kalam,cursive;letter-spacing:-.03em;padding:17px 20px;width:25%;min-height:0;background:linear-gradient(174deg,#f7e6ac 0%,#f5dfa0 100%);box-shadow:1px 4px 4px #5e48100c,2px 13px 14px -11px #5e481031;opacity:0;transform-origin:50% 50%;transform-style:preserve-3d;will-change:transform,opacity;border-radius:1px 1px 8px 1px}.hp-need:nth-of-type(3n+1){background:linear-gradient(174deg,#ecebcf,#e3e4c3)}.hp-need:nth-of-type(3n+2){background:linear-gradient(174deg,#f5e0d4,#f0d8c8)}.hp-need em{font:inherit;color:var(--hp-accent)}.hp-need::before{content:'';position:absolute;inset:0 0 auto;height:19px;background:#84744505;border-bottom:1px solid #88734305}
.hp-needs-caption{position:absolute;left:0;bottom:0;font-size:10px;line-height:1.5;color:var(--hp-muted)}
.hp-designer-note{position:absolute;left:57%;width:40%;padding:20px 24px 23px;background:#faf7ed;box-shadow:0 7px 16px -12px #42331d5c;font:clamp(22px,1.75vw,33px)/1.22 Kalam,cursive;letter-spacing:-.035em;opacity:0;transform-origin:20% 20%;border-left:2px solid #b7432c29}.hp-designer-note:nth-child(1){top:5%}.hp-designer-note:nth-child(2){top:37%}.hp-designer-note:nth-child(3){top:69%}.hp-designer-note span{display:block;font-size:.69em;margin-top:8px;color:var(--hp-muted)}.hp-designer-note .hp-note-label{font:9px/1.3 'DM Sans',sans-serif;letter-spacing:.12em;margin:0 0 12px;color:var(--hp-accent)}
.hp-people{position:absolute;left:0;bottom:0;width:25%;height:clamp(110px,18vh,190px);display:flex;align-items:flex-end;justify-content:flex-start;gap:4%;pointer-events:none;opacity:0;transform-origin:50% 100%}.hp-person{position:relative;width:48%;height:100%;flex:0 0 48%;transform-origin:50% 100%}.how-process .hp-pose{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;visibility:hidden}.how-process .hp-pose-active{visibility:visible}.hp-designer{transform:scaleX(-1)}
.hp-moodboard{mix-blend-mode:multiply}.hp-palette-note{position:absolute;left:2%;top:2%;width:34%;transform:rotate(-3deg)}.hp-hand{font:clamp(22px,1.9vw,35px)/1.2 Kalam,cursive;letter-spacing:-.03em}.hp-small-hand{font-size:clamp(12px,1vw,18px);color:var(--hp-muted);margin-top:10px!important}.hp-swatches{display:flex;gap:8px;margin-top:17px}.hp-swatches i{display:block;width:40px;height:32px;background:var(--swatch);transform:rotate(-3deg);clip-path:polygon(2% 3%,98% 0,100% 90%,4% 99%,0 23%)}.hp-swatches i:nth-child(2n){transform:rotate(4deg);margin-top:5px}
.hp-collage-piece{position:absolute;width:30%;opacity:0;will-change:transform,opacity;transform-origin:50% 40%}.hp-cutout{width:100%;aspect-ratio:1.5;background:var(--hp-paper) url('/motion-study-8bdc189a81cf/assets/how-case/furniture-sketch-sheet.webp') no-repeat;background-blend-mode:multiply}.hp-cutout-cabinet{background-size:201.04712% 261.22449%;background-position:100.00000% 90.98101%;aspect-ratio:764/392}.hp-cutout-chair{background-size:236.30769% 185.50725%;background-position:90.85779% 0.00000%;aspect-ratio:650/552}.hp-cutout-rug{background-size:196.41944% 216.94915%;background-position:0.00000% 8.69565%;aspect-ratio:782/472}.hp-cutout-table{background-size:210.41096% 261.22449%;background-position:2.97767% 90.18987%;aspect-ratio:730/392}.hp-collage-piece figcaption{font:clamp(17px,1.4vw,27px)/1.2 Kalam,cursive;letter-spacing:-.035em;position:relative;margin-top:12px;padding-left:7px;transform:rotate(-1deg)}.hp-cabinet{left:39%;top:8%;width:32%}.hp-chair{left:74%;top:8%;width:26%}.hp-rug{left:39%;top:53%;width:30%}.hp-table{left:73%;top:53%;width:27%}
.hp-moodboard-caption{position:absolute;left:0;bottom:0;font-size:10px;color:var(--hp-muted)}
.hp-collection{opacity:1;transform-style:preserve-3d}.hp-direction{position:absolute;left:0;top:0;width:300px;transform-origin:0 0;opacity:0;will-change:transform,opacity;transform-style:preserve-3d}.hp-direction button{width:300px;height:402px;border:0;padding:0;background:#faf7ef;display:block;position:relative;pointer-events:auto;box-shadow:0 1px 0 #fff9,0 3px 0 #e1d9ca,0 16px 28px -12px #4b382338;border-radius:3px;transform-style:preserve-3d}.hp-direction.hp-outside button{pointer-events:none}.hp-direction button>span{pointer-events:none}.hp-study-sheet{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform-origin:50% 80%;will-change:opacity,transform;mix-blend-mode:multiply}.hp-direction .hp-study{width:300px;height:224px;object-fit:contain;mix-blend-mode:multiply}.hp-study-sheet{background:#faf7ef;padding:8px;border-radius:3px}.hp-concept-sheet{position:absolute;inset:0;overflow:hidden;border-radius:3px;transform-origin:50% 90%;will-change:transform,opacity;box-shadow:0 8px 20px #3a2d2017;background:var(--hp-paper);opacity:0}.hp-direction .hp-concept{width:300px;height:402px;object-fit:cover;transform-origin:50% 100%}.hp-card-caption{display:flex;align-items:baseline;gap:12px;margin-top:14px;line-height:1.2}.hp-card-number{font:12px 'DM Sans',sans-serif;color:var(--hp-accent)}.hp-card-caption strong{font:480 23px/1.15 Fraunces,Georgia,serif;letter-spacing:-.03em}.hp-card-detail{font:13px/1.5 'DM Sans',sans-serif;color:var(--hp-muted);padding-top:12px;opacity:0}.hp-view-all{display:inline-flex;align-items:center;gap:30px;background:none;border:0;border-bottom:1px solid var(--hp-accent);color:var(--hp-accent)!important;min-height:44px;margin-top:20px;padding:6px 0;font-size:13px!important}.hp-view-all span{font-size:20px}.hp-collection-caption{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:baseline;gap:18px;pointer-events:none;opacity:0}.hp-collection-caption>span{font-size:11px;letter-spacing:.06em;color:var(--hp-accent);white-space:nowrap}.hp-collection-caption p{font:400 clamp(16px,1.3vw,24px)/1.3 Kalam,cursive}
.hp-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--hp-line);z-index:8;background:var(--hp-paper)}.hp-scroll-cue{display:flex;align-items:center;gap:12px;font-size:11px;color:var(--hp-muted)}.hp-scroll-line{width:27px;height:1px;background:var(--hp-accent)}.hp-actions{display:flex;align-items:center;gap:28px}.hp-actions a{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;font-size:13px;white-space:nowrap}.hp-actions .hp-free{color:var(--hp-accent)}.hp-actions .hp-order{padding:13px 20px;background:var(--hp-accent);color:var(--hp-paper);border-radius:4px}.hp-actions a span{font-size:20px}
.hp-gallery{border:0;background:var(--hp-paper);color:var(--hp-ink);border-radius:9px;width:min(1250px,94vw);max-width:none;max-height:94svh;padding:30px;overscroll-behavior:contain}.hp-gallery::backdrop{background:#25231ced}.hp-gallery-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.hp-gallery-head .hp-eyebrow{margin-bottom:10px!important}.hp-gallery-head h3{font-size:36px}.hp-close{font-size:32px!important;border:1px solid var(--hp-line);border-radius:50%;width:46px;height:46px;background:none;flex-shrink:0}.hp-gallery-select{display:flex;gap:12px;overflow:auto;padding:20px 0}.hp-gallery-select button{width:62px;flex-shrink:0;padding:0 0 4px;border:2px solid transparent;border-radius:5px;background:none;overflow:hidden}.hp-gallery-select button[aria-pressed=true]{border-color:var(--hp-accent)}.hp-gallery-select img{height:62px;object-fit:cover}.hp-gallery-select span{display:block;font-size:11px;line-height:1.4;padding-top:4px}.hp-gallery-pair{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}.hp-gallery-pair img{max-height:52svh;object-fit:contain}.hp-gallery-pair figure:first-child img{mix-blend-mode:multiply}.hp-gallery-pair figcaption{font-size:11px;margin-top:12px;color:var(--hp-muted)}.hp-gallery-name{font:480 25px Fraunces,Georgia,serif;margin-top:22px!important;color:var(--hp-accent)}.hp-gallery-detail{font-size:13px;line-height:1.6;margin-top:12px!important}.hp-noscript{padding:30px;font-size:17px;line-height:1.6}
/* Each viewport gets a composed desk, with text and drawings in separate reading areas. */
@media(min-width:701px) and (max-height:800px){
.hp-stage{grid-template-rows:96px 46px minmax(0,1fr) 64px}.hp-masthead h2{font-size:64px}
.hp-copy h3{font-size:clamp(34px,3.8vw,57px)}.hp-eyebrow{font-size:8px;margin-bottom:18px!important}.hp-body{font-size:13px;line-height:1.55;margin-top:18px!important}.hp-note{font-size:11px;margin-top:20px!important}
.hp-need{font-size:17px;min-height:0;padding:13px 15px}.hp-designer-note{font-size:23px;padding:13px 17px}.hp-designer-note .hp-note-label{margin-bottom:7px;font-size:8px}
.hp-collage-piece figcaption{font-size:18px;margin-top:8px}.hp-swatches i{width:30px;height:24px}.hp-hand{font-size:25px}.hp-scroll-cue{font-size:10px}.hp-actions a{font-size:12px}.hp-needs-caption,.hp-moodboard-caption{font-size:9px}
}
/* Complete display lines retain their scale within a clear reading area. */
.hp-title-line{display:block;line-height:inherit;padding:.15em .08em .25em 0;margin-bottom:-.40em;overflow:hidden}
.hp-title-line:last-child{margin-bottom:0}
.hp-title-line>span{display:inline-block;vertical-align:top;white-space:nowrap}
@media(min-width:1001px){
  .hp-copy{width:34%;top:clamp(18px,3vh,34px)}
  .hp-copy h3{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(70px,min(7.5vw,13.4svh),150px);font-weight:560;letter-spacing:-.028em;word-spacing:.055em;line-height:.92;text-wrap:initial;text-transform:uppercase}
  .hp-copy h3 em{font-family:Fraunces,Georgia,serif;font-weight:560;font-size:1.10em;font-style:italic;letter-spacing:-.045em;word-spacing:.075em;text-transform:none;font-variation-settings:'opsz' 100,'SOFT' 5,'WONK' 1}
  .hp-title-line{--hp-line-delay:0;overflow:clip}
  .hp-title-line:nth-child(2){--hp-line-delay:.13}
  .hp-title-line:nth-child(3){--hp-line-delay:.25}
  .hp-title-line>span{will-change:transform}
  .hp-eyebrow{font-size:clamp(10px,.67vw,13px);letter-spacing:.08em;margin-bottom:28px!important}
  .hp-body{width:365px;max-width:100%;font-size:clamp(15px,1.08vw,20px);line-height:1.55;margin-top:36px!important}
  .hp-note{width:380px;max-width:100%;font-size:clamp(11px,.85vw,16px);line-height:1.55;margin-top:24px!important}
  .hp-desk{left:39%;top:3%;bottom:3%}
  .hp-closing .hp-title-line:last-child{font-size:.52em;letter-spacing:-.035em;line-height:1.05;margin-top:.5em;margin-bottom:0;padding:.1em 0}
  .hp-closing h3{font-size:clamp(66px,min(6.55vw,11.8svh),128px)}
  .hp-stage[data-collection-phase="studies"] .hp-overview h3{font-size:clamp(64px,min(5.2vw,10.1svh),102px)}
  .hp-stage[data-collection-phase="develop"] .hp-overview h3,.hp-stage[data-collection-phase="concept"] .hp-overview h3{font-size:clamp(66px,min(5.75vw,10.6svh),110px)}
  .hp-overview .hp-body,.hp-closing .hp-body{width:350px;max-width:100%}
  .hp-closing :is(.hp-body,.hp-note){width:500px;max-width:100%}
  .hp-need{background:#eee6d8;box-shadow:none;border-radius:0;padding:14px 18px!important;border-top:1px solid #b7ac983d;font-size:clamp(17px,1.18vw,23px)!important;line-height:1.24}
  .hp-need:nth-of-type(3n+1){background:#ece8dc}.hp-need:nth-of-type(3n+2){background:#f0e3d9}
  .hp-need::before{display:none}
  .hp-people{width:22%}
  .hp-desk-label{font-size:13px;line-height:1.3;letter-spacing:0;top:-12px}
  .hp-needs-caption{font-size:11px}
}
@media(min-width:1001px) and (max-height:800px){
  .hp-eyebrow{margin-bottom:19px!important}.hp-body{margin-top:25px!important;font-size:14px;max-width:300px}.hp-note{margin-top:18px!important;font-size:11px}
  .hp-need{font-size:16px!important;padding:10px 14px!important}.hp-people{display:none}
}
@media(max-width:1000px) and (min-width:701px){
.hp-copy{width:24%}.hp-copy h3{font-size:34px}.hp-body{font-size:12px}.hp-need{font-size:16px;padding:12px;min-height:104px}.hp-designer-note{font-size:20px;padding:12px}.hp-collage-piece figcaption{font-size:16px}.hp-masthead>p{font-size:13px}
}
@media(max-width:700px){
.how-process{--hp-page:20px;height:2000svh}.hp-stage{grid-template-rows:77px 45px minmax(0,1fr) 76px}.hp-masthead h2{font-size:43px;white-space:nowrap}.hp-masthead>p{display:none}.hp-steps{gap:0}.hp-steps button{font-size:11px}
.hp-copy{left:0;top:10px;transform:none;width:100%}.hp-copy h3{font-size:clamp(32px,9vw,41px);line-height:1.02}.hp-copy h3 br{display:none}.hp-copy h3 em{margin-left:.1em}.hp-eyebrow{font-size:8px;margin-bottom:10px!important}.hp-body{font-size:12px;line-height:1.55;margin-top:11px!important;max-width:360px}.hp-note{font-size:10px;margin-top:11px!important;line-height:1.4}.hp-opening .hp-note,.hp-thinking .hp-note,.hp-overview .hp-note{display:none}
.hp-desk{left:0;right:0;top:154px;bottom:9px}.hp-desk-label{font-size:7px;letter-spacing:.1em}.hp-original figcaption{font-size:15px;line-height:1.2;max-width:265px}
.hp-need{font-size:17px;line-height:1.24;width:47%;min-height:96px;padding:13px 14px;letter-spacing:-.03em}.hp-needs-caption{font-size:8px;line-height:1.4;max-width:310px}
.hp-designer-note{font-size:18px;line-height:1.2;left:53%;width:47%;padding:12px 13px}.hp-designer-note:nth-child(1){top:4%}.hp-designer-note:nth-child(2){top:37%}.hp-designer-note:nth-child(3){top:70%}.hp-designer-note span{font-size:.76em;margin-top:6px}.hp-designer-note .hp-note-label{font-size:7px;letter-spacing:.07em;margin:0 0 6px}
.hp-people{left:0;width:46%;height:auto;bottom:auto;justify-content:center}.hp-person{width:48%;height:100%}
.hp-palette-note{top:0;left:0;width:49%}.hp-hand{font-size:23px}.hp-small-hand{font-size:13px;max-width:150px;line-height:1.25}.hp-swatches{gap:5px;margin-top:11px}.hp-swatches i{width:24px;height:21px}.hp-collage-piece figcaption{font-size:16px;line-height:1.18;letter-spacing:-.04em;margin-top:8px;padding-left:2px}.hp-moodboard-caption{font-size:8px;bottom:-1px}
.hp-view-all{font-size:10px!important;min-height:30px;margin-top:8px;gap:20px}.hp-collection-caption{bottom:0;gap:8px}.hp-collection-caption>span{font-size:8px}.hp-collection-caption p{font-size:13px}
.hp-footer{display:grid;grid-template-columns:1fr;align-content:center;gap:3px}.hp-actions{gap:12px;justify-content:space-between;grid-row:1}.hp-actions a{font-size:10px;gap:8px;min-height:42px}.hp-actions .hp-order{padding:10px}.hp-actions a span{font-size:16px}.hp-scroll-cue{font-size:8px;justify-content:center;gap:8px}.hp-scroll-line{width:15px}
.hp-gallery{width:calc(100vw - 16px);padding:20px}.hp-gallery-head h3{font-size:29px}.hp-gallery-head .hp-eyebrow{font-size:8px}.hp-gallery-select{gap:8px}.hp-gallery-select button{width:43px}.hp-gallery-select img{height:43px}.hp-gallery-pair{grid-template-columns:1fr;gap:24px}.hp-gallery-pair img{max-height:none}.hp-gallery-name{font-size:23px}
}
@media(max-width:360px){
.how-process{--hp-page:16px}.hp-stage{grid-template-rows:67px 43px minmax(0,1fr) 70px}.hp-masthead h2{font-size:37px}.hp-steps{gap:0}.hp-steps button{font-size:10px}.hp-copy{top:5px}.hp-copy h3{font-size:29px}.hp-body{font-size:11px;line-height:1.45;margin-top:8px!important}.hp-eyebrow{font-size:7px;margin-bottom:8px!important}.hp-note{font-size:9px;margin-top:9px!important}
.hp-need{font-size:15px;min-height:83px;padding:10px 11px}.hp-designer-note{font-size:16px;padding:10px 11px}.hp-collage-piece figcaption{font-size:13px}.hp-hand{font-size:20px}.hp-small-hand{font-size:11px}.hp-actions a{font-size:9px;gap:5px}.hp-actions .hp-order{padding:8px}.hp-view-all{min-height:26px;font-size:9px!important}.hp-palette-note .hp-hand{font-size:17px;white-space:nowrap}.hp-palette-note .hp-small-hand,.hp-original figcaption{display:none}
}
/* Reduced motion keeps the entire notebook readable without pinned scenes. */
.how-process.hp-reduced{height:auto}.hp-reduced .hp-stage{position:relative;height:auto;display:block;overflow:visible}.hp-reduced .hp-masthead{min-height:110px}.hp-reduced :is(.hp-steps,.hp-scroll-cue,.hp-collection-caption){display:none}.hp-reduced .hp-studio{display:flex;flex-direction:column;gap:30px;padding-block:40px}.hp-reduced .hp-copy{position:relative;inset:auto;transform:none;width:100%;max-width:730px;opacity:1!important;pointer-events:auto}.hp-reduced .hp-desk{position:relative;inset:auto!important;display:contents}.hp-reduced .hp-opening{order:0}.hp-reduced .hp-needs{order:1;position:relative;inset:auto;opacity:1!important;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding-block:40px}.hp-reduced .hp-need{position:relative!important;left:auto!important;top:auto!important;width:auto!important;transform:none!important;opacity:1!important;clip-path:none!important;font-size:24px}.hp-reduced .hp-needs-caption{position:relative;grid-column:1/-1}.hp-reduced .hp-original{order:2;position:relative;inset:auto!important;transform:none!important;width:100%;max-width:300px;opacity:1!important}.hp-reduced .hp-people{display:none}.hp-reduced .hp-thinking{order:3}.hp-reduced .hp-analysis{order:4;position:relative;opacity:1!important;display:flex;gap:30px}.hp-reduced .hp-designer-note{position:relative;inset:auto;opacity:1!important;transform:none!important;font-size:26px;width:33%}.hp-reduced .hp-moodboard{order:5;position:relative;opacity:1!important;height:auto;max-width:1000px;transform:none!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}.hp-reduced .hp-palette-note{position:relative;inset:auto;width:100%;grid-column:1/-1;opacity:1!important;transform:none}.hp-reduced .hp-collage-piece{position:relative;left:auto!important;top:auto!important;width:100%!important;opacity:1!important;transform:none!important}.hp-reduced .hp-overview{order:6}.hp-reduced .hp-collection{order:7;clip-path:none!important;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;pointer-events:auto}.hp-reduced .hp-direction{position:relative;inset:auto;transform:none!important;width:100%;opacity:1!important;pointer-events:auto}.hp-reduced .hp-direction button{width:100%;height:auto!important;pointer-events:auto}.hp-reduced :is(.hp-study-sheet,.hp-concept-sheet){position:relative;inset:auto;width:100%;height:auto;opacity:1!important;transform:none!important}.hp-reduced .hp-direction :is(.hp-concept,.hp-study){width:100%;height:auto}.hp-reduced .hp-card-caption{transform:none!important;opacity:1!important}.hp-reduced .hp-card-detail{opacity:1!important;font-size:13px!important}.hp-reduced .hp-closing{order:8;margin-top:30px}.hp-reduced .hp-footer{min-height:90px}.hp-reduced .hp-view-all{display:none}
@media(max-width:700px){.hp-reduced .hp-needs{grid-template-columns:1fr 1fr;gap:16px}.hp-reduced .hp-need{font-size:20px}.hp-reduced .hp-analysis{flex-direction:column}.hp-reduced .hp-designer-note{width:100%;max-width:none}.hp-reduced .hp-moodboard{height:auto;gap:24px}.hp-reduced .hp-collection{grid-template-columns:1fr;gap:40px}.hp-reduced .hp-direction{max-width:330px;margin:auto}}

.hp-reduced .hp-direction button{transform:none!important}.hp-reduced .hp-collection{opacity:1!important}.hp-reduced .hp-collection,.hp-reduced .hp-desk{transform:none!important;clip-path:none!important}.hp-reduced .hp-card-detail{width:auto!important;margin-left:0!important}

/* The reduced layout shares content but has no camera, depth stack, masks or scroll follow-through. */
.hp-reduced .hp-camera{display:contents;transform:none!important}
.hp-reduced .hp-copy{clip-path:none!important;translate:none!important}
.hp-reduced .hp-direction :is(.hp-concept-sheet,.hp-concept){clip-path:none!important;transform:none!important;visibility:visible!important}
.hp-reduced .hp-direction button{box-shadow:none;background:none}

/* One actual room occupies the visual field; copy and labels remain outside its canvas. */
.hp-volume{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:3;display:grid;grid-template-rows:minmax(0,1fr) 28px;gap:7px;margin:0}
/* Complete the desktop model/study crossfade instead of freezing two silhouettes together. */
@media(min-width:701px) and (prefers-reduced-motion:no-preference){.hp-volume,.hp-direction[data-direction="05"]{transition:opacity 160ms linear}}
.hp-volume-view{position:relative;min-height:0;overflow:hidden;border-radius:3px}
.hp-volume iframe,.hp-volume-poster{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain}
.how-process .hp-volume-poster{inset:50% auto auto 50%;width:auto;height:100%;max-width:100%;aspect-ratio:1800/1344;transform:translate(-50%,-50%);clip-path:var(--study-outline);mix-blend-mode:normal;filter:none}
.hp-volume iframe{opacity:0;transition:opacity .35s}.hp-volume.room-ready iframe{opacity:1}.hp-volume.room-ready .hp-volume-poster{opacity:0}
.hp-volume figcaption{display:flex;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:.04em;line-height:1.6;color:var(--hp-muted);padding-inline:8px}
.hp-volume figcaption span{opacity:.75}.hp-reduced .hp-volume{display:none}
/* Actual-size cards keep captions crisp; Motion sequences move the enclosing masks and images. */
.hp-camera{z-index:4}
.hp-direction{will-change:transform,opacity;transform-style:flat}
.hp-direction button{width:100%;overflow:hidden;transform-style:flat;background:transparent;box-shadow:none}
.hp-direction .hp-study,.hp-direction .hp-concept{width:100%;height:100%;object-fit:contain}
.hp-study-sheet{padding:0;background:transparent;mix-blend-mode:normal}.hp-direction .hp-study{mix-blend-mode:normal;filter:none;clip-path:var(--study-outline);height:auto;max-height:100%;aspect-ratio:1800/1344}
.hp-concept-sheet{opacity:1;box-shadow:none;clip-path:none;will-change:transform;visibility:hidden}
.hp-direction .hp-concept{object-fit:cover;will-change:transform}
.hp-card-caption{gap:6px;margin-top:8px}.hp-card-caption strong{min-width:0;font-size:17px}
.hp-card-number{flex-shrink:0}.hp-card-detail{position:absolute;top:100%;left:0;right:0;font-size:12px;line-height:1.5}
.hp-need{min-height:0}.hp-needs-caption{z-index:20;bottom:0}
.hp-reduced .hp-direction{width:100%!important}.hp-reduced .hp-direction button{height:auto!important;aspect-ratio:auto;overflow:visible}
.hp-reduced .hp-direction :is(.hp-concept,.hp-study){width:100%;height:auto}.hp-reduced .hp-card-detail{position:static}
@media(min-width:701px){.hp-need{font-size:clamp(16px,1.28vw,25px);padding:15px 18px}}
@media(max-width:700px){.hp-overview h3{min-height:2.04em}.hp-overview h3 br{display:initial}.hp-overview h3 em{margin-left:0}.hp-overview .hp-body{min-height:3.1em}.hp-collection-caption{display:none}.hp-card-caption{gap:4px}.hp-card-number{font-size:8px!important}.hp-card-caption strong{font-size:10px!important}.hp-need{font-size:18px;padding:12px 15px}.hp-reduced .hp-overview h3,.hp-reduced .hp-overview .hp-body{min-height:0}}
@media(max-width:360px){.hp-need{font-size:16px;padding:10px 12px}}
@media(max-width:700px){.hp-volume{inset:0 -12px 0;grid-template-rows:minmax(0,1fr) 30px}.hp-volume figcaption{font-size:9px;letter-spacing:0;padding-inline:12px}.hp-stage[data-collection-phase="room"] .hp-view-all{visibility:hidden}}

/* SU illustrations retain their exact room silhouettes; no rectangular card backing. */
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="01"]{--study-outline:polygon(20.16667% 4.31548%,82.27778% 4.31548%,87.55556% 78.19940%,82.22222% 96.50298%,19.33333% 96.50298%,20.16667% 79.83631%,15.11111% 59.37500%)}
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="06"]{--study-outline:polygon(21.05556% 3.42262%,82.66667% 3.42262%,90.66667% 79.24107%,83.88889% 97.32143%,18.61111% 97.32143%,9.33333% 76.86012%)}
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="03"]{--study-outline:polygon(12.50000% 5.58036%,81.72222% 5.50595%,81.77778% 8.11012%,72.33333% 24.10714%,86.72222% 24.10714%,87.22222% 85.49107%,59.66667% 85.41667%,60.72222% 88.69048%,61.33333% 91.44345%,61.33333% 95.46131%,11.16667% 95.31250%,11.22222% 85.63988%,12.00000% 85.04464%,12.50000% 20.01488%,12.33333% 19.64286%)}
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="04"]{--study-outline:polygon(21.77778% 5.80357%,81.33333% 5.80357%,90.27778% 77.67857%,80.27778% 96.50298%,20.50000% 96.50298%,20.22222% 95.90774%,21.66667% 82.14286%,12.44444% 61.38393%)}
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="02"]{--study-outline:polygon(24.22222% 5.87798%,80.22222% 5.87798%,87.16667% 88.31845%,79.72222% 95.23810%,23.44444% 95.23810%,15.66667% 88.39286%)}
:is(.hp-direction,.hp-gallery,.hp-volume-poster)[data-direction="05"]{--study-outline:polygon(21.44444% 4.46429%,82.05556% 4.46429%,91.33333% 83.70536%,81.66667% 96.27976%,22.22222% 96.27976%,21.83333% 95.68452%,23.27778% 81.84524%,21.27778% 78.19940%,11.33333% 63.54167%)}

.hp-gallery [data-gallery-study]{clip-path:var(--study-outline);mix-blend-mode:normal;width:100%;height:auto;max-height:none}

@media(max-width:1000px){.hp-title-line{display:inline;overflow:visible;padding:0;margin:0}.hp-title-line>span{display:inline}.hp-title-line+.hp-title-line::before{content:' '}.hp-overview .hp-title-line{display:block}.hp-overview .hp-title-line+.hp-title-line::before{content:none}}
.hp-reduced .hp-title-line>span{transform:none!important}.hp-reduced .hp-volume{mask-image:none}

@media(min-width:1001px) and (prefers-reduced-motion:no-preference){
  .hp-copy.hp-active .hp-title-line>span{animation:hp-type-arrive .55s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--hp-line-delay) * .4s)}
  @keyframes hp-type-arrive{from{transform:translate3d(0,105%,0)}to{transform:translate3d(0,0,0)}}
}

/* Restore the paired color shutters inside the pinned chapter, after the previous case leaves. */
.how-process.hp-has-entrance{--hp-entrance-screens:1.35;--hp-method-screens:1.6}
.how-process.hp-has-entrance:not(.hp-reduced){height:calc(1630svh + 100svh * (var(--hp-entrance-screens) + var(--hp-method-screens)))}
.hp-has-entrance .hp-masthead>p,.hp-has-entrance .hp-steps,.hp-has-entrance .hp-studio,.hp-has-entrance .hp-footer{opacity:var(--hp-content-reveal,0)}

.hp-entrance{position:absolute;inset:0;z-index:10;pointer-events:none;isolation:isolate}
.hp-entrance[hidden]{display:none}
.hp-entrance-paper,.hp-entrance-ink{position:absolute;inset:0}
.hp-entrance-paper{background:var(--hp-paper)}
.hp-entrance-ink{background:var(--hp-accent);z-index:2;clip-path:inset(100% 0 0);will-change:clip-path}
.how-process .hp-entrance-title{position:absolute;white-space:nowrap;letter-spacing:-.055em;transform-origin:0 0;will-change:transform}
.hp-entrance-ink .hp-entrance-title,.hp-entrance-ink .hp-entrance-title em{color:var(--hp-paper);background:none;-webkit-text-fill-color:currentColor}
@media(max-width:700px){
 .how-process.hp-has-entrance{--hp-entrance-screens:.9;--hp-method-screens:1.25}
 .how-process.hp-has-entrance:not(.hp-reduced){height:calc(2000svh + 100svh * (var(--hp-entrance-screens) + var(--hp-method-screens)))}
}
.hp-reduced .hp-entrance{display:none}
/* Normal flow keeps the outgoing case and its actions intact throughout departure. */
.story-integrated .how-process.hp-has-entrance{border-top:0;scroll-margin-top:0}

@media(max-width:700px){
 .hp-method{--method-size:clamp(38px,10.5vw,73px);--method-top:22%;--method-row:1.8}
 .hp-method-window{left:23%}.hp-method-we{line-height:1.8}
 .hp-method-caption{top:calc(var(--method-top) + var(--method-size)*2.4);font-size:10px;max-width:20%}
 .hp-steps button{font-size:10px;padding-right:2px}
}
@media(min-width:701px) and (max-height:800px){.hp-method{--method-size:clamp(76px,10vw,160px);--method-top:6%}}
.hp-reduced .hp-method{display:none}.hp-reduced .hp-chapters{display:contents;opacity:1!important;transform:none!important}
