/* Homepage only. Existing fonts, color tokens, order and identity are retained. */
body[data-home-design-refinement] #work{--type-client:clamp(18px,1.8vw,26px)}
body[data-home-design-refinement] #work .flagship-grid .feature-title{font-size:clamp(36px,4.4vw,68px);font-weight:700;line-height:1.02;letter-spacing:-.045em;text-wrap:balance;max-width:19ch}
body[data-home-design-refinement] #work .flagship-grid .cardline h3{font-size:clamp(18px,1.8vw,26px);line-height:1.2;letter-spacing:-.02em}
body[data-home-design-refinement] #work .flagship-grid .card-description{font-size:clamp(17px,1.6vw,22px);line-height:1.5;max-width:42ch}
body[data-home-design-refinement] #work .flagship-grid .card-role{font-size:.875rem;line-height:1.65;max-width:58ch}
body[data-home-design-refinement] #work .flagship-grid .card-team{font-size:.875rem;line-height:1.65;max-width:58ch}
body[data-home-design-refinement] #work .flagship-grid .editorial-feature{margin-bottom:clamp(56px,7vw,104px)}
body[data-home-design-refinement] .project-preview-stage{display:none}
/* The final brand-system image gets a full-width moment; no new crop or imagery. */
@media(min-width:1000px){
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya]{display:block}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya]>.image{max-width:none!important;aspect-ratio:16/9;width:100%}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya]>.image img{object-fit:contain}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya]>.card-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);column-gap:clamp(32px,6vw,88px);row-gap:16px;padding-top:28px;align-items:start}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .cardline{grid-column:1;grid-row:1}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .feature-title{grid-column:1;grid-row:2 / span 3;max-width:16ch}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .card-description{grid-column:2;grid-row:1 / span 2}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .card-role{grid-column:2;grid-row:3}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .card-team:not(.card-call){grid-column:2;grid-row:4}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .card-call{grid-column:2;grid-row:5}
 body[data-home-design-refinement] #work .flagship-grid [data-thumbnail=kimiya] .project-entry{grid-column:1;grid-row:5;justify-self:start}
}
/* Progressive enhancement: touch and no-JS keep the directly visible image cards. */
@media(min-width:1000px) and (hover:hover) and (pointer:fine){
 body[data-home-design-refinement] #further-cases[data-browse-ready]{--type-client:clamp(28px,3vw,46px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 clamp(32px,5vw,80px);align-items:start;scroll-margin-top:100px}
 body[data-home-design-refinement] #further-cases>.section-head{grid-column:1/-1}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .project-preview-stage{display:block;position:sticky;top:112px;grid-column:1;grid-row:2;min-width:0}
 body[data-home-design-refinement] .project-preview-frame{display:grid;aspect-ratio:1/1;background:var(--bg);border:1px solid var(--line);overflow:hidden}
 body[data-home-design-refinement] .project-preview-slide{grid-area:1/1;min-width:0;min-height:0;opacity:0;transition:opacity 180ms ease}
 body[data-home-design-refinement] .project-preview-slide.is-preview-active{opacity:1;visibility:visible}
 body[data-home-design-refinement] .project-preview-slide img{display:block;width:100%;height:100%;object-fit:contain}
 body[data-home-design-refinement] .project-preview-caption{font-size:.75rem;line-height:1.6;margin:14px 0 0;color:var(--action-text)}
 body[data-home-design-refinement] #further-cases[data-browse-ready]>.supporting-grid{display:block;grid-column:2;grid-row:2}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .supporting-grid>.card{display:block;margin:0;padding:28px 0;border:0;border-top:1px solid var(--line);background:transparent;transform:none;box-shadow:none;min-width:0}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .supporting-grid>.card:last-child{border-bottom:1px solid var(--line)}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .supporting-grid>.card>.image{display:none}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .cardline{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin:0}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .cardline h3{font-size:clamp(28px,3vw,46px);line-height:1.1;letter-spacing:-.04em;margin:0;transition:color 160ms ease;color:var(--text)}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .cardline .meta{width:100%;margin-top:4px;font-size:.75rem}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .is-preview-active .cardline h3{color:var(--action-text)}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .card-editorial{font-size:1rem;line-height:1.6;max-width:48ch;margin:16px 0}
 body[data-home-design-refinement] #further-cases[data-browse-ready] :is(.card-role,.card-team){font-size:.875rem;line-height:1.65;max-width:60ch;margin:10px 0}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .metric{font-size:.75rem;line-height:1.65;max-width:60ch;margin:10px 0}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .open-case{display:block;font-size:.75rem;margin:18px 0 0;color:var(--action-text)}
 body[data-home-design-refinement] #further-cases[data-browse-ready] .card:focus-visible{outline:2px solid var(--action-text);outline-offset:6px}
}
@media(max-width:720px){
 body[data-home-design-refinement] #work{--type-client:20px}
 body[data-home-design-refinement] #work .flagship-grid .feature-title{font-size:clamp(32px,8.5vw,48px);line-height:1.08}
 body[data-home-design-refinement] #work .flagship-grid .cardline h3{font-size:20px}
 body[data-home-design-refinement] #work .flagship-grid .card-description{font-size:17px}
}
@media(prefers-reduced-motion:reduce){body[data-home-design-refinement] :is(.project-preview-slide,#further-cases h3){transition:none!important}}
html[data-motion=off] body[data-home-design-refinement] :is(.project-preview-slide,#further-cases h3),body[data-home-design-refinement][data-motion=off] :is(.project-preview-slide,#further-cases h3){transition:none!important}
