/* Compact two-column catalogue; copy left, smaller preview right. */
.curated-tools .project{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-rows:auto auto auto 1fr auto auto;gap:14px 22px;align-items:start;padding:26px;min-width:0}
.curated-tools .project-heading{grid-column:1;grid-row:1;justify-content:flex-start;margin:0;text-align:left}
.curated-tools .project-heading h3{font-size:clamp(20px,1.8vw,30px);min-height:0;margin:0;text-align:left}
.curated-tools .project-icon{width:36px;height:36px;flex-shrink:0}
.curated-tools .project-image{grid-column:2;grid-row:1/5;width:100%;height:clamp(150px,18vw,255px);min-height:0;margin:0;aspect-ratio:auto;align-self:center;overflow:hidden;border-radius:12px;background:transparent}
.curated-tools .project-image img{width:100%;height:100%;object-fit:contain;object-position:center;transform:none}
.curated-tools .project:hover .project-image img{transform:none}
.curated-tools .description{grid-column:1;grid-row:2;margin:0;font-size:15px;line-height:1.5}
.curated-tools .project-benefit{grid-column:1;grid-row:3;margin:0;font-size:16px;line-height:1.5}
.curated-tools .status,.curated-tools .project-foot{grid-column:1;grid-row:4;margin:0;font-size:12px;align-self:end}
.curated-tools .project-meta{grid-column:1/-1;grid-row:5;margin:10px 0 0;font-size:11px}
@media(max-width:1050px){.curated-tools .project{padding:20px;gap:12px}.curated-tools .project-image{height:170px}.curated-tools .project-heading{gap:8px}.curated-tools .project-heading h3{font-size:20px}}
@media(max-width:600px){.curated-tools .project{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);padding:18px;gap:12px}.curated-tools .project-heading{grid-column:1/-1}.curated-tools .project-image{grid-row:2/5;height:155px}.curated-tools .project-benefit{font-size:14px}.curated-tools .description{font-size:13px}.curated-tools .project-heading h3{min-height:0;font-size:22px}}

.app-brand,.brand81{color:#35f3a5!important;opacity:1!important}

/* Preview round: larger images, title and copy form one block. */
#projects .section-heading{display:block}
#projects .section-heading>div{width:100%;max-width:none}
#projects .section-heading h2{font-size:clamp(28px,3.1vw,48px);white-space:normal;line-height:1.15;max-width:none;margin-bottom:18px}
#projects .section-heading .section-intro{max-width:720px;text-align:left;margin:0;line-height:1.55}
#projects .curated-tools .project{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:18px;padding:24px}
#projects .curated-tools .project-image,#projects .curated-tools .project.is-local .project-image{height:clamp(260px,24vw,360px);padding:0;aspect-ratio:auto;margin:0;background:transparent}
#projects .curated-tools .project-image img{transition:transform .45s ease;transform:scale(1);transform-origin:center}
#projects .curated-tools .project:hover .project-image img,#projects .curated-tools .project:focus-visible .project-image img{transform:scale(1.12)}
@media(max-width:1050px){#projects .curated-tools .project{gap:12px;padding:18px}#projects .curated-tools .project-image,#projects .curated-tools .project.is-local .project-image{height:260px}#projects .curated-tools .project-heading{grid-column:1/-1}#projects .curated-tools .project-image{grid-row:2/5}}
@media(max-width:600px){#projects .curated-tools .project{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);padding:16px}#projects .curated-tools .project-image,#projects .curated-tools .project.is-local .project-image{height:230px}#projects .section-heading h2{font-size:32px}}
@media(prefers-reduced-motion:reduce){#projects .curated-tools .project-image img{transition:none}}

/* Icons and family suffix follow the selected look without changing SVG originals. */
.look-app-icon{display:inline-block;flex-shrink:0;width:var(--app-icon-size,36px);height:var(--app-icon-size,36px);background-color:var(--accent);mask-image:var(--app-icon);-webkit-mask-image:var(--app-icon);mask-size:contain;-webkit-mask-size:contain;mask-position:center;-webkit-mask-position:center;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat}
.tool-menu-item .look-app-icon{width:34px;height:34px}
.app-brand,.brand81{color:var(--accent)!important;opacity:1!important}
@media(max-width:600px){.tool-menu-item .look-app-icon{width:28px;height:28px}}

/* Mobile: readable copy followed by a full-width preview. */
@media(max-width:760px){
 #projects .project-grid.curated-tools{grid-template-columns:minmax(0,1fr);gap:22px}
 #projects .curated-tools .project{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto auto auto;gap:16px;padding:22px}
 #projects .curated-tools .project-heading{grid-column:1;grid-row:1;flex-direction:row;align-items:center;gap:12px}
 #projects .curated-tools .project-heading h3{font-size:26px;min-height:0;line-height:1.2;overflow-wrap:anywhere}
 #projects .curated-tools .description{grid-column:1;grid-row:2;min-height:0;font-size:15px;line-height:1.5}
 #projects .curated-tools .project-benefit{grid-column:1;grid-row:3;font-size:17px;line-height:1.5;padding-bottom:0;margin:0}
 #projects .curated-tools .project-image,#projects .curated-tools .project.is-local .project-image{grid-column:1;grid-row:4;height:auto;aspect-ratio:4/3;width:100%;min-height:0;padding:0;margin:0}
 #projects .curated-tools .project-image img{width:100%;height:100%;object-fit:contain}
 #projects .curated-tools .status,#projects .curated-tools .project-foot{grid-column:1;grid-row:5;align-self:start;margin:0;font-size:12px}
 #projects .curated-tools .project-meta{grid-column:1;grid-row:6;font-size:11px;margin-top:0}
}
@media(hover:none){#projects .curated-tools .project:hover .project-image img{transform:none}}