/* Compact portfolio gallery: strong contrast, actual work, four projects together. */
.folio-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;padding-block:22px 25px}
.folio-heading .eyebrow{font-size:9px;margin-bottom:13px}
.folio-heading h1{font-size:clamp(32px,3.2vw,44px);line-height:1.1;letter-spacing:-.045em;margin:0}
.folio-heading h1 span{color:#73839b}
.folio-heading>p{font-size:13px;line-height:1.7;color:#637795;margin:0;max-width:315px}
.folio-showcase{scroll-margin-top:110px;padding-bottom:30px}
.folio-gallery{position:relative;isolation:isolate;border:1px solid #526f96;border-radius:24px;padding:22px;background:linear-gradient(120deg,#173b67,#0e274d 60%,#0b2041);box-shadow:inset 0 1px #d3e4ff52,0 20px 38px #102c581c;overflow:clip;color:white}
.folio-gallery-atmosphere{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 15% 0,#567aa537,transparent 65%)}
.folio-gallery-atmosphere span{position:absolute;right:-100px;top:-260px;width:600px;height:600px;border-radius:50%;border:1px solid #aec8e516}
.folio-gallery-atmosphere span+span{inset:auto auto -300px -130px;width:500px;height:500px}
.folio-gallery-atmosphere span:after{content:'';position:absolute;top:50%;left:-3px;width:5px;height:5px;border-radius:50%;background:#c6aa73;box-shadow:0 0 0 5px #c6aa7317}
.folio-gallery-atmosphere span{animation:folio-orbit 40s linear infinite}
.folio-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 20px;margin-bottom:0}
.folio-toolbar .filters{display:flex;margin:0;border:1px solid #9bb7dc38;border-radius:12px;padding:4px;background:#071b353b;gap:3px;box-shadow:inset 0 1px #ffffff0b}
.folio-gallery .filters button{border:1px solid transparent;border-radius:8px;font-size:12px;padding:9px 15px;min-height:44px;white-space:nowrap;color:#c4d5eb;background:transparent;box-shadow:none}
.folio-gallery .filters button:hover{background:#6687b133;border-color:#a7c3e450;transform:none;color:white}
.folio-gallery .filters button[aria-pressed="true"]{background:linear-gradient(125deg,#fff,#dce8f7);color:#102c58;border-color:#e6eef8;box-shadow:inset 0 1px white,0 3px 10px #04112325}
.folio-toolbar>p{font-size:10px;color:#bbcee7;margin:0;text-align:right}
.portfolio-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:0;align-items:stretch}
.portfolio-piece{position:relative;min-width:0;display:flex;flex-direction:column;padding:13px;border:1px solid #a2bed442;border-radius:16px;background:linear-gradient(150deg,#ffffff0d,#ffffff03);box-shadow:inset 0 1px #e1edfa17,0 5px 15px #00000008;transition:border-color .3s,background .3s,box-shadow .3s,transform .3s}
.portfolio-piece[hidden]{display:none}
.portfolio-piece:hover,.portfolio-piece:focus-within{border-color:#c5d9f480;background:linear-gradient(150deg,#ffffff15,#ffffff07);box-shadow:inset 0 1px #e1edfa40,0 12px 24px #00000020;transform:translateY(-3px)}
.piece-service{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.045em;text-transform:uppercase;line-height:1.5;min-height:17px;color:#c4d5eb;margin:0 0 11px}
.piece-service>span{width:4px;height:4px;border-radius:50%;background:#c6aa73;box-shadow:0 0 0 3px #c6aa730f;flex-shrink:0}
.portfolio-media{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:calc(100% + 12px);margin-left:-6px;height:153px;flex-shrink:0;border:1px solid #97b6db47;border-radius:11px;background:linear-gradient(120deg,#6d8aab22,#bacfe52e);overflow:clip;box-shadow:0 10px 16px #03132b30,inset 0 1px #ffffff45;transition:box-shadow .3s,border-color .3s}
.portfolio-media-grid{position:absolute;inset:0;z-index:-1;background:linear-gradient(#cadbef0f 1px,transparent 1px),linear-gradient(90deg,#cadbef0f 1px,transparent 1px);background-size:19px 19px;mask-image:linear-gradient(135deg,black,transparent)}
.portfolio-screen{display:block;position:relative;width:100%;border-block:1px solid #bdd1ec73;background:#102c58;box-shadow:0 7px 16px #03122d3b;overflow:hidden}
.portfolio-screen img{display:block;width:100%;height:auto;max-height:151px;object-fit:contain;object-position:center;background:#102c58}
.piece-oriana .portfolio-screen,.piece-oriana .portfolio-screen img{background:#fbfcff}
.piece-repro .portfolio-screen,.piece-repro .portfolio-screen img,.piece-toxic .portfolio-screen,.piece-toxic .portfolio-screen img{background:#111}
.portfolio-media:hover{border-color:#c5ddff;box-shadow:0 12px 20px #03132b50,inset 0 1px #fff}
.portfolio-media:after{content:'';position:absolute;left:-90%;top:0;width:55%;height:100%;pointer-events:none;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,#ffffff12,transparent);transition:left .6s}
.portfolio-media:hover:after{left:140%}
.piece-toxic .portfolio-media{padding-bottom:22px}
.piece-toxic .portfolio-screen img{max-height:127px}
.portfolio-evidence{position:absolute;left:8px;right:8px;bottom:6px;font-size:8px;line-height:1.25;color:#d6e2f2;text-align:center}
.piece-info{display:flex;flex-direction:column;flex:1;min-width:0;padding-top:19px}
.piece-info :is(h2,h3){font-size:23px;line-height:1.14;font-weight:650;letter-spacing:-.035em;color:#fff;margin:0 0 10px;min-height:28px;display:flex;align-items:start;text-wrap:balance}
.piece-description{font-size:12px;line-height:1.65;color:#d1dff1;margin:0 0 13px;min-height:36px}
.piece-role{font-size:10px;line-height:1.5;color:#b6cbe6;margin:0 0 15px;padding-left:9px;border-left:2px solid #8ba7c45c;min-height:27px;display:flex;align-items:center}
.piece-action{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:43px;padding:7px 9px 7px 12px;border:1px solid #c2d7f2;border-radius:9px;color:#102c58;background:linear-gradient(120deg,#fff,#e1ebf8);font-size:11px;font-weight:650;box-shadow:inset 0 1px white,0 4px 10px #02122922;margin-top:auto;transition:background .25s,border-color .25s,box-shadow .25s}
.piece-action>span{display:grid;place-items:center;width:26px;height:26px;border:1px solid #9db6d341;border-radius:6px;background:#fff7;flex:none}
.piece-action svg{width:17px;height:17px}
.piece-action:hover{background:#fff;border-color:#fff;box-shadow:inset 0 1px white,0 5px 14px #0002}
.portfolio-piece :is(a,button):focus-visible{outline:3px solid #c6aa73;outline-offset:3px}
@keyframes folio-orbit{to{rotate:360deg}}
.tab-inactive .folio-gallery-atmosphere span{animation-play-state:paused}
@media(max-width:1000px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.portfolio-media{height:179px}.portfolio-screen img{max-height:177px}.piece-toxic .portfolio-screen img{max-height:154px}.piece-info :is(h2,h3){min-height:0}.piece-description{min-height:0}.piece-role{min-height:0}.folio-heading{gap:24px}.folio-heading>p{font-size:12px;max-width:270px}}
@media(max-width:600px){
 .folio-heading{display:block;padding-block:14px 16px}.folio-heading h1{font-size:32px}.folio-heading .eyebrow{font-size:8px;margin-bottom:11px}.folio-heading>p{font-size:12px;max-width:none;margin-top:14px}.folio-heading>p br{display:none}
 .folio-showcase{width:calc(100% - 24px);padding-bottom:24px}
 .folio-gallery{padding:12px;border-radius:19px}
 .folio-toolbar{display:block;padding:0 0 14px}.folio-toolbar .filters{width:100%;max-width:100%;gap:1px;padding:3px}.folio-gallery .filters button{font-size:9px;padding:8px 6px;min-height:42px;flex:1}.folio-toolbar>p{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .portfolio-grid{gap:12px 10px}
 .portfolio-piece{padding:10px;border-radius:12px}
 .piece-service{font-size:8px;line-height:1.4;letter-spacing:0;min-height:23px;margin-bottom:9px;gap:5px}
 .portfolio-media{height:100px;border-radius:8px;width:calc(100% + 12px);margin-left:-6px}
 .portfolio-screen img{max-height:98px}.piece-toxic .portfolio-screen img{max-height:76px}.piece-toxic .portfolio-media{padding-bottom:22px}
 .portfolio-evidence{font-size:6.5px;bottom:5px;left:3px;right:3px}
 .piece-info{padding-top:13px}.piece-info :is(h2,h3){font-size:17px;line-height:1.2;min-height:41px;align-items:start;margin-bottom:8px}
 .piece-description{font-size:11px;line-height:1.5;min-height:47px;margin-bottom:9px}
 .piece-role{font-size:10px;min-height:30px;padding-left:7px;margin-bottom:11px}
 .piece-action{font-size:10px;min-height:44px;padding:7px 6px 7px 8px;gap:5px;border-radius:8px}.piece-action>span{width:22px;height:24px}.piece-action svg{width:15px;height:15px}
}
@media(max-width:350px){.folio-gallery{padding:10px}.portfolio-grid{gap:10px 8px}.portfolio-piece{padding:8px}.piece-info :is(h2,h3){font-size:16px}.folio-gallery .filters button{font-size:8px;padding-inline:4px}.piece-description{font-size:10px}.piece-action{font-size:9px;padding-left:6px}.piece-service{font-size:7.5px}}
@media(prefers-reduced-motion:reduce){.folio-gallery-atmosphere span{animation:none}.portfolio-piece,.portfolio-media,.portfolio-media:after,.piece-action{transition:none}.portfolio-piece:hover{transform:none}}
