/* Portfolio presentations use original artwork in responsive CSS mockups. */
.project-scene { --brand: #071f41; --surface: #e9e8e3; --scene-ink: #fff; position: relative; isolation: isolate; aspect-ratio: 1.6; overflow: hidden; background: var(--surface); color: var(--scene-ink); container-type: inline-size; font-family: 'Montserrat', sans-serif; }
.scene-higgys { --brand: #071f41; --surface: #071f41; }
.scene-greggs { --brand: #005d9b; --surface: #ffcf34; --scene-ink: #005d9b; }
.scene-smartcarbon { --brand: #1d71b8; --surface: #1d71b8; }
.scene-jetbio { --brand: #056f8a; --surface: #e0ecee; --scene-ink: #123f4b; }
.scene-pwm { --brand: #ba2031; --surface: #ba2031; }
.scene-hah { --brand: #ec008c; --surface: #f5dfea; --scene-ink: #6c1b52; }
.scene-brand { position: absolute; left: 6%; top: 9%; width: 34%; z-index: 3; }
.project-scene img { display: block; width: 100%; height: auto; }
.project-scene .scene-logo { width: 90%; max-height: 17cqw; object-fit: contain; object-position: left center; }
.scene-brand p { font-family: 'Montserrat', sans-serif; font-size: 2.5cqw; line-height: 1.25; font-weight: 700; margin: 7% 0 0; max-width: 90%; color: inherit; }
.scene-note { position: absolute; left: 6%; bottom: 6%; font-size: 1.1cqw; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; z-index: 5; }
.scene-photograph { position: absolute; right: 0; top: 0; width: 53%; height: 100%; overflow: hidden; }
.scene-photograph img { width: 100%; height: 100%; object-fit: cover; }
.scene-papers { position: absolute; inset: 0; }
.scene-paper { position: absolute; background: #fff; box-shadow: 0 1.8cqw 2.5cqw #0003, .15cqw .15cqw .2cqw #0002; transform: rotate(-7deg); }
.scene-paper::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(100deg, #00000005, transparent 6%, #ffffff12 90%, #00000009); border: 1px solid #0000000c; }
.scene-paper-1 { width: 24%; left: 12%; top: 41%; }
.scene-paper-2 { width: 24%; left: 31%; top: 35%; transform: rotate(8deg); }
.scene-paper-3 { width: 24%; left: 54%; top: 35%; transform: rotate(-4deg); }
.scene-guide { position: absolute; width: 56%; right: 5%; top: 13%; box-shadow: 0 1.5cqw 3.8cqw #0003; transform: rotate(3deg); background: #fff; }
.scene-swatches { position: absolute; left: 6%; bottom: 19%; width: 28%; height: 8%; display: flex; gap: 3%; }
.scene-swatches span { flex: 1; border: 1px solid #ffffff50; }
.scene-computer { position: absolute; width: 78%; left: 11%; top: 8%; filter: drop-shadow(0 2.3cqw 1.3cqw #0002); }
.scene-screen { border: 1cqw solid #202322; border-radius: 1.4cqw 1.4cqw 0 0; background: #111; overflow: hidden; aspect-ratio: 16 / 9; position: relative; }
.scene-screen::after { content: ''; position: absolute; height: .3cqw; width: .3cqw; border-radius: 50%; background: #656967; top: -.6cqw; left: 50%; }
.scene-screen img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.scene-chin { height: 2.4cqw; background: linear-gradient(90deg,#b8bfbd,#e4e8e6 42%,#c8cecb); border-radius: 0 0 .8cqw .8cqw; }
.scene-stand { width: 16%; margin: auto; height: 4cqw; background: linear-gradient(#8c9391,#c5ccca); clip-path: polygon(15% 0,85% 0,100% 100%,0 100%); }
.scene-foot { width: 27%; margin: auto; height: .8cqw; background: linear-gradient(#e1e6e3,#a0a8a5); border-radius: 70% 70% 15% 15%; }
.scene-device { aspect-ratio: 1.45; }
.scene-device .scene-computer { width: 78%; top: 8%; }
.scene-device .scene-note { color: var(--scene-ink); bottom: 3%; }
.scene-identity .scene-brand { width: 27%; top: 20%; }
.scene-identity .scene-logo { width: 100%; }
.scene-identity .scene-brand p { font-size: 2cqw; }
.scene-identity .scene-guide { top: 12%; width: 55%; }
.scene-identity.scene-higgys .scene-guide { top: 13%; }
.scene-identity.scene-jetbio .scene-brand { width: 45%; top: 15%; }
.scene-identity.scene-jetbio .scene-photograph { width: 44%; }
.scene-identity.scene-jetbio .scene-swatches { bottom: 22%; }
.scene-print { aspect-ratio: 1.6; background: #e6e4df; }
.scene-print .scene-paper-1 { width: 29%; top: 13%; left: 6%; transform: rotate(-7deg); }
.scene-print .scene-paper-2 { width: 29%; top: 17%; left: 36%; transform: rotate(3deg); }
.scene-print .scene-paper-3 { width: 29%; top: 12%; left: 67%; transform: rotate(8deg); }
.scene-print .scene-note { color: #4d514b; }
.scene-print.scene-smartcarbon .scene-paper-2 { width: 52%; left: 42%; top: 28%; }
.scene-cover.scene-higgys .scene-paper-1 { width: 18%; top: 45%; left: 20%; }
.scene-cover.scene-higgys .scene-paper-2 { width: 18%; top: 39%; left: 33%; }
.scene-cover.scene-greggs .scene-brand { top: 8%; width: 34%; }
.scene-cover.scene-greggs .scene-brand p { font-size: 3.3cqw; }
.scene-cover.scene-greggs .scene-brand { top: 6%; }
.scene-cover.scene-greggs .scene-brand p { margin-top: 4%; }
.scene-cover.scene-greggs .scene-paper-2 { top: 52%; left: 18%; }
.scene-cover.scene-greggs .scene-paper-1 { width: 32%; top: 21%; left: 49%; transform: rotate(8deg); z-index: 2; }
.scene-cover.scene-greggs .scene-paper-2 { width: 40%; top: 46%; left: 16%; transform: rotate(-9deg); }
.scene-cover.scene-smartcarbon .scene-brand { width: 26%; }
.scene-cover.scene-smartcarbon .scene-computer { width: 61%; top: 27%; left: 34%; transform: rotate(2deg); }
.scene-cover.scene-smartcarbon .scene-paper-1 { width: 24%; top: 42%; left: 9%; transform: rotate(-8deg); z-index: 2; }
.scene-cover.scene-smartcarbon .scene-paper-1 { width: 22%; top: 51%; }
.scene-cover.scene-jetbio .scene-brand { width: 33%; }
.scene-cover.scene-jetbio .scene-photograph { width: 54%; }
.scene-cover.scene-jetbio .scene-computer { width: 42%; top: 48%; left: 11%; transform: rotate(-4deg); }
.scene-cover.scene-hah .scene-brand { top: 8%; width: 29%; }
.scene-cover.scene-hah .scene-computer { width: 60%; left: 35%; top: 28%; transform: rotate(3deg); }
.scene-cover.scene-hah .scene-paper-1 { width: 23%; top: 43%; left: 10%; transform: rotate(-8deg); }
.scene-cover.scene-hah .scene-paper-1 { width: 21%; top: 53%; }
.scene-cover .scene-note { display: none; }
.scene-jetbio.scene-cover, .scene-jetbio.scene-identity { background: #fff; }
.scene-cover.scene-pwm .scene-brand { width: 30%; }
.scene-cover.scene-pwm .scene-paper-1 { width: 41%; top: 25%; left: 54%; transform: rotate(8deg); }
.scene-cover.scene-pwm .scene-paper-2 { width: 42%; top: 47%; left: 14%; transform: rotate(-7deg); }
.case-showcase figure { margin: 0; }
.case-showcase figcaption { color: #56584f; font-size: 12px; line-height: 1.65; padding-top: 16px; max-width: 850px; }
.case-page .case-hero { padding-bottom: 35px; }
.case-page .case-hero h1 { max-width: 1050px; font-size: clamp(42px, 6.2vw, 90px); line-height: 1.06; letter-spacing: -.055em; }
.case-page .case-hero .page-hero-sub { max-width: 820px; }
.case-page .case-meta-bar { display: grid; grid-template-columns: 1fr 1fr 1.8fr 1fr; gap: 30px; }
.case-page .case-study-meta-info:last-child { grid-column: auto; }
.case-page .case-meta-bar:has(.case-study-meta-info:nth-child(5)) { grid-template-columns: 1fr 1fr 1.8fr .7fr 1fr; }
.case-page .case-sub-heading { font-size: clamp(27px, 3.5vw, 48px); line-height: 1.18; letter-spacing: -.035em; text-transform: none; font-weight: 700; }
.case-page .case-content { margin-bottom: 0; gap: 60px; }
.case-page .case-gallery-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.case-page .case-gallery-row .case-figure { min-width: 0; aspect-ratio: auto; background: transparent; }
.case-page .case-figure { background: transparent; border: 0; }
.case-page .case-gallery-row img { width: 100%; height: auto; max-height: 700px; object-fit: contain; }
.inner-page .portfolio-card-media img { object-fit: cover; }
.inner-page .portfolio-card-media::after { display: none; }
.inner-page .portfolio-card-index, .home-page .home-work-index { display: none; }
.inner-page .portfolio-card-media, .home-work-image { aspect-ratio: 1.6; }
.home-page .home-hero-project img { height: auto; aspect-ratio: 1.6; border-radius: 0; }
.home-page .home-design-note { top: -20px; right: -15px; left: auto; bottom: auto; width: 155px; padding: 19px; font-size: 23px; }
.home-page .home-art-label { display: none; }
@media(max-width: 1000px) {
 .home-page .home-design-note { width: 120px; padding: 15px; font-size: 18px; }
}
@media(max-width: 800px) {
 .case-page .case-meta-bar, .case-page .case-meta-bar:has(.case-study-meta-info:nth-child(5)) { grid-template-columns: 1fr 1fr; gap: 22px; }
 .case-page .case-meta-bar .case-study-meta-info:nth-child(3) { grid-column: 1 / -1; }
 .case-page .case-gallery-row { gap: 15px; }
 .case-page .case-content { gap: 25px; }
}
@media(max-width: 520px) {
 .home-page .home-design-note { width: 110px; padding: 13px; font-size: 17px; top: -16px; right: -8px; }
 .case-page .case-hero h1 { font-size: 42px; }
 .case-showcase { padding-left: 0; padding-right: 0; }
 .case-showcase figcaption { padding: 13px 24px 0; font-size: 11px; }
 .project-scene { aspect-ratio: 1.25; }
 .scene-brand p { font-size: 3.1cqw; }
 .scene-note { font-size: 1.6cqw; }
 .scene-device { aspect-ratio: 1.25; }
 .scene-device .scene-computer { top: 14%; width: 90%; left: 5%; }
 .scene-identity .scene-guide { top: 22%; }
 .scene-identity .scene-brand { top: 20%; }
 .scene-identity .scene-brand p { font-size: 2.7cqw; }
 .scene-print .scene-paper-1 { top: 23%; }
 .scene-print .scene-paper-2 { top: 28%; }
 .scene-print .scene-paper-3 { top: 22%; }
 .scene-cover.scene-greggs .scene-paper-1 { top: 28%; }
 .scene-cover.scene-greggs .scene-paper-2 { top: 57%; }
 .scene-cover.scene-pwm .scene-paper-1 { top: 33%; }
 .scene-cover.scene-pwm .scene-paper-2 { top: 60%; }
 .scene-cover.scene-higgys .scene-paper-1 { top: 52%; }
 .scene-cover.scene-higgys .scene-paper-2 { top: 48%; }
 .scene-cover.scene-smartcarbon .scene-computer, .scene-cover.scene-hah .scene-computer { top: 39%; }
 .scene-cover.scene-smartcarbon .scene-paper-1, .scene-cover.scene-hah .scene-paper-1 { top: 54%; }
 .scene-cover.scene-jetbio .scene-computer { top: 58%; }
 .case-page .case-gallery-row { grid-template-columns: 1fr; gap: 26px; }
}