.project-image-link { display:block; text-decoration:none; }
.project-image-link:hover .project-visual { filter:brightness(1.2); }
.project-image-link:focus-visible { outline-offset:-4px; }
.album-link { display:block; text-decoration:none; }
.album-link:hover .hero-art { border-color:var(--paper); }
.footer nav { flex-wrap:wrap; }
.brand-hero { max-width:900px; }
.brand-index { display:flex; flex-wrap:wrap; gap:14px 28px; margin-top:36px; font-size:12px; text-transform:uppercase; letter-spacing:.1em; }
.brand-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.brand-card { border:1px solid var(--line); padding:28px; background:#0c0c0cee; min-width:0; }
.brand-art { display:grid; place-items:center; min-height:260px; margin-bottom:28px; background:#080808; }
.brand-art img { width:240px; height:220px; object-fit:contain; }
.brand-art .brand-wordmark { width:320px; height:auto; }
.brand-card p { color:var(--muted); }
.brand-colors { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.brand-swatch { height:150px; border:1px solid var(--line); margin-bottom:20px; }
.brand-colors h3 { font-size:19px; margin-bottom:8px; }
.brand-colors p { font-size:13px; color:var(--muted); }
.brand-type { font-size:clamp(38px,6vw,72px); line-height:1.1; letter-spacing:-.035em; overflow-wrap:anywhere; }
.brand-medium { font-weight:500; }
.brand-alphabet { overflow-wrap:anywhere; font-size:19px; }
.brand-serif { font-family:Georgia,serif; font-size:24px; }
.brand-name { text-transform:none; letter-spacing:0; }
.brand-texture { background:transparent; }
@media(max-width:800px) { .nav { flex-wrap:wrap; padding:14px 0 20px; gap:12px; } .nav nav { flex-wrap:wrap; } .brand-colors { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:520px) { .nav { align-items:flex-start; flex-direction:column; } .nav nav { width:100%; justify-content:space-between; gap:10px; } .brand-grid { grid-template-columns:1fr; } .brand-card { padding:20px; } .brand-art { min-height:220px; } .footer { flex-direction:column; } .footer nav { gap:14px; } }
