/* Only the Projects introduction. Catalogue and project-viewer rules are unchanged. */
.portfolio-hero.portfolio-hero-refined{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0;align-items:start;max-width:1280px;padding-block:36px 44px}
.portfolio-hero-refined .hero-title{display:contents}
.portfolio-hero-refined .micro{grid-column:1/6;grid-row:1;padding-top:6px}
.portfolio-hero-refined h1{grid-column:1/6;grid-row:2;font-size:clamp(48px,4.7vw,68px);line-height:1.12;letter-spacing:-.045em;margin:14px 0 32px}
.portfolio-hero-refined .projects-hero-statement{grid-column:7/-1;grid-row:1/3;font-size:clamp(22px,2.1vw,29px);line-height:1.5;max-width:none;margin:0 0 30px;padding-left:28px;border-left:1px solid var(--line);align-self:center}
.portfolio-hero.portfolio-hero-refined>picture{grid-column:3/-1;grid-row:3;display:block;position:relative;margin:0;border-top:1px solid var(--line);padding-top:18px}
.portfolio-hero.portfolio-hero-refined>picture img{display:block;width:90%;height:auto;max-height:none;object-fit:contain;margin-inline:auto;border-radius:12px}
.portfolio-hero-refined .text-link{grid-column:1/3;grid-row:3;align-self:end;justify-self:start;margin:0 24px 0 0;font-size:15px;gap:22px}
.portfolio-hero-refined>picture:before{content:'';position:absolute;left:-24px;top:0;bottom:0;border-left:1px solid var(--line);pointer-events:none}
@media(min-width:651px){.has-js .portfolio-hero-refined>picture{animation:portfolio-photo-in .85s cubic-bezier(.22,1,.36,1) both}.has-js .portfolio-hero-refined h1,.has-js .portfolio-hero-refined .projects-hero-statement{animation:portfolio-copy-in .7s .1s cubic-bezier(.22,1,.36,1) both}}
@keyframes portfolio-photo-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes portfolio-copy-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.portfolio-hero.portfolio-hero-refined{padding-block:30px 36px}.portfolio-hero.portfolio-hero-refined>picture{grid-column:2/-1}.portfolio-hero-refined .text-link{grid-column:1/-1;grid-row:4;margin-top:18px}.portfolio-hero-refined .projects-hero-statement{font-size:23px;padding-left:22px}.portfolio-hero-refined>picture:before{left:-20px}}
@media(max-width:650px){.portfolio-hero.portfolio-hero-refined{display:flex;flex-direction:column;align-items:stretch;padding-block:28px 32px;gap:0}.portfolio-hero-refined .micro{font-size:10px;padding:0}.portfolio-hero-refined h1{font-size:44px;line-height:1.15;margin:13px 0 20px}.portfolio-hero-refined .projects-hero-statement{font-size:22px;line-height:1.55;border:0;padding:0;margin:0 0 25px}.portfolio-hero.portfolio-hero-refined>picture{order:1;padding-top:16px}.portfolio-hero-refined>picture:before{display:none}.portfolio-hero-refined .text-link{order:2;align-self:flex-start;margin:18px 0 0}.has-js .portfolio-hero-refined>picture{animation:portfolio-photo-in .7s cubic-bezier(.22,1,.36,1) both}}
@media(prefers-reduced-motion:reduce){.portfolio-hero-refined>picture,.portfolio-hero-refined h1,.portfolio-hero-refined .projects-hero-statement{animation:none!important}}