/* Pięć projektów i szósty kafelek prowadzący do pełnego portfolio. */
:root{--rv-portfolio-ratio:16 / 9;--rv-portfolio-caption-space:var(--rv-space-3);--rv-portfolio-more-icon:var(--rv-space-5)}
.rv-portfolio-grid{display:grid;gap:var(--rv-space-4)}
.rv-portfolio-card{position:relative;aspect-ratio:var(--rv-portfolio-ratio);overflow:hidden;min-width:0;background:var(--rv-grey)}
.rv-portfolio-card>img{width:100%;height:100%;object-fit:cover}
.rv-portfolio-caption{position:absolute;inset:auto 0 0;padding:var(--rv-portfolio-caption-space);display:grid;gap:var(--rv-space-1)}
.rv-portfolio-scope,.rv-portfolio-year,.rv-portfolio-industry{font-size:var(--rv-size-note)}

.rv-portfolio-more{aspect-ratio:var(--rv-portfolio-ratio);display:flex;align-items:center;justify-content:space-between;gap:var(--rv-space-3);padding:var(--rv-space-4);background:var(--rv-red);color:var(--rv-paper);font-size:var(--rv-size-subheading);font-weight:var(--rv-bold);text-decoration:none;transition:background var(--rv-motion-button) var(--rv-ease-button)}
.rv-portfolio-more .rv-button-icon{width:var(--rv-portfolio-more-icon);height:var(--rv-portfolio-more-icon);flex-shrink:0}
.rv-portfolio-more:hover{background:var(--rv-ink)}
.rv-portfolio-more:hover .rv-button-icon{transform:rotate(45deg)}
@media(min-width:48rem){.rv-portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.rv-portfolio-more{transition:none}}

/* Informacje bezpośrednio na zdjęciu, bez panelu pod tekstem. */
.rv-portfolio-caption{background:transparent;border:0;box-shadow:none;backdrop-filter:none;color:var(--rv-ink)}
.rv-portfolio-title-row{display:flex;align-items:baseline;gap:var(--rv-space-2)}
.rv-portfolio-title-row h3{min-width:0}
.rv-portfolio-year{flex-shrink:0}

/* Delikatny zoom zdjęcia wewnątrz nieruchomego kafelka. */
:root{--rv-portfolio-image-scale:1.09;--rv-portfolio-image-duration:.6s}
.rv-portfolio-card>img{transition:transform var(--rv-portfolio-image-duration) var(--rv-ease-button);transform-origin:center}
@media(hover:hover) and (pointer:fine){.rv-portfolio-card:hover>img{transform:scale(var(--rv-portfolio-image-scale))}}
@media(prefers-reduced-motion:reduce){.rv-portfolio-card>img{transition:none}.rv-portfolio-card:hover>img{transform:none}}


/* Cały kafelek otwiera podstronę projektu. */
.rv-portfolio-card{text-decoration:none;color:inherit;display:block}
.rv-portfolio-card:focus-visible>img{transform:scale(var(--rv-portfolio-image-scale))}
@media(prefers-reduced-motion:reduce){.rv-portfolio-card:focus-visible>img{transform:none}}

/* Czytelne podpisy i gradient od dołu, mocniejszy podczas interakcji. */
:root{--rv-portfolio-white:#fff;--rv-portfolio-overlay:linear-gradient(to top,rgba(19,8,12,.92) 0%,rgba(19,8,12,.5) 42%,rgba(19,8,12,0) 80%);--rv-portfolio-overlay-opacity:.82;--rv-portfolio-reveal-height:8rem;--rv-portfolio-arrow-size:var(--rv-space-4)}
.rv-portfolio-card::before{content:"";position:absolute;inset:0;z-index:1;background:var(--rv-portfolio-overlay);opacity:var(--rv-portfolio-overlay-opacity);transition:opacity var(--rv-motion-button) var(--rv-ease-button);pointer-events:none}
.rv-portfolio-caption{z-index:2;color:var(--rv-portfolio-white);padding-right:calc(var(--rv-portfolio-caption-space) + var(--rv-portfolio-arrow-size) + var(--rv-space-2))}
.rv-portfolio-scope{color:var(--rv-grey);font-weight:var(--rv-bold)}
.rv-portfolio-industry{color:var(--rv-grey)}
.rv-portfolio-year{color:var(--rv-portfolio-white)}
.rv-portfolio-arrow{position:absolute;bottom:var(--rv-portfolio-caption-space);right:var(--rv-portfolio-caption-space);z-index:2;width:var(--rv-portfolio-arrow-size);height:var(--rv-portfolio-arrow-size);color:var(--rv-portfolio-white);pointer-events:none;transition:opacity var(--rv-motion-button) var(--rv-ease-button),transform var(--rv-motion-button) var(--rv-ease-button)}
.rv-portfolio-card:is(:hover,:focus-visible)::before{opacity:1}
@media(hover:hover) and (pointer:fine){
 .rv-portfolio-year{opacity:0;transition:opacity var(--rv-motion-button) var(--rv-ease-button)}
 .rv-portfolio-industry{max-height:0;overflow:hidden;opacity:0;transition:max-height var(--rv-motion-button) var(--rv-ease-button),opacity var(--rv-motion-button) var(--rv-ease-button)}
 .rv-portfolio-arrow{opacity:0}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-year,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-industry,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-arrow{opacity:1}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-industry{max-height:var(--rv-portfolio-reveal-height)}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-arrow{transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){.rv-portfolio-card::before,.rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition:none}}

/* Tekst i strzałka wchodzą od dołu; drugi gradient pogłębia cień. */
:root{--rv-portfolio-overlay-hover:linear-gradient(to top,rgba(19,8,12,.8) 0%,rgba(19,8,12,.45) 48%,rgba(19,8,12,0) 88%);--rv-portfolio-reveal-distance:var(--rv-space-2)}
.rv-portfolio-card::after{content:"";position:absolute;inset:0;z-index:1;background:var(--rv-portfolio-overlay-hover);opacity:0;transition:opacity var(--rv-motion-button) var(--rv-ease-button);pointer-events:none}
.rv-portfolio-card:is(:hover,:focus-visible)::after{opacity:1}
@media(hover:hover) and (pointer:fine){
 .rv-portfolio-caption{transform:translateY(var(--rv-portfolio-reveal-distance));transition:transform var(--rv-motion-button) var(--rv-ease-button)}
 .rv-portfolio-year{transform:translateY(var(--rv-portfolio-reveal-distance));transition:opacity var(--rv-motion-button) var(--rv-ease-button),transform var(--rv-motion-button) var(--rv-ease-button)}
 .rv-portfolio-industry{transform:translateY(var(--rv-portfolio-reveal-distance));transition:max-height var(--rv-motion-button) var(--rv-ease-button),opacity var(--rv-motion-button) var(--rv-ease-button),transform var(--rv-motion-button) var(--rv-ease-button)}
 .rv-portfolio-arrow{transform:translateY(var(--rv-space-3))}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-caption,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-year,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-industry,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-arrow{transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){.rv-portfolio-card::after,.rv-portfolio-caption,.rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition:none}}

/* Spokojniejsze ujawnianie: rok, następnie branża i strzałka. */
:root{--rv-portfolio-reveal-duration:.8s;--rv-portfolio-reveal-delay:.16s;--rv-portfolio-reveal-ease:cubic-bezier(.4,0,.2,1)}
@media(hover:hover) and (pointer:fine){
 .rv-portfolio-caption{transition-duration:var(--rv-portfolio-reveal-duration)}
 .rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition-duration:var(--rv-portfolio-reveal-duration);transition-delay:0s}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-industry,.rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-arrow{transition-delay:var(--rv-portfolio-reveal-delay)}
}
@media(prefers-reduced-motion:reduce){.rv-portfolio-caption,.rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition:none}}
/* Łagodny początek i koniec zamiast gwałtownego przyspieszenia. */
@media(hover:hover) and (pointer:fine){
 .rv-portfolio-caption,.rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition-timing-function:var(--rv-portfolio-reveal-ease)}
 .rv-portfolio-industry{max-height:var(--rv-space-5);clip-path:inset(100% 0 0 0);transition:opacity var(--rv-portfolio-reveal-duration) var(--rv-portfolio-reveal-ease),transform var(--rv-portfolio-reveal-duration) var(--rv-portfolio-reveal-ease),clip-path var(--rv-portfolio-reveal-duration) var(--rv-portfolio-reveal-ease)}
 .rv-portfolio-card:is(:hover,:focus-visible) .rv-portfolio-industry{max-height:var(--rv-space-5);clip-path:inset(0);transition-delay:var(--rv-portfolio-reveal-delay)}
}
.rv-portfolio-card::before,.rv-portfolio-card::after{transition-duration:var(--rv-portfolio-reveal-duration);transition-timing-function:var(--rv-portfolio-reveal-ease)}
@media(prefers-reduced-motion:reduce){.rv-portfolio-card::before,.rv-portfolio-card::after,.rv-portfolio-caption,.rv-portfolio-year,.rv-portfolio-industry,.rv-portfolio-arrow{transition:none}}
/* Mniejsze podpisy realizacji na telefonach. */
:root{--rv-portfolio-mobile-title:1.15rem;--rv-portfolio-mobile-note:.75rem}
@media(max-width:47.999rem){
 .rv-portfolio-title-row h3{font-size:var(--rv-portfolio-mobile-title)}
 .rv-portfolio-scope,.rv-portfolio-year,.rv-portfolio-industry{font-size:var(--rv-portfolio-mobile-note)}
 .rv-portfolio-caption{--rv-portfolio-caption-space:var(--rv-space-2);gap:var(--rv-space-1)}
}
