/* Black-and-white editorial theme. Artwork retains its original colors. */
:root{color-scheme:dark;--editorial-ink:#fff;--editorial-muted:#fff;--editorial-rule:#333}
html,body,body>header,dialog,#contact{background:#000;color:#fff}
body *{color:#fff!important}
body>header{border-color:#333}
#info-view .info-portrait,#info-view .info-profile,#info-view .info-index,#info-view .info-entry,#contact{border-color:#333}
.work-viewport{scrollbar-width:none}
#contact-form input,#contact-form textarea{background:#000;border-color:#555;color:#fff}
#contact-form input::placeholder,#contact-form textarea::placeholder{color:#aaa;opacity:1}
#contact-form .contact-send{background:#000;border:1px solid #fff;color:#fff}
#contact-form .contact-send:hover{background:#202020}
dialog::backdrop,#contact::backdrop{background:#000b;backdrop-filter:blur(7px)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline-color:#fff}
::selection{background:#fff;color:#000}

/* Minimal entry screen using the original logo without its white margins. */
body[data-page="home"]>header,body[data-page="home"]>main{display:none}
#entrance{min-height:100svh;display:grid;place-items:center;background:#000;padding:32px}
#entrance[hidden]{display:none}
.entrance-content{display:flex;flex-direction:column;align-items:center;gap:44px}
.entrance-logo{position:relative;width:clamp(200px,28vw,340px);aspect-ratio:267/63;overflow:hidden}
.entrance-logo img{display:block;width:100%;height:100%;object-fit:contain}
.enter-link{font-family:'Courier New',monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:12px 20px;opacity:.65;transition:opacity .2s}
.enter-link:hover,.enter-link:focus-visible{opacity:1;text-decoration:none}


/* Gear partners, carried over from the original Gear page. */
#info-view .info-gear{grid-column:1/-1;min-width:0;border-top:1px solid #333;margin-top:56px;padding-top:24px}
#info-view .info-gear h3{margin:0 0 28px;color:#888;text-transform:uppercase;font-size:11px;letter-spacing:.08em}
.gear-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 34px}
#info-view .gear-brand{display:flex;align-items:center;justify-content:center;min-height:112px;padding:22px 20px;opacity:.65;transition:opacity .2s}
#info-view .gear-brand:hover,#info-view .gear-brand:focus-visible{opacity:1}
.gear-brand img{display:block;max-width:100%;width:auto;height:auto;max-height:65px;filter:grayscale(1) invert(1);mix-blend-mode:screen}
@media(max-width:1000px){.gear-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}#info-view .gear-brand{padding:18px 8px}}
@media(max-width:700px){#info-view .info-gear{margin-top:10px;padding-top:24px}.gear-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}#info-view .gear-brand{min-height:105px;padding:20px}.gear-brand img{max-height:60px}}

/* Six selected partners in reading order, two per row. */
#info-view .gear-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px;margin:0 auto;gap:20px 60px}
#info-view .gear-brand{min-height:128px;padding:28px 40px}
#info-view .gear-brand img{max-width:200px;width:100%;max-height:70px;object-fit:contain}
@media(max-width:700px){#info-view .gear-grid{gap:12px 24px}#info-view .gear-brand{padding:22px 12px;min-height:105px}#info-view .gear-brand img{max-height:60px}}

/* Artist credits flow across the page in the established catalogue font. */
#info-view .info-artists{grid-column:1/-1;min-width:0;border-top:1px solid #333;margin-top:46px;padding:24px 0 0}
#info-view .info-artists h3{font-family:'Courier New',monospace;font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:.08em;margin:0 0 22px;opacity:.65}
#info-view .artist-flow{font-family:'Courier New',monospace;font-size:13px;line-height:2.3;letter-spacing:0;font-weight:400;margin:0;max-width:1160px}
#info-view .artist-name{white-space:nowrap}
#info-view .artist-separator{padding:0 7px;opacity:.4}
#info-view .info-gear{margin-top:36px}
@media(max-width:700px){#info-view .info-artists{margin-top:0}#info-view .artist-flow{line-height:2.15}#info-view .artist-separator{padding:0 3px}#info-view .info-gear{margin-top:0}}
/* Flush artwork rows; preserve original proportions and saved individual sizing. */
.work-card{--art-height:1!important}

/* Artist-specific titles remain crisp while preserving the original photographs. */
.artist-poster{position:relative;display:block;width:100%;height:100%;overflow:hidden;isolation:isolate}
.artist-poster>img:first-child{display:block;width:100%;height:100%;object-fit:contain}
.artist-poster .artist-poster-logo{position:absolute;z-index:1;object-fit:contain!important;max-height:none!important;height:auto!important;width:72%!important;left:14%;bottom:7%;filter:drop-shadow(0 2px 5px #0007)}
.artist-poster-colby .artist-poster-logo{top:6%;bottom:auto;left:8%;width:56%!important;filter:grayscale(1) invert(1);mix-blend-mode:screen}
.artist-poster-jagwar .artist-poster-logo{width:44%!important;left:4%;bottom:5%}
.artist-poster-name{position:absolute;left:6%;bottom:6%;font-family:ExpressiveSerif,Georgia,serif;font-style:italic;font-size:clamp(28px,4vw,52px);letter-spacing:-.045em;line-height:1;color:#fff2d9!important;text-shadow:0 2px 12px #402b1b66;white-space:nowrap}
.detail-media .artist-poster{height:auto}
.detail-media .artist-poster>img:first-child{height:auto}
@media(max-width:700px){.artist-poster-name{font-size:32px}}

/* Project popups: visual destinations first, concise credits below. */
.project-links{clear:both;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px;padding:12px 0 32px}
.project-links:has(>a:only-child){grid-template-columns:minmax(0,1fr)}
.project-link-card{display:block;min-width:0;text-decoration:none!important}
.project-link-image{position:relative;background:#111;aspect-ratio:16/10;overflow:hidden;display:flex;align-items:center;justify-content:center}
.project-link-image>img,.project-link-image>video{display:block;width:100%;height:100%;object-fit:contain}
.project-link-image .artist-poster{height:100%}
.project-link-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:52px;height:52px;padding-left:3px;border:1px solid #ffffffaa;border-radius:50%;background:#0009;color:#fff;font-size:18px;transition:background .2s}
.project-link-card:hover .project-link-play{background:#000d}
.project-link-caption{display:block;margin-top:10px;font:12px/1.4 var(--editorial-text)}
.project-info{clear:both;border-bottom:1px solid var(--editorial-rule);padding:0 0 24px;margin-bottom:24px}
#detail .project-info h2{margin:0 0 12px}
.project-info .detail-title{margin:0 0 28px}
.project-credits h3{font:12px/1.4 var(--editorial-text);margin:0 0 10px}
.project-credits ul{list-style:none;padding:0;margin:0;font:14px/1.8 var(--editorial-text)}
@media(max-width:600px){.project-links{grid-template-columns:1fr;gap:22px;padding-bottom:24px}.project-link-image{aspect-ratio:4/3}}

.project-gallery{clear:both;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:12px 0 30px;align-items:start}.project-gallery img{display:block;width:100%;height:auto}@media(max-width:600px){.project-gallery{gap:10px}}

.jordin-feature{position:relative;width:100%;aspect-ratio:3/4;height:100%;overflow:hidden;background:#170e29;color:#fff5e6;isolation:isolate}
.jordin-photo{position:absolute;inset:0;overflow:hidden}
.jordin-photo>img{position:absolute!important;width:337%!important;max-width:none!important;height:auto!important;left:-120%;top:-8%;object-fit:initial!important}
.jordin-feature:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,#170e2930 62%,#170e29 85%);z-index:1}
.jordin-copy{position:absolute;left:8%;right:6%;bottom:3%;z-index:2;text-align:left}
.jordin-copy strong{display:block;font-family:ExpressiveSerif,Georgia,serif;font-size:clamp(32px,3.5vw,54px);font-weight:400;line-height:.88;letter-spacing:-.055em;margin:8px 0 10px}
.jordin-eyebrow{font-size:9px;letter-spacing:.13em;display:block}
.jordin-song{font-size:12px;letter-spacing:.12em;display:block}
.jordin-with{font-size:10px;opacity:.7;display:block;margin-top:9px}
.detail-media .jordin-feature{height:auto;max-width:440px;margin:auto}

.project-media-entry{min-width:0}.streaming-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.streaming-links a{display:inline-flex;align-items:center;padding:9px 13px;border:1px solid currentColor;border-radius:999px;font-size:12px;line-height:1.3;text-decoration:none;color:inherit}.streaming-links a:hover,.streaming-links a:focus-visible{background:#fff2d9;color:#171717}

/* Preserve the original DXG HAUS wordmark from Ponce artwork. */
.dxg-corner-logo{position:absolute;right:5%;bottom:5%;width:24%;height:auto;overflow:hidden;mix-blend-mode:multiply;filter:grayscale(1) contrast(1.7)}

/* Carry the opening monogram through the portfolio. */
.header-brand{display:flex;align-items:center;gap:24px;min-width:0}
.site-logo{display:flex;align-items:center;flex:0 0 auto;min-height:44px}
.site-logo img{display:block;width:100px;height:auto}
body>header{align-items:center}
.footer-brand{display:flex;align-items:flex-start;flex-direction:column;gap:15px;justify-self:start}
.footer-brand img{display:block;width:145px;height:auto}
.footer-brand span{font-size:14px}
body[data-page="work"] footer,body[data-page="info"] footer{display:grid;border-color:#333;margin-top:48px;gap:24px}
@media(max-width:700px){.header-brand{gap:16px}.site-logo img{width:76px}.header-brand .wordmark{font-size:24px}.header-brand .wordmark span{font-size:9px;max-width:240px;line-height:1.4}.footer-brand img{width:125px}}
@media(max-width:380px){.header-brand{gap:12px}.site-logo img{width:64px}.header-brand .wordmark{font-size:21px}}

/* Keep the disciplines with the footer signature. */
footer{grid-template-columns:1fr auto;align-items:start}
.footer-identity{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.footer-identity>p{font-size:12px;line-height:1.6;color:#aaa}
@media(max-width:700px){footer>span{grid-column:2;grid-row:1}.footer-identity>p{grid-column:auto;grid-row:auto}}

/* A quiet, logo-only footer. */
body footer{grid-template-columns:1fr;padding:24px 0}
footer .footer-brand img{width:100px;height:auto}

/* Give mobile Safari definite poster dimensions and isolate the cropped wordmark. */
.work-card .work-card-link,.work-card .work-artwork{width:100%;min-width:0}
.artist-poster-dxg{position:relative;overflow:hidden}
.artist-poster-dxg>img.dxg-corner-logo{position:absolute;display:block;right:5%;bottom:5%;left:auto;top:auto;width:24%!important;height:5.28%!important;max-width:24%!important;max-height:5.28%!important;object-fit:contain;margin:0;pointer-events:none}
