@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  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: "Manrope";
  src: url("../fonts/manrope-latin.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  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: "Inter";
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  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: "Inter";
  src: url("../fonts/inter-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  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;
}

:root {
  --bo-porcelain: #f5f5f2;
  --bo-midnight: #172536;
  --bo-ice: #c7dbe5;
  --bo-coral: #e77b68;
  --bo-ink: #172536;
  --bo-muted: #4c5d6c;
  --bo-line: rgba(23, 37, 54, 0.14);
  --bo-white: #fffcf8;
  --bo-display: "Manrope", "Segoe UI", sans-serif;
  --bo-body: "Inter", "Segoe UI", sans-serif;
  --bo-nav-h: 76px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

#bo-tresc,
#bo-rytm,
#bo-wstep,
#bo-obszary,
#bo-wiedza { scroll-margin-top: 88px; }

body {
  margin: 0;
  background: var(--bo-porcelain);
  color: var(--bo-ink);
  font-family: var(--bo-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

body.bo-lock { overflow: hidden; }

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; }

button, input, textarea { font: inherit; color: inherit; }

h1, h2, h3, p { margin: 0; }

.bo-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.bo-skip {
  position: absolute;
  left: 16px;
  top: -40px;
  background: var(--bo-coral);
  color: var(--bo-midnight);
  padding: 8px 12px;
  z-index: 20;
}

.bo-skip:focus { top: 12px; }

.bo-nav {
  position: sticky;
  top: 0;
  z-index: 10;
  height: var(--bo-nav-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4vw;
  background: var(--bo-porcelain);
  border-bottom: 1px solid var(--bo-line);
}

.bo-mark {
  font-family: var(--bo-display);
  font-weight: 650;
  letter-spacing: -0.04em;
  text-decoration: none;
  font-size: 1.25rem;
}

.bo-mark::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--bo-coral);
  transform: translateY(-1px);
}

.bo-menu { display: flex; gap: 28px; }

.bo-menu a {
  text-decoration: none;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
}

.bo-menu a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--bo-coral); }

.bo-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  padding: 10px;
}

.bo-toggle-line {
  display: block;
  height: 1.5px;
  margin: 6px 0;
  background: var(--bo-midnight);
}

.bo-hero { position: relative; background: var(--bo-midnight); }

.bo-hero-img {
  width: 100%;
  height: calc(100svh - var(--bo-nav-h));
  min-height: 520px;
  object-fit: cover;
  object-position: 62% 45%;
}

.bo-hero-panel {
  position: absolute;
  left: 0;
  bottom: 0;
  width: min(760px, 92%);
  padding: 36px 4vw 40px;
  background: var(--bo-midnight);
  color: var(--bo-porcelain);
  border-top: 3px solid var(--bo-coral);
}

.bo-kicker {
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--bo-coral);
  margin-bottom: 14px;
}

.bo-hero h1 {
  font-family: var(--bo-display);
  font-weight: 560;
  font-size: clamp(2.6rem, 5.4vw, 5.2rem);
  line-height: 0.96;
  letter-spacing: -0.045em;
}

.bo-hero-panel p { margin-top: 18px; max-width: 38ch; color: #d5dde4; }

.bo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: 26px;
  padding: 0 22px;
  background: var(--bo-coral);
  color: var(--bo-midnight);
  text-decoration: none;
  border: 0;
  cursor: pointer;
  font-weight: 600;
}

.bo-btn:hover { background: #f0a598; }

.bo-btn:focus-visible,
.bo-menu a:focus-visible,
.bo-mark:focus-visible,
.bo-tile:focus-visible,
input:focus-visible,
textarea:focus-visible,
button:focus-visible {
  outline: 2px solid var(--bo-coral);
  outline-offset: 3px;
}

.bo-intro {
  display: grid;
  grid-template-columns: 72px 1.1fr 0.9fr;
  gap: 36px 48px;
  padding: 96px 4vw 40px;
}

.bo-intro-index {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--bo-muted);
}

.bo-intro h2 {
  font-family: var(--bo-display);
  font-weight: 550;
  font-size: clamp(2.4rem, 4.6vw, 4.4rem);
  line-height: 0.98;
  letter-spacing: -0.045em;
  max-width: 11ch;
}

.bo-intro h2 span {
  display: block;
  color: #6d4c46;
}

.bo-intro-copy { padding-top: 18px; }

.bo-intro-lead {
  font-size: 1.35rem;
  line-height: 1.45;
  max-width: 28ch;
}

.bo-intro-copy p + p { margin-top: 18px; color: var(--bo-muted); max-width: 42ch; }

.bo-intro-copy p:last-child { margin-top: 64px; }

.bo-areas { padding: 72px 4vw 40px; }

.bo-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 22px;
}

.bo-section-head h2,
.bo-block h2,
.bo-mast h1,
.bo-chapter h2,
.bo-close h2 {
  font-family: var(--bo-display);
  font-weight: 560;
  letter-spacing: -0.04em;
  line-height: 1.02;
}

.bo-section-head h2 { font-size: clamp(2rem, 3vw, 3rem); max-width: 16ch; }

.bo-mosaic {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr 1fr;
  grid-template-rows: 340px 300px;
  gap: 12px;
}

.bo-tile {
  position: relative;
  overflow: hidden;
  display: block;
  color: var(--bo-porcelain);
  text-decoration: none;
  background: var(--bo-midnight);
}

.bo-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.bo-tile:hover img { transform: scale(1.04); }

.bo-tile-a { grid-column: 1; grid-row: 1 / 3; }
.bo-tile-b { grid-column: 2 / 4; grid-row: 1; }
.bo-tile-c { grid-column: 2; grid-row: 2; }
.bo-tile-d { grid-column: 3; grid-row: 2; }

.bo-tile-copy {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 22px;
  background: linear-gradient(transparent, rgba(23, 37, 54, 0.88));
}

.bo-tile-copy strong {
  display: block;
  font-family: var(--bo-display);
  font-size: 1.7rem;
  font-weight: 560;
  letter-spacing: -0.03em;
}

.bo-tile-copy span { display: block; margin-top: 4px; color: #e4ebf0; }

.bo-rhythm {
  margin-top: 72px;
  background: var(--bo-ice);
  padding: 72px 4vw 80px;
}

.bo-rhythm-grid {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 48px;
  align-items: start;
}

.bo-rhythm h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); max-width: 10ch; }

.bo-rhythm-lead { margin-top: 18px; max-width: 36ch; }

.bo-matrix {
  background: var(--bo-porcelain);
  padding: 28px;
}

.bo-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 20px;
}

.bo-fields label,
.bo-form label { display: flex; flex-direction: column; gap: 8px; font-size: 0.92rem; }

.bo-choices { grid-column: 1 / -1; border: 0; margin: 0; padding: 0; }

.bo-choices legend { margin-bottom: 8px; }

.bo-choices label { display: inline-flex; flex-direction: row; align-items: center; gap: 8px; margin-right: 18px; }

input[type="time"],
input[type="email"],
input[type="text"],
input[type="range"],
textarea {
  width: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--bo-midnight);
  padding: 10px 0;
  border-radius: 0;
}

textarea { min-height: 140px; resize: vertical; border: 1px solid var(--bo-line); padding: 12px; }

.bo-range-row { display: flex; justify-content: space-between; }

.bo-matrix-out { margin-top: 28px; min-height: 80px; }

.bo-bar {
  position: relative;
  height: 4px;
  background: rgba(23, 37, 54, 0.18);
  margin: 8px 0 22px;
}

.bo-bar i {
  position: absolute;
  top: -5px;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  border-radius: 50%;
  background: var(--bo-coral);
}

.bo-slots { list-style: none; padding: 0; margin: 0; }

.bo-slots li {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid var(--bo-line);
}

.bo-slots time { font-family: var(--bo-display); font-weight: 650; }

.bo-hub { padding: 88px 4vw; }

.bo-hub-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.8fr;
  grid-template-rows: auto auto;
  gap: 18px 28px;
}

.bo-feature { grid-row: 1 / 3; }

.bo-feature img { width: 100%; height: 460px; object-fit: cover; }

.bo-card {
  text-decoration: none;
  display: block;
  color: inherit;
}

.bo-card h3,
.bo-feature h3,
.bo-side h3 {
  font-family: var(--bo-display);
  font-weight: 560;
  letter-spacing: -0.03em;
  font-size: 1.8rem;
  margin: 12px 0 8px;
}

.bo-meta { color: var(--bo-muted); font-size: 0.92rem; }

.bo-side {
  padding-top: 8px;
  border-top: 1px solid var(--bo-midnight);
}

.bo-side + .bo-side { align-self: end; }

.bo-ribbon {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 22px 0;
  border-top: 1px solid var(--bo-midnight);
  border-bottom: 1px solid var(--bo-midnight);
  text-decoration: none;
}

.bo-close {
  background: var(--bo-midnight);
  color: var(--bo-porcelain);
  padding: 88px 4vw;
  display: grid;
  grid-template-columns: 1.4fr 0.6fr;
  gap: 32px;
  align-items: end;
}

.bo-close h2 { font-size: clamp(2.4rem, 5vw, 4.6rem); max-width: 12ch; }

.bo-close .bo-btn { background: var(--bo-porcelain); }

.bo-footer {
  background: #101a26;
  color: #d5dde4;
  padding: 56px 4vw 28px;
}

.bo-footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 0.7fr 0.7fr;
  gap: 32px;
}

.bo-mark-light { color: var(--bo-porcelain); }

.bo-footer a { display: block; color: #d5dde4; text-decoration: none; margin: 6px 0; }

.bo-footer a:hover { color: var(--bo-coral); }

.bo-footer-label {
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--bo-coral);
  margin-bottom: 10px;
}

.bo-footer-lead { max-width: 36ch; margin-top: 14px; }

.bo-copy {
  margin-top: 36px;
  padding-top: 16px;
  border-top: 1px solid rgba(245, 245, 242, 0.12);
  font-size: 0.92rem;
}

.bo-mast { padding: 48px 4vw 10px; }

.bo-mast-photo { position: relative; margin: 0 0 10px; }

.bo-mast-photo img { width: 100%; height: min(78vh, 760px); object-fit: cover; }

.bo-mast-photo figcaption,
.bo-caption { color: var(--bo-muted); font-size: 0.92rem; padding: 8px 4vw 0; }

.bo-mast h1 { font-size: clamp(2.8rem, 6vw, 5.6rem); max-width: 14ch; }

.bo-mast-ergo { padding-top: 64px; }

.bo-mast-ergo h1 { max-width: 13ch; }

.bo-lead {
  font-size: 1.35rem;
  line-height: 1.45;
  max-width: 38ch;
  margin-top: 22px;
}

.bo-prose {
  display: grid;
  grid-template-columns: 180px minmax(0, 68ch);
  gap: 28px;
  padding: 28px 4vw 72px;
}

.bo-margin {
  color: var(--bo-muted);
  font-size: 0.92rem;
  position: sticky;
  top: 96px;
  align-self: start;
}

.bo-margin ol { margin: 8px 0 0; padding-left: 18px; }

.bo-prose h2,
.bo-chapter h2,
.bo-wide h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); margin: 36px 0 12px; }

.bo-prose h3 { font-family: var(--bo-display); font-size: 1.35rem; margin: 28px 0 8px; letter-spacing: -0.03em; }

.bo-prose p,
.bo-chapter p,
.bo-wide p { margin: 0 0 14px; }

.bo-prose ol,
.bo-prose ul,
.bo-chapter ol,
.bo-wide ol { margin: 0 0 16px; padding-left: 1.2rem; }

.bo-prose li + li,
.bo-chapter li + li,
.bo-wide li + li { margin-top: 8px; }

.bo-quote {
  margin: 28px 0;
  padding: 0;
  border: 0;
  font-family: var(--bo-display);
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: #6d4c46;
}

.bo-table-wrap { overflow-x: auto; margin: 18px 0 28px; }

.bo-table { width: 100%; border-collapse: collapse; font-size: 0.98rem; }

.bo-table caption {
  text-align: left;
  font-weight: 600;
  margin-bottom: 8px;
}

.bo-table th,
.bo-table td {
  text-align: left;
  vertical-align: top;
  padding: 12px 12px 12px 0;
  border-top: 1px solid var(--bo-line);
}

.bo-table th { font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase; }

.bo-strip-img { width: 100%; height: 320px; object-fit: cover; object-position: center; }

.bo-chapters { padding: 10px 4vw 80px; }

.bo-chapter {
  display: grid;
  grid-template-columns: 120px minmax(0, 70ch);
  gap: 20px;
  padding: 36px 0;
  border-top: 1px solid var(--bo-line);
}

.bo-chapter-no {
  font-family: var(--bo-display);
  font-size: 3rem;
  letter-spacing: -0.05em;
  color: var(--bo-coral);
}

.bo-chapter-dark {
  background: var(--bo-midnight);
  color: var(--bo-porcelain);
  margin: 0 -4vw;
  padding: 36px 4vw;
  border-top: 0;
}

.bo-chapter-dark .bo-quote { color: var(--bo-ice); }

.bo-day {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 28px 4vw 10px;
  border-top: 1px solid var(--bo-midnight);
}

.bo-day div { padding: 18px 16px 18px 0; border-right: 1px solid var(--bo-line); }

.bo-day strong { display: block; font-family: var(--bo-display); font-size: 1.4rem; }

.bo-wide { padding: 10px 4vw 80px; max-width: 1100px; }

.bo-index { padding: 10px 4vw 80px; display: grid; gap: 0; }

.bo-index a {
  display: grid;
  grid-template-columns: 90px 1.2fr 0.8fr;
  gap: 18px;
  padding: 28px 0;
  border-top: 1px solid var(--bo-midnight);
  text-decoration: none;
  align-items: center;
}

.bo-index a:last-child { border-bottom: 1px solid var(--bo-midnight); }

.bo-index strong { font-family: var(--bo-display); font-size: clamp(1.6rem, 3vw, 2.4rem); letter-spacing: -0.03em; }

.bo-contact {
  padding: 28px 4vw 80px;
  display: grid;
  grid-template-columns: 0.8fr 1.1fr;
  gap: 48px;
}

.bo-address {
  font-family: var(--bo-display);
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.bo-form { display: grid; gap: 18px; }

.bo-alert {
  background: #f3d2cb;
  padding: 12px 14px;
}

.bo-trap {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.bo-done, .bo-lost {
  min-height: calc(100svh - 220px);
  padding: 72px 4vw;
  background: var(--bo-midnight);
  color: var(--bo-porcelain);
}

.bo-done h1, .bo-lost h1 {
  font-family: var(--bo-display);
  font-size: clamp(3rem, 8vw, 7rem);
  letter-spacing: -0.05em;
  line-height: 0.95;
}

.bo-ref {
  font-family: var(--bo-display);
  font-size: clamp(1.4rem, 3vw, 2rem);
  color: var(--bo-coral);
  margin: 18px 0;
}

.bo-done a, .bo-lost a { color: var(--bo-porcelain); }

@media (max-width: 980px) {
  .bo-intro,
  .bo-rhythm-grid,
  .bo-hub-grid,
  .bo-close,
  .bo-prose,
  .bo-chapter,
  .bo-contact,
  .bo-footer-grid,
  .bo-ribbon,
  .bo-index a,
  .bo-day {
    grid-template-columns: 1fr;
  }

  .bo-intro-index { writing-mode: horizontal-tb; transform: none; }

  .bo-intro-copy p:last-child { margin-top: 18px; }

  .bo-mosaic {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }

  .bo-tile-a, .bo-tile-b, .bo-tile-c, .bo-tile-d {
    grid-column: auto;
    grid-row: auto;
    height: 420px;
  }

  .bo-tile-b { height: 260px; }
  .bo-tile-c { height: 340px; }
  .bo-tile-d { height: 300px; }

  .bo-feature { grid-row: auto; }
  .bo-feature img { height: 280px; }
  .bo-margin { position: static; }
  .bo-chapter-dark { margin: 0; padding: 28px 0; }
  .bo-day div { border-right: 0; border-bottom: 1px solid var(--bo-line); }
  .bo-hero-img { min-height: 420px; height: 68svh; }
}

@media (max-width: 760px) {
  .bo-toggle { display: block; }

  .bo-menu {
    position: fixed;
    inset: 0;
    background: var(--bo-porcelain);
    flex-direction: column;
    justify-content: flex-end;
    padding: 32px 24px 48px;
    gap: 8px;
    transform: translateY(-102%);
    visibility: hidden;
  }

  .bo-nav.is-open .bo-menu {
    transform: none;
    visibility: visible;
  }

  .bo-menu a {
    font-family: var(--bo-display);
    font-size: 2.4rem;
    letter-spacing: -0.04em;
    line-height: 1.1;
  }

  .bo-nav.is-open { z-index: 30; }
  .bo-nav.is-open .bo-menu { z-index: 30; }
  .bo-nav.is-open .bo-toggle { position: relative; z-index: 31; }

  .bo-fields { grid-template-columns: 1fr; }
  .bo-hero-panel { width: 100%; padding: 28px 22px 32px; }
  .bo-hero h1 { font-size: 2.7rem; }
  .bo-slots li { grid-template-columns: 64px 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .bo-tile img { transition: none; }
}
