:root {
  --paper:#efe9dd; --paper-2:#f6f1e7; --ink:#2b2a26; --ink-soft:#625e55; --orange:#e85c1e;
  --display:"Archivo Black",sans-serif; --mono:"Space Mono",monospace; color-scheme:light;
}
*{box-sizing:border-box}html{background:var(--paper)}
body{background-color:var(--paper);background-image:radial-gradient(rgba(43,42,38,.08) 1px,transparent 1px);background-size:5px 5px;color:var(--ink);font-family:var(--mono);margin:0;min-height:100vh}
body::before{background:var(--orange);content:"";height:8px;left:0;position:fixed;right:0;top:0;z-index:30}
a{color:inherit;text-decoration:none}
.catalogue-header{align-items:center;background:rgba(239,233,221,.94);border-bottom:1.5px solid var(--ink);display:flex;justify-content:space-between;padding:17px clamp(16px,4vw,54px) 13px;position:sticky;top:0;z-index:10}
.brand,.back-link{align-items:center;display:flex;gap:10px}.brand{font-family:var(--display);letter-spacing:.03em;text-transform:uppercase}.brand span{align-items:center;background:var(--orange);border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);color:white;display:flex;height:34px;justify-content:center;width:34px}.back-link{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.back-link:hover{color:var(--orange)}.back-link svg{height:17px;width:17px}
main{margin:auto;max-width:1500px;padding:clamp(42px,6vw,80px) clamp(16px,4vw,58px) 88px}.catalogue-intro{max-width:960px;position:relative}.catalogue-intro::after{border:1px solid var(--orange);content:"CATALOGUE / LIVE";font-size:.52rem;letter-spacing:.14em;padding:7px 9px;position:absolute;right:0;top:0}
.eyebrow,#projectTag{color:var(--orange);font-size:.64rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}h1{font-family:var(--display);font-size:clamp(3.4rem,8vw,7.5rem);font-weight:400;letter-spacing:0;line-height:.84;margin:18px 0 25px;max-width:900px;text-transform:uppercase}.catalogue-intro>p:last-of-type{color:var(--ink-soft);font-size:.9rem;line-height:1.7;max-width:740px}
.catalogue-switch{display:flex;gap:10px;margin-top:30px}.catalogue-switch a{align-items:center;background:var(--paper-2);border:1.5px solid var(--ink);display:flex;font-size:.72rem;font-weight:700;gap:9px;letter-spacing:.07em;padding:12px 17px;text-transform:uppercase;transition:box-shadow 180ms ease,transform 180ms ease,background 180ms ease}.catalogue-switch a:hover{box-shadow:4px 4px 0 var(--ink);transform:translate(-2px,-2px)}.catalogue-switch a.is-active{background:var(--orange);color:white}.catalogue-switch svg{height:18px;width:18px}
.catalogue-grid{display:grid;gap:22px 18px;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:54px}.catalogue-card{background:var(--paper-2);border:1.5px solid var(--ink);color:var(--ink);cursor:pointer;display:flex;flex-direction:column;min-width:0;padding:0;position:relative;text-align:left;transition:box-shadow 220ms ease,transform 220ms ease}.catalogue-card::after{border:1px solid var(--orange);content:"";inset:7px -7px -7px 7px;pointer-events:none;position:absolute;z-index:-1}.catalogue-card:hover{box-shadow:8px 8px 0 rgba(43,42,38,.14);transform:translate(-4px,-4px)}
.catalogue-card-bar{align-items:center;background:var(--ink);color:var(--paper-2);display:flex;font-size:.6rem;justify-content:space-between;letter-spacing:.13em;min-height:34px;padding:8px 12px;text-transform:uppercase}.catalogue-card-bar b{color:var(--orange)}.catalogue-card-bar i{font-size:1rem;font-style:normal;transition:transform 220ms ease}.catalogue-card:hover .catalogue-card-bar i{transform:translate(3px,-3px)}
.catalogue-thumb{align-items:center;aspect-ratio:16/9;background:var(--ink);display:flex;justify-content:center;overflow:hidden;position:relative}.catalogue-thumb::after{background:rgba(69,69,64,.44);content:"";inset:0;position:absolute;transition:opacity 260ms ease}.catalogue-thumb img{filter:grayscale(.28) contrast(.92);height:100%;object-fit:cover;transition:filter 260ms ease,transform 360ms ease;width:100%}.catalogue-card:hover .catalogue-thumb::after{opacity:0}.catalogue-card:hover img{filter:none;transform:scale(1.035)}.catalogue-thumb>span{color:var(--paper-2);font:400 2rem var(--display)}
.catalogue-body{display:flex;flex:1;flex-direction:column;gap:9px;padding:17px}.catalogue-body>span{color:var(--orange);font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.catalogue-body h2{font:400 1.05rem var(--display);letter-spacing:0;margin:0;text-transform:uppercase}.catalogue-body p{color:var(--ink-soft);font-size:.72rem;line-height:1.62;margin:0}.catalogue-body strong{border-top:1px dotted rgba(43,42,38,.35);color:var(--ink-soft);font-size:.58rem;letter-spacing:.08em;margin-top:auto;padding-top:12px;text-transform:uppercase}
.catalogue-modal{display:none;inset:0;position:fixed;z-index:40}.catalogue-modal.is-open{display:block}.catalogue-backdrop{background:rgba(24,23,20,.86);inset:0;position:absolute}.catalogue-panel{background:var(--paper-2);border:2px solid var(--ink);box-shadow:10px 10px 0 var(--orange);display:grid;grid-template-rows:auto minmax(0,1fr);height:min(90vh,960px);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:min(94vw,1280px)}.catalogue-panel header{align-items:center;background:var(--ink);color:var(--paper-2);display:flex;justify-content:space-between;padding:11px 15px}.catalogue-panel h2{font:400 1rem var(--display);margin:3px 0 0;text-transform:uppercase}.catalogue-panel p{margin:0}.catalogue-actions{display:flex;gap:8px}.catalogue-actions a,.catalogue-actions button{align-items:center;background:transparent;border:1px solid rgba(246,241,231,.5);color:var(--paper-2);cursor:pointer;display:flex;font-size:1.7rem;height:40px;justify-content:center;width:40px}.catalogue-actions a:hover,.catalogue-actions button:hover{background:var(--orange);border-color:var(--orange)}.catalogue-actions svg{height:17px;width:17px}#projectFrame{background:var(--paper);border:0;height:100%;width:100%}
@media(max-width:980px){.catalogue-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.catalogue-header{padding:13px 12px 10px}.back-link{font-size:0}.back-link svg{height:22px;width:22px}main{padding-top:38px}.catalogue-intro::after{display:none}h1{font-size:clamp(3rem,18vw,5rem)}.catalogue-switch a{flex:1;justify-content:center;padding-inline:8px}.catalogue-grid{grid-template-columns:1fr;margin-top:34px}.catalogue-panel{border:0;box-shadow:none;height:100dvh;inset:0;transform:none;width:100vw}.catalogue-panel header{padding:9px 10px}.catalogue-panel h2{font-size:.82rem}.catalogue-panel #projectTag{font-size:.52rem}.catalogue-actions a,.catalogue-actions button{height:38px;width:38px}}
@media(prefers-reduced-motion:reduce){.catalogue-card,.catalogue-thumb img,.catalogue-switch a{transition:none}}
