/* Koncentracja — page-specific styles.
   Shared kit: assets/css/styles.css, section "Subpages".
   Everything here is scoped to this page's sections. */

/* 1. Dlaczego uwaga ucieka ------------------------------------------------ */

.konc-split {
  --gap: clamp(32px, 5vw, 72px);
  align-items: center;
}

.konc-figure {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius);
  background: var(--tint);
}
.konc-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 45%;
}

/* 2. ADHD i trudności z koncentracją -------------------------------------- */

.konc-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.konc-list li {
  position: relative;
  max-width: 46ch;
  padding-left: 22px;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.6;
}
.konc-list li::before {
  content: "";
  position: absolute;
  top: 0.72em;
  left: 0;
  width: 11px;
  height: 2px;
  background: var(--coral);
}
/* "What helps" uses a drawn check, not a second dash. */
.konc-list--help li::before {
  top: 0.5em;
  width: 6px;
  height: 11px;
  background: none;
  border-right: 2px solid var(--brand-strong);
  border-bottom: 2px solid var(--brand-strong);
  transform: rotate(45deg);
}

.konc-note {
  max-width: 78ch;
  margin-top: clamp(28px, 3.5vw, 44px);
  padding: 20px 26px;
  border-radius: 14px;
  background: #fff;
  color: var(--muted);
  font-size: 0.9375rem;
  line-height: 1.6;
}

/* 4. W skrócie (mint band) ------------------------------------------------ */

.konc-summary {
  --cols: minmax(0, 0.85fr) minmax(0, 1.15fr);
  --gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.konc-summary h2 {
  font-size: var(--h2);
  font-weight: 700;
}
.konc-summary__lead {
  max-width: 36ch;
  margin-top: 16px;
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.6;
}
#w-skrocie .facts > div {
  border-color: rgba(21, 26, 33, 0.18);
}
#w-skrocie .facts dd {
  color: #10423a;
}

@media (max-width: 760px) {
  .konc-note {
    padding: 18px 20px;
  }
}