*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:#101010;font-family:Calibri,Arial,sans-serif;font-size:18px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit}img{max-width:100%;display:block}::selection{background:#ffcd05}header{position:sticky;top:0;z-index:20;background:#ffffffed;backdrop-filter:blur(18px);border-bottom:1px solid #e8e8e8}.nav{max-width:1440px;margin:auto;padding:23px 5%;display:flex;align-items:center;justify-content:space-between;gap:25px}.logo{width:220px;height:auto}.links{display:flex;align-items:center;gap:30px;font-size:16px;font-weight:700}.links a:hover,.links a[aria-current=page]{text-decoration:underline;text-decoration-color:#ffcd05;text-decoration-thickness:3px;text-underline-offset:8px}.menu{display:none;border:0;background:#ffcd05;padding:8px 16px}.wrap{max-width:1440px;margin:auto;padding:0 5%}.eyebrow{font-size:14px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;margin:0 0 24px}.hero{padding:95px 0 70px}.hero h1{font-size:clamp(52px,7.1vw,104px);line-height:.99;letter-spacing:-.055em;margin:0 0 30px;font-weight:700;max-width:1080px}.hero .lead{max-width:620px;font-size:22px;color:#505050;line-height:1.5}.accent{background:#ffcd05;padding:0 .07em}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.button{display:inline-block;background:#ffcd05;color:#111;padding:14px 24px;border-radius:4px;font-weight:700;font-size:17px;transition:background .2s,transform .2s}.button:hover{background:#efbd00;transform:translateY(-2px)}.button.outline{background:white;border:1px solid #ccc}.button.outline:hover{border-color:#111}.hero-foot{border-top:1px solid #ddd;margin-top:58px;padding-top:20px;display:flex;justify-content:space-between;font-size:14px;color:#666;gap:20px}.section{padding:85px 0;border-top:1px solid #e6e6e6}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}h2{font-size:clamp(34px,4vw,56px);letter-spacing:-.045em;line-height:1.1;margin:0 0 20px}h3{font-size:27px;line-height:1.15;letter-spacing:-.025em;margin:15px 0}p{margin:0 0 20px}.section-head p{max-width:420px;color:#666}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.project{display:block}.project-image{background:#fff;border-radius:6px;overflow:hidden;aspect-ratio:1.5;display:flex;align-items:center;justify-content:center}.project-image img{width:100%;height:100%;object-fit:contain;transition:transform .6s}.project:hover img{transform:scale(1.035)}.meta{display:flex;justify-content:space-between;font-size:14px;color:#666;margin:20px 0 0}.project p{color:#626262;max-width:510px}.service-row{display:grid;grid-template-columns:65px 1fr 1fr 140px;align-items:start;gap:28px;padding:32px 0;border-top:1px solid #d8d8d8}.service-row h3{margin:0}.service-row p{color:#666;margin:0}.number{font-size:14px;color:#777}.text-link{font-weight:700;font-size:16px;border-bottom:2px solid #ffcd05;width:fit-content}.text-link:hover{border-color:#111}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px}.split p{color:#555}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.steps article{border-top:3px solid #ffcd05;padding-top:20px}.steps p{color:#666;font-size:17px}.cta{background:#ffcd05;padding:70px 5%;border-radius:6px;display:flex;justify-content:space-between;align-items:center;gap:35px;margin:25px 0 80px}.cta h2{max-width:760px;margin:0}.cta .button{background:#111;color:white;white-space:nowrap}footer{border-top:1px solid #ddd;padding:45px 0 25px}.footer-top{display:flex;justify-content:space-between;gap:30px}.footer-top p{color:#666;font-size:16px;max-width:360px;margin-top:20px}.footer-links{display:flex;gap:26px;align-items:start;font-size:16px}.copyright{display:flex;justify-content:space-between;font-size:14px;color:#777;margin-top:45px}.detail-hero{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.detail-hero h1{font-size:clamp(48px,5.5vw,78px)}.visual{background:#fff;border-radius:6px;overflow:hidden}.visual img{width:100%;object-fit:contain}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;border-top:1px solid #ddd;padding:30px 0;margin-top:40px}.facts strong{display:block;margin-top:5px}.facts span{font-size:14px;color:#777}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:30px}.gallery img{width:100%;background:#fff;border-radius:5px}.caption{font-size:14px;color:#777;margin-top:12px}.compare{display:grid;grid-template-columns:1fr 1fr;gap:28px}.compare figure{margin:0;background:#fff;padding:20px;border-radius:5px}.compare img{width:100%;aspect-ratio:1.7;object-fit:contain}.compare figcaption{font-size:16px;margin-top:15px}.compare b{display:block;font-size:14px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}.tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.tags span{padding:7px 12px;background:#fff;border-radius:3px;font-size:14px}.deliverables{list-style:none;padding:0;margin:0}.deliverables li{padding:17px 0;border-bottom:1px solid #ddd}.faq details{border-bottom:1px solid #ddd;padding:22px 0}.faq summary{cursor:pointer;font-weight:700;font-size:21px}.faq p{max-width:750px;color:#555;margin:20px 0 0}.contact-link{display:block;padding:25px 0;border-bottom:1px solid #ddd;font-size:clamp(20px,3vw,36px);overflow-wrap:anywhere}.reveal{animation:arrive .65s both}@keyframes arrive{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}:focus-visible{outline:3px solid #111;outline-offset:5px}.skip{position:absolute;left:10px;top:-80px;background:#ffcd05;padding:10px;z-index:99}.skip:focus{top:10px}@media(max-width:800px){.nav{padding:20px 5%;flex-wrap:wrap}.logo{width:185px}.menu{display:block}.links{display:none;width:100%;flex-direction:column;align-items:start;gap:20px;padding:20px 0}.links.open{display:flex}.hero{padding:60px 0 45px}.hero h1{font-size:clamp(46px,10vw,76px)}.hero .lead{font-size:20px}.grid,.split,.detail-hero,.gallery,.compare{grid-template-columns:1fr;gap:30px}.section{padding:55px 0}.section-head{display:block}.service-row{grid-template-columns:30px 1fr;gap:15px}.service-row p,.service-row>a{grid-column:2}.steps{grid-template-columns:1fr 1fr}.cta,.footer-top{display:block}.cta .button{margin-top:25px}.footer-links{flex-wrap:wrap;margin-top:30px}.hero-foot,.copyright{flex-wrap:wrap}.facts{grid-template-columns:1fr;gap:18px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.cm-white,.cm-case .visual,.cm-case .compare figure,.cm-case .gallery img{background:#fff}.cm-case .compare figure{border:1px solid #e6e6e6}.ecosystem-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.ecosystem-grid article{border-top:2px solid #ffcd05;padding-top:20px}.ecosystem-grid p{color:#555}.story-statement{font-size:clamp(25px,3.2vw,43px);line-height:1.25;letter-spacing:-.025em;max-width:1000px}.impact-list{padding:0;list-style:none}.impact-list li{border-bottom:1px solid #ddd;padding:20px 0}.impact-list strong{display:block;font-size:23px}.impact-list span{color:#555}@media(max-width:800px){.ecosystem-grid{grid-template-columns:1fr}}

.project-image,.visual,.gallery img,.compare figure,.cm-white{background:#ffffff!important}

.showcase-gallery{align-items:start}.showcase-gallery figure{margin:0}.showcase-gallery img{width:100%;height:auto}.showcase-gallery{gap:40px}

.detail-navigation{display:flex;align-items:center;gap:30px;padding:23px 0;border-bottom:1px solid #e6e6e6;font-size:15px}.detail-all{font-weight:700;white-space:nowrap;border-right:1px solid #ddd;padding-right:28px}.detail-links{display:flex;flex-wrap:wrap;gap:14px 25px}.detail-links a{padding:5px 0;color:#666}.detail-links a:hover{color:#111}.detail-links a[aria-current=page]{color:#111;font-weight:700;border-bottom:3px solid #ffcd05}.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.related-card{padding:25px;border:1px solid #e6e6e6;border-radius:5px;background:#fff;transition:border-color .2s,transform .2s}.related-card:hover{border-color:#111;transform:translateY(-3px)}.related-card h3{font-size:25px}.related-card p{font-size:17px;color:#666}.related-image{aspect-ratio:1.5;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;margin:-25px -25px 25px}.related-image img{width:100%;height:100%;object-fit:contain}@media(max-width:800px){.detail-navigation{display:block}.detail-all{display:inline-block;border:0;padding:0;margin-bottom:15px}.detail-links{gap:10px 20px}.related-grid{grid-template-columns:1fr}.related-image{max-height:270px}}

.reading-progress{position:fixed;top:0;left:0;width:100%;height:4px;background:#ffcd05;transform:scaleX(0);transform-origin:left;z-index:100}
.scroll-reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.scroll-reveal.is-visible{opacity:1;transform:none}
.service-row{transition:padding .25s,border-color .25s}.service-row:hover{border-color:#ffcd05;padding-left:10px}
.service-expand{grid-column:3;grid-row:2;max-width:500px;font-size:16px}.service-expand summary{font-weight:700;cursor:pointer;list-style-position:inside}.service-expand p{margin-top:15px!important}.service-expand[open] summary{background:#ffcd05;width:fit-content;padding:3px 8px}
.project-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.project-filters button{font-size:16px;padding:11px 18px;border:1px solid #ccc;background:#fff;border-radius:4px;cursor:pointer;transition:background .2s,border-color .2s}.project-filters button[aria-pressed=true]{background:#ffcd05;border-color:#ffcd05;font-weight:700}.project-filters button:hover{border-color:#111}.filter-status{font-size:14px;color:#666;margin-bottom:25px}.project[hidden]{display:none}
.related-card{transition:transform .25s,border-color .25s}.image-preview-trigger{display:block;position:relative;background:#fff;border:0;padding:0;width:100%;cursor:zoom-in;color:#111;font:inherit}.image-preview-trigger>img{width:100%;height:auto}.detail-hero .image-preview-trigger{height:100%}.image-preview-label{position:absolute;bottom:12px;right:12px;background:#ffcd05;font-size:14px;padding:6px 12px;border-radius:3px;opacity:0;transition:opacity .2s}.image-preview-trigger:hover .image-preview-label,.image-preview-trigger:focus-visible .image-preview-label{opacity:1}
.image-dialog{width:94vw;max-width:1400px;max-height:94vh;padding:20px;border:1px solid #ddd;background:#fff;border-radius:6px}.image-dialog::backdrop{background:rgba(0,0,0,.65)}.image-dialog-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #ddd;padding-bottom:15px;margin-bottom:20px}.image-dialog-caption{margin:0;font-size:17px}.image-dialog-close{border:0;background:#ffcd05;padding:10px 16px;font-size:16px;cursor:pointer;white-space:nowrap}.image-dialog-content{max-height:74vh;overflow:auto}.image-dialog-content img{width:100%;height:auto;max-width:none}
@media(max-width:800px){.service-expand{grid-column:2;grid-row:auto}.image-preview-label{opacity:1;font-size:12px}.image-dialog{padding:12px}.image-dialog-bar{align-items:start}.image-dialog-caption{font-size:15px}.image-dialog-close{font-size:14px;padding:8px}.service-row:hover{padding-left:0}}@media(prefers-reduced-motion:reduce){.scroll-reveal{opacity:1;transform:none;transition:none}}

.hero h1 .accent{-webkit-box-decoration-break:clone;box-decoration-break:clone}.phone-location{font-size:clamp(20px,2.2vw,30px);line-height:1.4;overflow-wrap:normal}

.construction-cover{margin-top:45px;border:1px solid #e6e6e6;padding:20px;background:#fff}.construction-panel{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.5fr);gap:40px;align-items:start;padding-top:25px}.construction-panel[hidden]{display:none}.construction-panel-copy{position:sticky;top:130px}.construction-panel-copy p{color:#555}.construction-screen{border:1px solid #e6e6e6;padding:16px;background:#fff!important}.portrait-screen{max-width:430px;justify-self:center}.construction-panel-copy h3{font-size:34px}.construction-case .tags span{border:1px solid #e6e6e6}.construction-case .caption{max-width:900px}@media(max-width:800px){.construction-panel{grid-template-columns:1fr}.construction-panel-copy{position:static}.construction-cover{padding:5px}.construction-screen{padding:8px}.portrait-screen{width:100%}}

.construction-case .construction-cover{padding:0;border:0;border-radius:0}.construction-feature{padding:0;border:0;background:#fff}.construction-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px;margin-top:35px}.construction-benefits article{border-top:2px solid #ffcd05;padding-top:15px}.construction-benefits p{color:#555}.construction-concepts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:50px 30px;margin-top:35px}.construction-concepts article{min-width:0}.construction-concepts .visual{border:1px solid #e6e6e6;margin-bottom:24px}.construction-concepts p{color:#555}.construction-concepts .eyebrow{margin-bottom:10px;font-size:13px}.concept-intro{max-width:780px;color:#555}.construction-full-study{align-items:center}#platform-visuals{scroll-margin-top:105px}@media(max-width:800px){.construction-benefits,.construction-concepts{grid-template-columns:1fr}.construction-benefits{gap:20px}.construction-concepts{gap:40px}}

/* Fluid, restrained motion throughout the original white-and-yellow design. */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}
.reveal{animation:arrive .7s var(--motion-ease) both}
.scroll-reveal{transform:translateY(18px);transition:opacity .7s var(--motion-ease),transform .7s var(--motion-ease)}
.media-motion{opacity:0;transform:translateY(14px) scale(.99);transition:opacity .65s var(--motion-ease),transform .85s var(--motion-ease);transition-delay:0ms}
.media-motion.is-media-visible,.media-motion:focus-within{opacity:1;transform:translateY(0) scale(1);transition-delay:var(--media-delay,0ms)}
.project-image img,.related-image img{transition:transform .85s var(--motion-ease)}
.project:hover .project-image img,.related-card:hover .related-image img{transform:scale(1.025)}
.button,.related-card,.project-filters button{transition:background .25s ease,border-color .25s ease,transform .35s var(--motion-ease)}
.button:active,.project-filters button:active{transform:translateY(1px) scale(.985)}
.links a,.detail-links a{position:relative;transition:color .2s ease}
.image-preview-label{transition:opacity .25s ease,transform .35s var(--motion-ease);transform:translateY(4px)}
.image-preview-trigger:hover .image-preview-label,.image-preview-trigger:focus-visible .image-preview-label{transform:translateY(0)}
.ecommerce-case .ecommerce-cover{margin-top:40px;border:0;border-radius:0;padding:0;background:#fff}
@media(prefers-reduced-motion:reduce){.media-motion,.scroll-reveal{opacity:1!important;transform:none!important;transition:none!important}.reveal{animation:none!important}}

.ecommerce-case .detail-hero{grid-template-columns:1fr;gap:0}.ecommerce-case .detail-hero h1{font-size:clamp(52px,7.1vw,104px)}.related-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}@media(max-width:800px){.ecommerce-case .detail-hero h1{font-size:clamp(46px,10vw,76px)}}

.branding-feature{margin-top:38px}.branding-case .tags span{border:1px solid #e6e6e6}.branding-support{align-items:center}.branding-case .visual{background:#fff}

.detail-links{align-items:center}.project-nav-group{position:relative;font-size:15px}.project-nav-group summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:9px;padding:5px 0;color:#666}.project-nav-group summary::-webkit-details-marker{display:none}.project-nav-group summary:after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}.project-nav-group[open] summary:after{transform:rotate(225deg) translate(-1px,-1px)}.project-nav-group.current-group summary{color:#111;font-weight:700;border-bottom:3px solid #ffcd05}.project-nav-submenu{position:absolute;right:0;top:calc(100% + 10px);width:210px;padding:10px;background:#fff;border:1px solid #ddd;border-radius:5px;box-shadow:0 10px 25px #0000000c;z-index:30}.detail-links .project-nav-submenu a{display:block;padding:12px 14px;border:0;border-radius:3px}.detail-links .project-nav-submenu a:hover,.detail-links .project-nav-submenu a[aria-current=page]{background:#ffcd05;color:#111}.project-nav-group:focus-within{z-index:31}@media(max-width:800px){.project-nav-submenu{right:auto;left:0}}

/* Project navigation stays on a single, horizontally scrollable row. */
.project-navigation{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;gap:30px;scrollbar-width:thin;scrollbar-color:#b8b8b8 #fff;-webkit-overflow-scrolling:touch}
.project-navigation .detail-all{flex:0 0 auto;margin-bottom:0;border-right:1px solid #ddd;padding-right:28px}
.project-navigation .detail-links{flex:0 0 auto;flex-wrap:nowrap;gap:25px;white-space:nowrap}
.project-navigation .detail-links>a,.project-navigation .project-nav-group{flex:0 0 auto;white-space:nowrap}
.project-navigation .project-nav-submenu{position:fixed;top:var(--submenu-top);left:var(--submenu-left);right:auto;white-space:normal}
.project-navigation::-webkit-scrollbar,.project-filters::-webkit-scrollbar{height:5px}
.project-navigation::-webkit-scrollbar-thumb,.project-filters::-webkit-scrollbar-thumb{background:#b8b8b8;border-radius:4px}
.project-filters{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:8px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.project-filters button{flex:0 0 auto;white-space:nowrap}

.project-scroll-shell{display:flex;align-items:center;gap:12px;min-width:0;width:100%}
.project-scroll-shell>.project-navigation,.project-scroll-shell>.project-filters{flex:1 1 0;min-width:0;width:0;max-width:100%;touch-action:pan-x pan-y}
.project-scroll-shell>.project-filters{margin-bottom:18px}
.project-scroll-control{display:none;flex:0 0 36px;width:36px;height:36px;border:1px solid #ddd;border-radius:50%;background:#fff;color:#111;font:26px/1 Calibri,Arial,sans-serif;cursor:pointer}
.has-overflow>.project-scroll-control{display:block}
.project-scroll-control:hover{background:#ffcd05;border-color:#ffcd05}
.project-scroll-control:disabled{opacity:.3;cursor:default;background:#fff;border-color:#ddd}
@media(max-width:600px){.project-scroll-shell{gap:7px}.project-scroll-control{flex-basis:30px;width:30px;height:30px}.project-navigation{gap:20px}.project-navigation .detail-links{gap:22px}}

/* Other projects: three cards per desktop viewport, with horizontal scrolling. */
.related-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 56px)/3);gap:28px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:0;padding:5px 0 16px;min-width:0;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.related-grid>.related-card{scroll-snap-align:start;min-width:0;margin:0}
.project-scroll-shell>.related-grid{flex:1 1 0;width:0;min-width:0}
.related-grid::-webkit-scrollbar{height:5px}
.related-grid::-webkit-scrollbar-thumb{background:#b8b8b8;border-radius:4px}
@media(max-width:800px){.related-grid{grid-auto-columns:85%;gap:18px}}
@media(prefers-reduced-motion:reduce){.related-grid{scroll-behavior:auto}}

.project-detail-page .image-dialog-caption,.project-detail-page .image-preview-label{display:none}

/* Page navigation keeps the final fade state instead of snapping back before loading. */
.reveal{animation:page-arrival .28s ease-out both}
@keyframes page-arrival{from{opacity:0}to{opacity:1}}
html.page-leaving main{animation:none!important;opacity:0;transition:opacity .18s ease-out;pointer-events:none}
@media(prefers-reduced-motion:reduce){.reveal{animation:none!important}html.page-leaving main{opacity:1;transition:none}}

/* Stable image dimensions and lightweight, decode-aware fades. */
img{height:auto}
.project-image img,.related-image img{height:100%}
.media-motion{transform:none;transition:opacity .5s ease;transition-delay:0ms}
.media-motion.is-media-visible,.media-motion:focus-within{transform:none;transition-delay:0ms}
@media(prefers-reduced-motion:reduce){.media-motion{opacity:1!important;transition:none!important}}
/* Keep the loader visible while the image itself fades into view. */
.image-loading-host{position:relative}
.image-loader{display:none;position:absolute;left:50%;top:50%;width:28px;height:28px;margin:-14px 0 0 -14px;border:2px solid #ececec;border-top-color:#ffcd05;border-right-color:#ffcd05;border-radius:50%;animation:image-loading-spin .85s linear infinite;pointer-events:none;z-index:2}
.image-loading .image-loader{display:block}
.image-loading-host img{transition:opacity .5s ease}
.image-loading-host.image-loading img{opacity:0!important}
.media-motion{opacity:1;transform:none;transition:none}
.media-motion img{opacity:0;transition:opacity .5s ease}
.media-motion.is-media-visible img,.media-motion:focus-within img,.image-load-failed img{opacity:1}
.image-dialog-content.image-loading{min-height:180px}
@keyframes image-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.image-loader{animation:none}.image-loading-host img,.media-motion img{transition:none!important}.media-motion img{opacity:1}}

.image-loader{animation-play-state:paused}.image-loading.image-near-view .image-loader{animation-play-state:running}

/* Show already-loaded images immediately; only pending images use a short reveal. */
.image-loading-host img,.media-motion img{transition:opacity .18s ease}
.image-was-cached img{transition:none!important}
.scroll-reveal{transition:opacity .22s ease,transform .28s ease}

.website-offers{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:900px){.website-offers{grid-template-columns:1fr}}