html {
  font-family: Tahoma, "Segoe UI", Arial, sans-serif;
}

html,
body {
  margin: 0;
  background: var(--bg, #f4f6f8);
  direction: rtl;
}

html.dark,
html.dark body {
  background: #121212;
}

#static-lcp-hero {
  position: absolute;
  z-index: 1;
  top: 5.5rem;
  right: 2rem;
  left: 2rem;
  min-height: 17.5rem;
  overflow: hidden;
  border-radius: 1.5rem;
  background: #134e4a;
  box-shadow: 0 10px 15px -3px rgb(15 23 42 / 0.12);
  pointer-events: none;
}

#static-lcp-hero[hidden],
html[data-not-home] #static-lcp-hero,
body:has(#root *) #static-lcp-hero {
  display: none;
}

#static-lcp-hero picture,
#static-lcp-hero img {
  display: block;
  width: 100%;
  height: 17.5rem;
  object-fit: cover;
}

#static-lcp-hero .static-lcp-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to left,
    rgb(15 23 42 / 0.9),
    rgb(19 78 74 / 0.75),
    rgb(17 94 89 / 0.55)
  );
  pointer-events: none;
}