
.projects-page { padding-bottom:85px; }
.project-breadcrumb { display:flex; gap:14px; padding-top:30px; font-size:12px; color:var(--muted); }
.project-breadcrumb a:hover { color:#f18b42; }
.projects-intro { padding:48px 0 44px; }
.projects-sticker,.project-art-label { display:inline-block; width:fit-content; padding:7px 10px; border-radius:5px; background:#f18b42; color:#151515; transform:rotate(-2deg); font:700 10px/1.4 ui-monospace,monospace; letter-spacing:1.1px; text-transform:uppercase; }
.projects-intro h1 { margin:23px 0 14px; font-size:clamp(42px,5.3vw,74px); letter-spacing:-3px; }
.projects-subtitle { font-size:clamp(21px,2.4vw,30px); color:#c6c8ce; font-weight:500; line-height:1.35; letter-spacing:-.7px; }
.projects-intro>p:last-child { max-width:760px; margin-top:23px; color:var(--muted); font-size:15px; }
.projects-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.project-card { min-width:0; overflow:hidden; border-radius:25px; border:2px solid #25282f; background:var(--surface); box-shadow:0 9px 0 #060709,0 21px 32px #0004; display:flex; flex-direction:column; transition:border-color .2s; }
.project-card:hover,.project-card:focus-within { border-color:#f18b42; }
.project-art { isolation:isolate; position:relative; height:240px; padding:24px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(ellipse at 80% 30%,#f18b4212,transparent 65%),#0c0e11; overflow:hidden; }
.project-art::before { content:''; position:absolute; z-index:-2; width:270px; height:270px; right:-90px; top:-65px; background:repeating-conic-gradient(#ffffff05 0% 25%,transparent 0% 50%) 50% / 56px 56px; transform:rotate(-18deg); mask-image:linear-gradient(#000,transparent); }
.project-art::after { content:''; position:absolute; z-index:-1; width:75%; height:104px; border:1px solid #3e414b; border-radius:16px; background:linear-gradient(130deg,#222630,#111318); transform:translate(14px,9px) rotate(5deg); box-shadow:0 10px 22px #0009; }
.project-art-label { position:absolute; z-index:2; left:20px; top:20px; font-size:9px; letter-spacing:.6px; }
.project-logo-plate { display:grid; place-items:center; width:100%; min-height:100px; padding:15px 12px; border:1px solid #33363e; border-radius:14px; background:#0a0a0d; transform:rotate(-3deg); box-shadow:0 5px 0 #050608,0 16px 28px #0008,inset 0 1px 0 #ffffff08; }
.project-logo { display:block; width:100%; max-width:250px; height:auto; object-fit:contain; }
.rexher-art .project-logo { max-width:211px; }
.project-cover-note { position:absolute; bottom:22px; left:24px; right:24px; color:#a9adb8; text-align:center; font-size:10px; letter-spacing:.2px; }
.dare-art { background:radial-gradient(ellipse at 50% 50%,#7356d11a,transparent 70%),#0c0e11; }
.fantasy-art { background:radial-gradient(ellipse at 50% 50%,#f18b4217,transparent 70%),#0c0e11; }
.fantasy-art::after { display:block; }
.project-art svg { width:185px; height:126px; margin-top:12px; fill:#191d25; stroke:#f18b42; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 6px 0 #0005); }
.project-art strong { font-size:26px; letter-spacing:-1px; line-height:1; margin-top:6px; }
.project-art strong span { color:#f18b42; }
.project-copy { padding:27px 25px 30px; display:flex; flex:1; flex-direction:column; }
.project-copy>.eyebrow { display:none; }
.project-copy h2 { font-size:28px; letter-spacing:-.8px; margin-bottom:18px; }
.project-copy>p:not(.eyebrow) { color:var(--muted); font-size:14px; line-height:1.75; margin-bottom:22px; }
.project-tags { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:auto 0 25px; padding:0; }
.project-tags li { padding:6px 9px; border-radius:6px; background:#24272e; border:1px solid #343842; color:#c5c9d2; font-size:10px; line-height:1.4; }
.project-visit { width:100%; font-size:13px; }
.projects-invitation { display:flex; align-items:center; justify-content:space-between; gap:40px; margin-top:80px; padding-top:44px; border-top:1px solid var(--line); }
.projects-invitation h2 { font-size:34px; margin:16px 0; }
.projects-invitation p:last-child { color:var(--muted); font-size:14px; }
.projects-invitation .button { flex-shrink:0; }
nav a[aria-current="page"] { color:#f18b42; }
@media(max-width:1000px) {
 .projects-grid { gap:16px; }
 .project-copy { padding:25px 19px 28px; }
 .project-art { padding-inline:18px; }
}
@media(max-width:900px) {
 .projects-grid { grid-template-columns:1fr; max-width:640px; margin-inline:auto; }
 .project-art { height:265px; padding-inline:45px; }
 .project-logo-plate { max-width:350px; }
 .project-art::after { max-width:340px; }
 .project-copy { padding:30px; }
 .projects-invitation { flex-direction:column; align-items:flex-start; margin-top:55px; }
}
@media(max-width:540px) {
 .projects-intro { padding:36px 0; }
 .projects-sticker { font-size:8px; letter-spacing:.5px; }
 .projects-intro h1 { font-size:43px; letter-spacing:-2px; }
 .projects-intro>p:last-child { font-size:14px; }
 .project-art { height:235px; padding-inline:23px; }
 .project-copy { padding:25px 22px 30px; }
 .project-copy h2 { font-size:27px; }
 .projects-invitation h2 { font-size:29px; }
 .projects-invitation .button { gap:14px; max-width:100%; }
}
@media(prefers-reduced-motion:reduce) { .project-card { transition:none; } }

.fantasy-art .project-logo-plate { position:relative; height:106px; min-height:106px; overflow:hidden; }
.fantasy-art .project-logo { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; max-width:300px; }
