.site-house-ads {
  width: min(1180px, calc(100% - 32px));
  margin: clamp(28px, 5vw, 62px) auto;
  position: relative;
}

.site-house-ads__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
  transition: opacity .24s ease, transform .24s ease;
}
.site-house-ads__grid--out { opacity: 0; transform: translateY(7px); }
.site-house-ads__pause{position:absolute;right:0;bottom:-28px;border:0;background:transparent;color:#9fc1d5;font:700 .69rem/1 system-ui,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.site-house-ads__pause:focus-visible{outline:2px solid #c9ff39;outline-offset:4px;border-radius:4px}.site-house-ads[data-house-ads-paused="true"] .house-ad *,.site-house-ads[data-house-ads-paused="true"] .house-ad *::after{animation:none!important;transition:none!important}

.site-house-ads__tower {
  position: fixed;
  z-index: 45;
  inset: 50% 12px auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: auto;
  margin: 0;
  pointer-events: none;
  transform: translateY(-50%);
}

.house-ad {
  --ad-main: #44ff86;
  --ad-secondary: #bcff44;
  isolation: isolate;
  min-height: clamp(264px, 29vw, 348px);
  display: grid;
  overflow: hidden;
  position: relative;
  border: 1px solid color-mix(in srgb, var(--ad-main) 72%, white);
  border-radius: 24px;
  background: #06120f;
  box-shadow: 0 12px 28px rgb(0 0 0 / .27), 0 0 0 1px rgb(255 255 255 / .08) inset, 0 0 24px color-mix(in srgb, var(--ad-main) 26%, transparent);
  color: #fff;
  text-decoration: none;
  transform: translateZ(0);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.house-ad:hover, .house-ad:focus-visible {
  color: #fff;
  transform: translateY(-5px) scale(1.012);
  border-color: #fff;
  box-shadow: 0 20px 42px rgb(0 0 0 / .36), 0 0 35px color-mix(in srgb, var(--ad-main) 56%, transparent);
  outline: none;
}

.house-ad--electric { --ad-main: #3ee8ff; --ad-secondary: #e84bff; background: #071126; }
.house-ad--gold { --ad-main: #44e98c; --ad-secondary: #f7cd52; background: #0d1713; }
.house-ad--violet { --ad-main: #ff52d3; --ad-secondary: #5deaff; background: #170526; }
.house-ad--vertical {
  min-height: 0;
  height: min(520px, calc(100vh - 120px));
  width: clamp(128px, 9.7vw, 182px);
  max-width: none;
  margin: 0;
  border-radius: 17px;
  pointer-events: auto;
}
.house-ad--vertical .house-ad__visual img { object-position: 66% center; }
.house-ad--vertical .house-ad__content { min-height: 100%; height: 100%; max-width: 100%; justify-content: space-between; padding: 24px 16px 17px; }
.house-ad--vertical .house-ad__eyebrow { gap: 5px; font-size: 8px; letter-spacing: .09em; }
.house-ad--vertical .house-ad__icon { font-size: 13px; }
.house-ad--vertical .house-ad__live { display: none; }
.house-ad--vertical .house-ad__title { margin: 0; font-size: clamp(20px, 1.7vw, 25px); line-height: .96; }
.house-ad--vertical .house-ad__detail { max-width: 150px; margin: 0; font-size: 12px; }
.house-ad--vertical .house-ad__cta { margin: 0; padding: 9px 10px; font-size: 10px; gap: 5px; }
.house-ad--vertical .house-ad__legal { margin: 0; max-width: 150px; font-size: 7px; }

/* The side creatives must never sit above the persistent site navigation.
   Keep the Telegram CTA fully visible and render its SVG without cropping. */
.site-header { z-index: 60; }
.site-header .site-cta { position: relative; z-index: 61; overflow: visible; }
.site-header .site-cta > img { display: none !important; }
.site-header .site-cta::before { content: ''; display: inline-block; flex: 0 0 22px; width: 22px; height: 22px; background: url('/static/assets/telegram.svg') center / contain no-repeat; }

/* At this width the full desktop navigation has more items than the header
   can safely contain.  Switch only the navigation to its compact control so
   the green Telegram CTA is never pushed outside the viewport. */
@media (min-width: 761px) and (max-width: 2000px) {
  .site-header { grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto; gap: 13px; min-width: 0; }
  .site-header > .site-menu { display: none !important; }
  .site-header > .site-cta { display: inline-flex !important; align-items: center; justify-self: end; min-width: max-content; }
  .site-header > .mobile-menu { position: relative; display: block; }
  .site-header > .mobile-menu summary { display: grid; gap: 4px; width: 40px; padding: 11px; border: 1px solid rgba(169,202,228,.25); border-radius: 11px; list-style: none; }
  .site-header > .mobile-menu summary::-webkit-details-marker { display: none; }
  .site-header > .mobile-menu summary i { display: block; height: 2px; border-radius: 99px; background: #eaf6ff; }
  .site-header > .mobile-menu > div { position: absolute; top: 52px; right: 0; display: none; width: 238px; gap: 2px; padding: 8px; border: 1px solid rgba(100,166,216,.35); border-radius: 17px; background: #0b2036; box-shadow: 0 23px 45px #000b; }
  .site-header > .mobile-menu[open] > div { display: grid; }
  .site-header > .mobile-menu a { padding: 11px; color: #d6e6f5; font-size: 12px; font-weight: 800; text-decoration: none; }
  .site-header > .mobile-menu .mobile-menu-cta { margin-top: 4px; border-radius: 10px; background: #c9ff5d; color: #14270b; text-align: center; }
}

.house-ad__visual, .house-ad__visual::after, .house-ad__aurora, .house-ad__sweep { position: absolute; inset: 0; pointer-events: none; }
.house-ad__visual { z-index: -3; background: #081311; }
.house-ad__visual img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 74% center; opacity: .9; animation: house-ad-drift 12s ease-in-out infinite alternate; transform: scale(1.08); }
.house-ad__visual::after { content: ''; background: linear-gradient(90deg, rgb(3 8 14 / .98) 0%, rgb(3 8 14 / .89) 37%, rgb(3 8 14 / .32) 76%, rgb(3 8 14 / .12) 100%); }
.house-ad__aurora { z-index: -2; background: radial-gradient(ellipse at 13% 28%, color-mix(in srgb, var(--ad-main) 30%, transparent), transparent 43%), radial-gradient(ellipse at 93% 94%, color-mix(in srgb, var(--ad-secondary) 34%, transparent), transparent 48%); mix-blend-mode: screen; animation: house-ad-aurora 6.5s ease-in-out infinite alternate; }
.house-ad__sweep { z-index: -1; inset: -80% -28%; background: linear-gradient(106deg, transparent 43%, rgb(255 255 255 / .04) 48%, rgb(255 255 255 / .37) 50%, rgb(255 255 255 / .05) 52%, transparent 57%); transform: translateX(-75%) rotate(6deg); animation: house-ad-sweep 7.5s 1.1s ease-in-out infinite; }

.house-ad__content { min-height: inherit; padding: clamp(24px, 3vw, 38px); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; max-width: 77%; text-shadow: 0 2px 12px rgb(0 0 0 / .55); }
.house-ad__eyebrow { display: inline-flex; align-items: center; gap: 8px; font: 800 11px/1 system-ui, sans-serif; letter-spacing: .14em; color: #eafff3; }
.house-ad__icon { font-size: 17px; filter: drop-shadow(0 0 8px var(--ad-main)); }
.house-ad__live { margin-left: 4px; padding: 4px 6px; border-radius: 999px; color: #06100b; background: var(--ad-main); box-shadow: 0 0 14px var(--ad-main); font-size: 9px; letter-spacing: .1em; animation: house-ad-pulse 2.4s ease-in-out infinite; }
.house-ad__title { margin-top: 15px; font: 900 clamp(28px, 3.4vw, 48px)/.95 system-ui, sans-serif; letter-spacing: -.055em; color: #fff; text-wrap: balance; animation: house-ad-rise .75s cubic-bezier(.2,.8,.2,1) both; }
.house-ad__detail { margin-top: 10px; font: 750 clamp(14px, 1.6vw, 18px)/1.24 system-ui, sans-serif; color: color-mix(in srgb, var(--ad-main) 52%, white); text-wrap: balance; }
.house-ad__cta { margin-top: 19px; padding: 11px 15px; display: inline-flex; align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--ad-main) 72%, white); border-radius: 10px; background: linear-gradient(135deg, color-mix(in srgb, var(--ad-main) 88%, #fff), var(--ad-secondary)); box-shadow: 0 6px 22px color-mix(in srgb, var(--ad-main) 36%, transparent); color: #06100b; font: 900 13px/1 system-ui, sans-serif; text-shadow: none; animation: house-ad-cta 3s ease-in-out infinite; }
.house-ad__cta span { font-size: 18px; line-height: .6; }
.house-ad__legal { margin-top: 14px; max-width: 300px; color: rgb(255 255 255 / .69); font: 600 9px/1.35 system-ui, sans-serif; letter-spacing: .025em; }

@keyframes house-ad-drift { from { transform: scale(1.08) translate3d(-1.3%, -1%, 0); } to { transform: scale(1.16) translate3d(2.5%, 1.4%, 0); } }
@keyframes house-ad-aurora { from { opacity: .48; transform: scale(.94) rotate(-2deg); } to { opacity: 1; transform: scale(1.08) rotate(2deg); } }
@keyframes house-ad-sweep { 0%, 34% { transform: translateX(-78%) rotate(6deg); } 60%, 100% { transform: translateX(86%) rotate(6deg); } }
@keyframes house-ad-pulse { 0%, 100% { box-shadow: 0 0 10px color-mix(in srgb, var(--ad-main) 45%, transparent); } 50% { box-shadow: 0 0 22px var(--ad-main); } }
@keyframes house-ad-cta { 0%, 100% { transform: translateY(0); filter: brightness(1); } 50% { transform: translateY(-2px); filter: brightness(1.12); } }
@keyframes house-ad-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (min-width: 1280px) and (max-width: 1439px) {
  .site-house-ads__tower { inset-inline: 8px; }
  .house-ad--vertical { width: 112px; height: min(430px, calc(100vh - 118px)); }
  .house-ad--vertical .house-ad__content { padding: 20px 11px 14px; }
  .house-ad--vertical .house-ad__eyebrow { font-size: 7px; }
  .house-ad--vertical .house-ad__title { font-size: 18px; }
  .house-ad--vertical .house-ad__detail { font-size: 10px; }
  .house-ad--vertical .house-ad__cta { padding: 8px; font-size: 8px; }
  .house-ad--vertical .house-ad__legal { font-size: 6px; }
}

@media (max-width: 1279px) {
  .site-house-ads__tower { display: none; }
}

@media (max-width: 760px) {
  .site-house-ads { width: min(100% - 24px, 560px); margin: 30px auto; }
  .site-house-ads__grid { grid-template-columns: 1fr; gap: 15px; }
  .house-ad { min-height: 238px; border-radius: 19px; }
  .house-ad__content { max-width: 82%; padding: 26px 22px; }
  .house-ad__title { font-size: clamp(31px, 9vw, 42px); }
  .house-ad__visual img { object-position: 72% center; }
  .site-house-ads__pause{right:4px;bottom:-25px}
}

@media (prefers-reduced-motion: reduce) {
  .house-ad, .house-ad *, .house-ad *::after { animation: none !important; transition: none !important; }
  .house-ad__visual img { transform: scale(1.08); }
}