/* Heretic Photo — portfolio directory */
.portfolio-index{position:relative;overflow:hidden;background:var(--ink);color:var(--bone)}
.portfolio-index__hero{position:relative;min-height:min(860px,92svh);display:flex;align-items:end;padding:clamp(150px,18vw,250px) 0 clamp(72px,8vw,120px);border-bottom:1px solid var(--line-soft);isolation:isolate}
.portfolio-index__ghost{position:absolute;left:50%;top:49%;z-index:-1;transform:translate(-50%,-50%);font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(8rem,23vw,24rem);line-height:.72;letter-spacing:-.08em;text-transform:uppercase;color:rgba(233,228,221,.025);white-space:nowrap;pointer-events:none}
.portfolio-index__hero::after{content:"";position:absolute;inset:auto 0 0;height:42%;z-index:-2;background:linear-gradient(180deg,transparent,rgba(143,119,84,.035))}
.portfolio-index__hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:clamp(42px,8vw,120px);align-items:end}
.portfolio-index__hero-main h1{margin:.2em 0 0;font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(4.4rem,11vw,10rem);line-height:.78;letter-spacing:-.065em;text-transform:uppercase}
.portfolio-index__hero-main h1 span{display:block;color:transparent;-webkit-text-stroke:1px rgba(178,154,115,.85)}
.portfolio-index__hero-copy{max-width:610px;padding-bottom:.5rem}
.portfolio-index__lede{margin:0 0 1.25rem;color:var(--bone);font-family:OswaldLocal,Impact,sans-serif;font-size:clamp(1.35rem,2.1vw,2.1rem);line-height:1.28;text-transform:uppercase;letter-spacing:.025em}
.portfolio-index__hero-copy>p:not(.portfolio-index__lede){margin:0;color:var(--muted);font-size:clamp(.98rem,1.2vw,1.12rem);line-height:1.75}
.portfolio-index__hero-meta{display:flex;flex-wrap:wrap;gap:14px 28px;margin-top:clamp(28px,4vw,42px);padding-top:18px;border-top:1px solid var(--line)}
.portfolio-index__hero-meta span{display:flex;align-items:baseline;gap:10px;color:var(--muted);font-family:OswaldLocal,Impact,sans-serif;font-size:.75rem;letter-spacing:.13em;text-transform:uppercase}
.portfolio-index__hero-meta strong{color:var(--gold2);font-size:1.5rem;letter-spacing:-.02em}

.portfolio-index__directory{padding:clamp(78px,10vw,150px) 0 clamp(90px,12vw,180px)}
.portfolio-index__directory-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,520px);gap:clamp(36px,8vw,120px);align-items:end;margin-bottom:clamp(56px,7vw,96px);padding-bottom:clamp(30px,4vw,48px);border-bottom:1px solid var(--line-soft)}
.portfolio-index__directory-head h2{margin:.18em 0 0;font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(3rem,7vw,6.9rem);line-height:.84;letter-spacing:-.055em;text-transform:uppercase}
.portfolio-index__directory-head p{margin:0;color:var(--muted);line-height:1.75}

.portfolio-index__list{display:grid;gap:clamp(56px,8vw,110px)}
.portfolio-index__entry{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);gap:clamp(34px,7vw,100px);align-items:center;color:inherit;text-decoration:none}
.portfolio-index__entry--reverse{grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr)}
.portfolio-index__entry--reverse .portfolio-index__entry-media{order:2}
.portfolio-index__entry--reverse .portfolio-index__entry-copy{order:1}
.portfolio-index__entry-media{position:relative;overflow:hidden;min-height:clamp(420px,52vw,720px);background:var(--panel);border:1px solid var(--line-soft)}
.portfolio-index__entry-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .45s ease}
.portfolio-index__entry-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,2,2,.02),rgba(2,2,2,.12) 58%,rgba(2,2,2,.62));transition:background .35s ease}
.portfolio-index__entry-index{position:absolute;left:clamp(18px,3vw,36px);bottom:clamp(18px,3vw,34px);font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(4rem,9vw,9rem);line-height:.72;letter-spacing:-.06em;color:rgba(233,228,221,.9)}
.portfolio-index__entry-copy{position:relative;padding:clamp(10px,2vw,24px) 0}
.portfolio-index__entry-copy::before{content:"";display:block;width:44px;height:1px;margin-bottom:24px;background:var(--gold2)}
.portfolio-index__entry-label{color:var(--gold2);font-family:OswaldLocal,Impact,sans-serif;font-size:.72rem;letter-spacing:.17em;text-transform:uppercase}
.portfolio-index__entry h3{margin:.2em 0 .22em;font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(3.1rem,7vw,7.2rem);line-height:.82;letter-spacing:-.06em;text-transform:uppercase}
.portfolio-index__entry p{max-width:560px;margin:0;color:var(--muted);font-size:clamp(.98rem,1.2vw,1.1rem);line-height:1.72}
.portfolio-index__entry-link{display:inline-flex;align-items:center;gap:13px;margin-top:clamp(26px,4vw,40px);padding-bottom:4px;border-bottom:1px solid var(--line);color:var(--bone);font-family:OswaldLocal,Impact,sans-serif;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;transition:border-color .22s ease,color .22s ease}
.portfolio-index__entry-link b{color:var(--gold2);font-size:1rem;transition:transform .22s ease}
.portfolio-index__entry:hover .portfolio-index__entry-media img,.portfolio-index__entry:focus-visible .portfolio-index__entry-media img{transform:scale(1.035);filter:contrast(1.04)}
.portfolio-index__entry:hover .portfolio-index__entry-shade,.portfolio-index__entry:focus-visible .portfolio-index__entry-shade{background:linear-gradient(180deg,rgba(2,2,2,.01),rgba(2,2,2,.08) 55%,rgba(2,2,2,.48))}
.portfolio-index__entry:hover .portfolio-index__entry-link,.portfolio-index__entry:focus-visible .portfolio-index__entry-link{border-color:var(--gold2);color:var(--gold2)}
.portfolio-index__entry:hover .portfolio-index__entry-link b,.portfolio-index__entry:focus-visible .portfolio-index__entry-link b{transform:translate(3px,-3px)}

.portfolio-index__closing{padding:clamp(82px,10vw,150px) 0;border-top:1px solid var(--line-soft);background:linear-gradient(180deg,var(--ink2),var(--ink))}
.portfolio-index__closing-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr);gap:clamp(42px,9vw,140px);align-items:start}
.portfolio-index__closing h2{margin:.12em 0 0;font-family:ArchivoBlackLocal,"Arial Black",sans-serif;font-size:clamp(5rem,13vw,12rem);line-height:.72;letter-spacing:-.07em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px rgba(178,154,115,.82)}
.portfolio-index__closing p{max-width:650px;margin:0 0 28px;color:var(--muted);font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.8}

@media(max-width:980px){
  .portfolio-index__hero{min-height:auto;padding-top:160px}
  .portfolio-index__hero-grid,.portfolio-index__directory-head,.portfolio-index__closing-grid{grid-template-columns:1fr}
  .portfolio-index__hero-copy{max-width:760px}
  .portfolio-index__directory-head{gap:24px}
  .portfolio-index__entry,.portfolio-index__entry--reverse{grid-template-columns:1fr;gap:28px}
  .portfolio-index__entry--reverse .portfolio-index__entry-media,.portfolio-index__entry--reverse .portfolio-index__entry-copy{order:initial}
  .portfolio-index__entry-media{min-height:clamp(420px,76vw,680px)}
  .portfolio-index__entry-copy{max-width:720px}
}
@media(max-width:620px){
  .portfolio-index__hero{padding-top:135px;padding-bottom:68px}
  .portfolio-index__hero-main h1{font-size:clamp(4rem,20vw,6.5rem)}
  .portfolio-index__hero-meta{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .portfolio-index__directory{padding-top:70px}
  .portfolio-index__entry-media{min-height:72svh}
  .portfolio-index__entry h3{font-size:clamp(3rem,17vw,5.4rem)}
  .portfolio-index__entry-index{font-size:clamp(4.5rem,24vw,7rem)}
}
@media(prefers-reduced-motion:reduce){
  .portfolio-index__entry-media img,.portfolio-index__entry-link,.portfolio-index__entry-link b{transition:none}
}