@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap");
:root{--ink:#141a20;--muted:#65717a;--paper:#f7f8f6;--panel:#fff;--line:#dce2df;--accent:#2563eb;--shadow:0 14px 42px rgba(22,31,28,.055)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}.shell{max-width:1510px;margin:auto;padding:0 clamp(18px,4vw,68px)}.site-header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{display:flex;gap:13px;align-items:center;font-size:12px;letter-spacing:.16em;font-weight:700}.mark{font-weight:700;font-size:27px;border:2px solid var(--ink);width:46px;height:46px;display:grid;place-items:center;letter-spacing:-.1em}.mark span{color:var(--accent)}nav{display:flex;gap:28px;font-size:13px;font-weight:600}.intro{padding:86px 0 71px;max-width:950px}.eyebrow,.kicker{font-size:11px;font-weight:700;letter-spacing:.15em;color:var(--muted)}.status-dot{width:8px;height:8px;background:#31b78e;border-radius:50%;display:inline-block;margin-right:9px}.intro h1{font-size:clamp(48px,6.7vw,102px);line-height:1.015;letter-spacing:-.07em;font-weight:500;margin:24px 0 28px}.intro h1 em{font-family:"Instrument Serif",Georgia,serif;letter-spacing:-.032em;font-weight:400;color:#3368a8}.intro p{font-size:17px;line-height:1.7;color:#4d5b65;max-width:710px;margin:0}.intro code,.how code{font-size:.86em;background:#e7eef5;padding:3px 6px;border-radius:4px;color:#1e4876}.intro-foot{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;font-size:12px;color:#6a767c;font-weight:600}.separator{color:#c4ccc8}.explore{padding:52px 0 95px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px;gap:16px}.section-heading h2,.how h2{font-size:clamp(29px,3.5vw,48px);font-weight:500;letter-spacing:-.055em;margin:8px 0 0}.count-pill{font-size:12px;border:1px solid var(--line);background:#fff;padding:10px 15px;border-radius:100px;color:#51616a;white-space:nowrap}.filters{display:grid;grid-template-columns:minmax(280px,1fr) 174px 210px auto;gap:10px;align-items:stretch}.search-wrap{position:relative;display:flex;align-items:center;background:#fff;border:1px solid #d0dad5;border-radius:8px;padding:0 13px}.search-wrap:focus-within,.select-wrap:focus-within{border-color:var(--accent);outline:3px solid #2563eb19}.search-wrap svg{width:19px;height:19px;fill:none;stroke:#71808a;stroke-width:2;flex:none}.search-wrap input{border:none;background:transparent;outline:0;padding:15px 12px;min-width:0;width:100%;color:var(--ink);font-size:13px}.search-wrap kbd{border:1px solid var(--line);border-radius:4px;padding:2px 6px;font-size:11px;color:#97a1a5}.select-wrap{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:5px 12px;background:#fff;border:1px solid #d0dad5;border-radius:8px}.select-wrap span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:#8b969d}.select-wrap select{border:0;background:transparent;outline:0;color:#35424a;font-size:13px;max-width:100%;cursor:pointer}#reset,.empty button{border:1px solid var(--line);background:transparent;border-radius:8px;padding:0 15px;color:#55646c;font-size:12px;font-weight:700}#reset:hover,.empty button:hover{background:#eaf0ed}.filter-hint{margin:15px 0 28px;font-size:12px;color:#8a979d}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.design-card{min-width:0;border:1px solid #dce3df;border-radius:12px;background:#fff;overflow:hidden;box-shadow:var(--shadow);transition:transform .16s ease,box-shadow .16s ease}.design-card:hover{transform:translateY(-3px);box-shadow:0 20px 54px #10171e17}.image-link{display:block;aspect-ratio:1.62;background:#e8eeeb;overflow:hidden;position:relative}.image-link img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}.design-card:hover .image-link img{transform:scale(1.025)}.theme-tag{position:absolute;top:13px;right:13px;padding:6px 9px;border-radius:6px;background:#ffffffee;border:1px solid #ffffff77;text-transform:uppercase;letter-spacing:.08em;font-weight:700;font-size:9px;color:#425159}.card-body{padding:18px 19px 19px}.card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.card-top a{font-size:19px;font-weight:700;letter-spacing:-.035em;line-height:1.2}.industry{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:#7a8990;margin-top:5px}.description{font-size:13px;color:#687780;line-height:1.5;min-height:40px;margin:11px 0 15px}.palette{display:flex;gap:5px;margin-bottom:13px}.swatch{width:24px;height:24px;border:1px solid #00000012;border-radius:5px}.font-line{font-size:11px;color:#859199;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-bottom:15px;border-bottom:1px solid #eef1ef}.card-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:13px}.card-actions a,.card-actions button{font-weight:700;font-size:11px}.card-actions a{color:#245b9a}.card-actions button{padding:6px 0;border:none;background:transparent;color:#69777f}.card-actions button:hover{color:var(--accent)}.more{text-align:center;margin-top:36px}.more button{background:#17212b;color:white;border:0;border-radius:8px;padding:15px 23px;font-size:13px;font-weight:700}.more button span{margin-left:15px}.empty{padding:70px 20px;text-align:center;color:#667780;border:1px dashed #cbd5d0;border-radius:12px}.empty strong{display:block;font-size:20px;color:#27343c}.empty button{padding:12px 16px;margin-top:12px}.how{display:grid;grid-template-columns:1fr 1fr;gap:8vw;border-top:1px solid var(--line);padding:80px 0 100px}.how h2{font-size:clamp(36px,4.4vw,62px);line-height:1.1}.how>div>p{max-width:480px;font-size:15px;line-height:1.8;color:#6c7c83;margin-top:25px}.steps{display:grid;gap:0}.steps>div{display:grid;grid-template-columns:42px 1fr;column-gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}.steps>div>span{grid-row:span 2;font-size:12px;color:#8b969d;padding-top:5px}.steps strong{font-size:16px}.steps p{font-size:13px;color:#7c898f;margin:7px 0 0}.steps a{font-weight:700;color:#245b9a;font-size:13px;margin-top:26px}footer{padding:30px 0 44px;border-top:1px solid var(--line);font-size:12px;color:#91a0a5;display:flex;justify-content:space-between;gap:20px}footer a{text-decoration:underline}@media(max-width:1100px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.filters{grid-template-columns:1fr 1fr}.search-wrap{grid-column:span 2}}@media(max-width:640px){.shell{padding:0 18px}.site-header{height:70px}nav{gap:13px;font-size:11px}.wordmark{font-size:9px;gap:8px}.mark{width:37px;height:37px;font-size:22px}.intro{padding:61px 0 55px}.intro h1{font-size:49px}.intro p{font-size:14px}.gallery{grid-template-columns:1fr}.filters{grid-template-columns:1fr 1fr}.search-wrap{grid-column:span 2}.select-wrap{min-width:0}#reset{grid-column:span 2;padding:12px}.section-heading{align-items:center}.how{grid-template-columns:1fr;gap:20px;padding:60px 0}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Exhibition is additive. The catalogue and its original card layout remain independent. */
[hidden]{display:none!important}
.exhibition{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.78fr);align-items:stretch;gap:20px;margin:0 0 36px;background:#17212b;color:#f7f8f6;border-radius:12px;overflow:hidden}
.exhibition>div:first-child{padding:clamp(24px,4vw,58px)}
.exhibition .kicker{color:#a9b8cc}
.exhibition h2{margin:14px 0;font-size:clamp(34px,5vw,68px);font-weight:500;line-height:.98;letter-spacing:-.06em}
.exhibition p{margin:0 0 22px;color:#cbd6df;font-size:15px;line-height:1.6;max-width:410px}
.exhibition-link,.demo-live{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:#d9e8ff;color:#192c49;padding:10px 13px;border-radius:6px;font-weight:700;font-size:12px}
.exhibition-link:hover,.demo-live:hover{background:#a9cbff;color:#12213a}
.exhibition-art{display:flex;justify-content:space-evenly;align-items:center;gap:14px;padding:24px;color:#d9e8ff;background:repeating-linear-gradient(0deg,#c3d9fa1a 0 1px,transparent 1px 29px),repeating-linear-gradient(90deg,#c3d9fa1a 0 1px,transparent 1px 29px),#20344d;font:700 clamp(24px,4.4vw,70px)/.83 system-ui;letter-spacing:-.09em}
.art-dot,.art-arrow{color:#82b5ff}
.filters.has-demos{grid-template-columns:minmax(245px,1fr) minmax(100px,145px) minmax(105px,175px) minmax(110px,145px) auto}
.demo-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.demo-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#dce3df}
.demo-comparison figure{margin:0;background:#f3f6f5}
.demo-comparison .image-link{aspect-ratio:1.55}
.demo-comparison .image-link img{object-position:top}
.demo-comparison figcaption{padding:9px 10px;color:#495967;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.card-top .demo-reference{color:#526475;font-size:12px;line-height:1.4;text-align:right}
.demo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px 14px;margin-top:12px;font-size:11px;font-weight:700}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.image-link:focus-visible{outline-offset:-4px;z-index:1}
@media(max-width:1100px){.filters.has-demos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.demo-gallery,.exhibition{grid-template-columns:minmax(0,1fr)}.exhibition{gap:0}.exhibition-art{justify-content:flex-start;gap:26px;padding:24px;font-size:31px}.filters.has-demos #reset{grid-column:auto}.demo-comparison figcaption{font-size:9px}.site-header nav{gap:9px}}
.demo-signature{font-size:12px;line-height:1.5;color:#526475;margin:14px 0 0}