/* Self Owned — standalone layout engine.
   Desktop canvas is 1200px wide, mobile canvas 320px. Each block's canvas
   (.sc) is scaled to the viewport with --s, set by js/site.js. Element
   positions, sizes and type styles come from the per-page stylesheet. */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; background: #fff; --s: 1; --lx: 0; }
body { line-height: 1; font-family: 'Nunito Sans', sans-serif; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p, nav { margin: 0; font: inherit; }
b, strong { font-weight: 700; }
em, i { font-style: italic; }

/* page and blocks */
.sp { position: relative; width: 100%; min-width: 320px; overflow: hidden; }
.sb { position: relative; width: 100%; }
.d .sb { height: calc(var(--hd) * var(--s) * 1px); }
.m .sb { height: calc(var(--hm) * var(--s) * 1px); }
.ss-s, .ss-bg { position: absolute; inset: 0; width: 100%; height: 100%; }

/* block background media: cover the block, centered */
.sb-m { position: absolute; inset: 0; overflow: hidden; }
.sb-m .sb-mc { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%;
  transform: translate(-50%, -50%); object-fit: cover; display: block; }
.d .sb-m.bg-m, .m .sb-m.bg-d { display: none; }

/* the design canvas, scaled about its top centre */
.sc { position: absolute; top: 0; left: 50%; height: 100%; width: 1200px; pointer-events: none;
  transform: translateX(-50%) scale(var(--s)); transform-origin: 50% 0; }
.m .sc { width: 320px; }

/* elements */
.se { position: absolute; display: block; outline: none; pointer-events: auto;
  transform-origin: 50% 50%; animation-fill-mode: both; }
.d .se { transform: translateX(calc(var(--lkx, 0) * 1px)) rotate(var(--rotd, 0deg)); }
.m .se { transform: translateY(calc(var(--lky, 0) * 1px)) rotate(var(--rotm, 0deg)); }
.d .se[data-lockh-d="r"] { --lkx: var(--lx); }
.d .se[data-lockh-d="l"] { --lkx: calc(var(--lx) * -1); }
.d .se-bd, .m .se-bm { overflow: hidden; }

.se-t { position: absolute; inset: 0; width: 100%; height: 100%; background: transparent;
  border: 0; padding: 0; }
.se-rc a { text-decoration: underline; }
.se-rc a:hover { opacity: .8; }
.se-img, .se-gr { display: block; width: 100%; height: 100%; }
.se-icon { width: 100%; height: 100%; }
.se-icon svg { width: 100%; height: 100%; vertical-align: top; }
.se-simple { width: 100%; height: 100%; border: 0 solid transparent; }
.se-pc, a.se { cursor: pointer; }

/* scroll-in transitions */
.str-id, .str-im { position: absolute; inset: 0; width: 100%; height: 100%; animation-fill-mode: both; }
.str-wait { visibility: hidden; }
.str-go { visibility: visible; animation-timing-function: ease-out; animation-fill-mode: both; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes rotateInDownLeft {
  from { transform-origin: left bottom; transform: rotate3d(0, 0, 1, -45deg); opacity: 0; }
  to   { transform-origin: left bottom; transform: none; opacity: 1; }
}
.fadeIn { animation-name: fadeIn; }
.rotateInDownLeft { animation-name: rotateInDownLeft; }

/* mobile header: fixed bar, page content starts below it */
.m .sib-mobile-menu-closed { position: fixed; top: 0; left: 0; right: 0; z-index: 20; }
.m .sp { padding-top: calc(var(--mhead, 50) * var(--s) * 1px); }

/* mobile menu: full-screen overlay, canvas centred vertically */
.m .sib-mobile-menu { position: fixed; inset: 0; z-index: 30; height: 100vh; height: 100dvh;
  display: none; opacity: 0; transition: opacity .2s; }
.m .sib-mobile-menu.is-open { display: block; }
.m .sib-mobile-menu.is-shown { opacity: 1; }
.m .sib-mobile-menu .sc { top: 50%; transform: translate(-50%, -50%) scale(var(--s)); transform-origin: 50% 50%;
  height: calc(var(--hm) * 1px); }
.m .sib-mobile-menu .se[data-lockv-m="b"] { --lky: var(--menu-extra, 0); }
.m .sib-mobile-menu .se[data-lockv-m="bs"] { height: calc((var(--lkh0, 0) + var(--menu-extra, 0)) * 1px) !important; }
.m .sib-mobile-menu .se[data-lockv-m="t"] { --lky: calc(var(--menu-extra, 0) * -1); }

/* video keeps playing quietly behind the content */
video.sb-mc { pointer-events: none; }
