/* L'Égo Contour — mapa 7 grzechów */
.sins{overflow:hidden}
.sins .head{max-width:760px}
.sins-wrap{display:grid;grid-template-columns:minmax(0,690px) minmax(0,1fr);gap:clamp(30px,3.4vw,48px);align-items:start;margin-top:40px}
.sinmap{position:relative;width:100%;aspect-ratio:1;max-width:690px;margin-inline:auto}
.sinmap svg{width:100%;height:100%;display:block;overflow:visible}
.sm-star{transform-origin:300px 300px;animation:smspin 120s linear infinite}
@keyframes smspin{to{transform:rotate(360deg)}}
.sm-ring{fill:none;stroke:rgba(201,164,92,.35);stroke-width:1}
.sm-ring2{fill:none;stroke:rgba(201,164,92,.12);stroke-width:1;stroke-dasharray:2 7}
.sm-hept{fill:none;stroke:rgba(201,164,92,.28);stroke-width:1}
.sm-gram{fill:none;stroke:rgba(168,33,61,.38);stroke-width:1}
.sm-c7{font-family:var(--serif);font-style:italic;font-weight:300;font-size:120px;fill:var(--gold2)}
.sm-ct{font-family:var(--serif);font-size:30px;letter-spacing:.3em;fill:#f3ece6}
.sm-cs{font-family:var(--sans);font-size:10.5px;letter-spacing:.42em;fill:var(--rose)}
.sm-node{cursor:pointer;outline:none}
.sm-node .bg{fill:url(#smn);stroke:rgba(201,164,92,.5);stroke-width:1.2;transition:fill .4s,stroke .4s}
.sm-node .halo{fill:none;stroke:var(--wine2);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center;transition:opacity .4s}
.sm-node .ic{fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.sm-node .num{font-family:var(--serif);font-size:15px;fill:var(--gold);text-anchor:middle}
.sm-node .lbl{font-family:var(--serif);font-size:26px;fill:#f3ece6;text-anchor:middle;letter-spacing:.04em;transition:fill .4s}
.sm-node .sub{font-family:var(--sans);font-size:9.5px;letter-spacing:.3em;fill:var(--mute);text-anchor:middle;text-transform:uppercase}
.sm-node .scale{transform-box:fill-box;transform-origin:center;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sm-node:hover .scale,.sm-node:focus-visible .scale{transform:scale(1.1)}
.sm-node:focus-visible .bg{stroke:var(--gold2);stroke-width:2}
.sm-node.soon .ic{stroke:rgba(201,164,92,.55)}
.sm-node.soon .lbl{fill:rgba(243,236,230,.6)}
.sm-node.on .bg{fill:url(#smo);stroke:var(--rose)}
.sm-node.on .ic{stroke:var(--gold2)}
.sm-node.on .lbl{fill:var(--gold2)}
.sm-node.on .halo{opacity:1;animation:smpulse 2.4s ease-out infinite}
@keyframes smpulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.55);opacity:0}}
.sm-node.live .dot{fill:var(--rose)}
.sm-node .dot{fill:transparent}

.sinpanel{position:relative;min-height:420px;scroll-margin-top:90px}
.sp-in{animation:spin .6s cubic-bezier(.2,.8,.2,1)}
@keyframes spin{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:none}}
.sp-k{font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.sp-t{font-family:var(--serif);font-weight:300;font-size:clamp(44px,5.4vw,72px);line-height:.95;margin-bottom:6px}
.sp-t em{color:var(--rose);font-style:italic}
.sp-l{font-family:var(--serif);font-style:italic;color:var(--mute);font-size:20px;margin-bottom:18px}
.sp-d{color:var(--mute);max-width:520px;margin-bottom:18px}
.sp-f{max-width:520px;margin-bottom:26px;padding-left:18px;border-left:1px solid var(--wine2);color:#e7dfd9;font-size:15px}
.sp-f b{display:block;font-weight:400;font-size:10.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.sp-badge{display:inline-block;font-size:10px;letter-spacing:.32em;text-transform:uppercase;padding:7px 12px;border:1px solid var(--line);color:var(--gold2);margin-bottom:22px}
.sp-badge.live{border-color:var(--wine2);color:#fff;background:rgba(168,33,61,.35)}
.sp-gal{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:26px}
.sp-gal button{position:relative;padding:0;border:1px solid rgba(255,255,255,.08);background:#111;cursor:zoom-in;overflow:hidden;aspect-ratio:2/3;display:block}
.sp-gal button:first-child{grid-row:span 2;aspect-ratio:auto}
.sp-gal img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .5s;filter:saturate(.92)}
.sp-gal button:hover img{transform:scale(1.06);filter:saturate(1.05)}
.sp-gal button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(7,7,10,.55));pointer-events:none}
.sp-gal button:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.sp-soon{position:relative;border:1px solid var(--line);padding:clamp(28px,4vw,46px);margin-bottom:26px;background:radial-gradient(circle at 80% 0%,rgba(168,33,61,.22),transparent 60%),rgba(255,255,255,.015)}
.sp-soon svg{width:64px;height:64px;fill:none;stroke:var(--gold);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;opacity:.8;margin-bottom:16px}
.sp-soon p{color:var(--mute)}
.sp-row{display:flex;flex-wrap:wrap;gap:12px}

.sbox{position:fixed;inset:0;z-index:200;background:rgba(5,4,7,.94);display:none;align-items:center;justify-content:center;padding:60px 70px}
.sbox.open{display:flex;animation:spin .4s ease-out}
.sbox img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 30px 80px -30px rgba(168,33,61,.6);border:1px solid rgba(201,164,92,.2)}
.sbox button{position:absolute;background:none;border:1px solid var(--line);color:var(--gold2);width:48px;height:48px;font-size:22px;cursor:pointer;transition:border-color .3s,background .3s}
.sbox button:hover{border-color:var(--gold);background:rgba(201,164,92,.08)}
.sbox .x{top:16px;right:16px}
.sbox .pv{left:14px;top:50%;margin-top:-24px}
.sbox .nx{right:14px;top:50%;margin-top:-24px}
.sbox .ct{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.4em;color:var(--gold)}

@media(max-width:1000px){.sins-wrap{grid-template-columns:1fr}.sinpanel{min-height:0}}
@media(max-width:560px){.sm-node .lbl{font-size:30px}.sm-node .sub{display:none}.sp-gal{grid-template-columns:1fr 1fr;grid-template-rows:auto}.sp-gal button:first-child{grid-column:span 2;grid-row:auto;aspect-ratio:2/3}.sbox{padding:56px 8px}.sbox .pv,.sbox .nx{top:auto;bottom:10px;margin:0}.sbox .ct{bottom:26px}}
@media(prefers-reduced-motion:reduce){.sm-star,.sm-node.on .halo{animation:none}}

/* === Next chapter / Arriving soon === */
.sp-badge.arr{border-color:var(--rose);color:#fff;background:linear-gradient(100deg,rgba(168,33,61,.5),rgba(168,33,61,.15));display:inline-flex;align-items:center;gap:10px;position:relative;overflow:hidden}
.sp-badge.arr::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,236,190,.35),transparent);animation:bsh 3.2s ease-in-out infinite}
@keyframes bsh{0%,55%{left:-60%}100%{left:130%}}
.pd{width:7px;height:7px;border-radius:50%;background:var(--rose);box-shadow:0 0 0 0 rgba(226,103,127,.7);animation:pdp 1.6s ease-out infinite}
@keyframes pdp{0%{box-shadow:0 0 0 0 rgba(226,103,127,.75)}100%{box-shadow:0 0 0 12px rgba(226,103,127,0)}}
.sp-tz{display:grid;grid-template-columns:clamp(150px,40%,210px) minmax(0,1fr);gap:clamp(16px,2.4vw,26px);align-items:center;border:1px solid var(--line);padding:clamp(14px,2vw,20px);margin-bottom:12px;background:radial-gradient(circle at 85% 0%,rgba(168,33,61,.26),transparent 62%),rgba(255,255,255,.015)}
.tz-m{position:relative;aspect-ratio:9/16;overflow:hidden;background:#0d0b10;box-shadow:0 0 0 1px rgba(201,164,92,.25),0 24px 60px -26px rgba(226,31,63,.7);animation:tzglow 3.6s ease-in-out infinite}
@keyframes tzglow{50%{box-shadow:0 0 0 1px rgba(240,215,154,.5),0 24px 70px -20px rgba(255,40,70,.95)}}
.tz-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;animation:tzkb 12s ease-in-out infinite alternate}
@keyframes tzkb{from{transform:scale(1.02)}to{transform:scale(1.12) translate(-2%,-1%)}}
.tz-scan{position:absolute;left:0;right:0;height:22%;top:-25%;background:linear-gradient(180deg,transparent,rgba(255,60,90,.28),rgba(255,236,190,.18),transparent);mix-blend-mode:screen;animation:tzs 3.8s linear infinite;pointer-events:none}
@keyframes tzs{to{top:105%}}
.tz-m::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 1px,transparent 1px 3px);opacity:.5}
.tz-c{position:absolute;width:16px;height:16px;border:solid var(--gold2);border-width:0;z-index:2;opacity:.85}
.tz-c.a{top:8px;left:8px;border-top-width:1px;border-left-width:1px}.tz-c.b{top:8px;right:8px;border-top-width:1px;border-right-width:1px}
.tz-c.c{bottom:8px;left:8px;border-bottom-width:1px;border-left-width:1px}.tz-c.d{bottom:8px;right:8px;border-bottom-width:1px;border-right-width:1px}
.tz-rec{position:absolute;left:14px;bottom:16px;z-index:2;display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px #000}
.tz-rec i{width:7px;height:7px;border-radius:50%;background:#ff2b4d;animation:tzr 1.2s steps(2,start) infinite}
@keyframes tzr{50%{opacity:.1}}
.tz-t svg{width:46px;height:46px;fill:none;stroke:var(--gold);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;margin-bottom:10px;filter:drop-shadow(0 0 8px rgba(201,164,92,.5));animation:tzfl 4s ease-in-out infinite}
@keyframes tzfl{50%{transform:translateY(-4px) rotate(-4deg)}}
.tz-h{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.2vw,40px);line-height:1;margin-bottom:8px}
.tz-g{position:relative;display:inline-block;color:var(--gold2);text-shadow:0 0 18px rgba(226,103,127,.45);animation:tzgl 3s ease-in-out infinite}
.tz-g::after{content:attr(data-t);position:absolute;left:0;right:0;top:0;background:linear-gradient(100deg,transparent 30%,#fff 45%,#fff6dc 50%,transparent 65%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:tzsh 3.6s linear infinite}
@keyframes tzgl{50%{text-shadow:0 0 26px rgba(255,60,90,.8)}}
@keyframes tzsh{from{background-position:100% 0}to{background-position:-150% 0}}
.tz-w{font-size:10px;letter-spacing:.38em;text-transform:uppercase;color:var(--rose);margin-bottom:12px;position:relative;padding-bottom:10px}
.tz-w::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:linear-gradient(90deg,var(--rose),transparent);transform-origin:left;animation:tzw 3s ease-in-out infinite}
@keyframes tzw{0%{transform:scaleX(0)}60%,100%{transform:scaleX(1)}}
.tz-p{color:var(--mute);font-size:14px}
.sp-th{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:26px}
.sp-th button{padding:0;border:1px solid rgba(255,255,255,.08);background:#111;cursor:zoom-in;overflow:hidden;aspect-ratio:3/4;display:block}
.sp-th img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.95);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sp-th button:hover img{transform:scale(1.07)}
.sp-th button:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.sm-tag rect{fill:rgba(168,33,61,.92);stroke:rgba(240,215,154,.7);stroke-width:.8}
.sm-tag text{font-family:var(--sans);font-size:8px;letter-spacing:.2em;fill:#fff;font-weight:500}
.sm-tag{pointer-events:none}.sm-tag .tgi{animation:tgf 2.6s ease-in-out infinite}
@keyframes tgf{50%{transform:translateY(-3px)}}
.sm-node.arr .dot{fill:var(--rose)}
.sm-node.arr .bg{stroke:rgba(226,103,127,.8);animation:arrb 2.4s ease-in-out infinite}
@keyframes arrb{50%{stroke:rgba(240,215,154,.9);stroke-width:1.9}}
.sm-node.arr .ic{stroke:var(--gold2)}
.sm-node.arr:not(.on) .halo{opacity:1;animation:smpulse 2.8s ease-out infinite}
@media(max-width:560px){.sp-tz{grid-template-columns:1fr 1fr}.sm-tag{display:none}.sp-th{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){.tz-v,.tz-scan,.tz-m,.tz-t svg,.tz-g,.tz-g::after,.tz-w::after,.sp-badge.arr::after,.pd,.tz-rec i,.sm-tag,.sm-node.arr .bg,.sm-node.arr:not(.on) .halo{animation:none}.tz-scan{display:none}}

.sm-bigsk{fill:none;stroke:rgba(201,164,92,.16);stroke-width:.45;stroke-linejoin:round;pointer-events:none}
.sm-node .ic{stroke-width:.95}
.tz-t svg{stroke-width:1.5!important;width:54px!important;height:54px!important}

/* czaszki: akcenty */
.sm-node .ic{stroke-width:.8;filter:drop-shadow(0 0 3px var(--c,#c9a45c))}
.sm-node .ac,.tzi .ac{stroke:var(--c);}
.sm-node .af,.tzi .af{fill:var(--c);fill-opacity:.38;stroke:var(--c)}
.sm-node .ck,.tzi .ck{stroke-width:.5;opacity:.65}
.sm-node .eg,.tzi .eg{fill-opacity:.55;animation:egl 3.2s ease-in-out infinite}
@keyframes egl{50%{fill-opacity:.95}}
.sm-node .tw,.tzi .tw{animation:twk 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes twk{0%,100%{opacity:.25;transform:scale(.6)}50%{opacity:1;transform:scale(1.15)}}
.sm-node .fl2,.tzi .fl2{transform-box:fill-box;transform-origin:50% 100%;animation:flk .9s ease-in-out infinite alternate}
@keyframes flk{from{transform:scaleY(.92) skewX(-2deg)}to{transform:scaleY(1.08) skewX(2deg)}}
.sm-node .zz,.tzi .zz{animation:zzf 3.4s ease-in-out infinite}
@keyframes zzf{50%{transform:translate(1.5px,-2.5px);opacity:.6}}
.sm-node .wg,.tzi .wg{transform-box:fill-box;transform-origin:100% 50%}
.sm-node:hover .ic{filter:drop-shadow(0 0 7px var(--c))}
.sm-node.on .ic{filter:drop-shadow(0 0 8px var(--c))}
.sm-node.soon:not(.on):not(:hover) .ic{opacity:.85}
.sm-bigsk{stroke:rgba(201,164,92,.14)}
.tz-t svg.tzi{filter:drop-shadow(0 0 9px var(--c));stroke:var(--gold)}
@media(prefers-reduced-motion:reduce){.sm-node .eg,.tzi .eg,.sm-node .tw,.tzi .tw,.sm-node .fl2,.tzi .fl2,.sm-node .zz,.tzi .zz{animation:none}}

.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}