.fkw-guide {
  --fkw-text: #141417;
  --fkw-muted: #55575c;
  --fkw-accent: #14aba3;
  --fkw-link: #007a73;
  --fkw-soft: #eef6f5;
  --fkw-border: #007a73;
  --fkw-gridline: #d8e2e1;
  --fkw-focus: #005fcc;
  --fkw-max: 1040px;

  color: var(--fkw-text);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-size: 18px;
  line-height: 1.52;
}
.fkw-guide, .fkw-guide * { box-sizing: border-box; }
body.fkw-page { margin: 0; background: #fff; }
.fkw-skip-link {
  position: fixed; left: 16px; top: -100px; z-index: 999;
  background: #fff; color: #000;
  border: 3px solid var(--fkw-focus);
  border-radius: 6px; padding: 10px 14px;
}
.fkw-skip-link:focus { top: 16px; }

.fkw-guide {
  width: min(calc(100% - 40px), var(--fkw-max));
  margin: 0 auto;
  padding: 56px 0 80px;
}
.fkw-section-mark { width: 64px; height: 8px; background: var(--fkw-accent); margin: 0 0 22px; }
.fkw-hero { padding: 16px 0 48px; border-bottom: 1px solid #e4e4e4; }
.fkw-eyebrow { margin: 0 0 10px; font-weight: 700; color: var(--fkw-link); }
.fkw-hero h1 { margin: 0; font-size: clamp(42px, 7vw, 76px); line-height: 1; letter-spacing: -0.035em; }

.fkw-toc {
  margin: 48px 0 72px;
  padding: 34px 30px;
  background: #eef6f5;
  border: 1.5px solid #a7d8d4;
  border-radius: 14px;
}
.fkw-toc h2 { margin-top: 0; }
.fkw-toc p { margin-bottom: 16px; }
.fkw-toc ol { margin: 0; padding-left: 1.45em; display: grid; gap: 9px; }
.fkw-toc a { font-weight: 700; text-decoration-thickness: 1.5px; }

.fkw-source-block { max-width: 920px; margin: 0 auto; padding: 0 0 68px; }
.fkw-article h2 { margin: 0 0 34px; font-size: clamp(28px, 4vw, 36px); line-height: 1.15; letter-spacing: -0.015em; }
.fkw-article h3 { margin: 32px 0 14px; font-size: clamp(21px, 2.4vw, 26px); line-height: 1.25; }
.fkw-intro-heading { margin: 0 0 20px; font-size: clamp(28px, 4vw, 36px); line-height: 1.15; }
.fkw-subhead-small { font-size: 1.1rem; margin-top: 24px; }
.fkw-time-title { font-size: clamp(24px, 3vw, 30px); margin-top: 28px; margin-bottom: 10px; }
.fkw-article p { margin: 0 0 18px; max-width: 860px; }
.fkw-article ul { margin: 8px 0 26px; padding-left: 1.4em; max-width: 860px; }
.fkw-article li + li { margin-top: 5px; }

.fkw-guide a {
  color: var(--fkw-link);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 2px;
}
.fkw-guide a:focus-visible {
  outline: 3px solid var(--fkw-focus);
  outline-offset: 4px;
  border-radius: 2px;
}

.fkw-facts { margin: 0 0 28px; }
.fkw-facts div { margin-bottom: 18px; }
.fkw-facts dt { font-weight: 700; }
.fkw-facts dd { margin: 2px 0 0; }
.fkw-address {
  display: inline-block; margin-top: 6px; font-weight: 700; line-height: 1.55;
}

.fkw-contact-card {
  margin-top: 34px;
  padding: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: 32px;
  align-items: start;
  background: var(--fkw-soft);
  border: 1.5px solid var(--fkw-border);
  border-radius: 14px;
}
.fkw-contact-card h3 { margin-top: 0; }
.fkw-contact-card__photo { margin-top: 0; }
.fkw-contact-card__photo img { aspect-ratio: 1 / 1; object-fit: cover; }
.fkw-contact-card__photo figcaption { max-width: 220px; }

.fkw-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 36%);
  gap: 44px;
  align-items: start;
}
.fkw-two-col--portrait .fkw-figure { margin-top: 0; }
.fkw-two-col--portrait .fkw-figure img { aspect-ratio: 2 / 3; object-fit: cover; }

.fkw-figure { margin: 26px 0 10px; }
.fkw-figure img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 760px;
  object-fit: cover;
  background: #fff;
  border-radius: 12px;
}
.fkw-figure figcaption, .fkw-caption {
  margin: 10px 0 24px;
  color: var(--fkw-muted);
  font-size: 0.94rem;
  font-style: italic;
}
.fkw-media-grid {
  margin: 24px 0 6px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}
.fkw-media-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.fkw-callout {
  margin: 28px 0 38px;
  padding: 24px 28px;
  background: var(--fkw-soft);
  border: 2px solid var(--fkw-border);
  border-radius: 18px;
}
.fkw-callout__label {
  margin: 0 0 10px !important;
  color: var(--fkw-link);
  font-weight: 800;
  text-transform: uppercase;
}

.fkw-table-wrap {
  margin: 26px 0 38px;
  overflow-x: auto;
  border: 1px solid #b9c9c8;
  border-radius: 10px;
}
.fkw-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  background: #fff;
}
.fkw-table caption { padding: 16px 18px; text-align: left; font-weight: 700; }
.fkw-table th, .fkw-table td {
  padding: 13px 16px;
  border-top: 1px solid var(--fkw-gridline);
  border-right: 1px solid var(--fkw-gridline);
  text-align: left;
  vertical-align: top;
}
.fkw-table th:last-child, .fkw-table td:last-child { border-right: 0; }
.fkw-table thead th { background: var(--fkw-soft); font-weight: 700; }

.fkw-legend {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: grid;
  gap: 12px;
}
.fkw-legend li {
  display: flex;
  align-items: center;
  gap: 14px;
}
.fkw-legend__icon { display: inline-block; flex: 0 0 auto; }
.fkw-legend__icon--circle { width: 22px; height: 22px; border-radius: 50%; background: #1580f0; }
.fkw-legend__icon--square { width: 22px; height: 22px; background: #1580f0; }
.fkw-legend__icon--diamond {
  width: 22px; height: 22px; background: #1580f0; transform: rotate(45deg);
}
.fkw-legend__icon--route {
  width: 36px; height: 0; border-top: 4px dashed #f2312c;
}

.fkw-logo {
  display: block;
  width: min(320px, 72%);
  height: auto;
  margin: 42px 0 0;
  background: #fff;
  object-fit: contain;
}

.fkw-credits {
  margin-top: 44px;
  padding-top: 24px;
  border-top: 1px solid #ddd;
  color: var(--fkw-muted);
  font-size: 0.94rem;
}
.fkw-back-top { margin: 28px 0 0; padding-top: 28px; border-top: 1px solid #ddd; font-weight: 700; }

@media (max-width: 760px) {
  .fkw-guide { width: min(calc(100% - 24px), var(--fkw-max)); padding-top: 28px; font-size: 17px; }
  .fkw-toc { padding: 24px 20px; margin-bottom: 52px; }
  .fkw-source-block { padding-bottom: 52px; }
  .fkw-media-grid, .fkw-media-grid--three, .fkw-two-col, .fkw-contact-card { grid-template-columns: 1fr; }
  .fkw-contact-card { padding: 20px; gap: 18px; }
  .fkw-contact-card__photo { max-width: 320px; }
}
@media (forced-colors: active) {
  .fkw-section-mark { background: CanvasText; }
  .fkw-toc, .fkw-callout, .fkw-contact-card { border: 2px solid CanvasText; }
}


/* ===== v5 — Figma fidelity / rhythm fixes ===== */
.fkw-guide {
  line-height: 1.5;
}

.fkw-source-block {
  padding-bottom: 46px;
}

.fkw-article p {
  margin: 0;
}

.fkw-article p + p {
  margin-top: 10px;
}

.fkw-article h2 {
  margin-bottom: 26px;
}

.fkw-article h3 {
  margin: 24px 0 10px;
}

.fkw-time-title {
  margin: 24px 0 8px;
}

.fkw-list-intro {
  margin-top: 18px !important;
  margin-bottom: 4px !important;
}

.fkw-article ul {
  margin: 4px 0 18px;
  padding-left: 1.35em;
}

.fkw-article ul li {
  padding-left: .08em;
  line-height: 1.5;
}

.fkw-article li + li {
  margin-top: 1px;
}

.fkw-activity-list {
  margin-top: 5px !important;
}

.fkw-activity-list > li + li {
  margin-top: 18px;
}

.fkw-activity-list > li > div {
  margin-top: 1px;
}

.fkw-callout {
  margin: 20px 0 28px;
  padding: 20px 18px;
}

.fkw-callout p + p {
  margin-top: 6px;
}

.fkw-day-plan {
  margin-top: 0;
}

.fkw-panel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 39.5%);
  gap: 48px;
  align-items: start;
}

.fkw-panel-photo {
  margin-top: 0;
}

.fkw-panel-photo img {
  aspect-ratio: 197 / 295;
  object-fit: cover;
}

.fkw-photo-stack > .fkw-figure,
.fkw-figure--figma-wide {
  width: min(100%, 720px);
}

.fkw-photo-stack .fkw-figure + .fkw-figure {
  margin-top: 26px;
}

.fkw-media-grid--equal {
  grid-template-columns: 1fr 1fr;
}

.fkw-media-grid--emotion {
  grid-template-columns: minmax(0, 2.06fr) minmax(0, 1fr);
  align-items: stretch;
}

.fkw-media-grid--emotion .fkw-figure {
  margin: 0;
  height: 100%;
}

.fkw-media-grid--emotion img {
  height: 100%;
  min-height: 280px;
  object-fit: cover;
}

.fkw-media-grid--idea-logika {
  grid-template-columns: 1.19fr 1fr;
}

.fkw-media-grid--comfort {
  grid-template-columns: 164fr 326fr;
}

.fkw-media-grid--support {
  grid-template-columns: 207fr 271fr;
}

.fkw-toilets-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 118px 132px;
  gap: 12px;
  align-items: start;
}

.fkw-toilets-grid .fkw-figure {
  margin: 0;
}

.fkw-toilets-grid img {
  height: 220px;
  object-fit: cover;
}

.fkw-caption,
.fkw-figure figcaption {
  margin-top: 8px;
  margin-bottom: 18px;
  line-height: 1.45;
}

.fkw-table-wrap {
  margin: 20px 0 30px;
  border: 0;
  border-radius: 0;
}

.fkw-table--program {
  min-width: 0;
  border-collapse: collapse;
  table-layout: fixed;
  border: 1px solid #737a7d;
}

.fkw-table--program th,
.fkw-table--program td {
  border: 1px solid #737a7d;
  padding: 10px 12px;
  line-height: 1.4;
}

.fkw-table--program thead th {
  background: #e5f5f5;
}

.fkw-table--program tbody th {
  font-weight: 700;
  white-space: nowrap;
  width: auto;
}

.fkw-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (max-width: 760px) {
  .fkw-source-block {
    padding-bottom: 38px;
  }

  .fkw-panel-grid,
  .fkw-media-grid--emotion,
  .fkw-media-grid--idea-logika,
  .fkw-media-grid--comfort,
  .fkw-media-grid--support,
  .fkw-toilets-grid {
    grid-template-columns: 1fr;
  }

  .fkw-panel-photo {
    max-width: 300px;
  }

  .fkw-toilets-grid img,
  .fkw-media-grid--emotion img {
    height: auto;
    min-height: 0;
  }

  .fkw-table-wrap {
    overflow-x: auto;
  }

  .fkw-table--program {
    min-width: 720px;
  }
}


/* ===== v6 — targeted corrections only ===== */

/* Single A4 photos in Figma are ~420 / 499 of the content width. */
.fkw-figure--a4-media {
  width: 84.2%;
  max-width: 100%;
}

.fkw-figure--a4-media img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Preserve the deliberate paired layouts already implemented. */
.fkw-talk-list {
  margin-top: 18px !important;
}

.fkw-talk-list > li + li {
  margin-top: 28px;
}

.fkw-talk-list > li > div {
  margin-left: 0;
}

/* Figma puts the ending heading after the concert photo with a clear but not excessive gap. */
.fkw-time-title--after-media {
  margin-top: 30px !important;
}

/* Page 22 and 23 are one continuous content group. */
.fkw-source-block--tight-next {
  padding-bottom: 14px !important;
}

.fkw-source-block--continuation {
  padding-top: 0 !important;
}

/* Accessibility/support transition: two different spacing needs, adjusted locally only. */
.fkw-source-block--support-start .fkw-subsection-gap {
  margin-top: 30px;
}

.fkw-source-block--support-start .fkw-section-mark--section9 {
  margin-top: 40px;
  margin-bottom: 22px;
}

@media (max-width: 760px) {
  .fkw-figure--a4-media {
    width: 100%;
  }

  .fkw-talk-list > li + li {
    margin-top: 22px;
  }
}


/* ===== v8 — final polish ===== */
.fkw-guide {
  --fkw-gap-xs: 6px;
  --fkw-gap-sm: 10px;
  --fkw-gap-md: 16px;
  --fkw-gap-lg: 24px;
  --fkw-gap-xl: 32px;
  --fkw-gap-2xl: 40px;
}

/* Consistent vertical rhythm across the guide */
.fkw-source-block {
  padding-bottom: 40px;
}
.fkw-article p {
  margin-bottom: 0;
}
.fkw-article p + p {
  margin-top: var(--fkw-gap-sm);
}
.fkw-article h2 {
  margin-bottom: var(--fkw-gap-lg);
}
.fkw-article h3 {
  margin-top: var(--fkw-gap-xl);
  margin-bottom: var(--fkw-gap-sm);
}
.fkw-article h2 + p,
.fkw-article h3 + p,
.fkw-article h3 + ul,
.fkw-article p + ul {
  margin-top: 0;
}
.fkw-article ul {
  margin-top: var(--fkw-gap-sm);
  margin-bottom: var(--fkw-gap-lg);
}
.fkw-article li + li {
  margin-top: 3px;
}
.fkw-callout {
  margin-top: var(--fkw-gap-lg);
  margin-bottom: var(--fkw-gap-lg);
}
.fkw-figure {
  margin-top: var(--fkw-gap-lg);
  margin-bottom: var(--fkw-gap-sm);
}
.fkw-figure figcaption,
.fkw-caption {
  margin-top: 8px;
  margin-bottom: var(--fkw-gap-lg);
}

/* Standalone A4 photos use one consistent width. */
.fkw-figure--a4-media {
  width: 84.2%;
  max-width: 100%;
  margin-left: 0;
  margin-right: auto;
}
.fkw-figure--a4-media img {
  width: 100%;
  height: auto;
}

/* Deliberate grid layouts remain unchanged. */
.fkw-media-grid .fkw-figure,
.fkw-panel-grid .fkw-figure,
.fkw-contact-card .fkw-figure,
.fkw-toilets-grid .fkw-figure {
  width: auto;
}

/* Compact transitions that looked too loose in v7. */
.fkw-panel-grid + .fkw-list-intro {
  margin-top: var(--fkw-gap-lg) !important;
}
.fkw-source-block--tight-next {
  padding-bottom: var(--fkw-gap-md) !important;
}
.fkw-source-block--continuation {
  padding-top: 0 !important;
}
.fkw-source-block--accessibility {
  padding-bottom: var(--fkw-gap-lg) !important;
}
.fkw-source-block--support-start {
  padding-top: 0 !important;
}
.fkw-source-block--support-start .fkw-subsection-gap {
  margin-top: var(--fkw-gap-lg);
}
.fkw-source-block--support-start .fkw-section-mark--section9 {
  margin-top: var(--fkw-gap-xl);
}
.fkw-activity-list > li + li,
.fkw-talk-list > li + li {
  margin-top: var(--fkw-gap-lg);
}

@media (max-width: 760px) {
  .fkw-source-block {
    padding-bottom: 34px;
  }
  .fkw-figure--a4-media {
    width: 100%;
  }
}


/* ===== v9 — final rhythm correction ===== */

/*
   The web version must not inherit artificial "page breaks" from the PDF/Figma
   pages. Spacing is now controlled by content relationships, not source-page
   boundaries.
*/
.fkw-article .fkw-source-block {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* A new real chapter gets breathing room; an arbitrary source page does not. */
.fkw-article .fkw-source-block > .fkw-section-mark {
  margin-top: 44px;
  margin-bottom: 18px;
}

.fkw-article .fkw-source-block:first-child > .fkw-section-mark {
  margin-top: 0;
}

/* One spacing scale for normal content. */
.fkw-article h2 {
  margin-top: 0 !important;
  margin-bottom: 22px !important;
}

.fkw-article h3 {
  margin-top: 26px !important;
  margin-bottom: 8px !important;
}

.fkw-article p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.fkw-article p + p {
  margin-top: 8px !important;
}

.fkw-article ul {
  margin-top: 8px !important;
  margin-bottom: 20px !important;
}

.fkw-article li + li {
  margin-top: 3px !important;
}

.fkw-article .fkw-callout {
  margin-top: 24px !important;
  margin-bottom: 26px !important;
}

.fkw-article .fkw-figure {
  margin-top: 22px !important;
  margin-bottom: 0 !important;
}

.fkw-article .fkw-figure figcaption,
.fkw-article .fkw-caption {
  margin-top: 7px !important;
  margin-bottom: 18px !important;
}

/* No extra gap created just because the next content came from a new PDF page. */
.fkw-article .fkw-source-block + .fkw-source-block > h3:first-child,
.fkw-article .fkw-source-block + .fkw-source-block > p:first-child,
.fkw-article .fkw-source-block + .fkw-source-block > ul:first-child,
.fkw-article .fkw-source-block + .fkw-source-block > figure:first-child {
  margin-top: 26px !important;
}

/* Match the single-photo width used by the parking images. */
.fkw-article .fkw-figure--standard-single {
  width: min(100%, 720px) !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

.fkw-article .fkw-figure--standard-single img {
  width: 100% !important;
  height: auto !important;
}

/* Intentional Figma grids remain exactly as grids. */
.fkw-article .fkw-media-grid .fkw-figure,
.fkw-article .fkw-panel-grid .fkw-figure,
.fkw-article .fkw-contact-card .fkw-figure,
.fkw-article .fkw-toilets-grid .fkw-figure {
  width: auto !important;
}

/* Specific transitions that previously looked accidental. */
.fkw-article .fkw-callout + h3,
.fkw-article .fkw-callout + .fkw-source-block,
.fkw-article .fkw-figure + h3,
.fkw-article .fkw-caption + h3 {
  margin-top: 26px !important;
}

.fkw-article .fkw-panel-grid + .fkw-list-intro {
  margin-top: 24px !important;
}

.fkw-article .fkw-list-intro + ul {
  margin-top: 7px !important;
}

.fkw-article .fkw-activity-list > li + li,
.fkw-article .fkw-talk-list > li + li {
  margin-top: 22px !important;
}

/* Section 8/9 transition: clear hierarchy, not a giant empty hole. */
.fkw-article .fkw-source-block--accessibility {
  padding-bottom: 0 !important;
}

.fkw-article .fkw-source-block--support-start {
  padding-top: 0 !important;
}

.fkw-article .fkw-source-block--support-start .fkw-subsection-gap {
  margin-top: 26px !important;
}

.fkw-article .fkw-source-block--support-start .fkw-section-mark--section9 {
  margin-top: 38px !important;
}

@media (max-width: 760px) {
  .fkw-article .fkw-figure--standard-single {
    width: 100% !important;
  }

  .fkw-article .fkw-source-block > .fkw-section-mark {
    margin-top: 36px;
  }
}


/* ===== v10 — only the four requested targeted adjustments ===== */

/* 1. Specialists now fill the empty space in the text column beside Justyna's photo. */
.fkw-panel-copy .fkw-specialists-intro {
  margin-top: 22px !important;
  margin-bottom: 6px !important;
}

.fkw-panel-copy .fkw-specialists-list {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 2. Slightly more breathing room before Lunch. */
.fkw-gap-before-lunch {
  margin-top: 34px !important;
}

/* 3. Slightly more breathing room before the paragraph below the Okrąglak image. */
.fkw-gap-before-okraglak {
  margin-top: 24px !important;
}

/* 4. Toilets images below the text, not beside it. */
.fkw-toilets-block {
  display: block;
}

.fkw-media-grid--toilets {
  margin-top: 18px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 300px;
  gap: 12px;
}

.fkw-media-grid--toilets .fkw-figure {
  margin-top: 0 !important;
}

.fkw-media-grid--toilets img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

@media (max-width: 760px) {
  .fkw-media-grid--toilets {
    max-width: 100%;
  }
}


/* ===== v11 — two targeted fixes only ===== */

/* 1. Real spacing before the paragraph after the Okrąglak photo.
   Higher specificity is intentional: v9 had a more specific !important rule
   that was overriding the previous class. */
.fkw-article p.fkw-gap-before-okraglak {
  margin-top: 28px !important;
}

/* 2. Toilets photos: equal visual height while preserving the two-column layout. */
.fkw-media-grid--toilets .fkw-figure {
  display: flex;
  flex-direction: column;
}

.fkw-media-grid--toilets .fkw-figure img {
  width: 100% !important;
  height: 210px !important;
  object-fit: cover !important;
}

@media (max-width: 760px) {
  .fkw-media-grid--toilets .fkw-figure img {
    height: 210px !important;
  }
}


/* ===== v12 — final tiny fix only ===== */
.fkw-article h3.fkw-gap-before-lunch {
  margin-top: 46px !important;
}