.home-page-shell, .home-canvas { height: 1867px; }
.home-canvas .home-greeting { top: 240px; width: 1382px; letter-spacing: -.03em; text-box-trim: trim-both; text-box-edge: cap alphabetic; }
.home-subtitle { position: absolute; left: 30px; top: 296px; width: 1382px; font-size: 60px; line-height: 64px; letter-spacing: -.03em; color: rgb(0 0 0 / 30%); text-box-trim: trim-both; text-box-edge: cap alphabetic; }
.home-canvas .home-experience { top: 418px; left: 30px; }
.home-canvas .home-experience-row { font-size: 15px; }
.home-experience-row > span { text-box-trim: trim-both; text-box-edge: cap alphabetic; }
.home-experience-row .year, .home-experience-row .role { color: rgb(0 0 0 / 50%); }
.home-experience-row .org, .home-experience-row .role { text-transform: none; }
.home-canvas .home-experience-row .org { left: 140px; }
.home-canvas .home-experience-row .role { left: 402px; letter-spacing: -.03em; }
.home-canvas .home-experience-row:nth-child(3) .org { top: -1px; }
.home-canvas .project-card { width: 685px; height: auto; font-size: 12px; line-height: 24px; }
.home-canvas .project-pladuo { left: 30px; top: 586px; }
.home-canvas .project-roads { left: 725px; top: 586px; width: 688px; }
.home-canvas .project-midis { left: 30px; top: 1205px; }
.home-canvas .project-media { width: 100%; height: 494px; aspect-ratio: auto; }
.project-card .project-caption { display: grid; grid-template-columns: minmax(0, 1fr) max-content; align-items: start; column-gap: 8px; row-gap: 11.4375px; margin-top: 16px; }
.project-card .project-caption p { text-box-trim: trim-both; text-box-edge: cap alphabetic; letter-spacing: -.02em; }
.project-card .project-caption .project-title { grid-column: 1; grid-row: 1; width: auto; text-transform: uppercase; }
.project-card .project-caption .project-meta { grid-column: 1; grid-row: 2; color: rgb(0 0 0 / 50%); }
.project-year { grid-column: 2; grid-row: 1; white-space: nowrap; text-transform: uppercase; }
.home-canvas .project-roads .project-caption { padding-left: 4px; }
.home-canvas .project-midis .project-caption { margin-top: 15px; }
.home-canvas .project-card .project-caption { font-size: 15px; line-height: 24px; font-weight: 400; row-gap: calc(27px - 1cap); }
.home-canvas .project-card .project-caption .project-meta { letter-spacing: -.03em; }
.project-midis .project-media { background: transparent; padding: 0; }
.project-midis .project-midis-video { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; }
.project-midis .project-card-video { object-position: center center; transform: scale(1.5525); transform-origin: center center; }
.project-midis .project-midis-foreground { position: absolute; left: 50%; top: 50%; width: 78.40579710144927%; aspect-ratio: 16 / 9; transform: translate(-50%, -50%); z-index: 1; overflow: hidden; pointer-events: none; }
.project-media--pladuo { pointer-events: auto; }
.project-media--pladuo img { pointer-events: none; }
.pladuo-gradient-host { position: absolute; inset: 0; overflow: hidden; container-type: size; pointer-events: none; background: #007bbb; }
.pladuo-gradient-surface { position: absolute !important; width: max(100cqw, 155.386949924cqh) !important; height: max(64.35546875cqw, 100cqh) !important; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none; }
.project-media--pladuo .pladuo-logo { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.project-media--pladuo .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 768px) and (max-width: 1439px) {
  .home-page-shell { height: calc(1867 / 1440 * 100vw); }
}

@media (max-width: 767px) {
  .home-page-shell, .home-mobile, html[lang="en"] .home-page-shell, html[lang="en"] .home-mobile { height: 1867px; }
  .home-mobile .home-greeting { top: 253px; width: 378px; font-size: 33px; line-height: 32px; letter-spacing: -.02em; text-box-trim: trim-both; text-box-edge: cap alphabetic; }
  .home-mobile .home-subtitle { top: 325px; left: 12px; width: 378px; font-size: 33px; line-height: 32px; letter-spacing: -.02em; color: rgb(0 0 0 / 40%); }
  .home-mobile .home-experience { top: 434px; left: 11px; }
  .home-mobile .home-experience-row .org, .home-mobile .home-experience-row .role { left: 169px; }
  .home-mobile .home-experience-row:nth-child(n+2) .org { letter-spacing: -.04em; }
  .home-mobile .home-experience-row:nth-child(3) .org { top: -1px; }
  .home-mobile .home-experience-row:nth-child(2) .role { top: 22px; }
  .home-mobile .project-pladuo { left: 11px; top: 647px; }
  .home-mobile .project-roads { left: 11px; top: 1015px; }
  .home-mobile .project-midis { left: 11px; top: 1383px; width: 368.719px; }
  .home-mobile .project-media { width: 100%; height: 275.462px; aspect-ratio: auto; }
  .home-mobile .project-midis .project-media { height: 276px; }
  .home-mobile .project-card .project-caption { margin-top: 14.538px; row-gap: 14.4375px; font-size: 12px; line-height: 16px; padding-left: 1px; }
  .home-mobile .project-card .project-caption .project-title { width: auto; }
  .home-mobile .project-pladuo .project-title { max-width: 308px; }
  .home-mobile .project-roads .project-title { max-width: 314px; }
  .home-mobile .project-roads .project-year { margin-top: 1px; }
  .home-mobile .project-midis .project-caption { margin-top: 15px; padding-left: 0; }
  .home-mobile .project-midis .project-title { max-width: 314px; }
}
@media (max-width: 389px) {
  .home-page-shell, html[lang="en"] .home-page-shell { height: calc(1867 / 390 * 100vw); }
}

/* Keep caption title/year anchors; place the new chip row at the Figma offset. */
.home-canvas .project-card .project-caption{row-gap:calc(42px - 1cap)}
.home-canvas .project-midis .project-caption{row-gap:calc(26px - 1cap)}
.project-caption .portfolio-tags{grid-column:1;grid-row:2}
.home-canvas .project-roads .portfolio-tags{margin-left:-4px}
@media(max-width:767px){.home-mobile .project-card .project-caption{row-gap:calc(20px - 1cap)}.home-mobile .project-roads .project-caption{row-gap:calc(18px - 1cap)}.home-mobile .project-midis .portfolio-tags{margin-left:1px}}
.home-canvas .project-pladuo .project-title { max-width: 548px; line-height: 21px; }
.home-canvas .project-midis .project-title { max-width: 459px; line-height: 21px; }
.home-canvas .project-roads .project-caption { row-gap: calc(26px - 1cap); }
.home-canvas .project-pladuo .project-caption { row-gap: calc(31px - 1cap); }
.home-canvas .project-midis .project-caption { row-gap: calc(26px - 1cap); }
