/* PORTFOLIO PAGE ONLY — follows the existing navy / orange / white pixel system. */
.portfolio-page{background:#fff}
.portfolio-main{overflow:hidden;padding-bottom:0}
.portfolio-main .section-shell{max-width:1440px}
.portfolio-intro{position:relative;display:flex;justify-content:space-between;align-items:center;min-height:164px;padding-top:38px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.portfolio-title-row{display:flex;align-items:center;gap:20px}
.portfolio-title-mark{width:22px;height:22px;background:var(--orange);display:block;position:relative;box-shadow:22px 22px 0 var(--navy)}
.portfolio-title-mark:after{content:"";position:absolute;right:-13px;bottom:-13px;width:13px;height:13px;background:var(--navy)}
.portfolio-title-row h1{font:400 clamp(58px,5.3vw,88px)/.88 var(--pixel);letter-spacing:.01em;margin:0;color:var(--navy)}
.portfolio-title-row h1 span{color:var(--orange)}
.portfolio-intro-copy p{font:400 17px/1.55 var(--pixel);letter-spacing:.035em;margin:15px 0 0 72px;color:var(--navy)}
.portfolio-intro-art{position:relative;width:140px;height:95px;flex:0 0 140px;margin-right:4px}
.portfolio-intro-art span{position:absolute;width:15px;height:15px;background:var(--orange);display:block}
.portfolio-intro-art span:nth-child(1){right:60px;top:0}.portfolio-intro-art span:nth-child(2){right:43px;top:17px;background:var(--navy)}.portfolio-intro-art span:nth-child(3){right:27px;top:34px}.portfolio-intro-art span:nth-child(4){right:10px;top:51px;background:var(--navy)}.portfolio-intro-art span:nth-child(5){right:0;top:68px}
.portfolio-intro-art b{position:absolute;left:0;bottom:4px;color:var(--orange);font:400 16px var(--pixel);letter-spacing:.05em}
.portfolio-content{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(390px,.92fr);gap:28px;padding-top:26px;padding-bottom:34px}
.portfolio-preview-panel{min-width:0}
.preview-stage{height:573px;position:relative;overflow:hidden;background:#fafaf7;border:1px solid rgba(16,47,95,.04);transition:height .25s ease}
.preview-grid{position:absolute;inset:32px 46px 32px 46px;background-image:linear-gradient(rgba(16,47,95,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(16,47,95,.09) 1px,transparent 1px);background-size:42px 42px;opacity:.72}
.preview-grid:after{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid rgba(255,101,31,.35);box-shadow:0 -110px 0 rgba(16,47,95,.08),0 110px 0 rgba(16,47,95,.08)}
.preview-pixels i{position:absolute;width:24px;height:24px;background:var(--orange);display:block;z-index:2}
.preview-pixels i:nth-child(1){left:43px;top:86px}.preview-pixels i:nth-child(2){left:67px;top:110px;background:var(--navy)}.preview-pixels i:nth-child(3){left:91px;top:134px}.preview-pixels i:nth-child(4){right:73px;top:110px;background:var(--navy)}.preview-pixels i:nth-child(5){right:49px;top:134px}.preview-pixels i:nth-child(6){left:220px;bottom:108px;background:var(--navy)}.preview-pixels i:nth-child(7){left:244px;bottom:84px}.preview-pixels i:nth-child(8){right:110px;bottom:86px;background:var(--navy)}
.portfolio-stack{position:absolute;left:50%;top:48%;width:330px;height:420px;transform:translate(-50%,-50%);z-index:4;transition:transform .25s ease}
.preview-stage.zoomed .portfolio-stack{transform:translate(-50%,-50%) scale(1.08)}
.stack-sheet{position:absolute;inset:0;background:#e9ecec;border:1px solid rgba(16,47,95,.42);box-shadow:8px 8px 0 rgba(16,47,95,.08)}
.back-two{transform:translate(-26px,26px);background:#e5e8e8}.back-one{transform:translate(-13px,13px);background:#eef0ef}
.portfolio-cover{position:absolute;inset:0;background:linear-gradient(135deg,#102f5f,#0d284d);border:1px solid #102f5f;color:#fff;box-shadow:8px 8px 0 rgba(16,47,95,.16);overflow:hidden;padding:48px 30px 26px}
.cover-corner{position:absolute;right:0;top:0;width:48px;height:48px;background:var(--orange);clip-path:polygon(0 0,100% 0,100% 100%,62% 100%,62% 62%,0 62%)}
.cover-head{display:flex;justify-content:space-between;align-items:flex-start;font-family:var(--pixel)}
.cover-head strong{font-size:25px;line-height:.92;font-weight:400}.cover-head span{text-align:right;font-size:15px;line-height:1.05}
.cover-role{font:400 13px var(--pixel);color:var(--orange);margin-top:13px}
.cover-mid-logo{position:absolute;width:200px;height:200px;object-fit:contain;left:50%;top:50%;transform:translate(-50%,-50%)}
.cover-list{position:absolute;left:30px;bottom:42px;font:400 11px/1.3 var(--pixel);letter-spacing:.04em}
.cover-square{position:absolute;left:15px;bottom:15px;width:18px;height:18px;background:var(--orange)}.cover-square.two{left:auto;right:15px;bottom:15px;width:18px;height:18px;background:var(--orange);box-shadow:0 -22px 0 var(--orange),-12px -34px 0 var(--orange)}
.preview-label{position:absolute;left:40px;bottom:86px;display:flex;align-items:center;gap:12px;color:var(--orange);font:400 15px var(--pixel);z-index:5}
.document-icon{width:22px;height:27px;border:2px solid var(--orange);display:block;position:relative}.document-icon:before{content:"";position:absolute;right:-2px;top:-2px;width:9px;height:9px;background:#fafaf7;border-left:2px solid var(--orange);border-bottom:2px solid var(--orange)}.document-icon:after{content:"";position:absolute;left:4px;right:4px;bottom:6px;height:2px;background:var(--orange);box-shadow:0 -6px 0 var(--orange)}
.preview-meta{position:absolute;left:50%;bottom:37px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;color:var(--navy);font:400 18px var(--pixel);z-index:5}.preview-meta strong{color:var(--orange);font-weight:400}.preview-meta span{color:var(--orange)}.preview-dots{display:flex;gap:14px;margin-left:7px}.preview-dots i{width:10px;height:10px;background:#c4ccd4;border-radius:50%;display:block}.preview-dots i.active{background:var(--orange)}
.preview-zoom{position:absolute;right:42px;bottom:31px;border:0;background:none;color:var(--navy);font:400 15px var(--pixel);letter-spacing:.04em;cursor:pointer;z-index:5;display:flex;gap:8px;align-items:center}.preview-zoom span{font:400 22px var(--body);line-height:1}.preview-zoom:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
.portfolio-info{min-width:0;border-left:1px solid rgba(16,47,95,.28);padding:8px 0 0 36px;display:flex;flex-direction:column}
.info-heading{display:flex;align-items:center;gap:14px}.panel-mark{width:16px;height:16px;background:var(--orange);display:inline-block;box-shadow:8px 0 0 rgba(255,101,31,.2)}.info-heading h2{font:400 36px var(--pixel);letter-spacing:.035em;color:var(--navy);margin:0}
.portfolio-tags{display:flex;flex-wrap:wrap;gap:14px;margin:26px 0 22px}.portfolio-tags span{border:1px solid var(--orange);border-radius:99px;padding:9px 25px;font:500 15px var(--body);color:var(--navy);white-space:nowrap}
.info-copy{font-size:16px;line-height:1.65;max-width:500px;margin:0 0 28px;color:var(--navy)}
.file-details{border-top:1px solid rgba(16,47,95,.24);border-bottom:1px solid rgba(16,47,95,.24);padding:17px 0;margin-bottom:25px}.file-details>div{display:flex;align-items:center;gap:16px;min-height:43px;color:var(--navy);font:400 16px var(--pixel);letter-spacing:.03em}.detail-icon{width:20px;height:20px;display:block;position:relative;flex:0 0 20px}.detail-icon.document{border:2px solid var(--navy)}.detail-icon.document:before{content:"";position:absolute;right:-2px;top:-2px;width:8px;height:8px;background:#fff;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy)}.detail-icon.document:after{content:"";position:absolute;left:3px;right:3px;bottom:4px;height:2px;background:var(--navy);box-shadow:0 -5px 0 var(--navy)}
.detail-icon.pdf{border:2px solid var(--navy);border-radius:2px}.detail-icon.pdf:after{content:"PDF";position:absolute;left:2px;bottom:2px;font:400 8px var(--pixel);color:var(--navy)}
.detail-icon.database{height:16px;border:2px solid var(--navy);border-radius:50%/25%;background:linear-gradient(to bottom,transparent 39%,var(--navy) 40%,var(--navy) 48%,transparent 49%,transparent 67%,var(--navy) 68%,var(--navy) 76%,transparent 77%)}
.detail-icon.calendar{border:2px solid var(--navy)}.detail-icon.calendar:before{content:"";position:absolute;left:0;right:0;top:5px;border-top:2px solid var(--navy)}.detail-icon.calendar:after{content:"";position:absolute;left:5px;top:9px;width:3px;height:3px;background:var(--navy);box-shadow:7px 0 var(--navy),14px 0 var(--navy),0 7px var(--navy),7px 7px var(--navy),14px 7px var(--navy)}
.portfolio-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px}.preview-button,.download-button{min-height:54px;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;font:400 17px var(--pixel);cursor:pointer;transition:transform .18s,box-shadow .18s}.preview-button{background:#fff;color:var(--navy);border:1px solid var(--navy);box-shadow:4px 4px 0 rgba(16,47,95,.08)}.download-button{background:var(--orange);color:#fff;border:1px solid var(--orange);box-shadow:4px 4px 0 var(--navy)}.preview-button:hover,.preview-button:focus-visible,.download-button:hover,.download-button:focus-visible{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--navy)}
.action-icon{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.portfolio-note{display:flex;align-items:center;gap:17px;margin-top:31px;padding-bottom:18px;border-bottom:1px solid rgba(16,47,95,.24)}.note-pixels{width:51px;height:36px;position:relative;display:block;flex:0 0 51px}.note-pixels i{position:absolute;width:14px;height:14px;background:var(--orange)}.note-pixels i:nth-child(1){left:0;top:0}.note-pixels i:nth-child(2){left:14px;top:14px;background:var(--navy)}.note-pixels i:nth-child(3){left:28px;top:14px;background:var(--navy)}.note-pixels i:nth-child(4){left:14px;top:0;background:var(--orange)}.note-line{height:1px;background:var(--orange);width:31px;flex:0 0 31px}.portfolio-note p{font:400 14px/1.35 var(--pixel);letter-spacing:.04em;color:var(--navy);margin:0}
.portfolio-footer{display:flex;justify-content:space-between;align-items:center;padding-top:8px;padding-bottom:20px}.portfolio-footer>div{display:flex;align-items:center;gap:0}.portfolio-footer span{width:16px;height:16px;background:var(--orange);display:block}.portfolio-footer span:nth-child(2){background:var(--navy);margin-left:4px}.portfolio-footer span:nth-child(3){background:var(--navy);margin-left:4px}.portfolio-footer i{display:block;width:190px;height:1px;background:var(--orange);margin-left:4px}.portfolio-footer b{font:400 15px var(--pixel);color:var(--orange)}
.pdf-modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:28px}.pdf-modal.open{display:flex}.pdf-modal-backdrop{position:absolute;inset:0;background:rgba(16,47,95,.78)}.pdf-modal-card{position:relative;width:min(1180px,100%);height:min(88vh,900px);background:#fff;border:1px solid var(--navy);box-shadow:10px 10px 0 rgba(0,0,0,.16);display:flex;flex-direction:column}.pdf-modal-head{height:58px;display:flex;justify-content:space-between;align-items:center;padding:0 16px;border-bottom:1px solid var(--line);flex:0 0 58px}.pdf-modal-head>div{display:flex;align-items:center;gap:12px}.pdf-modal-head h2{font:400 21px var(--pixel);color:var(--navy);margin:0}.pdf-close{border:1px solid var(--navy);background:#fff;color:var(--navy);width:38px;height:38px;font-size:26px;line-height:1;cursor:pointer}.pdf-frame-wrap{min-height:0;flex:1;background:#e8ebed}.pdf-frame-wrap iframe{width:100%;height:100%;border:0;display:block}.pdf-modal-foot{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-top:1px solid var(--line);font:400 14px var(--pixel);color:var(--navy);flex:0 0 46px}.pdf-modal-foot a{color:var(--orange);border-bottom:1px solid var(--orange)}body.modal-open{overflow:hidden}
@media(max-width:1100px){.desktop-nav{gap:24px}.portfolio-content{grid-template-columns:minmax(0,1.25fr) 330px;gap:20px}.portfolio-info{padding-left:24px}.info-heading h2{font-size:30px}.portfolio-tags{gap:8px}.portfolio-tags span{padding:8px 16px;font-size:13px}.portfolio-actions{grid-template-columns:1fr}.preview-stage{height:520px}.portfolio-stack{transform:translate(-50%,-50%) scale(.88)}.preview-stage.zoomed .portfolio-stack{transform:translate(-50%,-50%) scale(.98)}}
@media(max-width:760px){.portfolio-main{padding-bottom:20px}.portfolio-intro{display:block;min-height:0;padding-top:36px;padding-bottom:30px}.portfolio-title-row{gap:15px}.portfolio-title-mark{width:16px;height:16px;box-shadow:16px 16px 0 var(--navy)}.portfolio-title-mark:after{right:-10px;bottom:-10px;width:10px;height:10px}.portfolio-title-row h1{font-size:clamp(46px,12vw,66px)}.portfolio-intro-copy p{margin:17px 0 0;font-size:15px}.portfolio-intro-art{display:none}.portfolio-content{display:flex;flex-direction:column;padding-top:14px;gap:18px}.preview-stage{height:440px}.preview-grid{inset:20px 20px 20px 20px;background-size:30px 30px}.preview-pixels i{width:17px;height:17px}.preview-pixels i:nth-child(1){left:22px;top:58px}.preview-pixels i:nth-child(2){left:39px;top:75px}.preview-pixels i:nth-child(3){left:56px;top:92px}.preview-pixels i:nth-child(4){right:49px;top:74px}.preview-pixels i:nth-child(5){right:32px;top:91px}.preview-pixels i:nth-child(6){left:94px;bottom:83px}.preview-pixels i:nth-child(7){left:111px;bottom:66px}.preview-pixels i:nth-child(8){right:57px;bottom:66px}.portfolio-stack{width:245px;height:315px}.portfolio-cover{padding:34px 22px 20px}.cover-head strong{font-size:19px}.cover-head span{font-size:12px}.cover-role{font-size:10px}.cover-mid-logo{width:95px;height:95px;top:47.5%}.cover-list{left:22px;bottom:32px;font-size:9px}.cover-square{left:11px;bottom:11px;width:13px;height:13px}.cover-square.two{right:11px;bottom:11px;width:13px;height:13px}.preview-label{left:20px;bottom:63px}.preview-meta{bottom:22px;font-size:16px}.preview-dots{gap:8px}.preview-dots i{width:8px;height:8px}.preview-zoom{right:20px;bottom:17px;font-size:13px}.portfolio-info{border-left:0;border-top:1px solid rgba(16,47,95,.28);padding:18px 0 0}.info-heading h2{font-size:27px}.portfolio-tags{margin:20px 0 18px}.portfolio-tags span{padding:8px 14px}.info-copy{font-size:15px}.file-details{margin-bottom:20px}.portfolio-actions{grid-template-columns:1fr 1fr}.preview-button,.download-button{font-size:14px;padding:10px 8px}.portfolio-note{margin-top:22px}.portfolio-footer{padding-top:10px}.portfolio-footer i{width:90px}.pdf-modal{padding:10px}.pdf-modal-card{height:92vh}.pdf-modal-head h2{font-size:16px}.pdf-modal-foot{font-size:12px}}
@media(max-width:430px){.portfolio-actions{grid-template-columns:1fr}.portfolio-stack{width:220px;height:284px}.preview-stage{height:400px}.portfolio-note p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.portfolio-stack,.preview-stage,.preview-button,.download-button{transition:none}}
