/* The same restrained glass treatment, adapted to the photographic case studies. */
.project{isolation:isolate;display:block;width:100%;border:1px solid rgba(255,255,255,.19);border-radius:16px;padding:9px;background:linear-gradient(135deg,#1a1a1a,#0e0e0e);box-shadow:inset 0 1px 0 #ffffff09;transition:border-color .35s,box-shadow .35s}
.project-photo{height:auto;aspect-ratio:1;border-radius:9px;background:#161616}
.project-photo>img{object-position:center;transition:transform .8s cubic-bezier(.2,.6,.3,1)}
.project::before,.project::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .45s}
.project::before{z-index:2;background:radial-gradient(400px circle at var(--glow-x,50%) var(--glow-y,0%),rgba(255,255,255,.1),transparent 75%)}
.project::after{z-index:4;padding:1px;background:radial-gradient(250px circle at var(--glow-x,50%) var(--glow-y,0%),rgba(255,255,255,.8),transparent 80%);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.project-label{position:relative;inset:auto;background:none;padding:24px 18px 20px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.project-label h3{font-size:32px;color:#e0e0e0}
.project-label p{font-size:17px;margin:0;text-align:right;color:#aaa}
.project-hover{left:auto;top:auto;right:18px;bottom:18px;transform:none;width:auto;height:auto;padding:11px 17px;border:1px solid #ffffff40;border-radius:30px;background:#161616b8;backdrop-filter:blur(12px);font-size:14px;z-index:3}
.project:hover img{transform:none}
.project:hover .project-hover{opacity:0}
.project:focus-visible{outline-color:#fff;outline-offset:5px;border-color:#ffffff80}
.project:focus-visible .project-hover{opacity:1}
@media(hover:hover) and (pointer:fine){.project:hover{border-color:#ffffff50;box-shadow:0 15px 45px #0004}.project:hover::before,.project:hover::after,.project:hover .project-hover{opacity:1}.project:hover img{transform:scale(1.025)}}
@media(hover:none){.project-hover{opacity:1}}
#project-dialog{max-width:850px;border-radius:16px;padding:28px;color-scheme:dark;scrollbar-width:thin;scrollbar-color:#4a4a4a #171717}
#project-image{height:auto;max-height:45svh;object-fit:contain;border-radius:8px;background:#101010;display:block}
#project-contact{margin-top:10px}
/* Dialogs live above the document's custom cursor; retain the native cursor there. */
html.custom-cursor dialog,html.custom-cursor dialog *{cursor:auto}
html.custom-cursor dialog a,html.custom-cursor dialog button{cursor:pointer}
dialog::backdrop{cursor:auto}
body:has(dialog[open]) #cursor{visibility:hidden}
.contact-channels a{width:fit-content;max-width:100%;overflow-wrap:anywhere}
.contact-channels .whatsapp-link{display:flex;flex-direction:column;gap:5px;color:#d9d9d9}
.whatsapp-link span{font-size:16px;color:#888;letter-spacing:.03em}
.footer-pair .social-links{flex-direction:row;flex-wrap:wrap;gap:12px 26px}
.footer-info{gap:38px}
@media(max-width:700px){.project{padding:7px;border-radius:14px}.project-photo{border-radius:8px}.project-label{padding:18px 12px 16px;align-items:flex-start;flex-direction:column;gap:6px}.project-label h3{font-size:28px}.project-label p{text-align:left;font-size:16px}.project-hover{right:12px;bottom:12px;padding:9px 13px;font-size:12px}#project-dialog{padding:22px}#project-contact{font-size:16px;padding:12px 16px}.footer-pair .social-links{gap:12px 22px}}
