/* UDX design pages: uses the theme's typography, buttons, grid and colors. */
.udx-design-native{color:#19234c;font-family:'DM Sans',sans-serif}
.udx-design-native .design-masthead{padding:96px 32px 64px}
.udx-design-native .design-nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.udx-design-native .design-section{padding:64px 32px;border-top:1px solid #e8e9ed}
.udx-design-native .design-work-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;row-gap:40px;align-items:start;grid-auto-flow:row dense}
.udx-design-native .design-work{margin:0;min-width:0;grid-column:span 4;align-self:start}
.udx-design-native .design-art{appearance:none;display:flex;align-items:center;justify-content:center;width:100%;height:auto;aspect-ratio:var(--art-ratio,1);margin:0 0 16px;padding:clamp(20px,2.5vw,40px);background:#fbfcff;border:0;border-radius:0;cursor:zoom-in}
.udx-design-native .design-art-image{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.udx-design-native .design-art:focus-visible{outline:2px solid #204aff;outline-offset:4px}
.udx-design-native .design-work figcaption{color:#474f70}
.udx-design-native .design-contact{padding:64px 48px;background:#19234c;color:#fff}
.udx-design-native .design-contact h2,.udx-design-native .design-contact p{color:inherit}
.udx-design-native .design-source-note{padding:24px 32px;color:#474f70}
.design-image-dialog{width:min(1200px,94vw);max-height:92vh;padding:0;border:1px solid #e8e9ed;background:#fff;color:#19234c;font-family:'DM Sans',sans-serif}
.design-image-dialog::backdrop{background:rgba(25,35,76,.75)}
.design-image-dialog header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 24px;border-bottom:1px solid #e8e9ed}
.design-image-dialog h2{font:500 20px/1.5 'DM Sans',sans-serif;margin:0}
.design-image-dialog button{font:400 16px/1.25 'DM Sans',sans-serif;color:#204aff;background:#fff;border:1px solid #aebeff;padding:10px 20px;cursor:pointer}
.design-image-dialog .design-image-stage{padding:32px;background:#fbfcff}
.design-image-dialog img{display:block;max-width:100%;height:auto;margin:auto}

.udx-design-native .design-work-wide{grid-column:span 8}
.udx-design-native .design-work-wide .design-art{aspect-ratio:var(--art-ratio,1.778);max-height:880px}
.udx-design-native .design-work-superwide{grid-column:1/-1}
.udx-design-native .design-work-superwide .design-art{aspect-ratio:var(--art-ratio,2.333);max-height:780px}
.udx-design-native .design-work-portrait .design-art{aspect-ratio:var(--art-ratio,.75);max-height:1100px}
.udx-design-native .design-work-grid[data-packed]{grid-auto-rows:1px;row-gap:0}
.design-gallery-row{width:100%;background:#fff}
.design-gallery-row-mist{background:#edf1ff}
.design-gallery-row-navy{background:#19234c}
.design-gallery-row-blue{background:#204aff}
.design-gallery-row .design-section{border-top:0;background:transparent}
.design-gallery-row-navy .udx-design-native,.design-gallery-row-blue .udx-design-native{color:#fff}
.design-gallery-row-navy :is(h2,p,.design-work figcaption),.design-gallery-row-blue :is(h2,p,.design-work figcaption){color:#fff}
.design-gallery-row-navy .udx-btn,.design-gallery-row-blue .udx-btn{color:#fff;border-color:#aebeff}
@media(max-width:991px){.udx-design-native .design-work-grid{grid-template-columns:repeat(6,minmax(0,1fr));column-gap:24px}.udx-design-native .design-work{grid-column:span 3}.udx-design-native .design-work-wide,.udx-design-native .design-work-superwide{grid-column:1/-1}}
@media(max-width:767px){.udx-design-native .design-masthead,.udx-design-native .design-section,.udx-design-native .design-contact{padding:48px 16px}.udx-design-native .design-work-grid{grid-template-columns:1fr;gap:32px}.udx-design-native .design-work{grid-column:1/-1;grid-row-end:auto!important}.udx-design-native .design-work-grid[data-packed]{grid-auto-rows:auto;row-gap:32px}.udx-design-native .design-nav a{width:auto}.udx-design-native .design-art{padding:20px}.udx-design-native .design-work-superwide .design-art{aspect-ratio:16/9}.udx-design-native .design-work-portrait .design-art{max-height:1000px}.design-image-dialog .design-image-stage{padding:16px}}

/* Native Masthead and InquiryForm modules are reused from /about. */
.udx-design-page .masthead-image{display:none}
.udx-design-native .design-collection-nav{padding:16px 32px 32px}
@media(max-width:767px){.udx-design-native .design-collection-nav{padding:8px 0 24px}.udx-design-native .design-section{padding-left:0;padding-right:0}}

.udx-design-native .design-work-half{grid-column:span 6}
.udx-design-native .design-work-half .design-art{aspect-ratio:var(--art-ratio,1.778)}
@media(max-width:991px){.udx-design-native .design-work-half{grid-column:1/-1}}

#udx .design-gallery-row-navy .title-section{color:#aebeff}
#udx .design-gallery-row-blue .title-section{color:#fff}

/* Small source crops retain their native scale and compact frame. */
.udx-design-native .design-work-detail{grid-column:span 4}
.udx-design-native .design-work-detail .design-art{aspect-ratio:auto;min-height:0;padding:24px}
@media(max-width:991px){.udx-design-native .design-work-detail{grid-column:span 3}}
@media(max-width:767px){.udx-design-native .design-work-detail{grid-column:1/-1}}

/* Captions provide preview context without interrupting the visual composition. */
.udx-design-native .design-work figcaption{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.udx-design-native .design-art{margin-bottom:0}

/* Text-only design mastheads: avoid image-layout margin collapse and button offset. */
.udx-design-page #udx .widget-masthead{padding:160px 0 72px}
.udx-design-page #udx .widget-masthead>.container{width:100%;max-width:1536px;margin:0 auto;padding:0 47px!important}
.udx-design-page #udx .widget-masthead .btn{top:0;margin-top:12px}
.udx-design-page #udx .masthead-description{max-width:1100px}
@media(max-width:767px){
.udx-design-page #udx .widget-masthead{padding:120px 0 48px}
.udx-design-page #udx .widget-masthead>.container{padding:0 15px!important}
}

/* Seven focused collections form one even desktop navigation row. */
.udx-design-native .design-collection-nav .design-nav{gap:12px;margin-top:24px}
.udx-design-native .design-collection-nav .design-nav a{white-space:nowrap;text-align:center;padding:12px 16px}
.udx-design-native .design-collection-nav .design-nav a[aria-current="page"]{background:#204aff;border-color:#204aff;color:white}
@media(min-width:992px){.udx-design-native .design-collection-nav .design-nav{flex-wrap:nowrap}.udx-design-native .design-collection-nav .design-nav a{flex:1}}
.udx-design-page #udx .widget-masthead .masthead-description{margin-bottom:0}

/* Give the closing invitation a deliberate transition from the artwork. */
.udx-design-page #udx .widget-inquiry-form{padding-top:80px;padding-bottom:80px}
@media(max-width:767px){.udx-design-page #udx .widget-inquiry-form{padding-top:48px;padding-bottom:48px}}

.design-partnership{background:#edf1ff;width:100vw;margin-left:calc(50% - 50vw)}
.design-partnership-inner{padding:64px 32px;display:flex;align-items:center;justify-content:space-between;gap:40px}
.design-partnership-inner h2{margin:0;max-width:840px}
.design-partnership-inner a{flex-shrink:0;white-space:nowrap}
@media(max-width:767px){.design-partnership-inner{padding:48px 0;display:block}.design-partnership-inner a{display:inline-block;margin-top:24px}}
