.metalang-banner { --metalang-ink: #21231f; --metalang-accent: #9d291b; position: relative; width: min(1360px, calc(100% - 30px)); margin: 16px auto; color: var(--metalang-ink); background: #f5f3ed; border: 1px solid #d9d6cc; border-radius: 8px; overflow: hidden; font-family: "Avenir Next", "Segoe UI", sans-serif; }
.metalang-banner__disclosure { padding: 9px 24px 0; font-size: 10px; line-height: 1.5; color: #59594f; overflow-wrap: anywhere; }
.metalang-banner__link { display: grid; grid-template-columns: 180px minmax(0, 1fr) 190px; align-items: center; gap: 32px; padding: 18px 32px 22px; color: inherit; text-decoration: none; }
.metalang-banner__brand img { display: block; width: 180px; max-width: 100%; height: auto; mix-blend-mode: multiply; }
.metalang-banner__copy { min-width: 0; }
.metalang-banner__headline { display: block; color: var(--metalang-accent); font-size: clamp(32px, 4.2vw, 56px); line-height: 1.08; letter-spacing: -.035em; font-weight: 750; }
.metalang-banner__headline > span[aria-hidden] { color: var(--metalang-ink); }
.metalang-banner .metalang-banner__product { margin: 12px 0 10px; color: var(--metalang-ink); font-size: clamp(18px, 2vw, 25px); line-height: 1.3; font-weight: 600; }
.metalang-banner .metalang-banner__promise { margin: 0; color: #59594f; font-size: 14px; line-height: 1.5; }
.metalang-banner__cta { display: inline-flex; align-items: center; gap: 22px; margin-top: 17px; padding-bottom: 3px; border-bottom: 1px solid currentColor; color: var(--metalang-accent); font-size: 14px; line-height: 1.5; font-weight: 700; }
.metalang-banner__hf { display: grid; gap: 5px; align-content: center; align-self: stretch; padding-left: 28px; border-left: 1px solid #c8c4b8; }
.metalang-banner__hf strong { font-size: 92px; font-weight: 750; line-height: 1; letter-spacing: -.04em; }
.metalang-banner__hf > span { font-size: 12px; letter-spacing: .06em; }
.metalang-banner__hf b { margin-top: 6px; font-size: 18px; line-height: 1.3; }
.metalang-banner .metalang-banner__note { margin: 0; padding: 10px 24px; background: #eae7df; color: #53544a; font-size: 11px; line-height: 1.5; }
.metalang-banner__link:hover .metalang-banner__cta { color: #6f1c12; border-bottom-width: 2px; }
.metalang-banner__link:focus-visible { outline: 3px solid var(--metalang-accent); outline-offset: -5px; }
.metalang-banner ::selection { background: #9d291b; color: white; }
@media (max-width: 1000px) {
  .metalang-banner__link { grid-template-columns: minmax(0, 1fr) 150px; gap: 18px; padding: 18px 24px 22px; }
  .metalang-banner__brand { grid-column: 1 / -1; }
  .metalang-banner__brand img { width: 160px; }
  .metalang-banner__hf { padding-left: 22px; }
  .metalang-banner__hf strong { font-size: 76px; }
}
@media (max-width: 540px) {
  .metalang-banner__disclosure { padding-inline: 18px; }
  .metalang-banner__link { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 18px; }
  .metalang-banner__headline { font-size: clamp(28px, 8vw, 40px); }
  .metalang-banner__hf { grid-template-columns: auto minmax(0, 1fr); gap: 2px 16px; border-left: 0; border-top: 1px solid #c8c4b8; padding: 15px 0 0; }
  .metalang-banner__hf strong { grid-row: 1 / 3; font-size: 56px; }
  .metalang-banner__hf > span { align-self: end; }
  .metalang-banner__hf b { margin-top: 0; }
  .metalang-banner .metalang-banner__note { padding: 10px 18px; }
}