/* components__HomeHero */
.hh:not(.mc-s) {
    padding-block: clamp(2.5rem, 5vw, 4.5rem) var(--space-l);
  }

  .hh-grid:not(.mc-s) {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.15fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: center;
  }

  /* „Cześć / Hello" jako jeden ciąg, nie przełącznik: jedna linijka mówiąca
     „tu można mówić po swojemu". Ukraiński dojdzie po potwierdzeniu obsługi
     na miejscu, a nie wcześniej: powitanie w języku bez pokrycia to obietnica. */
  .hh-greeting:not(.mc-s) {
    display: flex;
    gap: 0.5rem;
    margin: 0 0 var(--space-m);
    color: var(--brick-dark);
    font-size: var(--type-lead);
    font-weight: 800;
  }

  .hh-copy:not(.mc-s) h1:not(.mc-s) {
    font-size: clamp(2.25rem, 3.7vw, 3.5rem);
    margin-bottom: var(--space-m);
    max-width: 16ch;
  }

  .hh-copy:not(.mc-s) .lead:not(.mc-s) {
    max-width: 34rem;
    margin-bottom: var(--space-l);
  }

  .hero-actions:not(.mc-s) {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
  }

  /* ---------- Fakty ---------- */

  .hh-facts:not(.mc-s) {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2xs) var(--space-l);
    margin: var(--space-l) 0 0;
    padding-top: var(--space-m);
    border-top: 1px solid var(--line);
  }

  .hh-facts:not(.mc-s) > div:not(.mc-s) {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
  }

  .hh-facts:not(.mc-s) dt:not(.mc-s) {
    color: var(--muted);
    font-size: var(--type-micro);
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  .hh-facts:not(.mc-s) dd:not(.mc-s) {
    margin: 0;
    font-size: var(--type-meta);
    font-weight: 600;
  }

  @media (max-width: 900px) {
    .hh-grid:not(.mc-s) {
      grid-template-columns: minmax(0, 1fr);
      gap: var(--space-l);
    }
  }

  @media (max-width: 560px) {
    .hero-actions:not(.mc-s) .button:not(.mc-s) {
      width: 100%;
    }

    /* Adres, godziny i języki schodzą do wierszy zamiast kolumn. Wprowadzenie
       ma zmieścić się w jednym ekranie, żeby najbliższy termin wypadł w drugim. */
    .hh-facts:not(.mc-s) > div:not(.mc-s) {
      flex-direction: row;
      flex-wrap: wrap;
      min-width: 0;
      max-width: 100%;
      align-items: baseline;
      gap: 0.5rem;
    }

    .hh-facts:not(.mc-s) dt:not(.mc-s) {
      flex: 0 1 4.5rem;
    }
    .hh-facts:not(.mc-s) dd:not(.mc-s) { min-width: 0; flex: 1 1 8rem; }
  }