.portfolio-page{background:#fff}.portfolio-hero{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(113deg,#081e34 0%,#0b3555 69%,#113b59 100%);color:white;min-height:475px;display:flex;align-items:center}
.portfolio-hero:before,.portfolio-format:before,.portfolio-contact:before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(124deg,transparent 0,transparent 125px,rgba(217,171,101,.085) 126px,transparent 128px,transparent 250px);opacity:.65}
.portfolio-hero:after{content:"";position:absolute;inset:-10%;pointer-events:none;background:linear-gradient(125deg,transparent 55%,rgba(231,187,115,.08) 55.2%,transparent 56.5%);filter:blur(4px)}
.portfolio-hero-inner{position:relative;z-index:2;padding-top:78px;padding-bottom:76px}
.portfolio-kicker{font:700 11px Montserrat,sans-serif;letter-spacing:.18em;color:#d9ae71;text-transform:uppercase;margin-bottom:15px}
.portfolio-hero h1{font:900 clamp(35px,5.4vw,75px)/1.08 Montserrat,sans-serif;letter-spacing:-.04em;margin:0 0 22px}.portfolio-hero h1 span{color:#d7ac6a}
.portfolio-hero p:not(.portfolio-kicker){max-width:610px;line-height:1.8;color:#e2e8ec;font-size:15px;margin-bottom:26px}
.portfolio-main{padding-top:64px;padding-bottom:88px}.portfolio-intro{max-width:750px}.portfolio-intro h2,.portfolio-format h2,.portfolio-contact h2{font:800 clamp(26px,3vw,39px)/1.2 Montserrat,sans-serif;color:#0f2a44;margin:0 0 16px}
.portfolio-intro>p:last-child{color:#62707b;line-height:1.75}.portfolio-kicker.dark{color:#b78a4c}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:10px;margin:36px 0 30px}
.portfolio-filters button{appearance:none;border:1px solid #d6dce1;background:white;color:#19334c;padding:13px 18px;font:700 12px Montserrat,sans-serif;cursor:pointer;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);transition:background .2s,color .2s}
.portfolio-filters button.selected,.portfolio-filters button:hover{background:#0f2a44;color:white}
.portfolio-empty{border:1px solid #e2e5e7;padding:56px 25px;text-align:center;background:linear-gradient(120deg,#f6f8f9,#fff);clip-path:polygon(20px 0,100% 0,calc(100% - 20px) 100%,0 100%)}
.portfolio-empty-symbol{font-size:35px;color:#c4a171}.portfolio-empty h3{font:800 22px Montserrat,sans-serif;color:#0f2a44;margin:9px 0}.portfolio-empty p{max-width:540px;margin:auto;color:#677580;line-height:1.75;font-size:14px}
.portfolio-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.portfolio-format{position:relative;isolation:isolate;background:#0b2c49;color:white;padding:66px 0 72px;overflow:hidden}
.portfolio-format .wrap{position:relative;z-index:1}.portfolio-format h2,.portfolio-contact h2{color:white}
.portfolio-format-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:30px}
.portfolio-format article{background:rgba(255,255,255,.055);padding:16px 16px 23px;clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%)}
.format-visual{height:210px;display:flex;gap:4px;overflow:hidden}.format-half{flex:1;display:flex;align-items:end;padding:15px;background:linear-gradient(135deg,#777d7f,#a5a5a0);clip-path:polygon(11% 0,100% 0,89% 100%,0 100%)}
.format-half.after{background:linear-gradient(135deg,#ac9a81,#ddd0b9)}.format-visual span{font:800 11px Montserrat,sans-serif;letter-spacing:.1em;background:#0c2945e6;color:white;padding:8px}
.format-visual.progress>div{flex:1;display:flex;align-items:end;padding:7px;background:linear-gradient(145deg,#657483,#9fa9a7);clip-path:polygon(12% 0,100% 0,88% 100%,0 100%)}
.format-visual.progress>div:nth-child(2){background:linear-gradient(145deg,#657d83,#c1b6a4)}.format-visual.progress>div:nth-child(3){background:linear-gradient(145deg,#b8a486,#e2d8c8)}
.portfolio-format h3{font:800 18px Montserrat,sans-serif;margin:20px 0 9px}.portfolio-format article p,.format-note{color:#cbd5dc;line-height:1.75;font-size:13px}.format-note{font-style:italic;margin-top:22px}
.portfolio-contact{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding:70px 20px;background:#103a57;color:white}
.portfolio-contact .wrap{position:relative;z-index:1}.portfolio-contact p:not(.portfolio-kicker){margin:0 auto 25px;color:#d8e2e8}
.portfolio-page footer a{color:inherit}
@media(max-width:680px){.portfolio-hero{min-height:470px}.portfolio-hero-inner{padding:80px 22px 65px}.portfolio-hero h1{font-size:39px}.portfolio-hero p:not(.portfolio-kicker){font-size:13px}.portfolio-main{padding:43px 18px 60px}.portfolio-filters{gap:7px}.portfolio-filters button{font-size:10px;padding:12px 15px}.portfolio-empty{padding:44px 24px}.portfolio-format{padding:48px 0}.portfolio-format-grid{grid-template-columns:1fr;gap:18px}.portfolio-format .wrap{padding:0 18px}.format-visual{height:170px}.portfolio-contact{padding:60px 20px}.portfolio-cards{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.portfolio-filters button{transition:none}}

/* Portfolio hero photo: architectural renovation imagery, with a restrained navy overlay. */
.portfolio-hero{background:#0b2b44 url("https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=1800&q=85") center 48%/cover no-repeat}
.portfolio-hero::before{z-index:0;background:linear-gradient(90deg,rgba(5,22,38,.94) 0%,rgba(8,32,51,.83) 44%,rgba(9,37,57,.46) 100%)!important;opacity:1!important}
.portfolio-hero::after{z-index:1;opacity:.65}
.portfolio-hero-inner{z-index:2}
@media(max-width:680px){.portfolio-hero{background-position:57% center}.portfolio-hero::before{background:linear-gradient(90deg,rgba(5,22,38,.91),rgba(8,32,51,.74))!important}}

/* Television appearances integrated into the Projects filter. */
.tv-portfolio-card{overflow:hidden;background:#f4f6f7;clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%)}
.tv-portfolio-visual{height:175px;background:linear-gradient(125deg,#0a233c,#174967 75%,#2b5264);position:relative;display:flex;align-items:flex-end;padding:18px}
.tv-portfolio-visual:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(125deg,transparent 0,transparent 65px,rgba(212,169,98,.16) 66px,transparent 68px,transparent 145px)}
.tv-portfolio-visual span{position:relative;color:#d4a962;letter-spacing:.16em;font:800 10px Montserrat,sans-serif}
.tv-portfolio-copy{padding:22px}.tv-portfolio-copy h3{font:800 19px Montserrat,sans-serif;color:#0f2a44;margin:0 0 10px}.tv-portfolio-copy p{font-size:13px;line-height:1.7;color:#647480;margin:0}
.portfolio-empty[hidden]{display:none!important}
@media(max-width:900px){.portfolio-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.portfolio-cards{grid-template-columns:1fr}}