@import url("dim-contact-footer-sticky.css");
/* Home: Commercial (Figma 470:1427), 1512×1968 artboard; Safari chrome omitted */

:root {
  --comm-board-w: 1512px;
  --comm-board-h: 1968px;
  --comm-text: #595656;
  --comm-tile: 440px;
}

.dim-commercial { width: 100%; background: #fff; }
.dim-commercial__scale-wrap { width: min(100vw, var(--comm-board-w)); margin-inline: auto; height: calc(var(--comm-board-h) * min(100vw, var(--comm-board-w)) / var(--comm-board-w)); position: relative; overflow: hidden; }
.dim-commercial__board { position: absolute; left: 0; top: 0; width: var(--comm-board-w); height: var(--comm-board-h); transform-origin: top left; transform: scale(calc(min(100vw, var(--comm-board-w)) / var(--comm-board-w))); background: #fff; font-family: Inter, system-ui, -apple-system, sans-serif; color: var(--comm-text); }
.dim-commercial__board figure { margin: 0; }

.dim-commercial__header-bg { position: absolute; left: 0; top: 89px; width: 1512px; height: 223px; background: #fff; z-index: 2; pointer-events: none; }

.dim-commercial__logo { position: absolute; left: 64px; top: 138px; width: 213px; height: 58px; z-index: 6; display: block; }
.dim-commercial__logo img { width: 100%; height: 100%; object-fit: contain; object-position: left top; display: block; }

.dim-commercial__eyebrow { position: absolute; left: 64px; top: 290px; transform: translateY(-50%); margin: 0; font-size: 16px; font-weight: 400; letter-spacing: -0.064px; line-height: 1; text-transform: uppercase; z-index: 6; }

.dim-commercial__tile { position: absolute; overflow: hidden; background: transparent; z-index: 1; }
.dim-commercial__tile a { display: block; width: 100%; height: 100%; color: inherit; text-decoration: none; cursor: pointer; }
.dim-commercial__tile a img { transition: opacity 0.2s ease; }
.dim-commercial__tile a:hover img { opacity: 0.88; }
.dim-commercial__tile img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Left column */
.dim-commercial__tile--sky-clubhouse { left: 64px; top: 464px; width: var(--comm-tile); height: 293px; }
.dim-commercial__tile--the-spa       { left: 64px; top: 789px; width: var(--comm-tile); height: var(--comm-tile); }
.dim-commercial__tile--sopper-pot    { left: 64px; top: 1261px; width: var(--comm-tile); height: 293px; }
.dim-commercial__tile--k-bank        { left: 64px; top: 1586px; width: var(--comm-tile); height: 244px; }

/* Middle column */
.dim-commercial__tile--dim-c         { left: 536px; top: 464px; width: var(--comm-tile); height: 660px; }
.dim-commercial__tile--como          { left: 536px; top: 1156px; width: var(--comm-tile); height: 244px; }
.dim-commercial__tile--commercial-1  { left: 536px; top: 1432px; width: var(--comm-tile); height: var(--comm-tile); }

/* Right column */
.dim-commercial__tile--thai-carbon   { left: 1008px; top: 464px; width: var(--comm-tile); height: 320px; }
.dim-commercial__tile--redrabbit     { left: 1008px; top: 816px; width: var(--comm-tile); height: var(--comm-tile); }
.dim-commercial__tile--toomato       { left: 1008px; top: 1288px; width: var(--comm-tile); height: var(--comm-tile); }

.dim-commercial__footer { position: absolute; left: 0; top: 902px; width: 1512px; height: 78px; z-index: 4; background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06); }
.dim-commercial__footer-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 64px; gap: 24px; font-size: 13px; font-weight: 400; letter-spacing: -0.052px; line-height: 1.35; color: var(--comm-text); }
.dim-commercial__footer-col { flex: 0 1 auto; min-width: 0; }
.dim-commercial__footer-col p { margin: 0; }
.dim-commercial__footer-col--mid { text-align: center; flex: 1 1 auto; }
.dim-commercial__footer-col--right { text-align: right; }
.dim-commercial__footer a { color: var(--comm-text); text-decoration: none; }
.dim-commercial__footer a:hover { text-decoration: underline; }

@media (max-width: 480px) {
  .dim-commercial__footer-inner { padding: 0 20px; flex-wrap: wrap; justify-content: center; text-align: center; row-gap: 4px; }
  .dim-commercial__footer-col--mid,
  .dim-commercial__footer-col--right { text-align: center; }
}