@import url("style-v2.css");
/* Selected work: complete pages, focused motion and readable packaging details. */
.store-showcase{background:#e7ece7;padding:25px 19px 19px}
.showcase-top{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;color:#607569;margin-bottom:29px}
.showcase-top .micro{font-size:8px}.store-showcase img{width:100%;height:auto}
.store-notes{display:flex;flex-wrap:wrap;gap:10px 20px;border-top:1px solid #cbd6cc;padding-top:19px;margin-top:24px;font-size:10px;color:#6c7b70}
.example-link{font-size:11px;margin-top:21px;gap:25px}
.capability-ae .capability-body{display:block}
.capability-ae .capability-copy .lead{max-width:760px}
.capability-ae .ability-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.motion-pair{display:grid;grid-template-columns:1fr 1fr;gap:23px;margin-top:30px}
.motion-card{margin:0;background:#e8e7ed;min-width:0}
.motion-card-image{position:relative;padding:22px;display:grid;place-items:center}
.motion-card-image img{display:block;width:100%;max-height:535px;height:auto;object-fit:contain}
.gif-badge{position:absolute;top:33px;left:33px;background:#f7f7f0e8;color:#374b44;padding:6px 9px;font:9px Arial;letter-spacing:.11em}
.motion-card figcaption{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:17px 22px;border-top:1px solid #d0d0d8}
.motion-card figcaption strong{display:block;font-size:15px;font-weight:500;margin-bottom:6px}
.motion-card figcaption div>span{font-size:10px;color:#777483}
.motion-toggle{border:1px solid #b9c7bd;padding:8px 11px;font-size:11px;white-space:nowrap;min-height:36px;cursor:pointer}
.motion-toggle:hover{background:#f6f7f1}
.cup-showcase{background:#eae8e2;padding:16px}
.cup-showcase>.image-trigger img{width:100%;height:auto;max-height:440px;object-fit:contain}
.cup-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px;padding-top:15px;border-top:1px solid #d1d0c5}
.cup-details img{width:100%;height:auto;object-fit:contain}
.capability-brief{display:grid;grid-template-columns:.85fr 1.15fr;gap:35px;align-items:start;padding-block:29px}
.capability-brief:last-child{padding-bottom:38px}
.capability-brief .tool-title h3{font-size:21px}
.brief-copy>p{font-size:12px;color:var(--muted);line-height:1.95;margin:0}
.brief-copy .deliverables{margin-top:12px}
.cup-cover{height:100%;padding:30px 35px 22px;display:grid;place-items:center}
.cup-cover img{height:100%;max-height:305px;width:100%;object-fit:contain;transition:transform .3s}
.wrap-stage:hover .cup-cover img{transform:translateY(-3px)}
.single-poster{display:grid;grid-template-columns:1.05fr .7fr;gap:26px;height:100%;align-items:center;padding:45px 37px 42px}
.single-poster>img{height:100%;max-height:279px;width:100%;object-fit:contain;transform:rotate(-4deg);filter:drop-shadow(0 9px 12px #26312a16)}
.series-cover-note{display:flex;flex-direction:column;align-items:flex-start;color:#597469;gap:9px}
.series-cover-note .micro{font-size:8px;line-height:1.8}
.series-cover-note strong{font:60px/1.1 Arial;color:#7c9b8b;font-weight:300}
.series-cover-note>span:not(.micro){font-size:13px;white-space:nowrap}
.series-cover-note b{font-size:9px;font-weight:400;border-top:1px solid #bfd0c6;padding-top:12px;line-height:1.8}
.project-title h3{font-size:18px}.project-title p{line-height:1.9}
.gallery-controls[hidden],.gallery-status[hidden]{display:none}
.dialog-toolbar{height:64px;padding-block:0}
.gallery-controls{position:sticky;top:64px;z-index:4;background:var(--paper);padding-block:12px;border-block:1px solid var(--line);margin-top:23px}
.product-switcher{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.product-switcher button{padding:12px 6px;font-size:11px;background:#e7ece7;border:1px solid transparent;min-height:42px;color:#63786a}
.product-switcher button[aria-pressed="true"]{border-color:var(--teal);background:#dce8df;color:#224b3c}
.gallery-modes{display:flex;align-items:center;gap:18px;margin-top:12px}
.gallery-modes button{font-size:11px;color:var(--muted);padding:8px 0;min-height:36px;border-bottom:1px solid transparent}
.gallery-modes button[aria-pressed="true"]:not(.toggle-all){border-bottom-color:var(--teal);color:var(--teal)}
.gallery-modes .toggle-all{margin-left:auto;font-size:10px}
.gallery-status{font-size:10px;line-height:1.9;color:var(--muted);margin:15px 0 23px}
.project-dialog .sequential-pages{gap:16px;max-width:790px;margin-inline:auto}
.project-dialog .sequential-pages figure{padding:0;background:#e7ece7;border:1px solid #d9e1da;overflow:hidden}
.project-dialog .sequential-pages img{display:block;width:100%;max-height:none;height:auto}
.project-dialog .sequential-pages figcaption{margin:0;padding:9px 13px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px}
.project-dialog .sequential-pages .animated-detail{border-color:#85ab99}
.animated-detail figcaption{background:#e0eae1;color:#446b58}
.dialog-images:not(.sequential-pages) img{height:auto;max-height:none}
.dialog-images:not(.sequential-pages) figure{padding:18px}
.dialog-images:not(.sequential-pages) img[src*="cup-detail"]{max-width:680px;display:block;margin-inline:auto}
@media(max-width:1100px){.single-poster{gap:18px;padding-inline:25px}.series-cover-note strong{font-size:50px}.cup-cover img{max-height:265px}.single-poster>img{max-height:238px}}
@media(max-width:760px){.capability-ae .ability-details{grid-template-columns:1fr;gap:0}.motion-pair{gap:15px}.motion-card-image{padding:14px}.motion-card figcaption{padding:13px;display:block}.motion-card .motion-toggle{margin-top:13px;width:100%}.gif-badge{top:22px;left:22px;font-size:8px;padding:5px}.capability-brief{grid-template-columns:1fr;gap:17px}.capability-brief .tool-title h3{font-size:21px}.cup-cover img{max-height:280px}.single-poster>img{max-height:250px}.series-cover-note strong{font-size:54px}.product-switcher{grid-template-columns:1fr 1fr;gap:6px}.product-switcher button{padding:9px 6px;font-size:10px;min-height:38px}.gallery-modes{gap:12px}.gallery-modes button{font-size:10px}.gallery-modes .toggle-all{font-size:9px}.gallery-controls{top:64px;margin-inline:-8px;padding-inline:8px}.gallery-status{font-size:9px}.dialog-content{padding-inline:18px}.project-dialog .sequential-pages figcaption{padding:8px 10px}.sequential-pages .motion-toggle{font-size:10px;padding:6px 10px}.dialog-images:not(.sequential-pages) figure{padding:8px}}
@media(max-width:480px){.motion-pair{grid-template-columns:1fr}.motion-card-image{padding:19px}.motion-card-image img{max-height:none}.motion-card figcaption{display:flex;padding:16px 19px}.motion-card .motion-toggle{width:auto;margin:0}.gif-badge{top:29px;left:29px}.showcase-top{font-size:9px;gap:10px;margin-bottom:20px}.showcase-top .micro{font-size:7px}.store-showcase{padding:20px 12px 15px}.store-notes{gap:10px 15px;font-size:9px;margin-top:17px}.single-poster{gap:18px;padding-inline:25px}.cup-details{gap:7px}.gallery-modes{gap:9px}.gallery-modes button{font-size:9px}.gallery-modes .toggle-all{font-size:8px}.capability-brief .tool-title h3{font-size:19px}}
@media(prefers-reduced-motion:reduce){.cup-cover img,.single-poster>img{transition:none}}
@media print{.capability-ae .capability-examples,.motion-pair,.gallery-controls,.gallery-status{display:none!important}.capability-brief{grid-template-columns:.85fr 1.15fr;gap:20px;padding-block:10px}.capability-brief .tool-title h3{font-size:13px}.brief-copy>p{font-size:9px;line-height:1.7}.brief-copy .deliverables{display:none}.cup-cover{padding:12px}.cup-cover img{max-height:135px}.single-poster{padding:12px;gap:15px}.single-poster>img{max-height:135px}.series-cover-note strong{font-size:30px}.series-cover-note>span:not(.micro){font-size:9px}.series-cover-note b,.series-cover-note .micro{font-size:6px}}
