/* Give the still life a large, centred area at every screen width. */
#problem{scroll-margin-block-start:-94px}
#problem .scraps-composition{left:50%;top:50%;width:64%;height:90%;transform:translate(-50%,-50%)}
#problem .possibility-line{text-shadow:0 1px 3px #434734,0 0 10px #434734}
@media(min-width:600px) and (max-width:1100px){
 #problem .scraps-composition{left:50%;top:50%;width:100%;height:86%;transform:translate(-50%,-50%)}
 #problem .scraps-composition:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#434734 0%,#434734b3 16%,transparent 40%)}
 #problem .problem-heading h2{text-shadow:0 2px 8px #434734,0 0 20px #434734}
}
@media(max-width:599px){
 #problem .scraps-composition{left:50%;top:220px;width:100%;height:clamp(420px,120vw,560px);transform:translateX(-50%)}
 #problem .problem-heading h2{margin-bottom:clamp(380px,120vw,520px)}
}
@media(max-width:700px){#problem{scroll-margin-block-start:-88px}}

/* Keep the three everyday actions inside a single desktop viewport. */
@media (min-width:1101px){
 #how{height:100vh;height:100svh;min-height:0;scroll-margin-block-start:-94px;display:grid;grid-template-rows:auto minmax(0,1fr);align-items:stretch;gap:clamp(20px,3.5svh,40px);padding-block:clamp(86px,11svh,120px) clamp(24px,4.5svh,52px)}
 #how .how-content{display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:auto 1fr auto;column-gap:8%;max-width:none}
 #how .how-content>.eyebrow{grid-column:1;grid-row:1;margin:0 0 16px}
 #how .how-content h2{grid-column:1;grid-row:2/4;font-size:clamp(36px,min(4.6vw,8svh),72px);line-height:1.06;margin:0}
 #how .how-content>p:not(.eyebrow){grid-column:2;grid-row:2;align-self:end;max-width:44ch;margin:0;font-size:clamp(13px,1.75svh,16px);line-height:1.65}
 #how .how-content>.pill{grid-column:2;grid-row:3;justify-self:start;align-self:start;min-height:44px;margin:clamp(14px,2.5svh,26px) 0 0}
 #how .action-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));min-height:0;padding-top:clamp(16px,2.5svh,28px);gap:clamp(18px,2.2vw,34px)}
 #how .action-photos article{display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0;gap:clamp(12px,2svh,22px)}
 #how .action-photos img{align-self:center;justify-self:center;width:min(100%,max(96px,calc((100svh - 420px)*4/3)));height:auto;max-height:100%;min-height:0;aspect-ratio:4/3;object-fit:contain;background:transparent}
 #how .action-copy{padding-top:0}
 #how .action-copy h3{font-size:clamp(18px,2.8svh,27px);margin:8px 0}
 #how .action-copy>p{font-size:clamp(12px,1.55svh,14px);line-height:1.5}
}

/* The All collection follows the reference's portrait stack and quiet navigation. */
#local.local-collection .deck-note,#local.local-collection .deck-navigation{display:none}
#local.local-collection[data-region=all] .local-stage{height:clamp(490px,72svh,720px)}
#local.local-collection[data-region=all] .pattern-deck{inset:60px 0 112px}
#local.local-collection[data-region=all] :is(.pattern-card,.card-inner,.card-front,.card-toss){border-radius:12px}
#local.local-collection[data-region=all] .pattern-card{box-shadow:0 12px 28px #15201024}
#local.local-collection[data-region=all] .card-toss{display:block;padding:24px 26px 48px}
#local.local-collection[data-region=all] .card-toss img{height:100%;width:100%;object-fit:contain}
#local.local-collection[data-region=all] .card-name{display:none}
#local.local-collection[data-region=all] .card-details{inset:auto 12px 12px auto;width:44px;height:44px;min-height:44px;border:1px solid #43473435;background:#434734b3;color:#eeeddf}
#local.local-collection[data-region=all] .card-details:before{display:none}
#local.local-collection[data-region=all] .card-details:hover{background:#434734}
#local.local-collection[data-region=all] .deck-note{position:absolute;inset:0 auto auto 12%;display:flex;align-items:center;gap:16px;margin:0;color:#d5d9c7;pointer-events:none;font-family:var(--serif);font-size:20px;font-style:italic;line-height:1.3;transform:rotate(-7deg)}
#local.local-collection .deck-note svg{width:90px;height:50px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transform:rotate(7deg)}
#local.local-collection .deck-note-touch{display:none}
#local.local-collection[data-region=all] .deck-navigation{position:absolute;inset:auto 0 40px;display:flex;justify-content:center;align-items:center;gap:22px;z-index:5}
#local.local-collection .deck-navigation .icon-button{display:grid;place-items:center;width:46px;height:46px;min-width:46px;border:1px solid #eeeddf44;border-radius:50%;background:transparent;color:#eeeddf}
#local.local-collection .deck-navigation .icon-button:hover:not(:disabled){background:#eeeddf14;border-color:#eeeddf99}
#local.local-collection .deck-navigation .icon-button:disabled{opacity:.28}
#local.local-collection #pattern-position{min-width:52px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.12em;color:#d5d9c7}
#local.local-collection[data-view=stack] .local-stage-caption{inset:auto 0 4px;font-size:12px;line-height:1.4;letter-spacing:0}
#local.local-collection[data-region=all] .local-context{height:52px;min-height:52px;margin-top:20px}
#local.local-collection[data-region=all] .local-region-description{min-height:0}
@media(min-width:1101px){
 #local.local-collection[data-region=all]{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:8%}
 #local.local-collection[data-region=all] .local-stage{grid-column:1;grid-row:1}
 #local.local-collection[data-region=all] .local-copy{grid-column:2;grid-row:1}
 #local.local-collection[data-region=all] .local-footnote{grid-row:2}
}
@media(max-width:700px){
 #local.local-collection[data-region=all] .local-stage{height:540px}
 #local.local-collection[data-region=all] .card-toss{padding:20px 20px 46px}
 #local.local-collection[data-region=all] .deck-note{left:10%;font-size:19px}
 #local.local-collection .deck-note-pointer{display:none}
 #local.local-collection .deck-note-touch{display:inline}
 #local.local-collection[data-region=all] .local-stage-caption{padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){
 #local.local-collection .deck-navigation button{transition:none}
}