/* Iron Products — scoped to .pi / .pg-iron */
.pi-hero{position:relative;min-height:100vh;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:3vw;padding:calc(104px + 2vh) var(--pad) clamp(56px,8vh,100px);background:var(--carbon);overflow:hidden}
.pi-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(50vw 60vh at 78% 50%,rgba(248,95,10,.14),transparent 70%);pointer-events:none}
.pi-word{position:absolute;left:-1.5vw;bottom:-3.2vw;font:400 clamp(180px,34vw,620px)/.8 var(--display);color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.07);white-space:nowrap;pointer-events:none;user-select:none}
.pi-hero-copy{position:relative;z-index:2;max-width:640px}
.pi-h1{font:400 clamp(40px,min(5.6vw,10.6vh),104px)/.98 var(--display);text-transform:uppercase}
.pi-h1 em{font:italic 400 1.04em/.9 var(--serif);text-transform:none;color:var(--or)}
.pi-intro{margin:clamp(20px,3.4vh,34px) 0 clamp(24px,4vh,38px);color:var(--steel);font-size:clamp(15px,1.12vw,17.5px);line-height:1.62;font-weight:300;max-width:36em}
/* the hanging mobile */
.pi-mobile{position:relative;z-index:2;list-style:none;height:min(78vh,720px);width:100%}
.pi-hang{position:absolute;top:calc(-1 * (104px + 2vh));transform-origin:50% 0;will-change:transform}
.pi-hang a{display:block;position:relative;padding-top:var(--len,120px)}
.pi-line{position:absolute;left:50%;top:0;height:var(--len,120px);width:1px;background:linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,.25));transform-origin:50% 0}
.pi-disc{display:block;width:var(--d,150px);aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px rgba(255,255,255,.14),0 24px 50px -16px rgba(0,0,0,.8);transition:transform .6s var(--ease),box-shadow .4s}
.pi-disc img{width:100%;height:100%;object-fit:cover}
.pi-tag{position:absolute;left:50%;top:calc(var(--len,120px) + var(--d,150px) + 12px);transform:translate(-50%,6px);white-space:nowrap;background:var(--or);color:#fff;padding:7px 11px;border-radius:99px;font-size:9.5px;opacity:0;transition:opacity .3s,transform .4s var(--ease);pointer-events:none}
.pi-hang a:hover .pi-disc,.pi-hang a:focus-visible .pi-disc{transform:scale(1.08);box-shadow:0 0 0 3px var(--or),0 30px 60px -16px rgba(0,0,0,.85)}
.pi-hang a:hover .pi-tag,.pi-hang a:focus-visible .pi-tag{opacity:1;transform:translate(-50%,0)}
.pi-hang-1{left:2%;--d:clamp(120px,12vw,190px);--len:clamp(140px,22vh,230px)}
.pi-hang-2{left:27%;--d:clamp(100px,10vw,160px);--len:clamp(60px,9vh,100px)}
.pi-hang-3{left:50%;--d:clamp(140px,14vw,220px);--len:clamp(190px,30vh,320px)}
.pi-hang-4{left:73%;--d:clamp(100px,10vw,160px);--len:clamp(90px,14vh,150px)}
.pi-hang-5{left:12%;--d:clamp(90px,9vw,140px);--len:clamp(330px,50vh,520px)}
.pi-hang-6{left:78%;--d:clamp(110px,11vw,175px);--len:clamp(300px,46vh,470px)}
/* catalogue */
.pi-cat{background:var(--bone);color:var(--ink)}
.pi-cat .kri-k{color:var(--ink)}
.pi-cat-h{max-width:12em}
.pi-cat-wrap{display:grid;grid-template-columns:minmax(220px,.5fr) minmax(0,2fr);gap:clamp(30px,5vw,90px);margin-top:clamp(40px,5vw,80px);align-items:start}
.pi-index{position:sticky;top:calc(var(--hdr,72px) + 28px)}
.pi-index-t{color:var(--mute);margin-bottom:14px}
.pi-index ol{list-style:none;border-top:2px solid var(--ink);margin-bottom:26px}
.pi-index li a{display:grid;grid-template-columns:34px 1fr;gap:6px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(11,12,14,.18);font:400 clamp(17px,1.4vw,22px)/1.15 var(--display);text-transform:uppercase;color:rgba(11,12,14,.5);transition:color .3s,padding .4s var(--ease)}
.pi-index li a .mono{color:var(--or);font-size:10px}
.pi-index li a:hover,.pi-index li a.on{color:var(--ink);padding-left:8px}
.pi-index li a.on{box-shadow:inset 3px 0 0 var(--or);padding-left:14px}
.pi-sheets{display:grid;gap:clamp(60px,8vw,130px)}
.pi-sheet{display:grid;grid-template-columns:minmax(220px,.82fr) minmax(0,1.18fr);gap:clamp(24px,4vw,64px);align-items:center;scroll-margin-top:90px}
.pi-sheet.is-r{grid-template-columns:minmax(0,1.18fr) minmax(220px,.82fr)}
.pi-sheet.is-r .pi-fig{order:2}
.pi-fig{position:relative;aspect-ratio:1;width:100%;max-width:340px;border-radius:50%;background:#161719;cursor:zoom-in;justify-self:center}
.pi-sheet.is-r .pi-fig{justify-self:center}
.pi-fig img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;transition:transform .9s var(--ease)}
.pi-fig:hover img{transform:scale(1.05)}
.pi-ring{position:absolute;inset:-14px;border-radius:50%;border:1px dashed var(--or);opacity:.8}
.pi-no{position:absolute;left:-6%;bottom:-4%;font:400 clamp(70px,9vw,140px)/.8 var(--display);color:transparent;-webkit-text-stroke:1.5px var(--ink);letter-spacing:-.02em;pointer-events:none}
.pi-sheet.is-r .pi-no{left:auto;right:-6%}
.pi-sup{color:var(--ink);margin-bottom:12px}
.pi-body h3{font:400 clamp(32px,3.6vw,62px)/1 var(--display);text-transform:uppercase;margin-bottom:16px}
.pi-text{font-size:clamp(15px,1.05vw,17px);line-height:1.62;color:#2b2e33;max-width:36em;margin-bottom:20px}
.pi-body .kri-feat{margin-bottom:24px;color:var(--ink)}
.pi-body .kri-feat li{border-color:rgba(11,12,14,.35)}
.pi-note{margin-top:clamp(50px,6vw,90px);color:#4a4d54;max-width:60em;text-transform:none;letter-spacing:.04em;font-size:11px;line-height:1.6}
@media (max-width:900px){
  .pi-hero{grid-template-columns:1fr;min-height:0;padding:calc(84px + 2vh) var(--pad) 40px;gap:0}
  .pi-hero-copy{order:2}
  .pi-mobile{order:1;height:min(62vw,300px);margin:0 calc(var(--pad) * -1) 26px;overflow:hidden;width:calc(100% + var(--pad) * 2)}
  .pi-hang{top:-96px}
  .pi-hang-1{left:2%;--d:62px;--len:140px}.pi-hang-2{left:18%;--d:52px;--len:200px}.pi-hang-3{left:36%;--d:78px;--len:170px}
  .pi-hang-4{left:56%;--d:56px;--len:215px}.pi-hang-5{left:73%;--d:64px;--len:165px}.pi-hang-6{left:89%;--d:48px;--len:225px}
  .pi-tag{display:none}
  .pi-word{font-size:58vw;bottom:-6vw}
  .pi-cat-wrap{grid-template-columns:1fr;gap:0}
  .pi-index{position:static;margin-bottom:46px}
  .pi-index ol{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
  .pi-index li a{font-size:16px}
  .pi-sheet,.pi-sheet.is-r{grid-template-columns:1fr;gap:26px}
  .pi-sheet.is-r .pi-fig{order:0}
  .pi-fig{max-width:260px}
  .pi-no,.pi-sheet.is-r .pi-no{font-size:76px;left:-4%;right:auto}
}
@media (prefers-reduced-motion:reduce){.pi-hang{transform:none!important}}