/* nova-digital: «Все проекты» и страницы проектов (подключается автоматически из админки → Проекты) */

/* ── карточка целиком кликабельна (главная + список) ── */
.work-card{position:relative}
.work-title a{color:inherit;text-decoration:none}
.work-title a::after{content:"";position:absolute;inset:0;z-index:3}
.work-card .work-overlay a{position:relative;z-index:4}

/* ── кнопка «Все проекты» под сеткой на главной ── */
.works-more{display:flex;justify-content:center;margin-top:48px}
.works-all{padding:15px 34px!important;border-radius:999px!important;font-family:var(--ff-head);font-weight:700;letter-spacing:.02em;border-color:rgba(255,217,61,.4)!important;background:var(--gold-dim)!important;color:var(--gold)!important;transition:all .25s}
.works-all span{display:inline-block;transition:transform .25s}
.works-all:hover{background:var(--gold)!important;color:#0a0a0a!important;border-color:var(--gold)!important;transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(255,217,61,.6)}
.works-all:hover span{transform:translateX(5px)}
body.light .works-all:hover{color:#fff!important}

/* ── сетка карточек на внутренних страницах (у них нет стилей главной) ── */
.pj-list{padding:70px 40px 40px}
.pj-list-inner,.pj-more{max-width:1400px;margin:0 auto}
.pj-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px}
.pj-grid>.work-card{flex:0 1 calc((100% - 56px)/3);min-width:0}
.pj-grid .work-card{background:linear-gradient(170deg,var(--bg2),var(--bg1));border:1px solid var(--border);border-radius:20px;overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s;opacity:1!important;transform:none}
.pj-grid .work-card:hover{transform:translateY(-8px);border-color:rgba(255,217,61,.45);box-shadow:0 30px 60px -28px rgba(0,0,0,.75)}
.pj-grid .work-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg3)}
.pj-grid .work-img img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .5s}
.pj-grid .work-card:hover .work-img img{transform:scale(1.04)}
.pj-grid .work-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(10,10,10,.55);opacity:0;transition:opacity .3s}
.pj-grid .work-card:hover .work-overlay{opacity:1}
.pj-grid .work-overlay a{padding:11px 24px;border-radius:999px;background:var(--gold);color:#0a0a0a;font-weight:700;font-size:13px;text-decoration:none;font-family:var(--ff-head)}
.pj-grid .work-body{padding:24px 26px 28px}
.pj-grid .work-tag{display:inline-block;font-size:10px;font-weight:700;color:var(--gold);background:var(--gold-dim);border-radius:999px;padding:4px 11px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px;font-family:var(--ff-head)}
.pj-grid .work-title{font-family:var(--ff-head);font-size:19px;font-weight:700;color:var(--text);margin-bottom:6px}
.pj-grid .work-desc{font-size:14px;color:var(--muted);line-height:1.6}
/* рамка MacBook на внутренних страницах — когда включён модуль nd-mockup, он подключается и тут */
@media (max-width:1100px){.pj-grid>.work-card{flex-basis:calc((100% - 28px)/2)}}
@media (max-width:900px){.pj-list{padding:48px 20px 24px}}
@media (max-width:640px){.pj-grid>.work-card{flex-basis:100%}}

/* ── страница проекта ── */
.pj-hero .svc-hero-inner,.pj-index-hero .svc-hero-inner{max-width:1400px}
.pj-hero .svc-hero-inner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:center}
.pj-hero h1{font-size:clamp(30px,4.2vw,58px)}
.pj-device{position:relative;padding:0 6% 22px;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55))}
.pj-lid{position:relative;border:11px solid #0b0b0d;border-bottom-width:14px;border-radius:18px 18px 0 0;background:#0b0b0d;box-shadow:0 0 0 2px #3b3b40}
.pj-lid img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top center;border-radius:4px}
.pj-cam{position:absolute;top:-8px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#1d1d22;box-shadow:0 0 0 2px #2a2a30;z-index:2}
.pj-base{position:absolute;left:0;right:0;bottom:0;height:15px;border-radius:0 0 20px 20px/0 0 15px 15px;background:linear-gradient(180deg,#e6e7eb 0%,#b7b8be 55%,#8d8e94 100%);box-shadow:inset 0 -1px 0 rgba(0,0,0,.3)}
.pj-base::before{content:"";position:absolute;left:50%;top:0;width:18%;height:6px;margin-left:-9%;border-radius:0 0 10px 10px;background:linear-gradient(#a3a4aa,#8f9096)}
.pj-feats{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 0;padding:0}
.pj-feats li{position:relative;padding:14px 16px 14px 42px;background:var(--bg2);border:1px solid var(--border);border-radius:12px;font-size:14px;color:var(--muted);line-height:1.6}
.pj-feats li::before{content:"✓";position:absolute;left:15px;top:13px;color:var(--gold);font-weight:700}
.pj-more{margin-top:70px;padding-top:50px;border-top:1px solid var(--border)}
.pj-more-title{font-family:var(--ff-head);font-size:24px;font-weight:800;color:var(--text);margin-bottom:26px}
.pj-more-all{display:flex;justify-content:center;margin-top:36px}
.pj-hero~.svc-content .svc-inner,.svc-content .svc-inner:has(.pj-more){max-width:1400px}
@media (max-width:980px){.pj-hero .svc-hero-inner{grid-template-columns:1fr;gap:36px}.pj-device{padding:0 3% 20px}}
@media (max-width:640px){.pj-feats{grid-template-columns:1fr}.pj-lid{border-width:7px;border-bottom-width:9px;border-radius:12px 12px 0 0}}

/* HTML-статья проекта */
.pj-article{overflow-wrap:anywhere}
.pj-article>*:first-child{margin-top:0}
.pj-article h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:2em 0 .6em;letter-spacing:-.02em}
.pj-article h3{font-size:1.25rem;margin:1.6em 0 .5em}
.pj-article h4{font-size:1.05rem;margin:1.4em 0 .4em}
.pj-article p,.pj-article li{line-height:1.8}
.pj-article p{margin:0 0 1.1em}
.pj-article a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.pj-article ul,.pj-article ol{margin:0 0 1.2em;padding-left:1.4em}
.pj-article ul li::marker{color:var(--gold)}
.pj-article li{margin-bottom:.4em}
.pj-article img,.pj-article video{display:block;max-width:100%;height:auto;margin:1.6em 0;border-radius:14px;border:1px solid var(--border);box-shadow:0 18px 40px -22px rgba(0,0,0,.6)}
.pj-article figure{margin:1.6em 0}
.pj-article figure img{margin:0}
.pj-article figcaption{margin-top:8px;font-size:.85rem;color:var(--muted);text-align:center}
.pj-article blockquote{margin:1.6em 0;padding:18px 22px;border-left:3px solid var(--gold);background:var(--gold-dim);border-radius:0 14px 14px 0;font-size:1.05rem}
.pj-article blockquote p:last-child{margin:0}
.pj-article table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:.95rem;display:block;overflow-x:auto}
.pj-article th,.pj-article td{padding:10px 14px;border-bottom:1px solid var(--border);text-align:left}
.pj-article th{color:var(--gold);font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.pj-article iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:14px;margin:1.6em 0;background:#000}
.pj-article code{padding:2px 6px;border-radius:6px;background:var(--bg3);font-size:.9em}
.pj-article pre{padding:16px;border-radius:12px;background:var(--bg3);overflow:auto;margin:1.4em 0}
.pj-article hr{border:0;border-top:1px solid var(--border);margin:2em 0}

/* iPhone рядом с MacBook на странице проекта */
.pj-device.has-phone{padding-right:16%}
.pj-phone{position:absolute;right:1%;bottom:2px;width:21%;max-width:210px;aspect-ratio:9/19.3;border:7px solid #0b0b0d;border-radius:30px;background:#0b0b0d;box-shadow:0 0 0 2px #4a4a50,0 0 0 4px #1d1d21,0 28px 40px -10px rgba(0,0,0,.7);overflow:hidden;z-index:3}
.pj-phone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;border-radius:23px}
.pj-island{position:absolute;top:7px;left:50%;width:32%;height:11px;margin-left:-16%;border-radius:8px;background:#0b0b0d;z-index:2}
@media (max-width:640px){.pj-device.has-phone{padding-right:14%}.pj-phone{border-width:5px;border-radius:20px;width:24%}.pj-phone img{border-radius:15px}.pj-island{top:5px;height:8px}}

/* галерея скриншотов страниц */
.pj-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.pj-shot{margin:0}
.pj-shot a{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--border);background:#0b0b0d;box-shadow:0 22px 40px -24px rgba(0,0,0,.8);transition:transform .35s,border-color .3s}
.pj-shot a:hover{transform:translateY(-4px);border-color:var(--gold)}
.pj-bar{display:flex;gap:6px;align-items:center;height:26px;padding:0 12px;background:linear-gradient(#2a2a2f,#1c1c20)}
.pj-bar i{width:9px;height:9px;border-radius:50%;background:#55555c}.pj-bar i:nth-child(1){background:#ff5f57}.pj-bar i:nth-child(2){background:#febc2e}.pj-bar i:nth-child(3){background:#28c840}
.pj-shot img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top center}
.pj-shot figcaption{margin-top:10px;font-size:.88rem;color:var(--muted);text-align:center}
.pj-gallery{margin-top:8px}
@media (max-width:640px){.pj-shots{grid-template-columns:1fr}}

/* мобильные скриншоты и просмотр-галерея */
.pj-gal-h{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:26px 0 14px}
.pj-gal-h:first-of-type{margin-top:6px}
.pj-shots-m{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:18px}
.pj-shot-m a{background:none;border:0;box-shadow:none;overflow:visible}
.pj-mph{position:relative;aspect-ratio:9/19.3;border:5px solid #0b0b0d;border-radius:22px;background:#0b0b0d;box-shadow:0 0 0 1.5px #4a4a50,0 18px 30px -14px rgba(0,0,0,.75);overflow:hidden;transition:transform .35s}
.pj-shot-m a:hover .pj-mph{transform:translateY(-4px)}
.pj-mph img{display:block;width:100%!important;height:100%!important;aspect-ratio:auto;object-fit:cover;object-position:top center;border-radius:16px}
.pj-mph .pj-island{top:5px;height:7px}
.pj-shot a{cursor:zoom-in}
.pj-lb{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;background:rgba(5,5,7,.94);backdrop-filter:blur(6px);padding:56px 70px}
.pj-lb.on{display:flex}
.pj-lb figure{margin:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;gap:12px}
.pj-lb img{max-width:100%;max-height:calc(100vh - 150px);width:auto;height:auto;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.7);background:#111}
.pj-lb.m img{max-height:calc(100vh - 140px);border-radius:26px;border:6px solid #0b0b0d;box-shadow:0 0 0 2px #4a4a50,0 30px 80px rgba(0,0,0,.7)}
.pj-lb figcaption{color:#cfcfd4;font-size:.95rem;min-height:1.2em}
.pj-lb button{position:absolute;border:0;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;border-radius:50%;width:46px;height:46px;font-size:28px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .2s}
.pj-lb button:hover{background:var(--gold,#ffd93d);color:#111}
.pj-lb-x{top:16px;right:18px}.pj-lb-p{left:16px;top:50%;margin-top:-23px}.pj-lb-n{right:16px;top:50%;margin-top:-23px}
.pj-lb-c{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:#9a9aa2;font-size:.85rem}
@media (max-width:700px){.pj-lb{padding:56px 10px}.pj-lb-p,.pj-lb-n{top:auto;bottom:12px;margin:0}.pj-lb-p{left:14px}.pj-lb-n{right:14px}.pj-shots-m{grid-template-columns:repeat(3,1fr);gap:12px}.pj-mph{border-width:4px;border-radius:16px}.pj-mph img{border-radius:12px}}

/* ── галерея v2: страницы целиком, десктоп / планшет / телефон ── */
.pj-shot .pj-scr{position:relative;overflow:hidden;background:#fff}
.pj-shot .pj-scr img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:top center}
.pj-shot-d .pj-scr{aspect-ratio:16/10}
.pj-shots-t{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.pj-shot-t a{border:8px solid #0b0b0d;border-radius:24px;background:#0b0b0d;box-shadow:0 0 0 1.5px #4a4a50,0 22px 36px -18px rgba(0,0,0,.8);overflow:hidden}
.pj-shot-t .pj-scr{aspect-ratio:820/1180;border-radius:15px}
.pj-shots-m{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:18px}
.pj-shot-m a{border:5px solid #0b0b0d;border-radius:22px;background:#0b0b0d;box-shadow:0 0 0 1.5px #4a4a50,0 18px 30px -14px rgba(0,0,0,.75);overflow:hidden}
.pj-shot-m .pj-scr{aspect-ratio:390/844;border-radius:16px}
.pj-shot-m .pj-scr::before{content:"";position:absolute;top:5px;left:50%;width:30%;height:7px;margin-left:-15%;border-radius:6px;background:#0b0b0d;z-index:2}
.pj-full{position:absolute;right:8px;bottom:8px;z-index:3;padding:3px 9px;border-radius:999px;background:rgba(10,10,12,.78);color:#fff;font-size:.68rem;letter-spacing:.03em;backdrop-filter:blur(4px)}
.pj-shot-m .pj-full{right:50%;margin-right:-34px;font-size:.6rem;padding:2px 7px;white-space:nowrap}
/* просмотр: страница прокручивается внутри рамки устройства */
.pj-lb img,.pj-lb.m img{max-height:none;border:0;border-radius:0;box-shadow:none}
.pj-lb-v{overflow-y:auto;max-height:calc(100vh - 150px);background:#111;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.7);scrollbar-width:thin;scrollbar-color:#555 transparent}
.pj-lb-v img{display:block;width:100%;height:auto}
.d-d .pj-lb-v{width:min(1240px,calc(100vw - 150px))}
.d-t .pj-lb-v{width:min(560px,calc(100vw - 150px));border:8px solid #0b0b0d;border-radius:26px;box-shadow:0 0 0 2px #4a4a50,0 30px 80px rgba(0,0,0,.7)}
.d-m .pj-lb-v{width:min(340px,calc(100vw - 150px));border:6px solid #0b0b0d;border-radius:32px;box-shadow:0 0 0 2px #4a4a50,0 30px 80px rgba(0,0,0,.7)}
@media (max-width:900px){.pj-shots-t{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.d-d .pj-lb-v{width:calc(100vw - 20px)}.d-t .pj-lb-v{width:min(460px,calc(100vw - 24px))}.d-m .pj-lb-v{width:min(320px,calc(100vw - 40px))}.pj-lb-v{max-height:calc(100vh - 170px)}.pj-shots-m{grid-template-columns:repeat(3,1fr);gap:12px}.pj-shot-m a{border-width:4px;border-radius:16px}.pj-shot-m .pj-scr{border-radius:12px}}
@media (max-width:520px){.pj-shots-t{grid-template-columns:1fr 1fr;gap:12px}.pj-shot-t a{border-width:5px;border-radius:14px}.pj-shot-t .pj-scr{border-radius:9px}}
