/* Galería de trabajos Nodocreative */
.project-card{appearance:none;-webkit-appearance:none;border:0;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer;display:block;position:relative;overflow:hidden}
.project-card .overlay{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end}
.project-card .overlay strong{font-size:clamp(1.35rem,2.2vw,2rem);line-height:1.05;margin:.3rem 0 .45rem}
.project-card .overlay span:not(.project-type){font-style:normal}
.project-card .overlay em{margin-top:1rem;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-style:normal;opacity:0;transform:translateY(8px);transition:.3s}
.project-card:hover .overlay em,.project-card:focus-visible .overlay em{opacity:1;transform:none}
.project-card:focus-visible{outline:2px solid #fff;outline-offset:4px}
.project-type{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;opacity:.75}

.project-modal{position:fixed;inset:0;z-index:10000;display:none}
.project-modal.is-open{display:block}
.project-modal-backdrop{position:absolute;inset:0;background:rgba(4,5,6,.88);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.project-modal-panel{position:relative;z-index:1;width:min(1180px,calc(100% - 48px));height:min(760px,calc(100vh - 48px));margin:24px auto;background:#101112;color:#fff;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);overflow:hidden;box-shadow:0 28px 80px rgba(0,0,0,.45)}
.project-modal-close{position:absolute;z-index:5;right:18px;top:14px;width:44px;height:44px;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(0,0,0,.35);color:#fff;font-size:30px;line-height:1;cursor:pointer;transition:.25s}
.project-modal-close:hover{background:#fff;color:#111;transform:rotate(90deg)}
.project-modal-media{position:relative;min-width:0;background:#060708;overflow:hidden}
.project-modal-media img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transform:scale(1.015);transition:opacity .4s,transform .8s}
.project-modal-media img.is-loaded{opacity:1;transform:scale(1)}
.gallery-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:48px;height:48px;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(0,0,0,.28);color:#fff;font-size:32px;cursor:pointer;transition:.25s}
.gallery-arrow:hover{background:#fff;color:#111}.gallery-prev{left:18px}.gallery-next{right:18px}
.gallery-counter{position:absolute;z-index:3;left:22px;bottom:18px;padding:8px 12px;background:rgba(0,0,0,.48);font-size:.75rem;letter-spacing:.1em}
.project-modal-info{overflow-y:auto;padding:70px 42px 34px;background:linear-gradient(145deg,#161719,#0d0e0f)}
.project-modal-info .eyebrow{display:block;color:#bfc1c3;margin-bottom:9px}
.project-modal-info h2{font-size:clamp(2rem,3.3vw,3.6rem);line-height:1;margin:0 0 20px;color:#fff}
.project-modal-info>p{color:#b9b9b9;line-height:1.7;margin-bottom:28px}
.project-meta{margin:0 0 28px;border-top:1px solid rgba(255,255,255,.14)}
.project-meta>div{display:grid;grid-template-columns:125px 1fr;gap:15px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.project-meta dt{font-size:.68rem;text-transform:uppercase;letter-spacing:.13em;color:#85888b}.project-meta dd{margin:0;color:#fff}
.project-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:30px}
.project-thumb{border:1px solid transparent;background:none;padding:0;aspect-ratio:1.3;overflow:hidden;cursor:pointer;opacity:.55;transition:.25s}
.project-thumb img{width:100%;height:100%;object-fit:cover;display:block}.project-thumb.active,.project-thumb:hover{opacity:1;border-color:#fff}
.project-navigation{display:flex;justify-content:space-between;gap:12px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14)}
.project-navigation button{border:0;background:transparent;color:#fff;padding:10px 0;font:inherit;font-size:.82rem;cursor:pointer;transition:.25s}
.project-navigation button:hover{opacity:.62}
body.project-modal-open{overflow:hidden}

@media(max-width:820px){
 .project-modal-panel{width:100%;height:100%;margin:0;display:block;overflow-y:auto}
 .project-modal-media{height:48vh;min-height:330px}
 .project-modal-info{overflow:visible;padding:38px 24px 30px}
 .project-modal-close{position:fixed;right:12px;top:12px}
 .gallery-arrow{width:42px;height:42px}.gallery-prev{left:10px}.gallery-next{right:10px}
 .project-meta>div{grid-template-columns:105px 1fr}
 .project-navigation button{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){.project-modal *{transition:none!important}}