.ib-wrap { container-type: inline-size; max-width: 1056px; margin: 1.5em auto; }

.ib {
  --ib-bg-from: #0b0614;
  --ib-bg-to:   #1b1660;
  --ib-bg-angle: 100deg;
  --ib-title:   #b86cf2;
  --ib-text:    #ffffff;
  --ib-btn-bg:  #8b14e9;
  --ib-btn-text:#ffffff;
  --ib-glow:    #6a5cff;
  --ib-top:     #dfe3ff;
  --ib-left:    #8f93e8;
  --ib-right:   #b9bdf5;
  --ib-accent:  #ffffff;

  position: relative; display: block; overflow: hidden;
  aspect-ratio: 1056 / 190;
  border-radius: 2.6cqw;
  background:
    radial-gradient(40cqw 30cqw at 88% 60%, color-mix(in srgb, var(--ib-glow) 55%, transparent), transparent 70%),
    linear-gradient(var(--ib-bg-angle), var(--ib-bg-from) 0%, var(--ib-bg-from) 22%, var(--ib-bg-to) 100%);
  color: var(--ib-text);
  text-decoration: none;
  isolation: isolate;
}
.ib * { box-sizing: border-box; }

.ib .ib__logo { position: absolute; left: 3.8cqw; top: 4.6cqw; display: flex; align-items: center; gap: .9cqw;
  font-weight: 800; font-size: 1.45cqw; letter-spacing: .06em; color: #fff; }
.ib__logo svg { width: 3cqw; height: 1.9cqw; display: block; }

.ib__body { position: absolute; left: 3.8cqw; top: 9.6cqw; right: 30cqw; }
.ib .ib__title { display: block; margin: 0; padding: 0; font-family: inherit; font-weight: 800; font-size: 3.55cqw; line-height: 1.1; color: var(--ib-title); letter-spacing: -.01em; white-space: nowrap; }
.ib .ib__sub { display: block; padding: 0; font-family: inherit; margin: 1.1cqw 0 0; font-weight: 500; font-size: 1.75cqw; line-height: 1.3; color: var(--ib-text); opacity: .95; }

.ib__art { position: absolute; right: 0; top: 0; height: 100%; width: 38cqw; z-index: -1; pointer-events: none; }
.ib__art svg { position: absolute; inset: 0; width: 100%; height: 100%; }

.ib__btn { position: absolute; right: 3.6cqw; top: 9.8cqw; z-index: 2;
  min-width: 22.6cqw; padding: 0 2cqw; height: 4.6cqw; display: flex; align-items: center; justify-content: center;
  border-radius: 99cqw; background: var(--ib-btn-bg); color: var(--ib-btn-text);
  font-weight: 800; font-size: 1.9cqw; white-space: nowrap;
  box-shadow: 0 0 2.4cqw color-mix(in srgb, var(--ib-btn-bg) 55%, transparent);
  transition: transform .15s ease, filter .15s ease; }
.ib:hover .ib__btn { transform: translateY(-1px); filter: brightness(1.08); }
.ib:focus-visible { outline: 3px solid var(--ib-title); outline-offset: 3px; }

@container (max-width: 560px) {
  .ib { aspect-ratio: auto; min-height: 0; padding: 18px 18px 18px; border-radius: 14px; display: flex; flex-direction: column; gap: 10px; }
  .ib__logo, .ib__body, .ib__btn { position: static; }
  .ib__logo { font-size: 12px; } .ib__logo svg { width: 24px; height: 15px; }
  .ib__body { padding: 0; }
  .ib .ib__title { font-size: 22px; white-space: normal; }
  .ib .ib__sub { font-size: 14px; margin-top: 6px; }
  .ib__btn { align-self: flex-start; height: 40px; min-width: 0; padding: 0 22px; font-size: 15px; margin-top: 4px; }
  .ib__art { width: 55%; opacity: .55; }
}


.ib-embed{margin:1.2em 0;padding:0}
.ib-embed .ib-wrap{margin:0}
.redactor-in .ib-embed{cursor:pointer;position:relative}
.redactor-in .ib-embed:hover{outline:2px dashed #8b8fa8;outline-offset:3px}
.redactor-in .ib-embed *{pointer-events:none}
.ibanner-form .form-item{margin-bottom:10px}
.ibanner-form .ib-row{display:flex;gap:10px}
.ibanner-form .ib-row .form-item{flex:1}
.ibanner-form .ib-hint{font-size:12px;opacity:.65}
