:root{--ouf-indigo:#27187D;--ouf-ghost:#F7F7FF}
.draft-preview-banner{display:flex;align-items:center;justify-content:center;gap:20px;padding:12px 24px;background:#27187D;color:#F7F7FF;position:relative;z-index:1000;font:14px/1.5 Arial,sans-serif;flex-wrap:wrap}.draft-preview-banner a{color:#F7F7FF;text-decoration:underline;text-underline-offset:4px}.is-draft-preview .site-header,.is-draft-preview .case-header{position:relative}.content-error{position:relative;z-index:1001;background:#27187D;color:#F7F7FF;padding:20px;margin:0}.about-details h3{font-size:17px;margin:28px 0 8px}.about-details p{white-space:pre-line}.about-file-unavailable{display:flex;flex-direction:column;justify-content:center;padding:12px 20px;min-height:62px;border:1px solid currentColor;border-radius:4px;opacity:.75}.about-file-unavailable span{font-size:12px}.project-gallery.cms-gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:start!important;gap:32px!important}.cms-gallery .gallery-item{grid-column:auto!important;margin:0!important;width:100%!important;transform:none!important}.cms-gallery .gallery-item.is-landscape{grid-column:1/-1!important}.cms-gallery .gallery-image-frame{display:block!important;aspect-ratio:auto!important;min-height:0!important;background:transparent!important;overflow:visible!important;border:0!important;border-radius:0!important}.cms-gallery img,.project-cover img{display:block;width:100%!important;height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;filter:none!important;transform:none!important;border:0!important;transition:none!important}.cms-gallery .gallery-open{display:block;width:100%;background:transparent;border:0;padding:0;border-radius:0;cursor:zoom-in}.cms-gallery .gallery-open:hover img,.project-cover:hover img{filter:none!important;transform:none!important}.cms-gallery .gallery-open-indicator{transition:opacity .2s}.cms-gallery figcaption{transition:color .2s}.project-cover{width:100%!important;max-height:none!important;aspect-ratio:auto!important;margin-top:40px!important}.project-cover .cover-preview{display:block;width:100%;border:0;background:transparent;padding:0;cursor:zoom-in}.project-story p{white-space:pre-line}.case-card,.project,.project-media,.project-media img,.case-card img{transform:none!important}.case-card img,.project-media img{filter:none!important;transition:none!important}.case-card:hover img,.project:hover .project-media img{transform:none!important;filter:none!important}.project-cta,.case-card-copy,.gallery-caption{transition:color .2s,opacity .2s}.project-image-preview .preview-stage img{max-width:100%;max-height:calc(100dvh - 170px);width:auto;height:auto;object-fit:contain}.project-not-found{padding:80px 0}.project-not-found a{color:inherit;text-decoration:underline}.project-gallery .gallery-open:focus-visible,.cover-preview:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #7661df;outline-offset:5px}.project-hero dd{overflow-wrap:anywhere}.gallery-section{clear:both}
@media(max-width:760px){.project-gallery.cms-gallery{grid-template-columns:minmax(0,1fr)!important;gap:28px!important}.cms-gallery .gallery-item{grid-column:1!important}.draft-preview-banner{gap:10px;padding:12px;font-size:12px}.gallery-intro{display:block!important}.gallery-intro>div{margin-top:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}.case-card{opacity:1!important;transform:none!important}}
:root{--electric:#27187D}html[data-theme=dark]{--electric:#b9adf1}.project-hero>p:not(:first-child){font-size:18px;line-height:1.7;letter-spacing:normal;text-transform:none;font-weight:400;max-width:65ch}.cms-gallery .gallery-item{min-height:0!important}
/* Dimension-aware project spreads. A KV is shown once, in its own opening frame. */
.project-cover.project-cover--portrait,.project-cover.project-cover--story{width:min(100%,680px,calc(80svh * var(--media-ratio)))!important;max-width:none;margin-inline:auto!important;border-radius:8px}
.project-cover.project-cover--square{width:min(100%,820px,80svh)!important;margin-inline:auto!important}
.project-cover.project-cover--landscape{width:100%!important;max-width:1200px}
.project-gallery.cms-gallery{max-width:1160px;gap:clamp(28px,3.5vw,48px) clamp(22px,3vw,40px)!important}
.cms-gallery .gallery-item{padding-top:0!important;align-self:start}
.cms-gallery .gallery-item.is-solo{grid-column:1/-1!important;justify-self:center;width:min(100%,560px)!important}
.cms-gallery .gallery-item.gallery-item--story{justify-self:center;width:min(100%,calc(82svh * var(--media-ratio)))!important}
.cms-gallery .gallery-item.is-landscape:not(.gallery-item--landscape){justify-self:center;width:min(100%,680px,calc(82svh * var(--media-ratio)))!important}
.cms-gallery .gallery-item figcaption{grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:6px;text-align:left}
.cms-gallery .gallery-caption{overflow-wrap:anywhere}
.cms-gallery .gallery-item figcaption .gallery-action{grid-column:2;font-size:12px}
.gallery-section .gallery-intro{max-width:1160px}
.project-hero dl{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:760px){.project-gallery.cms-gallery{max-width:560px;row-gap:32px!important}.cms-gallery .gallery-item.is-solo{grid-column:1!important}.cms-gallery .gallery-item.gallery-item--story{width:min(100%,calc(76svh * var(--media-ratio)))!important}.project-cover.project-cover--portrait,.project-cover.project-cover--story{width:min(100%,calc(76svh * var(--media-ratio)))!important}.project-hero dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Override the older section-wide anchor rule, so icons and labels align as a button. */
.contact-links .contact-link{display:flex;align-items:center;gap:10px;margin:0;min-height:48px}
.contact-links .contact-link svg{display:block;flex:0 0 20px}
.contact-links .contact-link .contact-label{display:block;line-height:1.2}

/* Keep the story in one optional reading section; artwork stays uninterrupted. */
.project-narrative{max-width:1160px;margin:64px auto 16px;padding:32px 0;border-top:1px solid var(--line)}
.narrative-intro{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.narrative-eyebrow{margin:0 0 10px;color:var(--muted);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.narrative-intro h2{margin:0;font-size:clamp(26px,3.5vw,40px);line-height:1.15;letter-spacing:-.035em;font-weight:600}
.narrative-intro h2 span{color:var(--electric)}
.narrative-intro>a{flex-shrink:0;color:var(--ink);font-size:13px;text-decoration:none;padding:12px 0;text-underline-offset:5px}
.narrative-intro>a:hover{text-decoration:underline}
.narrative-item{border-bottom:1px solid var(--line)}
.narrative-item:first-child{border-top:1px solid var(--line)}
.narrative-item summary{display:grid;grid-template-columns:32px minmax(0,1fr) 36px;gap:18px;align-items:start;padding:23px 0;cursor:pointer;list-style:none}
.narrative-item summary::-webkit-details-marker{display:none}
.narrative-item summary::marker{content:''}
.narrative-number{font-size:11px;color:var(--muted);line-height:26px;font-variant-numeric:tabular-nums}
.narrative-heading h3{font-size:clamp(17px,2vw,21px);line-height:1.4;font-weight:600;letter-spacing:-.015em;margin:0}
.narrative-excerpt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;max-width:68ch;color:var(--muted);font-size:14px;line-height:1.65}
.narrative-toggle{position:relative;display:block;width:32px;height:32px;border:1px solid var(--line);border-radius:50%;color:var(--ink);transition:background-color .18s,color .18s}
.narrative-toggle::before,.narrative-toggle::after{content:'';position:absolute;left:9px;top:14px;width:12px;height:1px;background:currentColor}
.narrative-toggle::after{transform:rotate(90deg)}
.narrative-item[open] .narrative-toggle::after{transform:rotate(0)}
.narrative-item[open] .narrative-excerpt{display:none}
.narrative-item summary:hover .narrative-toggle{background:var(--ink);color:var(--paper)}
.narrative-item summary:focus-visible{outline:3px solid #7661df;outline-offset:5px;border-radius:2px}
.narrative-detail{padding:0 54px 26px 50px;max-width:82ch}
.narrative-detail p{margin:0;white-space:pre-line;font-size:16px;line-height:1.8;color:var(--ink)}
.project-visuals{scroll-margin-top:110px}
@media(max-width:760px){.project-narrative{margin-top:40px;padding-top:24px}.narrative-intro{gap:16px;margin-bottom:22px}.narrative-intro>a{font-size:12px}.narrative-item summary{grid-template-columns:22px minmax(0,1fr) 32px;gap:10px;padding:20px 0}.narrative-detail{padding:0 8px 24px 32px}.narrative-detail p{font-size:15px}.narrative-excerpt{font-size:13px}}
@media(prefers-reduced-motion:reduce){.narrative-toggle{transition:none}}
