/* P0 release overrides for generated static pages. */

/* Cyan accent on the cyan knowledge-hub section looked like a rendering bug. */
.hub-library .hub-card--2 {
  --accent: var(--pink);
}

/* Keep the active dishwasher route visually obvious in generated navigation. */
.article-nav a[href="/kalkulator-doboru-zmywarki/"],
.global-nav a[href="/kalkulator-doboru-zmywarki/"] {
  text-decoration-thickness: 3px;
  text-underline-offset: 5px;
}

/* Technical disclosures must never stretch wider than the reading column. */
.article-disclosure,
.article-technical-meta,
.article-table-wrap {
  max-width: 100%;
}

@media (max-width: 720px) {
  .hub-card.hub-library-card {
    border-top-width: 8px;
  }
}

@media (max-width: 720px) {
  h1,
  .article-hero h1,
  .hub-hero-v2 h1 {
    max-width: 100% !important;
    font-size: clamp(38px, 11.5vw, 54px) !important;
    line-height: 0.96 !important;
    overflow-wrap: break-word;
  }

  .header-inner {
    width: min(100% - 22px, 1180px);
  }

  .content-primary-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    overflow: visible;
    padding-inline: 0;
  }

  .content-primary-nav a {
    min-width: 0;
    width: 100%;
    padding-inline: 6px;
    font-size: 9px;
    white-space: normal;
    text-align: center;
  }
}

/* Navigation must never create horizontal page overflow. */
.header-inner {
  flex-wrap: wrap;
  gap: 8px 16px;
}

.content-primary-nav {
  flex: 1 1 620px;
  max-width: 100%;
  flex-wrap: wrap;
  overflow: visible;
}

.content-primary-nav a {
  flex: 0 1 auto;
  min-width: 0;
  white-space: normal;
  text-align: center;
}

/* Mobile recovery overrides. */
@media (max-width: 720px) {
  .content-header {
    position: static;
  }

  .header-inner {
    gap: 6px !important;
    padding-block: 8px !important;
  }

  .content-brand {
    font-size: 20px !important;
  }

  .content-primary-nav {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
  }

  .article-hero,
  .hub-hero-v2 {
    padding-top: 34px !important;
  }

  .breadcrumbs {
    font-size: 10px;
    gap: 5px;
  }
}