/* ===================== Design tokeny + globální základ =====================
   Názvy tokenů kopírují proměnné z Figmy (BG/*, FG/*, Accent/*). */
:root {
  /* Pozadí */
  --bg-canvas: #ffffff;
  --bg-subtle: #f5f5f5;
  --bg-contrast: #0a2c22;

  /* Text */
  --fg-base: #0a2c22;
  --fg-contrast: #ffffff;

  /* Akcenty */
  --lime: #c5ff1d;           /* Accent/lime-default */
  --green-muted: #baded4;
  --blue-muted: #d9eaee;
  --purple-muted: #c4c6ec;
  --lime-subtle: #e9ece3;
  --green-subtle: #e3ece9;
  --blue-subtle: #e3eaec;
  --purple-subtle: #e3e3ec;

  --nav-h: 72px;

  /* Boční odsazení sekcí: 32px, od šířky okna 1920px roste tak, aby se
     obsah (max 1856px + okraje) centroval. Pozadí sekcí zůstává full-bleed. */
  --gutter: max(32px, calc(50vw - 928px));
}

/* ===================== Fonty =====================
   Founders Grotesk + Inter Display lokálně (licencované). */
@font-face {
  font-family: "Founders Grotesk";
  src: url("../assets/fonts/FoundersGrotesk-Light.woff2") format("woff2"),
       url("../assets/fonts/FoundersGrotesk-Light.woff") format("woff");
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("../assets/fonts/FoundersGrotesk-Regular.woff2") format("woff2"),
       url("../assets/fonts/FoundersGrotesk-Regular.woff") format("woff");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("../assets/fonts/FoundersGrotesk-Medium.woff2") format("woff2"),
       url("../assets/fonts/FoundersGrotesk-Medium.woff") format("woff");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("../assets/fonts/FoundersGrotesk-Bold.woff2") format("woff2"),
       url("../assets/fonts/FoundersGrotesk-Bold.woff") format("woff");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../assets/fonts/InterDisplay-Light.woff2") format("woff2");
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../assets/fonts/InterDisplay-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../assets/fonts/InterDisplay-Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../assets/fonts/InterDisplay-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Inter Display";
  src: url("../assets/fonts/InterDisplay-Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

* { box-sizing: border-box; }

/* tmavá na html = overscroll nad herem; bílá na body = mezery mezi
   sekcemi (sekce s vlastním pozadím si ho nesou samy, mezery dělá
   margin-bottom předchozí sekce) */
/* overflow-x na html drží mobilní layout viewport na šířce zařízení —
   bez něj si prohlížeč při přetečení obsah oddálí a rozbije vh jednotky */
html { scroll-behavior: auto; background: var(--bg-contrast); overflow-x: hidden; }

body {
  margin: 0;
  background: var(--bg-canvas);
  color: var(--fg-contrast);
  font-family: "Inter Display", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; }

/* ===================== Reset seznamů (vkládání do WP) =====================
   Stránka se vkládá do WordPressu, jehož motiv dědí na <li> styly (tečka/
   bullet na pozadí, padding). Resetujeme JEN naše seznamy (class obsahuje
   „mm-web-"), ať nesáhneme na <li> motivu (menu, patička). */
ul[class*="mm-web-"],
ol[class*="mm-web-"] {
  /* jen tečky/bullet pryč — margin a padding si každý seznam řídí sám
     ve své komponentě (a třídou přebije obecná pravidla motivu) */
  list-style: none;
}
/* tečka/bullet i margin pryč u všech našich <li> — žádné je nepoužívá
   (newsletter karta má barvu přes background-color/::after, takže
   background-image: none jí neublíží) */
ul[class*="mm-web-"] > li,
ol[class*="mm-web-"] > li {
  margin: 0;
  background-image: none;
  list-style: none;
}
/* padding nulujeme jen u <li>, které si ho nedrží samy; karty s vlastním
   paddingem (.__card / .__cell) tu nepřebíjíme, ať o něj nepřijdou */
.mm-web-articles__list > li,
.mm-web-podcast__authors > li,
.mm-web-podcast__episodes > li,
.mm-web-speakers__track > li {
  padding: 0;
}

/* ---- Hover odkazů (vkládání do WP) ----
   Motiv barví a:hover na červenou (.no-touchevents body:not(.tailwind)
   a:hover { color:#d40b3e }). Pravidlo NENÍ !important → přebijeme ho.
   Naše odkazy drží na hover svou barvu: většina dědí (inherit), menu a
   tlačítka mají vlastní. :where() drží nízkou specificitu, aby konkrétní
   pravidla níže (menu/tlačítka) vyhrála. */
:where([class*="mm-web-"]) a:hover {
  color: inherit !important;
}
.mm-web-nav__link:hover,
.mm-web-nav__link--active,
.mm-web-btn:hover {
  color: var(--fg-base) !important;
}
.mm-web-nav--open .mm-web-nav__link:hover,
.mm-web-nav--open .mm-web-nav__link--active {
  color: var(--lime) !important;
}

/* ===================== Navigace ===================== */
.mm-web-nav {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--nav-h);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px max(24px, calc(50vw - 936px)); /* obsah nav max 1872px, centrovaný */
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  opacity: 0; /* nájezd při loadu */
}
.mm-web-nav__logo img { height: 18px; width: auto; }
.mm-web-nav__logo-dark { display: none; }
.mm-web-nav__toggle {
  display: none; /* jen mobil */
  padding: 0;
  border: 0;
  background: none;
  color: var(--fg-contrast);
  cursor: pointer;
}
.mm-web-nav--inverse .mm-web-nav__toggle { color: var(--fg-base); }
.mm-web-nav__menu-title { display: none; } /* jen v mobilním menu */

/* zámek scrollu při otevřeném mobilním menu */
.mm-no-scroll { overflow: hidden; }

/* Inverzní stav nad světlými sekcemi (přepíná scrollspy v js/nav.js):
   poloprůhledné bílé pozadí s jemným blurem zvýrazní menu nad obsahem */
.mm-web-nav--inverse {
  border-bottom-color: rgba(10, 44, 34, 0.07);
  background: rgba(255, 255, 255, 0.7);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.mm-web-nav--inverse .mm-web-nav__link { color: var(--fg-base); }
.mm-web-nav--inverse .mm-web-nav__logo-light { display: none; }
.mm-web-nav--inverse .mm-web-nav__logo-dark { display: block; }
.mm-web-nav__menu { display: flex; align-items: center; }
.mm-web-nav__link {
  color: var(--fg-contrast);
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  padding: 12px 20px;
  border-radius: 100px;
  opacity: 0.92;
  transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}
/* aktivní/hover položka = lime pill s tmavým textem (dle Figmy);
   aktivní třídu řídí scrollspy v js/nav.js */
.mm-web-nav__link:hover,
.mm-web-nav__link--active {
  background: var(--lime);
  color: var(--fg-base);
  opacity: 1;
}

/* cíle kotev nesmí zajet pod fixní navigaci */
section[id] { scroll-margin-top: var(--nav-h); }

/* ===================== Mobil (≤900px) ===================== */
@media (max-width: 900px) {
  :root { --gutter: 16px; }

  .mm-web-nav { padding: 16px; }
  .mm-web-nav__toggle { display: block; }

  /* Menu = fullscreen tmavý overlay pod lištou (z-index -1 v kontextu nav) */
  .mm-web-nav__menu {
    position: fixed;
    inset: 0;
    z-index: -1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 104px 32px 16px;
    background: var(--bg-contrast);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }
  .mm-web-nav--open .mm-web-nav__menu {
    opacity: 1;
    visibility: visible;
  }

  /* Položky: Founders 28px, bez pill stylu; aktivní/hover jen lime text */
  .mm-web-nav__link {
    padding: 0;
    border-radius: 0;
    font-family: "Founders Grotesk", system-ui, sans-serif;
    font-size: 28px;
    font-weight: 400;
    color: var(--fg-contrast);
    opacity: 1;
  }
  .mm-web-nav__link:hover,
  .mm-web-nav__link--active {
    background: none;
    color: var(--lime);
  }

  /* Otevřené menu: lišta vždy ve světlé variantě (overlay je tmavý) */
  .mm-web-nav--open {
    background: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom-color: rgba(255, 255, 255, 0.07);
  }
  .mm-web-nav--open .mm-web-nav__logo-light { display: block; }
  .mm-web-nav--open .mm-web-nav__logo-dark { display: none; }
  .mm-web-nav--open .mm-web-nav__link { color: var(--fg-contrast); }
  .mm-web-nav--open .mm-web-nav__link:hover,
  .mm-web-nav--open .mm-web-nav__link--active { color: var(--lime); }
  .mm-web-nav--open .mm-web-nav__toggle { color: var(--fg-contrast); }

  /* Dekorativní MONEY MAKER u spodního okraje menu */
  .mm-web-nav__menu-title {
    display: block;
    width: 345px;
    max-width: 100%;
    margin: auto auto 0;
  }
  .mm-web-nav__menu-title img { display: block; width: 100%; height: auto; }
  .mm-web-nav__menu-title img:last-child { width: 96.98%; margin: 3.48% auto 0; }
}

/* ===================== Footer ===================== */
.footer__copy {
	background: #142B23;
}