.portfolio-layout{padding-top:5rem;min-height:100vh;display:flex;flex-direction:column;align-items:center;text-align:center}.portfolio-title-container{width:100%;padding:1rem 2rem}.portfolio-container{width:100%;max-width:1200px;padding:0 2rem 4rem}.portfolio-title{font-family:var(--font-family-heading);font-size:clamp(2rem,5vw,3rem);text-transform:uppercase;color:var(--color-text);margin-bottom:.5rem;letter-spacing:.05em;margin-top:0}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;justify-content:center;width:100%;max-width:1200px;margin:0 auto}.gallery-item{position:relative;overflow:hidden;transition:transform .3s ease;cursor:pointer;background-color:#f8f8f8;height:200px;width:100%;border-radius:8px;box-shadow:0 2px 8px #0000001a}.gallery-item:hover{transform:translateY(-8px)}.gallery-item img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .3s ease;border-radius:8px;display:block}.image-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#0009);color:#fff;padding:2rem 1.5rem 1.5rem;transform:translateY(100%);transition:transform .3s ease;display:flex;flex-direction:column;justify-content:space-between}.gallery-item:hover .image-overlay{transform:translateY(0)}@media (max-width: 768px){.gallery-item:active .image-overlay{transform:translateY(0)}}.artwork-info h3,.artwork-title{font-family:var(--font-family-heading);font-size:1.3rem;margin:0 0 .5rem;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.artwork-info p,.artwork-media,.artwork-size{font-size:.95rem;margin:0;opacity:1;line-height:1.4;color:#f0f0f0;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.see-art-btn{background-color:#87ceeb;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:6px;font-family:var(--font-family-body);font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:1rem;text-transform:uppercase;letter-spacing:.5px}.see-art-btn:hover{background-color:#5f9ea0;transform:translateY(-2px)}.image-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000000e6;display:flex;justify-content:center;align-items:center;z-index:1000;cursor:pointer}.modal-content{position:relative;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;cursor:default}.close-btn{position:absolute;top:-60px;right:0;background:#000000b3;border:2px solid white;color:#fff;font-size:1.8rem;cursor:pointer;z-index:1001;padding:.5rem .8rem;border-radius:50%;transition:all .3s ease;width:50px;height:50px;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1}.close-btn:hover{background:#fff3;border-color:#87ceeb;color:#87ceeb;transform:scale(1.1)}.expanded-image-container{flex-grow:1;display:flex;justify-content:center;align-items:center}.expanded-image{max-width:100%;max-height:80vh;-o-object-fit:contain;object-fit:contain;box-shadow:0 10px 40px #00000080}.expanded-info{background-color:#000c;padding:1rem;text-align:center;margin-top:1rem;border-radius:4px}.expanded-title{font-family:var(--font-family-heading);font-size:1.2rem;font-weight:600;color:#fff;margin:0 0 .3rem}.expanded-media{font-family:var(--font-family-body);font-size:.9rem;color:#fff;margin:0 0 .2rem}.expanded-size{font-family:var(--font-family-body);font-size:.8rem;color:#fff;margin:0;opacity:.9}@media (max-width: 768px){.portfolio-container{padding:1rem 1.5rem 2rem}.portfolio-title{margin-bottom:.5rem}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;justify-content:center}.gallery-item{height:150px}.artwork-title{font-size:1.2rem}.artwork-media,.artwork-size{font-size:.8rem}.see-art-btn{padding:.6rem 1rem;font-size:.8rem}.modal-content{max-width:95vw;max-height:95vh}.expanded-image{max-height:70vh}.close-btn{top:-50px;font-size:1.5rem;width:45px;height:45px}}.no-artwork-message{text-align:center;padding:4rem 2rem;color:var(--color-light-text)}.no-artwork-message h2{font-family:var(--font-family-heading);font-size:2rem;margin-bottom:1rem;color:var(--color-accent)}.no-artwork-message p{font-family:var(--font-family-body);font-size:1.1rem}@media (max-width: 768px){.portfolio-layout{padding-top:4rem}.portfolio-title-container{padding:1rem}}