/* CraftWeb overrides for Azurio main.css */

/* Menu hamburger should match the page theme, not invert it.
   Remap "opposite" tokens to base inside the menu scope so all the
   built-in mxd-menu rules (background, text, dividers, shadows) follow
   the active color-scheme instead of fighting it. */
.mxd-menu {
  --base-opp: var(--base);
  --base-opp-rgb: var(--base-rgb);
  --t-opp-bright: var(--t-bright);
  --t-opp-medium: var(--t-medium);
  --t-opp-muted: var(--t-muted);
  --t-opp-muted-extra: var(--t-muted-extra);
}

/* Hero-04 media (GrowGPT/Snapfeed slides): cover nad img */
.mxd-hero-04__media { position: relative; }
.mxd-hero-04__media .mxd-hero-04__cover { z-index: 2; }

/* SEO: visually hidden text (e.g. home h1) */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* === Hero slide 1: content left (title->lead->tags->contact), New Case bottom-right === */
.mxd-hero-04__slide .mxd-hero-01 {
  height: 100%;
  justify-content: flex-start;
  padding-top: 0;
}
.mxd-hero-04__slide .mxd-hero-01__wrap {
  position: relative;
  flex: 1 1 auto;
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 8rem;
  padding-bottom: 8rem;
}
.cw-hero__content {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3rem;
  max-width: 70%;
  mix-blend-mode: difference;
}
/* Title -- ten sam krój/rozmiar co tytuly slajdow (.mxd-hero-04__name p), 2 linie */
.cw-hero__title {
  margin: 0;
  font: normal 600 6rem/0.98 var(--_font-default);
  letter-spacing: -0.24rem;
  color: #fff;
}
.cw-hero__title span { display: block; }
@media only screen and (min-width: 768px) {
  .cw-hero__title { font-size: 9rem; line-height: 0.98; }
}
@media only screen and (min-width: 1400px) {
  .cw-hero__title { font-size: 11rem; }
}
.cw-hero__lead {
  margin: 0;
  max-width: 26ch;
  font-size: clamp(1.5rem, 2.4vw, 2.4rem);
  line-height: 1.25;
  color: #fff;
}
.cw-hero__lead span {
  display: block;
  margin-top: 0.7rem;
  font-size: 0.6em;
  opacity: 0.7;
}
.cw-hero__tags {
  display: flex;
  gap: 3rem;
}
.cw-hero__tags .tags-column ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cw-hero__contact {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
/* New Case box -- prawy DOLNY rog */
.cw-hero__case {
  position: absolute;
  right: 3rem;
  bottom: 3rem;
  z-index: 3;
  width: 30rem;
  max-width: 30vw;
  overflow: hidden;
}
.cw-hero__case-video {
  display: block;
  width: 100%;
  height: auto;
}
.cw-hero__case-btn {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
}
@media only screen and (max-width: 991px) {
  .mxd-hero-04__slide .mxd-hero-01__wrap { flex-direction: column; align-items: flex-start; justify-content: flex-start; padding-top: 8rem; padding-bottom: 3rem; }
  .cw-hero__content { max-width: 100%; gap: 2.2rem; }
  .cw-hero__title { font-size: 4.5rem; }
  .cw-hero__case { position: relative; right: auto; bottom: auto; width: 100%; max-width: 30rem; margin-top: 2.5rem; }
}