.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem;list-style:none;padding:0;margin:1.75rem 0 0}
.portfolio-card{min-width:0;font:17px/1.6 Arial,Helvetica,"Adwaita Sans","DejaVu Sans",sans-serif}
.portfolio-preview{display:block;overflow:hidden;background:var(--portfolio-surface,#f3f3ee);margin-bottom:1.25rem}
.portfolio-preview img{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;object-position:top;transition:transform 180ms ease}
.portfolio-preview:hover img{transform:scale(1.025)}
.portfolio-card :is(h2,h3){font:600 24px/1.25 Arial,Helvetica,"Adwaita Sans","DejaVu Sans",sans-serif;letter-spacing:-.02em;text-wrap:balance;margin:0}
.portfolio-card p{max-width:58ch;margin:.75rem 0 0;text-wrap:pretty}
.portfolio-card .portfolio-category{font-size:16px;margin:.5rem 0 0;color:inherit}
.portfolio-links{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;margin:1rem 0 0;padding:0;list-style:none}
.portfolio-links a{display:inline-block;padding:.35rem 0;text-underline-offset:4px}
.portfolio-card a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.portfolio-page{font:18px/1.65 Arial,Helvetica,"Adwaita Sans","DejaVu Sans",sans-serif}
.portfolio-page h1{font:600 clamp(32px,5vw,44px)/1.2 Arial,Helvetica,"Adwaita Sans","DejaVu Sans",sans-serif;letter-spacing:-.03em;margin:0 0 1rem}
.portfolio-intro{max-width:56ch;text-wrap:pretty}
.mw:has(.portfolio-page){max-width:960px}
@media(max-width:600px){.portfolio-grid{grid-template-columns:1fr;gap:2.5rem}.portfolio-page{font-size:17px}.portfolio-card :is(h2,h3){font-size:24px}}
@media(prefers-reduced-motion:reduce){.portfolio-preview img{transition:none}.portfolio-preview:hover img{transform:none}}

.portfolio-card h2::before{content:none}
.portfolio-notice{margin-top:2rem}
@media(prefers-color-scheme:dark){.portfolio-card{--portfolio-surface:#18181e}}

.portfolio-grid:has(>li:only-child){grid-template-columns:minmax(0,1fr)}
@media(min-width:700px){.portfolio-grid>li:only-child .portfolio-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:2rem;align-content:start}.portfolio-grid>li:only-child .portfolio-preview{grid-column:1;grid-row:1/5;margin-bottom:0}.portfolio-grid>li:only-child .portfolio-card>:not(.portfolio-preview){grid-column:2}}