/* DEAD STOCK — LA CREW (studio di tatuaggio) e scheda artista */
@font-face{font-family:"SH";src:url(fonts/ShaperLine-Regular.woff2) format("woff2");font-weight:100 600;font-display:swap}
@font-face{font-family:"SH";src:url(fonts/ShaperLine-Bold.woff2) format("woff2");font-weight:700 900;font-display:swap}
:root{--ink:#0c0c0c;--paper:#efe7d6;--mat:#ebe2cf;--white:#f6f3ec;--grey:#8e8a82;--red:#d23a2e;--teal:#12302e;--gold:#b08a3e;--f:"SH","Arial Narrow",sans-serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--white);font:400 16px/1.4 var(--f);letter-spacing:.06em;overflow-x:hidden}
a{color:inherit} button{font:inherit;color:inherit;cursor:pointer} img{display:block}

.ttx{position:fixed;top:0;left:0;right:0;z-index:40;height:36px;display:flex;align-items:center;gap:14px;padding:0 14px;background:#000;font-weight:700;letter-spacing:.12em;font-size:16px;border-bottom:1px solid #222}
.ttx-back{text-decoration:none}.ttx-back:hover{color:#2fb8c4}
.ttx-name{background:#2fb8c4;color:#000;padding:3px 10px 1px;white-space:nowrap}
.ttx-hint{color:#e8d04a;animation:blk 1.2s steps(2) infinite}
@keyframes blk{50%{opacity:0}}

/* stanza */
.room{position:relative;height:calc(100svh - 36px);min-height:480px;margin-top:36px;overflow:hidden;background:#0b0b0b}
.track{position:absolute;inset:0;overflow:hidden}
.stage{position:absolute;left:0;top:0;width:1585px;height:992px;transform-origin:0 0}
.photo{position:absolute;inset:0;width:1585px;height:992px;user-select:none}

/* foto nei passe-partout */
.pic{position:absolute;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#2a2620;padding:9px 9px 0}
.pic img{width:100%;flex:1;min-height:0;object-fit:cover;filter:grayscale(1) contrast(1.05);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.25)}
.pic span{height:24px;display:flex;align-items:center;font-weight:700;font-size:10.5px;letter-spacing:.12em;white-space:nowrap}
.pic::after{content:"";position:absolute;inset:-14px;border-radius:2px;box-shadow:0 0 0 0 rgba(255,214,140,0);transition:box-shadow .25s}
.pic:hover::after,.pic:focus-visible::after{box-shadow:0 0 0 3px rgba(255,214,140,.85),0 0 28px 6px rgba(255,200,110,.35)}
.pic:hover img{filter:grayscale(1) contrast(1.1) brightness(1.08)}
.pic:focus-visible{outline:none}

.pan{display:none}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:20px 20px calc(20px + env(safe-area-inset-bottom));border-top:1px solid #222;font-weight:700;font-size:14px;letter-spacing:.2em;color:var(--grey)}
.foot a{text-decoration:none}.foot a:hover{color:var(--white)}
.foot .legal{color:#6f6b64}

/* ===== scheda artista: la pagina è un quadro ===== */
.wall-bg{min-height:100svh;padding:76px 16px 40px;background:radial-gradient(ellipse at 50% 0,rgba(255,200,120,.12),transparent 55%),var(--teal)}
.frame{--bs:.42;max-width:1000px;margin:0 auto;filter:drop-shadow(0 26px 30px rgba(0,0,0,.55))}
.frame.c1{border-style:solid;border-image:url(img/crew/cornice-01.webp) 162 110 164 109 fill stretch;border-width:calc(162px*var(--bs)) calc(110px*var(--bs)) calc(164px*var(--bs)) calc(109px*var(--bs))}
.frame.c2{border-style:solid;border-image:url(img/crew/cornice-02.webp) 143 121 146 120 fill stretch;border-width:calc(143px*var(--bs)) calc(121px*var(--bs)) calc(146px*var(--bs)) calc(120px*var(--bs))}
.frame.c3{border-style:solid;border-image:url(img/crew/cornice-03.webp) 145 103 145 103 fill stretch;border-width:calc(145px*var(--bs)) calc(103px*var(--bs)) calc(145px*var(--bs)) calc(103px*var(--bs))}
.frame.c4{border-style:solid;border-image:url(img/crew/cornice-04.webp) 133 103 133 102 fill stretch;border-width:calc(133px*var(--bs)) calc(103px*var(--bs)) calc(133px*var(--bs)) calc(102px*var(--bs))}
.frame.c5{border-style:solid;border-image:url(img/crew/cornice-05.webp) 143 138 146 138 fill stretch;border-width:calc(143px*var(--bs)) calc(138px*var(--bs)) calc(146px*var(--bs)) calc(138px*var(--bs))}
.frame.c6{border-style:solid;border-image:url(img/crew/cornice-06.webp) 147 109 147 107 fill stretch;border-width:calc(147px*var(--bs)) calc(109px*var(--bs)) calc(147px*var(--bs)) calc(107px*var(--bs))}
.mat{background:var(--mat);color:#221f1a;padding:clamp(18px,4vw,48px);font-family:var(--sans);letter-spacing:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15),inset 3px 3px 10px rgba(0,0,0,.18)}
.a-head{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:clamp(16px,3vw,36px);align-items:center;margin-bottom:28px}
.a-photo{margin:0;background:#fff;padding:8px;box-shadow:0 6px 14px rgba(0,0,0,.25)}
.a-photo img{width:100%;aspect-ratio:5/6;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.a-kicker{margin:0;font-family:var(--f);font-weight:700;font-size:13px;letter-spacing:.24em;color:#7a7264}
.mat h1{font-family:var(--f);margin:6px 0 4px;font-weight:700;font-size:clamp(36px,6vw,64px);line-height:1;letter-spacing:.06em}
.a-style{margin:0 0 12px;font-family:var(--f);font-weight:700;font-size:16px;letter-spacing:.16em;color:var(--red)}
.a-bio{margin:0;font-size:17px;line-height:1.55;max-width:46ch}
.mat h2{font-family:var(--f);margin:0 0 12px;font-weight:700;font-size:18px;letter-spacing:.2em;border-bottom:2px solid #221f1a;padding-bottom:4px;display:inline-block}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin-bottom:30px}
.gallery button{padding:6px;border:0;background:#fff;box-shadow:0 4px 10px rgba(0,0,0,.2);transition:transform .2s}
.gallery button:hover,.gallery button:focus-visible{transform:translateY(-3px) rotate(-1deg);outline:none}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover}
.a-info{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.a-info p{margin:0;font-size:16px;line-height:1.6}
.a-info a{text-decoration-color:var(--red);text-underline-offset:3px}
.a-note{margin:26px 0 0;font-size:13px;color:#8b8375}
.a-nav{max-width:980px;margin:22px auto 0;display:flex;justify-content:space-between;gap:10px;font-weight:700;letter-spacing:.14em;font-size:14px}
.a-nav a{text-decoration:none;color:var(--paper)}.a-nav a:hover{color:#fff}
.lb{padding:0;border:0;background:transparent;max-width:92vw;max-height:92svh;overflow:visible}
.lb::backdrop{background:rgba(5,5,5,.9)}
.lb img{max-width:92vw;max-height:88svh;background:#fff;padding:8px}
.lb button{position:absolute;top:-16px;right:-16px;width:40px;height:40px;border:0;border-radius:50%;background:var(--paper);color:var(--ink);font-size:16px}

@media (max-width:860px){
  .ttx{gap:8px;font-size:13px}.ttx-hint{display:none}
  .room{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}
  .room::-webkit-scrollbar{display:none}
  .track{position:relative;inset:auto}
  .pan{display:block;position:fixed;left:0;top:calc(100svh - 44px);z-index:20;width:100vw;margin:0;text-align:center;font-weight:700;font-size:13px;letter-spacing:.2em;text-shadow:0 1px 4px #000;pointer-events:none;transition:opacity .4s}
  .pan.gone{opacity:0}
}
@media (max-width:640px){
  .frame{--bs:.22}
  .wall-bg{padding-left:8px;padding-right:8px}
  .a-head{grid-template-columns:1fr}.a-photo{max-width:220px}
  .a-info{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .a-nav{font-size:12px;letter-spacing:.08em}
}

.pic.soon span{color:#7a7264}
.pic.soon img{opacity:.85}
.w-soon{aspect-ratio:1;display:grid;place-items:center;background:#f4efe4;border:2px dashed #b9ae93;color:#8b8375;font-family:var(--f);font-weight:700;font-size:13px;letter-spacing:.14em;text-align:center;padding:8px}
