/* ============================================
   PORTFOLIO — stora rundade kort med glasetikett
============================================ */
.pf-split { display: block; margin: 0; padding: 0; }

/* Rubrik */
.pf-band { max-width: 760px; margin: 0 auto 5rem; padding: 195px 1.5rem 0; }
.pf-band__inner { display: flex; flex-direction: column; align-items: center; text-align: center; }
.pf-band__text { display: contents; }
.pf-band__sub { order: 3; margin: 1.8rem 0 0; font-size: 10px; letter-spacing: .4em; text-transform: uppercase; color: #6b3038; }
.pf-band__title { order: 1; margin: 0; font-family: var(--font-display); font-weight: 300; font-size: clamp(3rem, 8vw, 6.2rem); line-height: 1; letter-spacing: .04em; color: #3d1a20; }
.pf-band__title em { font-style: italic; color: #6b3038; }
.pf-band__lead { order: 2; margin: 1.8rem 0 0; max-width: 500px; font-size: 1rem; line-height: 1.9; color: #5d4448; }

/* Stora rundade kort */
.pf-wrap { max-width: 1160px; margin: 0 auto; padding: 0 2rem 9rem; }
.pf-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.4rem 2rem; }

.pf-c { position: relative; display: block; color: #3d1a20; text-decoration: none; opacity: 0; animation: pfIn .9s ease forwards; animation-delay: calc(var(--i) * 80ms + 100ms); }
@keyframes pfIn { from { opacity: 0; } to { opacity: 1; } }

.pf-c__img { position: relative; display: block; aspect-ratio: 5 / 4; overflow: hidden; border-radius: 36px; background: #e9dfd6; transition: transform .7s cubic-bezier(.2,.7,.2,1), box-shadow .6s ease, border-radius .8s ease; }
.pf-c:hover .pf-c__img { transform: translateY(-6px); box-shadow: 0 28px 56px rgba(107,48,56,.22); border-radius: 36px 120px 36px 120px; }
.pf-c__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 28%; transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.pf-c:nth-child(1) .pf-c__img img { object-position: 44% 24%; }
.pf-c:nth-child(5) .pf-c__img img { object-position: center 66%; }
.pf-c:hover .pf-c__img img { transform: scale(1.06); }

/* Collage i sista kortet */
.pf-c__img--mosaic img { position: absolute; width: auto; height: auto; max-width: none; transform: none; }
.pf-c:hover .pf-c__img--mosaic img { transform: none; }
.pf-c__img--mosaic img:nth-child(1) { left: 0; top: 0; width: 58%; height: 100%; }
.pf-c__img--mosaic img:nth-child(2) { left: 59%; top: 0; width: 41%; height: 49.5%; }
.pf-c__img--mosaic img:nth-child(3) { left: 59%; top: 50.5%; width: 41%; height: 49.5%; }

.pf-c__body { position: relative; display: grid; grid-template-columns: 1fr auto; column-gap: 1.2rem; align-items: center; padding: 1.2rem 1.2rem .6rem; }
.pf-c__num { display: none; }
.pf-c__body b { grid-column: 1; font-family: var(--font-display); font-weight: 300; font-size: 2.2rem; line-height: 1.05; color: #3d1a20; }
.pf-c__body em { grid-column: 1; margin-top: .3rem; font-style: normal; font-size: 13.5px; line-height: 1.55; color: #7a5f62; }
.pf-c__body i { grid-column: 2; grid-row: 1 / span 2; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid rgba(107,48,56,.45); font-style: normal; font-size: 0; transition: background .4s, transform .5s cubic-bezier(.2,.7,.2,1); }
.pf-c__body i::before { content: "→"; font-size: 1.3rem; color: #6b3038; transition: color .4s; }
.pf-c:hover .pf-c__body i { background: #6b3038; transform: rotate(-45deg); border-color: #6b3038; }
.pf-c:hover .pf-c__body i::before { color: #fff; }
.pf-c:hover .pf-c__body b { font-style: italic; color: #6b3038; }

@media (max-width: 700px) {
  .pf-band { padding-top: 135px; margin-bottom: 3rem; }
  .pf-band__title { font-size: clamp(2.8rem, 13vw, 3.8rem); }
  .pf-band__sub { font-size: 9px; letter-spacing: .28em; }
  .pf-wrap { padding: 0 1.2rem 5rem; }
  .pf-cards { grid-template-columns: 1fr; gap: 2rem; }
  .pf-c__img { border-radius: 26px; aspect-ratio: 4 / 3.4; }
  .pf-c__body b { font-size: 1.8rem; }
}
@media (prefers-reduced-motion: reduce) { .pf-c { opacity: 1; animation: none; } }