/* Pewne BDO (decision #122, direction E): white background, deep teal #0F766E for headings, buttons, the
   highlighted "Pewne BDO" column and "tak" marks; #E11D48 only for problems (.problem in the "Czego pilnujemy"
   cards), never for buttons, decoration or "nie". Work Sans served from the app (OFL.txt next to the fonts).
   Colors come from Brand#theme as --color-* and --font-* (see BrandsHelper). */

@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/brands/pewnebdo/work-sans-latin-400-normal-2a5a306a.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/brands/pewnebdo/work-sans-latin-ext-400-normal-b6469104.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/brands/pewnebdo/work-sans-latin-600-normal-5047280a.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Work Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/brands/pewnebdo/work-sans-latin-ext-600-normal-43242ac6.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

*, *::before, *::after { box-sizing: border-box; }

body.pewnebdo {
  margin: 0;
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--color-text, #1f2937);
  background: var(--color-background, #ffffff);
}

.pewnebdo h1, .pewnebdo h2, .pewnebdo h3 { font-weight: 600; line-height: 1.2; color: var(--color-primary, #0f766e); }
.pewnebdo h2 { margin: 0 0 1rem; font-size: 1.75rem; }
.pewnebdo h3 { margin: 0 0 0.5rem; font-size: 1.15rem; }
/* Links in running text are a shade darker than the buttons, for contrast in small type. */
.pewnebdo a { color: var(--color-link, #115e59); }

.pewnebdo__header { border-bottom: 1px solid var(--color-muted, #e5e7eb); }
.pewnebdo__header-inner, .pewnebdo__main { max-width: 64rem; margin: 0 auto; padding: 0 1.25rem; }
.pewnebdo__header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 0.875rem; }
.pewnebdo .pewnebdo__logo { font-size: 1.25rem; font-weight: 600; color: var(--color-primary, #0f766e); text-decoration: none; }

.pewnebdo__header-cta, .hero__cta, .comparison__cta, .pricing__cta, .signup__submit {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  border: 0;
  border-radius: 0.5rem;
  font: inherit;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.pewnebdo .pewnebdo__header-cta, .pewnebdo .hero__cta, .pewnebdo .comparison__cta, .pewnebdo .pricing__cta, .pewnebdo .signup__submit {
  color: #ffffff;
  background: var(--color-primary, #0f766e);
}
.pewnebdo .pewnebdo__header-cta { padding: 0.5rem 1rem; }
.pewnebdo__header-cta:hover, .hero__cta:hover, .comparison__cta:hover, .pricing__cta:hover, .signup__submit:hover { filter: brightness(0.92); }
.pewnebdo a:focus-visible, .signup__submit:focus-visible, .signup__input:focus-visible, .faq__question:focus-visible {
  outline: 3px solid var(--color-primary, #0f766e);
  outline-offset: 2px;
}

.section { padding: 3.5rem 0; border-bottom: 1px solid var(--color-muted, #e5e7eb); }

.section--hero { padding-top: 4rem; }
.pewnebdo .hero__heading { max-width: 46rem; margin: 0 0 1.25rem; font-size: 2.5rem; }
.hero__subheading { max-width: 42rem; margin: 0 0 2rem; font-size: 1.2rem; }
.hero__note, .comparison__note, .signup__note, .pricing__note { font-size: 0.9rem; color: var(--color-quiet, #4b5563); }
.hero__note { margin: 0.75rem 0 0; }

/* Comparison: table on wide screens, one card per column (Pewne BDO first) on narrow ones. */
.comparison__table-wrapper { overflow-x: auto; }
.comparison__table { width: 100%; border-collapse: separate; border-spacing: 0; }
.comparison__table th, .comparison__table td { padding: 0.875rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--color-muted, #e5e7eb); }
.comparison__table thead th { font-size: 1.1rem; font-weight: 600; }
.comparison__row-label { width: 28%; font-weight: 600; }
.comparison__column--highlight, .comparison__cell--highlight {
  background: var(--color-highlight, #f0fdfa);
  border-inline: 2px solid var(--color-primary, #0f766e);
}
.comparison__column--highlight { color: #ffffff; background: var(--color-primary, #0f766e); border-radius: 0.5rem 0.5rem 0 0; }
.comparison__table tbody tr:last-child .comparison__cell--highlight { border-bottom: 2px solid var(--color-primary, #0f766e); border-radius: 0 0 0.5rem 0.5rem; }
.comparison__cell--highlight { font-weight: 600; }
.comparison__mark { display: inline-block; width: 1.25em; font-weight: 600; }
.comparison__mark--yes { color: var(--color-primary, #0f766e); }
.comparison__mark--no { color: var(--color-quiet, #6b7280); }
.comparison__cards { display: none; }
.comparison__note { margin: 1rem 0 1.5rem; }

.comparison__card { padding: 1.25rem; border: 1px solid var(--color-muted, #e5e7eb); border-radius: 0.75rem; background: var(--color-surface, #f8fafc); }
.comparison__card--highlight { border: 2px solid var(--color-primary, #0f766e); background: var(--color-highlight, #f0fdfa); }
.comparison__card-rows { margin: 0; }
.comparison__card-label { margin-top: 0.75rem; font-size: 0.9rem; color: var(--color-quiet, #4b5563); }
.comparison__card-value { margin: 0.125rem 0 0; }
.comparison__card--highlight .comparison__card-value { font-weight: 600; }

/* "Czego pilnujemy": three cards; only .problem gets the warning color. */
.cards__intro { max-width: 46rem; margin: 0 0 1.5rem; }
.cards__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin: 0; padding: 0; list-style: none; }
.cards__item { padding: 1.5rem; border: 1px solid var(--color-muted, #e5e7eb); border-radius: 0.75rem; background: var(--color-surface, #f8fafc); }
.cards__details { margin: 0; }
.cards__label { margin-top: 0.875rem; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-quiet, #4b5563); }
.cards__text { margin: 0.125rem 0 0; }
.cards__text .problem { font-weight: 600; color: #e11d48; }

.text__list, .steps__list { margin: 0; padding-left: 1.25rem; }
.text__item, .steps__item { margin: 0.5rem 0; }
.text__paragraph { max-width: 46rem; }
.steps__item-text { margin: 0; }
.steps__note { margin: 1.25rem 0 0; }

.section--pricing { border-bottom: 0; padding-bottom: 1rem; }
.pricing__card { max-width: 32rem; padding: 1.5rem; border: 2px solid var(--color-primary, #0f766e); border-radius: 0.75rem; background: var(--color-highlight, #f0fdfa); }
.pricing__price { margin: 0 0 0.75rem; }
.pricing__amount { font-size: 2.25rem; font-weight: 600; color: var(--color-primary, #0f766e); }
.pricing__period { font-size: 1.1rem; font-weight: 600; }
.pricing__features { margin: 0 0 1.25rem; padding-left: 1.25rem; }

.signup__form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; max-width: 32rem; padding: 1.5rem; border: 1px solid var(--color-muted, #e5e7eb); border-radius: 0.75rem; }
.signup__field { display: grid; gap: 0.25rem; }
.signup__field--terms { grid-template-columns: auto 1fr; align-items: start; gap: 0.5rem; }
.signup__label { font-weight: 600; }
.signup__field--terms .signup__label { font-weight: 400; }
.signup__checkbox { width: 1.125rem; height: 1.125rem; margin-top: 0.3rem; accent-color: var(--color-primary, #0f766e); }
.signup__input { width: 100%; min-width: 0; padding: 0.625rem 0.75rem; font: inherit; color: inherit; background: #ffffff; border: 1px solid #9ca3af; border-radius: 0.5rem; }
.signup__submit { justify-self: start; }
.signup__note { margin: 0; }
.signup__errors { margin: 0; padding: 0.75rem 1rem 0.75rem 2rem; color: #1f2937; background: #f3f4f6; border-left: 4px solid #6b7280; border-radius: 0.375rem; }

.faq__item { padding: 0.875rem 0; border-top: 1px solid var(--color-muted, #e5e7eb); }
.faq__question { font-weight: 600; cursor: pointer; }
.faq__answer p { margin: 0.5rem 0 0; }

.section--footer { border-bottom: 0; font-size: 0.9rem; color: var(--color-quiet, #4b5563); }
.footer__links { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; align-items: baseline; }
.consent-settings { padding: 0; border: 0; font: inherit; color: var(--color-link, #115e59); background: none; text-decoration: underline; cursor: pointer; }

.section--thanks, .section--legal { max-width: 46rem; }
.legal__body h2, .legal__heading { margin: 2rem 0 0.75rem; font-size: 1.3rem; }
.legal__table-wrapper { overflow-x: auto; }
.legal__table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.legal__table th, .legal__table td { padding: 0.5rem; text-align: left; vertical-align: top; border: 1px solid var(--color-muted, #e5e7eb); }
.legal__missing { padding: 0 0.25rem; color: #7a2e0e; background: #fef0c7; }

/* Consent banner: a panel at the bottom that never covers the whole page. Every button on a layer looks
   the same (size, color, weight) - none may stand out. */
.consent-banner {
  position: fixed;
  inset: auto 1rem 1rem;
  z-index: 10;
  max-width: 56rem;
  max-height: calc(100vh - 2rem);
  margin: 0 auto;
  overflow-y: auto;
  padding: 1.25rem 1.5rem;
  color: var(--color-text, #1f2937);
  background: var(--color-background, #ffffff);
  border: 1px solid var(--color-muted, #e5e7eb);
  border-radius: 0.75rem;
  box-shadow: 0 0.5rem 1.5rem rgb(0 0 0 / 15%);
}
.consent-banner[hidden], .consent-banner__layer[hidden] { display: none; }
.pewnebdo .consent-banner__title { margin: 0 0 0.5rem; font-size: 1.15rem; }
.consent-banner__text { margin: 0 0 1rem; }
.consent-banner__actions { display: flex; gap: 0.5rem; }
.consent-banner__button {
  flex: 1 1 0;
  min-width: 0;
  padding: 0.625rem 1rem;
  font: inherit;
  font-weight: 600;
  color: var(--color-primary, #0f766e);
  background: var(--color-background, #ffffff);
  border: 2px solid var(--color-primary, #0f766e);
  border-radius: 0.5rem;
  cursor: pointer;
}
.consent-banner__button:focus-visible, .consent-category__switch:focus-visible, .consent-settings:focus-visible {
  outline: 3px solid var(--color-primary, #0f766e);
  outline-offset: 2px;
}
.consent-banner__categories { margin: 0 0 1rem; padding: 0; list-style: none; }
.consent-category { padding: 0.5rem 0; border-top: 1px solid var(--color-muted, #e5e7eb); }
.consent-category__name { display: flex; gap: 0.5rem; align-items: center; margin: 0; font-weight: 600; }
.consent-category__state { font-weight: 400; }
.consent-category__text { margin: 0.25rem 0 0; font-size: 0.9rem; }
.consent-category__switch { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--color-primary, #0f766e); }

@media (max-width: 48rem) {
  .pewnebdo .hero__heading { font-size: 1.9rem; }
  .pewnebdo h2 { font-size: 1.45rem; }
  .section { padding: 2.5rem 0; }
  .comparison__table-wrapper { display: none; }
  .comparison__cards { display: grid; gap: 1rem; }
  .cards__list { grid-template-columns: 1fr; }
}

@media (max-width: 40rem) {
  .consent-banner { inset: auto 0.5rem 0.5rem; padding: 0.75rem; font-size: 0.875rem; line-height: 1.45; }
  .consent-banner__button { padding: 0.5rem 0.25rem; }
}