/* LOGA V1.9.30 — 33 unique brand-case studies; no changes outside portfolio page. */
.portfolio-page .portfolio-main.shell{max-width:1510px}
.portfolio-page .portfolio-filter{max-width:790px}
.portfolio-page .filter-button{font-size:14px;padding:9px 12px}
.portfolio-page .portfolio-card{padding:clamp(11px,1.8vw,26px)}
.portfolio-page .portfolio-card.is-selected{padding:calc(clamp(11px,1.8vw,26px) - 1px)}
.portfolio-page .portfolio-card img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
/* Removed special-case Pimasota sizing: all 33 originals share identical optical presentation. */
.portfolio-page .portfolio-card[data-project] img{max-width:100%;max-height:100%}
.portfolio-page .detail-information{justify-content:center}
.portfolio-page .detail-shell{min-height:560px}
.portfolio-page .detail-story{margin-bottom:17px}
.portfolio-page .case-tags{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 20px}
.portfolio-page .case-tag{border:1px solid var(--bf-light);border-radius:3px;background:#fff;padding:6px 9px;color:var(--bf-main);font-weight:650;font-size:11.5px;letter-spacing:.012em;line-height:1.2}
.portfolio-page .case-facts{display:grid;gap:15px;margin-top:3px}
.portfolio-page .case-fact{display:flex;gap:11px;align-items:flex-start;min-width:0}
.portfolio-page .case-fact-icon{display:grid;place-items:center;flex:0 0 23px;width:23px;height:23px;color:var(--bf-main)}
.portfolio-page .case-fact-icon svg{width:21px;height:21px}
.portfolio-page .case-fact b{display:block;color:#191c2d;font-size:13px;font-weight:740;margin-bottom:2px}
.portfolio-page .case-fact p{margin:0;color:#656779;font-size:12.5px;line-height:1.38}
.portfolio-page .case-qualification{font-size:10px;color:#858699;line-height:1.4;margin-top:13px}
.portfolio-page .detail-art{min-width:0}
/* The original Pimasota identity-canvas is untouched. The other projects use the same 4-card frame. */
.portfolio-page .identity-canvas--brand .showcase-primary>img{width:91%;height:80%;object-fit:contain;margin:auto}
.portfolio-page .identity-canvas--brand .showcase-palette{height:34%}
.portfolio-page .identity-canvas--brand .swatch-row{gap:5px;margin-top:16px}
.portfolio-page .identity-canvas--brand .swatch-row i{height:43px;border-radius:4px}
.portfolio-page .identity-canvas--brand .palette-disclaimer{font-size:9px;color:#898a9b;margin-top:9px}
.portfolio-page .identity-canvas--brand .showcase-application{top:44%;height:52%}
.portfolio-page .identity-canvas--brand .showcase-application>small{font-size:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.portfolio-page .identity-canvas--brand .typeface-preview{gap:10px}
.portfolio-page .identity-canvas--brand .typeface-preview small{max-height:4.2em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.portfolio-page .identity-canvas--brand .serif-sample.type-sans{font-family:Arial,Helvetica,sans-serif;font-weight:740;letter-spacing:-.08em}
.portfolio-page .identity-canvas--brand .serif-sample.type-display{font-family:Arial,Helvetica,sans-serif;font-weight:900;font-style:italic;letter-spacing:-.09em}
.portfolio-page .identity-canvas--brand .showcase-small-logo{background:white;}
/* Semantic, digital application mockups with the actual source logo; no fake photographs. */
.portfolio-page .concept-mockup{--brand-accent:var(--brand-primary,#484bb4);position:relative;flex:1;min-height:0;background:#f7f6f3;border:1px solid #eeeef1;border-radius:5px;display:grid;place-items:center;overflow:hidden;margin:9px 0 7px;perspective:650px}
.portfolio-page .mockup-halo{position:absolute;width:72%;aspect-ratio:1;border-radius:50%;background:var(--brand-primary);opacity:.075;right:-13%;top:-30%;}
.portfolio-page .mockup-artline{position:absolute;left:0;right:0;bottom:10%;height:1px;background:var(--brand-primary);opacity:.13}
.portfolio-page .mockup-object{position:relative;display:grid;place-items:center;background:white;border:1px solid #e2e2e2;box-shadow:6px 10px 15px #28273418;transform:rotate(-7deg);width:69%;height:64%;border-radius:3px;}
.portfolio-page .mockup-print{width:78%;height:75%;display:grid;place-items:center;overflow:hidden;position:relative;background:white}
.portfolio-page .mockup-print img.application-logo{display:block;object-fit:contain;width:100%;height:100%;}
.portfolio-page .mockup-strap{display:none}
.portfolio-page .mockup-fold{display:none}
/* 13 restrained scene templates; every item is a real brand-image rendering. */
.portfolio-page .mockup-jar .mockup-object{width:48%;height:73%;border-radius:13px 13px 18px 18px;border-top:12px solid var(--brand-primary);transform:rotate(-7deg)}
.portfolio-page .mockup-jar .mockup-print{height:49%;width:100%;border-top:1px solid #ddd;border-bottom:1px solid #ddd}
.portfolio-page .mockup-bag .mockup-object{width:58%;height:69%;border-radius:2px 2px 7px 7px;transform:rotate(5deg)}
.portfolio-page .mockup-bag .mockup-object::before{content:"";position:absolute;top:-13px;left:31%;width:38%;height:24px;border:3px solid var(--brand-primary);border-bottom:0;border-radius:50% 50% 0 0;opacity:.35}
.portfolio-page .mockup-bag .mockup-strap{display:block;position:absolute;top:0;left:0;right:0;background:var(--brand-primary);height:4%;opacity:.4}
.portfolio-page .mockup-shirt .mockup-object{clip-path:polygon(24% 0,39% 0,45% 9%,55% 9%,61% 0,76% 0,100% 23%,85% 41%,77% 33%,77% 100%,23% 100%,23% 33%,15% 41%,0 23%);width:78%;height:79%;background:#f2f3f4;border:0;border-radius:0;box-shadow:none;transform:rotate(-4deg)}
.portfolio-page .mockup-shirt .mockup-print{width:42%;height:36%;margin-top:13%;border-radius:3px}
.portfolio-page .mockup-device .mockup-object{width:46%;height:87%;border:7px solid #24242c;border-radius:20px;transform:rotate(-10deg);}
.portfolio-page .mockup-device .mockup-object::before{content:"";position:absolute;top:1px;width:34%;height:6px;border-radius:0 0 6px 6px;background:#24242c}
.portfolio-page .mockup-device .mockup-print{width:88%;height:64%;background:#fff;border-radius:5px}
.portfolio-page .mockup-sign .mockup-object{width:84%;height:43%;border:6px solid #e0dfde;transform:rotate(-5deg);box-shadow:9px 12px 14px #3d363d23;}
.portfolio-page .mockup-sign .mockup-print{width:85%;height:83%}
.portfolio-page .mockup-ticket .mockup-object{width:84%;height:54%;transform:rotate(-9deg);border-left:9px solid var(--brand-primary);}
.portfolio-page .mockup-ticket .mockup-strap{display:block;position:absolute;right:12%;height:100%;border-left:1px dashed #c6c3c3}
.portfolio-page .mockup-cup .mockup-object{width:44%;height:67%;clip-path:polygon(2% 0,98% 0,84% 100%,16% 100%);border-top:9px solid #292e33;border-radius:4px 4px 15px 15px;transform:rotate(7deg)}
.portfolio-page .mockup-cup .mockup-print{width:88%;height:51%}
.portfolio-page .mockup-box .mockup-object{width:77%;height:54%;transform:rotate(-6deg) skewY(-2deg);border:1px solid #dbd2c1;box-shadow:8px 12px 10px #45403820;}
.portfolio-page .mockup-box .mockup-fold{display:block;position:absolute;bottom:-10px;left:2%;width:96%;height:10px;background:#ded4c3;transform:skewX(-28deg)}
.portfolio-page .mockup-poster .mockup-object{width:56%;height:84%;transform:rotate(6deg);background:var(--brand-primary);border:7px solid white;box-shadow:8px 12px 20px #1d1d4426}
.portfolio-page .mockup-poster .mockup-print{height:54%;width:100%}
.portfolio-page .mockup-paper .mockup-object{width:68%;height:80%;transform:rotate(-9deg);border-radius:1px;box-shadow:7px 12px 14px #28273422}
.portfolio-page .mockup-label .mockup-object{width:74%;height:57%;transform:rotate(7deg);border:1px solid #ddd7cb;}
.portfolio-page .mockup-pouch .mockup-object{width:67%;height:71%;transform:rotate(-6deg);border-radius:12px 12px 20px 20px;background:#fdfcff;border:1px solid #ebe9e9}
.portfolio-page .mockup-pouch .mockup-strap{display:block;position:absolute;left:0;top:13%;right:0;height:5px;background:var(--brand-primary);opacity:.38}
/* Preserve grid, thin lines, and comfortable detail content at every breakpoint. */
@media(max-width:1600px){.portfolio-page .detail-shell{min-height:515px}.portfolio-page .case-tag{font-size:10.5px;padding:5px 7px}.portfolio-page .case-facts{gap:11px}.portfolio-page .identity-canvas--brand .swatch-row i{height:35px}}
@media(max-width:1280px){.portfolio-page .portfolio-filter{justify-content:flex-start;max-width:600px}.portfolio-page .detail-shell{min-height:450px}.portfolio-page .detail-story{font-size:14px}.portfolio-page .case-fact p{font-size:11.5px}.portfolio-page .case-tags{margin-bottom:11px}.portfolio-page .identity-canvas--brand .showcase-palette .swatch-row i{height:30px}.portfolio-page .identity-canvas--brand .palette-disclaimer{font-size:8px;margin-top:4px}}
@media(max-width:980px){.portfolio-page .detail-shell{min-height:0}.portfolio-page .detail-information{padding-bottom:17px}.portfolio-page .case-tags{margin-bottom:15px}.portfolio-page .case-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.portfolio-page .detail-art{padding:13px 0 0}.portfolio-page .identity-canvas--brand .swatch-row i{height:43px}}
@media(max-width:600px){.portfolio-page .filter-button{font-size:12px;padding:7px 8px}.portfolio-page .portfolio-card{padding:7px}.portfolio-page .portfolio-card.is-selected{padding:6px}.portfolio-page .detail-shell{padding:25px 18px 21px}.portfolio-page .detail-information h2{font-size:32px}.portfolio-page .case-facts{grid-template-columns:1fr}.portfolio-page .detail-story{margin-bottom:13px}.portfolio-page .case-tag{font-size:10px}.portfolio-page .case-fact{gap:9px}.portfolio-page .case-fact b{font-size:12px}.portfolio-page .identity-canvas--brand .showcase-palette .swatch-row i{height:21px}.portfolio-page .identity-canvas--brand .palette-disclaimer{display:none}.portfolio-page .identity-canvas--brand .typeface-preview{gap:5px}.portfolio-page .identity-canvas--brand .serif-sample{font-size:34px}.portfolio-page .identity-canvas--brand .typeface-preview small{-webkit-line-clamp:2}.portfolio-page .identity-canvas--brand .showcase-application>small{font-size:8px}.portfolio-page .mockup-object{width:80%}}
@media(max-width:360px){.portfolio-page .portfolio-card{padding:5px}.portfolio-page .portfolio-card.is-selected{padding:4px}.portfolio-page .detail-shell{padding:21px 14px 20px}.portfolio-page .case-tag{font-size:9px}.portfolio-page .identity-canvas--brand .showcase-palette .swatch-row small{font-size:6px}}
@media(prefers-reduced-motion:reduce){.portfolio-page .identity-canvas--brand .showcase-card{transform:none!important;transition:none!important}}