
/* Original Plant Focus: larger, clearer range selector. */
.focus-thumbnails{gap:10px;padding-bottom:24px}
.focus-thumbnails button{padding:14px 10px 16px;border-color:#a3cad32c;background:#234c6329}
.focus-thumbnails .flow-art-frame{height:102px}
.focus-thumbnails .flow-art-frame svg{opacity:.85}
.focus-thumbnails strong{font-size:13px;line-height:1.5;margin-top:8px}
.focus-thumbnails button[aria-pressed=true]{background:#3c768c55;border-color:#9bd3dc}
.focus-project-details{background:#e5f0f4;color:#153c51}
.focus-project-details>summary{list-style:none;cursor:pointer;padding:24px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #8faebc44;font-size:16px}
.focus-project-details>summary::-webkit-details-marker{display:none}
.focus-project-details>summary:after{content:'+';font-size:26px;font-weight:400;line-height:1}
.focus-project-details[open]>summary:after{content:'−'}
.focus-project-details>summary:focus-visible{outline:2px solid #3f8296;outline-offset:-5px}
.focus-project-details .focus-plan{padding-top:28px;padding-bottom:32px}
@media(max-width:900px){.focus-thumbnails .flow-art-frame{height:90px}.focus-thumbnails strong{font-size:12px}}
@media(max-width:650px){.focus-thumbnails{gap:10px}.focus-thumbnails button{flex:0 0 145px;padding:14px 8px}.focus-thumbnails .flow-art-frame{height:94px}.focus-project-details>summary{font-size:14px;padding-block:20px}}

/* Keep the plant and its selector together within a laptop viewport. */
@media(min-width:901px){
 .focus-scene{padding-top:14px}
 .focus-heading{padding-bottom:10px;gap:20px}
 .focus-heading h1{font-size:clamp(25px,2.5vw,34px);margin:5px 0}
 .focus-heading p{font-size:11px}
 .focus-layout{gap:32px;padding:16px 0;grid-template-columns:1.25fr 1fr}
 .focus-plant>.flow-art-frame{height:clamp(260px,40svh,370px)}
 .focus-halo{width:65%}
 .focus-image-footer{padding-bottom:4px}
 .focus-copy{padding:4px 0}
 .focus-copy h2{font-size:clamp(32px,3.1vw,46px);margin:10px 0}
 .focus-copy h3{font-size:clamp(21px,2vw,27px);line-height:1.25;margin-bottom:12px}
 .focus-copy p{font-size:14px;line-height:1.65;margin-bottom:12px}
 .focus-use{padding:10px 0;margin-bottom:14px}
 .focus-use small{margin-bottom:5px}
 .focus-use span{font-size:13px;line-height:1.5}
 .focus-actions{gap:14px}
 .focus-actions .pill{padding:12px 18px}
 .focus-thumbnails{padding-bottom:16px;gap:10px}
 .focus-thumbnails button{padding:10px 8px 12px}
 .focus-thumbnails .flow-art-frame{height:clamp(70px,10svh,94px)}
 .focus-thumbnails strong{margin-top:4px;font-size:12px}
}
@media(min-width:901px) and (max-height:740px){
 .focus-heading h1{font-size:25px}.focus-heading p{display:none}
 .focus-plant>.flow-art-frame{height:260px}
 .focus-layout{padding:12px 0}.focus-copy h2{font-size:32px}
 .focus-copy h3{font-size:21px}.focus-copy p{font-size:13px;line-height:1.55}
 .focus-use{display:none}
 .focus-thumbnails .flow-art-frame{height:66px}
}

/* Give the main collection room; project planning follows below the fold. */
.focus-scene{padding-top:30px;padding-bottom:12px}
.focus-heading{align-items:flex-start;padding-bottom:18px}
.focus-heading p{padding-top:2px}
.focus-actions .pill{min-height:0;min-width:0;width:auto;padding:10px 16px;font-size:11px;line-height:1.4;gap:20px}
.focus-actions .pill span{font-size:17px;line-height:1}
@media(min-width:901px){
 .focus-scene{padding-top:32px;padding-bottom:16px}
 .focus-heading{padding-bottom:18px}
 .focus-heading h1{margin:10px 0 0}
 .focus-layout{padding:24px 0 26px}
 .focus-copy h2{margin:12px 0}
 .focus-copy h3{margin-bottom:16px}
 .focus-copy p{margin-bottom:16px}
 .focus-use{padding:12px 0;margin-bottom:18px}
 .focus-thumbnails{padding-bottom:20px}
 .focus-actions .pill{padding:10px 16px;font-size:11px}
}
@media(min-width:901px) and (max-height:740px){
 .focus-scene{padding-top:24px;padding-bottom:8px}
 .focus-heading{padding-bottom:12px}
 .focus-layout{padding:16px 0 20px}
 .focus-thumbnails{padding-bottom:14px}
}
