.case-card{display:grid;grid-template-columns:1fr 1.12fr;border:1px solid var(--line);background:var(--white)}.case-cover{padding:36px;background:var(--blue-50);display:flex;flex-direction:column;justify-content:center;gap:22px;min-width:0}.case-screen{width:88%;max-width:360px;margin:auto;border:2px solid var(--blue-900);background:var(--paper);transform:rotate(-3deg);box-shadow:14px 14px 0 var(--factor-cyan)}.screen-top{display:flex;gap:5px;padding:10px;border-bottom:1px solid var(--blue-900)}.screen-top i{width:5px;height:5px;background:var(--blue-700)}.screen-play{background:var(--blue-900);color:var(--paper);margin:18px;text-align:center;padding:18px;font-size:36px}.screen-bars{display:flex;gap:8px;padding:0 18px 18px}.screen-bars i{height:25px;background:var(--factor-green);flex:1}.screen-bars i:nth-child(2){background:var(--factor-blue)}.screen-bars i:nth-child(3){background:var(--factor-cyan)}.case-cover-caption{font-size:12px;color:var(--slate);margin-top:10px}.case-card-copy{padding:40px}.case-card-copy h3{font-size:30px;margin:18px 0 0}.case-subtitle{font-weight:600;color:var(--blue-900);margin:4px 0 18px}.case-card-copy>p:not(.case-subtitle){color:var(--slate)}.case-tags{display:flex;gap:8px;flex-wrap:wrap}.case-tags span{font-size:13px;padding:5px 10px;background:var(--green-50);color:var(--green-700)}.case-filter-panel{display:flex;align-items:end;gap:24px;padding:24px 0;border-block:1px solid var(--line);flex-wrap:wrap}.case-filter-panel label{display:grid;gap:8px;font-size:14px;color:var(--slate);flex:1;min-width:200px}.case-filter-panel select{padding:12px 40px 12px 14px;border:1px solid #7D8D9A;background:var(--paper);color:var(--ink);width:100%;border-radius:var(--radius)}.case-filter-panel button{min-height:52px}.case-empty{padding:60px 24px;background:var(--cream);text-align:center}.case-detail-top{display:grid;grid-template-columns:1.15fr 1fr;gap:40px;align-items:center}.case-detail-hero h1{font-size:clamp(32px,3.8vw,54px);line-height:1.3}.case-detail-hero h1>span{display:block;font-size:.72em;margin-top:18px;font-weight:500}.case-team-art{margin:0}.case-team-art img{width:100%;height:auto}.case-team-art figcaption{font-size:12px;color:var(--slate);text-align:right}.case-facts{display:grid;grid-template-columns:1fr 1fr .7fr 1.7fr;border-top:1px solid var(--line);padding-top:24px;gap:24px;margin:40px 0 0}.case-facts dt{font-size:13px;color:var(--slate)}.case-facts dd{margin:8px 0 0;font-size:15px}.case-article{max-width:1160px}.case-notice{font-size:14px;color:var(--slate);padding:20px 24px;background:var(--cream);border-left:3px solid var(--factor-cyan);margin:36px 0}.case-section{display:grid;grid-template-columns:250px minmax(0,1fr);gap:48px;padding:60px 0;border-bottom:1px solid var(--line);scroll-margin-top:100px}.case-section h2{font-size:28px;line-height:1.5;margin-top:12px}.case-section-body p:first-child{margin-top:0}.case-section-body p{color:var(--slate)}.case-pair-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.case-pair-grid h3{font-size:20px;margin:0 0 10px}.case-pair-grid p{font-size:16px;margin:0}.case-architecture{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 28px;padding:24px;background:var(--blue-50)}.arch-path{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:15px}.arch-path>span{background:var(--paper);padding:16px 12px;border:1px solid var(--line);width:100%}.arch-path .arch-store{border-bottom:3px solid var(--factor-green)}.arch-path b{color:var(--blue-700)}.arch-path small,.arch-output small{font-size:12px}.arch-output{grid-column:1/-1;background:var(--blue-900);color:var(--paper);padding:20px;text-align:center;font-size:15px}.case-architecture figcaption{grid-column:1/-1;font-size:12px;color:var(--slate)}.case-scope{padding-left:22px;line-height:2}.case-related{display:grid;gap:22px}.case-source{font-size:14px;padding:32px 0 60px;color:var(--slate)}.case-source a{color:var(--blue-700);text-decoration:underline}.case-featured{background:var(--cream)}
@media(min-width:1101px){.desktop-nav{gap:20px}.desktop-nav>a,.nav-wrap>a{font-size:14px}.header-inner{gap:20px}}
@media(max-width:800px){.case-card,.case-detail-top,.case-section{grid-template-columns:1fr}.case-section{gap:20px;padding:36px 0}.case-detail-top{gap:24px}.case-facts{grid-template-columns:1fr 1fr}.case-card-copy{padding:28px}.case-cover{padding:28px}.case-team-art{max-width:520px;margin:auto}.case-pair-grid{gap:24px}.case-section h2{margin:8px 0}.case-architecture{padding:16px;gap:12px}}
@media(max-width:500px){.case-pair-grid{grid-template-columns:1fr}.case-filter-panel{gap:16px}.case-filter-panel label{min-width:100%}.case-filter-panel button{width:100%}.case-architecture{grid-template-columns:1fr}.arch-output,.case-architecture figcaption{grid-column:1}.arch-path+.arch-path{border-top:1px solid var(--line);padding-top:20px}.case-detail-hero h1{font-size:34px}.case-facts{gap:20px}.case-card-copy{padding:24px}}
/* Case library: reuse the original case layout for six archived projects. */
.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.case-grid .case-card{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;min-width:0}.case-grid .case-cover{padding:20px;min-height:245px;align-items:center;justify-content:center;gap:10px}.case-client-mark{width:210px;height:210px;object-fit:contain}.case-grid .case-cover-caption{margin:0;text-align:center}.case-grid .case-screen{width:230px;max-width:85%;margin:24px auto}.case-grid .case-card-copy{padding:30px;display:flex;flex-direction:column;align-items:flex-start}.case-grid .case-card-copy>.eyebrow{margin-bottom:16px}.case-grid .case-card-copy>p:not(.case-subtitle){flex:1}.case-grid .case-card-copy h3{font-size:28px}.case-grid .case-card-copy>.text-link{margin-top:10px}.case-grid-featured{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.case-grid-featured .case-card-copy{padding:24px}.case-grid-featured .case-card-copy h3{font-size:25px}.case-grid-featured .case-subtitle{font-size:17px}.case-grid-featured .case-card-copy>p:not(.case-subtitle){font-size:15px}.case-functional-flow{display:block}.case-flow-path{display:flex;flex-direction:column;list-style:none;padding:0;margin:0 0 28px;gap:24px;text-align:center;font-size:16px}.case-flow-path li{position:relative;background:var(--paper);border:1px solid var(--line);padding:14px 18px}.case-flow-path li+li:before{content:'↓';position:absolute;top:-27px;left:calc(50% - 6px);color:var(--blue-700)}.case-flow-path li:last-child{border-bottom:3px solid var(--factor-green)}.case-functional-flow figcaption{padding-top:12px;border-top:1px solid var(--line)}.case-original-diagram{margin:28px 0}.case-original-diagram summary{color:var(--blue-700);cursor:pointer;font-size:15px}.case-original-diagram figure{margin:18px 0}.case-original-diagram img{height:auto;width:100%;background:#111}.case-original-diagram figcaption{font-size:12px;color:var(--slate)}
@media(max-width:1100px){.case-grid-featured{grid-template-columns:1fr}.case-grid-featured .case-card{grid-template-columns:1fr 1.25fr;grid-template-rows:auto}.case-grid-featured .case-cover{min-width:0}.case-grid-featured .case-card-copy{padding:30px}}
@media(max-width:700px){.case-grid{grid-template-columns:1fr}.case-grid-featured .case-card{grid-template-columns:1fr}.case-grid .case-card-copy{padding:24px}.case-grid .case-cover{min-height:225px}.case-grid{gap:24px}.case-flow-path{font-size:15px}}
.case-grid .case-cover{height:290px;min-height:0}.case-grid .case-screen{width:215px;margin:8px auto}.case-grid .case-card{grid-template-rows:290px 1fr}
@media(max-width:1100px) and (min-width:701px){.case-grid-featured .case-card{grid-template-rows:auto}.case-grid-featured .case-cover{height:100%;min-height:290px}}
@media(max-width:700px){.case-grid .case-cover{height:260px}.case-client-mark{width:190px;height:190px}.case-grid .case-card{grid-template-rows:260px 1fr}}
.case-grid .case-project-cover{display:block;width:100%;height:220px;object-fit:cover;object-position:top;border:1px solid var(--line)}.case-project-art{margin:0;min-width:0}.case-project-art>a{display:block;border:1px solid var(--line);overflow:hidden;background:#111}.case-project-art img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:top}.case-project-art figcaption{font-size:12px;color:var(--slate);margin-top:12px;text-align:right}.case-project-art figcaption a{color:var(--blue-700);text-decoration:underline}.case-screenshot-details{margin:32px 0 48px;border:1px solid var(--line);padding:20px 24px;background:var(--white)}.case-screenshot-details summary{cursor:pointer;color:var(--blue-700);font-size:16px;font-weight:500}.case-screenshot-details figure{margin:24px 0 0}.case-screenshot-details img{width:100%;height:auto}.case-screenshot-details figcaption{font-size:13px;color:var(--slate);margin-top:14px}@media(max-width:700px){.case-grid .case-project-cover{height:190px}.case-screenshot-details{padding:18px}.case-project-art figcaption{font-size:12px}}
.case-project-gallery{margin:40px 0 48px}.case-project-gallery>h2{font-size:28px;margin-bottom:24px}.case-project-gallery>figure{margin:0;background:var(--white);border:1px solid var(--line);padding:16px}.case-project-gallery>figure img{width:100%;height:auto}.case-project-gallery figcaption{font-size:13px;color:var(--slate);margin-top:14px}
.case-gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.case-gallery-item{border:1px solid var(--line);background:var(--white);min-width:0;align-self:start}.case-gallery-preview{display:block;background:var(--cream);border-bottom:1px solid var(--line)}.case-gallery-preview img{display:block;width:100%;height:260px;object-fit:cover;object-position:top}.case-gallery-copy{padding:22px}.case-gallery-copy h3{font-size:20px;margin:0 0 10px}.case-gallery-copy>p{font-size:15px;color:var(--slate)}.case-original-link{font-size:14px;color:var(--blue-700);text-decoration:underline}.case-gallery-copy .case-screenshot-details{padding:14px 0 0;margin:18px 0 0;border:0;border-top:1px solid var(--line)}.case-gallery-copy .case-screenshot-details summary{font-size:14px}.case-gallery-copy .case-screenshot-details img{margin-top:16px;width:100%;height:auto}.case-project-gallery>p{font-size:15px;margin-bottom:28px}@media(max-width:700px){.case-gallery-grid{grid-template-columns:1fr}.case-gallery-preview img{height:220px}.case-gallery-copy{padding:20px}.case-project-gallery>h2{font-size:25px}}

/* Preserve complete mobile app screenshots. */
.case-project-art-portrait>a{background:var(--cream);padding:24px}
.case-project-art-portrait img{display:block;width:100%;height:460px;aspect-ratio:auto;object-fit:contain;object-position:center}
.case-grid .case-project-cover-portrait{object-fit:contain;object-position:center;background:var(--paper)}
.case-gallery-portrait .case-gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.case-gallery-portrait .case-gallery-preview{display:block;padding:20px;background:var(--cream)}
.case-gallery-portrait .case-gallery-preview img{display:block;height:400px;object-fit:contain;object-position:center}
.case-more-images{margin-top:28px;border-top:1px solid var(--line);padding-top:20px}
.case-more-images>summary{cursor:pointer;font-weight:600;color:var(--webtext-blue,#216487);padding:12px 0}
.case-more-images[open]>.case-gallery-grid{margin-top:20px}
@media(max-width:1000px){.case-gallery-portrait .case-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.case-gallery-portrait .case-gallery-grid{grid-template-columns:minmax(0,1fr)}.case-project-art-portrait img{height:420px}.case-gallery-portrait .case-gallery-preview img{height:440px}}
