/* Separate web-project portfolio: never imply the native sector catalog is a web app. */
.portfolio-case-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;align-items:center}
.portfolio-case-nav button{flex-shrink:0;min-height:44px}
.portfolio-picker-wrap{display:none}
.portfolio-web-card .portfolio-preview{padding:0;height:auto;aspect-ratio:16/9;background:#edf4f5}
.portfolio-web-card .portfolio-preview>a{display:block;width:100%;height:100%}
.portfolio-web-card .portfolio-preview img{width:100%;height:100%;object-fit:contain}
.portfolio-web-card .portfolio-card-copy>small{color:#00726a;line-height:1.7}
.web-project-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:4px 0 10px}
.web-project-thumbs a{border:1px solid #c9dce5;border-radius:7px;overflow:hidden;background:#f5f9fb;min-width:0;color:#143b50}
.web-project-thumbs a:hover,.web-project-thumbs a:focus-visible{border-color:#008db0;outline:2px solid #008db0;outline-offset:2px}
.web-project-thumbs img{display:block;width:100%;height:65px;object-fit:contain;background:#e7eff3}
.web-project-thumbs span{display:block;padding:9px;font-size:11px;line-height:1.5;min-height:48px}
.web-project-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:auto}
.web-project-links a{min-height:44px;display:inline-flex;align-items:center;font-size:12px}
.portfolio-card-copy .web-project-evidence{font-size:11px;line-height:1.6;color:#466b7a}
.web-gallery-dialog{width:min(1460px,calc(100vw - 32px));max-width:none;padding:18px;background:#f7fbfd;color:#143b50;border:1px solid #cadfe8;border-radius:14px}
.web-gallery-dialog[open]{display:flex;flex-direction:column;gap:10px;max-height:calc(100dvh - 24px);overflow:hidden}
.web-gallery-dialog .dialog-top{margin:0;gap:12px;flex-shrink:0}.web-gallery-dialog .dialog-top>div{min-width:0}
.web-gallery-dialog h2{font-size:22px;margin:5px 0 0;line-height:1.25}.web-gallery-dialog .close-dialog{width:44px;height:44px;flex-shrink:0}
.web-gallery-toolbar{display:flex;align-items:end;gap:12px;flex-shrink:0}
.web-gallery-toolbar label{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0;font-size:11px}
.web-gallery-toolbar select{width:100%;min-width:0;min-height:44px;padding:8px;font-size:15px;border:1px solid #b7d1dd;border-radius:6px;background:white;color:#143b50}
.web-gallery-toolbar button,.web-gallery-controls button{min-height:44px;min-width:44px;padding:8px 12px;border:1px solid #b7d1dd;border-radius:6px;background:#e9f2f6;color:#143b50;font-size:14px}
.web-gallery-scroll{min-height:0;flex:1;overflow:auto;background:#e6eef3;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior:contain}
.web-gallery-scroll img{display:block;width:100%;max-width:100%;height:auto;object-fit:contain}
.web-gallery-dialog:not(.web-zoomed) .web-gallery-scroll img{max-height:calc(100dvh - 330px)}
.web-gallery-dialog.web-zoomed .web-gallery-scroll img{width:var(--web-image-width,1920px);max-width:none;min-width:var(--web-image-width,1920px)}
.web-gallery-controls{display:flex;align-items:center;justify-content:center;gap:18px;flex-shrink:0}.web-gallery-controls span{font-size:13px;min-width:40px;text-align:center}
#web-gallery-detail{font-size:12px;line-height:1.5;margin:0;flex-shrink:0}
#web-gallery-note{font-size:10px;line-height:1.5;margin:0;color:#4c6d7c;flex-shrink:0}
@media(max-width:900px){
 .portfolio-case-nav{padding:10px 16px;display:block;overflow:visible}.portfolio-case-nav>button{display:none}
 .portfolio-picker-wrap{display:flex;gap:10px;align-items:center;font-size:12px}.portfolio-picker-wrap select{flex:1;min-width:0;min-height:44px;font-size:16px;color:#15394d;background:white;border:1px solid #b8d0da;border-radius:6px;padding:8px}
 .portfolio-card{scroll-margin-top:78px}.web-project-thumbs span{font-size:12px;padding:7px}.web-project-links a{font-size:13px}
 .web-gallery-dialog{width:calc(100vw - 12px);padding:12px}.web-gallery-dialog h2{font-size:18px}.web-gallery-dialog .eyebrow{font-size:8px}
 .web-gallery-toolbar select{font-size:16px}.web-gallery-toolbar{gap:8px}#web-gallery-detail{font-size:12px}.web-gallery-toolbar button{font-size:12px;padding:8px}
}
@media(max-height:500px){
 .web-gallery-dialog[open]{gap:6px;padding:8px;max-height:calc(100dvh - 8px)}
 .web-gallery-dialog .dialog-top .eyebrow{display:none}.web-gallery-dialog h2{font-size:15px}
 .web-gallery-dialog:not(.web-zoomed) .web-gallery-scroll img{max-height:calc(100dvh - 210px)}
 #web-gallery-detail{display:none}#web-gallery-note{font-size:9px}.web-gallery-toolbar label{flex-direction:row;align-items:center}
}
