:root{--bg-color:#0a0a0a;--text-color:#fff;--accent-color:#a00;--font-heading:"Anton", sans-serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-body);scroll-behavior:smooth;overflow-x:hidden}#app{flex-direction:column;min-height:100vh;display:flex}h1{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:2px;font-size:clamp(4rem,10vw,8rem);line-height:1}header>p{text-transform:uppercase;margin-top:1rem;font-size:clamp(1.5rem,4vw,3rem);font-weight:900}header{border-bottom:4px solid var(--text-color);flex-direction:column;padding:2rem;display:flex}nav{justify-content:flex-end;gap:2rem;margin-top:2rem;font-size:1.2rem;font-weight:900;display:flex}nav a{color:var(--text-color);text-transform:uppercase;text-decoration:none;transition:color .2s}nav a:hover{color:var(--accent-color)}main{flex:1;padding:2rem}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2rem;display:grid}.artwork{border:4px solid var(--accent-color);background-color:var(--bg-color);flex-direction:column;padding:1rem;transition:transform .2s,box-shadow .2s;display:flex}.artwork:hover{box-shadow:8px 8px 0px var(--accent-color);transform:translate(-8px,-8px)}.artwork-img{aspect-ratio:3/4;object-fit:cover;filter:grayscale()contrast(1.2);width:100%;transition:filter .3s}.artwork:hover .artwork-img{filter:grayscale(0%)contrast(1.2)}.meta{border-top:2px solid var(--text-color);margin-top:1rem;padding-top:.5rem}.meta h2{font-family:var(--font-heading);text-transform:uppercase;letter-spacing:1px;font-size:1.5rem}.meta p{color:#ccc;font-size:.9rem;font-weight:700}footer{border-top:4px solid var(--text-color);text-transform:uppercase;justify-content:space-between;align-items:center;padding:2rem;font-weight:900;display:flex}footer a{color:var(--accent-color);text-decoration:none}footer a:hover{text-decoration:underline}.text-page{max-width:800px;margin:0;padding:2rem 0;animation:.4s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#text-title{font-family:var(--font-heading);text-transform:uppercase;color:var(--accent-color);margin-bottom:2rem;font-size:clamp(3rem,6vw,5rem);line-height:1}#text-content p{margin-bottom:1.5rem;font-size:1.25rem;font-weight:400;line-height:1.6}#text-content p:last-child{margin-bottom:0}@media (width<=768px){nav{justify-content:flex-start}footer{flex-direction:column;align-items:flex-start;gap:1rem}}
