.background-film{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:#080e19}.background-film video{width:100%;height:100%;object-fit:cover;opacity:var(--film-opacity,.65);filter:saturate(1.15) brightness(1.4);transition:opacity .25s linear}.background-film::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#080e1990 0%,#080e1910 40%,#080e1920 100%),linear-gradient(0deg,#080e19,transparent 30%,#080e1910 80%,#080e19)}.video-active .flow-background svg{opacity:.12}.video-active .architecture{mask-image:linear-gradient(to right,transparent,black 15%,black 90%,transparent),linear-gradient(to bottom,transparent,black 9%,black 91%,transparent);mask-composite:intersect}
@media(min-width:701px){.stage-wrap{left:20%;right:12%}.room[data-id=dev],.room[data-id=interior],.room[data-id=content]{left:100%;min-width:180px}.room[data-id=dev]::before,.room[data-id=interior]::before,.room[data-id=content]::before{width:45px;height:1px;top:50%;left:-46px;border:0;background:linear-gradient(90deg,#76baff10,#76baff);box-shadow:0 0 7px #368eff40}.room[data-id=dev]:hover,.room[data-id=interior]:hover,.room[data-id=content]:hover,.room[data-id=dev].selected,.room[data-id=interior].selected,.room[data-id=content].selected{transform:translate(-50%,-50%)}.scene-help{left:55%;white-space:normal;width:85%;text-align:center}.project-panel{width:300px}.editorial{width:26%}.room b{white-space:nowrap}}
@media(min-width:701px) and (max-width:1100px){.stage-wrap{left:20%;right:14%}.room[data-id=dev],.room[data-id=interior],.room[data-id=content]{min-width:150px}.room[data-id=dev]::before,.room[data-id=interior]::before,.room[data-id=content]::before{width:28px;left:-29px}.project-panel{width:265px}}
@media(max-width:700px){.background-film{display:none}.room b{white-space:normal}}
@media(prefers-reduced-motion:reduce){.background-film{display:none}}
.project-panel.is-pinned{background:linear-gradient(145deg,#1b4675,#0b203b);border-color:#8dccff;box-shadow:0 0 0 1px #72b9ff55,0 16px 50px #0006}
.pin-status{font-size:12px;font-weight:700;line-height:1.6;color:#b9e4ff;margin:12px 0}
.room.pinned{outline:2px solid #8dccff;outline-offset:3px}
/* Keep the mobile room artwork visible through every panel state. */
.editorial h1{margin-top:0}
@media(max-width:700px){
 .editorial{padding-top:16px}
 .room,.room:hover,.room.selected,.room:focus-visible{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:none;
  text-shadow:0 1px 2px #02060d,0 0 5px #02060d,0 0 9px #02060d;
 }
 .room:focus-visible{outline:2px solid #b1dbff;outline-offset:3px}
 .stage-wrap{overflow:hidden}
 .stage{width:120%;margin-left:-23%;aspect-ratio:1.5}
 .room[data-id=blog],.room[data-id=web],.room[data-id=publishing],
 .room[data-id=blog]:hover,.room[data-id=web]:hover,.room[data-id=publishing]:hover,
 .room[data-id=blog].selected,.room[data-id=web].selected,.room[data-id=publishing].selected{
  left:21.5%;transform:translateY(-50%);
 }
 .room[data-id=dev],.room[data-id=interior],.room[data-id=content]{
  left:auto;right:1.5%;width:116px;min-width:116px;
  transform:translateY(-50%);text-align:right;
 }
 .room[data-id=dev]:hover,.room[data-id=interior]:hover,.room[data-id=content]:hover,
 .room[data-id=dev].selected,.room[data-id=interior].selected,.room[data-id=content].selected{
  transform:translateY(-50%);
 }
}

/* Official HIRAM wordmark: preserve original proportions. */
.brand-logo{display:block;width:174px;height:auto;max-width:100%}
.company-footer .footer-logo{display:block;width:148px;height:auto;margin-bottom:12px}
@media(max-width:700px){.brand-logo{width:128px}.company-footer .footer-logo{width:140px}}

.company-footer strong{display:block;width:148px;height:31px;margin-bottom:12px;background:url("assets/hiram-logo-white.png") left center/contain no-repeat;font-size:0;letter-spacing:0}
@media(max-width:700px){.company-footer strong{width:140px;height:30px}}