/* Hand-written base styles. Per-element positions live in layout.css (generated). */

html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: #000;
  color: #fff;
  font-family: 'Inter', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }

/* All geometry in layout.css is expressed in cqw of this wrapper (= viewport width without scrollbar). */
.page { container-type: inline-size; overflow-x: hidden; overflow-x: clip; }

.rec { position: relative; }
@media (min-width: 981px) { .only-mobile { display: none; } }
@media (max-width: 980px) { .only-desktop { display: none; } }

/* ---- Zero Block model: absolutely positioned elements on a full-width artboard ---- */
.ab { position: relative; width: 100%; }
.el { position: absolute; box-sizing: border-box; display: table; }
.el > .a {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.el a, .el a:visited { color: inherit; }
.el > a.a { text-decoration: none; }
.t-text > .a { word-break: normal; -moz-osx-font-smoothing: grayscale; }
.t-shape > .a, .t-button > .a { height: 100%; }
.t-image img { display: block; width: 100%; height: auto; border-radius: inherit; }

/* Buttons */
.t-button > .a {
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out;
}
.t-button .bc { display: flex; align-items: center; gap: 4px; }
.t-button .bt { transition: color .2s ease-in-out; }
.t-button .bi {
  position: relative;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background-color: currentColor;
  -webkit-mask: url('../icons/arw_right_regular.svg') center / contain no-repeat;
  mask: url('../icons/arw_right_regular.svg') center / contain no-repeat;
}

/* ---- Scroll-in animations (same timings as Tilda; below 980px only elements flagged for mobile) ---- */
[data-anim].anim > .a {
  opacity: 0;
  backface-visibility: hidden;
  transition-property: opacity, transform;
  transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}
[data-anim].anim.in > .a { opacity: 1; transform: none !important; }

/* ---- Side menu (was Tilda t450) ---- */
.sm-overlay { position: fixed; inset: 0; z-index: 99999; }
.sm {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
  width: 100%;
  max-width: 480px;
  overflow-y: auto;
  box-sizing: border-box;
  padding: 48px 40px 38px;
  background: #060706;
  transform: translate(100%, 0);
  transition: transform .3s ease-in-out;
  visibility: hidden;
}
.sm.open { transform: none; visibility: visible; }
.sm-close {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: #060706;
  color: #fff;
  cursor: pointer;
}
.sm-close span { position: absolute; left: 8px; width: 24px; height: 2px; background: currentColor; }
.sm-close span:nth-child(1), .sm-close span:nth-child(4) { width: 0; }
.sm-close span:nth-child(2) { transform: rotate(45deg); }
.sm-close span:nth-child(3) { transform: rotate(-45deg); }
.sm-list { list-style: none; margin: 0; padding: 0; }
.sm-list li { font-size: 16px; line-height: 20px; }
.sm-list .sp { height: 20px; }
.sm-list a {
  display: inline-block;
  margin-bottom: 15px;
  color: #fff;
  font-weight: 300;
  text-decoration: none;
  text-transform: capitalize;
  transition: color .3s ease-in-out, opacity .3s ease-in-out;
}
.sm-list li:last-child a { margin-bottom: 0; }
.sm-list a.active { color: #82b1e3; opacity: .7; }
@media (hover: hover) { .sm-list a:not(.active):hover { color: #4ab26c; } }
.sm-list a:not(.active):focus-visible { color: #4ab26c; }
@media (max-width: 640px) { .sm { padding: 42px 25px 25px; } }

/* ---- Scrollbar (was Tilda t1084) ---- */
::-webkit-scrollbar { width: 8px; height: 8px; background-color: #000; }
::-webkit-scrollbar-track { background-color: #000; }
::-webkit-scrollbar-thumb { background-color: #32363b; border-radius: 40px; background-clip: padding-box; }
@supports (-moz-appearance: none) { :root { scrollbar-width: thin; scrollbar-color: #32363b #000; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-anim].anim > .a { opacity: 1 !important; transform: none !important; transition: none !important; }
  .sm { transition: none; }
}
.el h1.a, .el h2.a, .el h3.a, .el h4.a, .el h5.a, .el h6.a { margin: 0; }
