.poradniki-page {
  position: relative;
  overflow: clip;
}

.poradniki-page::before {
  position: absolute;
  z-index: -1;
  inset: 14rem 0 auto;
  height: 70rem;
  background: radial-gradient(circle at 80% 20%, rgb(78 217 232 / 7%), transparent 28rem), radial-gradient(circle at 10% 50%, rgb(180 61 130 / 8%), transparent 24rem);
  content: "";
  pointer-events: none;
}

.poradniki-page .section { position: relative; }
.poradniki-page .container { width: min(var(--container-width), var(--container-max)); }

.poradniki-hero { padding-block: var(--space-8) var(--space-9); }
.poradniki-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: stretch; gap: var(--space-6); min-height: 38.75rem; }
.poradniki-hero__content { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--space-5); }
.poradniki-breadcrumbs { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--space-2); color: var(--color-text-muted); font-size: var(--text-sm); }
.poradniki-breadcrumbs a { color: var(--color-text-muted); }
.poradniki-hero h1 { margin: 0; max-width: 12ch; font-size: clamp(3.6rem, 5.5vw, 5.5rem); }
.poradniki-hero__lead { max-width: 56ch; margin: 0; color: var(--color-text-muted); font-size: var(--text-lead); line-height: var(--line-lead); }
.poradniki-hero__actions { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--space-3); }
.poradniki-hero__media { position: relative; min-width: 0; height: 100%; margin: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); }
.poradniki-hero__media::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgb(10 13 28 / 18%), transparent 55%), linear-gradient(0deg, rgb(10 13 28 / 24%), transparent 45%); content: ""; pointer-events: none; }
.poradniki-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 68% center; }
.poradniki-hero__orbit { position: relative; width: min(100%, 24rem); height: 1px; margin-top: var(--space-2); background: linear-gradient(90deg, var(--color-comet-cyan), transparent); }
.poradniki-hero__orbit::after { position: absolute; top: 50%; left: 0; width: 0.55rem; aspect-ratio: 1; border-radius: 50%; background: var(--color-comet-cyan); box-shadow: var(--shadow-glow-cyan); content: ""; transform: translateY(-50%); animation: poradniki-orbit 12s ease-in-out infinite; }

.poradniki-route__panel { display: flex; min-width: 0; flex-direction: column; gap: var(--space-7); padding: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: linear-gradient(135deg, rgb(27 33 69 / 94%), rgb(10 13 28 / 92%)); box-shadow: var(--shadow-soft); }
.poradniki-route__intro { min-width: 0; max-width: 60ch; }
.poradniki-route__intro h2 { margin-top: var(--space-3); }
.poradniki-route__stations { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); min-width: 0; }
.poradniki-route__stations::before { position: absolute; z-index: 0; top: 0.85rem; right: 8%; left: 8%; height: 1px; background: linear-gradient(90deg, var(--color-comet-cyan), var(--color-star-gold), var(--color-comet-cyan)); content: ""; }
.poradniki-station { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; min-width: 0; gap: var(--space-3); color: var(--color-text); text-decoration: none; }
.poradniki-station__number { display: grid; width: 1.7rem; aspect-ratio: 1; place-items: center; border: 1px solid var(--color-comet-cyan); border-radius: 50%; background: var(--color-polished-obsidian); color: var(--color-comet-cyan); font-size: var(--text-xs); font-weight: 700; box-shadow: 0 0 0 0 rgb(78 217 232 / 0%); transition: box-shadow var(--transition-fast), transform var(--transition-fast); }
.poradniki-station__copy { display: flex; min-width: 0; flex-direction: column; gap: var(--space-2); }
.poradniki-station__copy strong { font-size: var(--text-sm); letter-spacing: 0.04em; text-transform: uppercase; }
.poradniki-station__copy span { color: var(--color-text-muted); font-size: var(--text-sm); line-height: var(--line-sm); }
.poradniki-station:hover .poradniki-station__number, .poradniki-station:focus-visible .poradniki-station__number { box-shadow: var(--shadow-glow-cyan); transform: scale(1.12); }

.poradniki-basics__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); align-items: start; gap: var(--space-7); }
.poradniki-basics__intro { min-width: 0; }
.poradniki-basics__intro h2 { margin-top: var(--space-3); }
.poradniki-basics__intro .lead { max-width: 58ch; }
.poradniki-basics__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; gap: var(--space-5); }
.poradniki-step { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); min-width: 0; gap: var(--space-3); }
.poradniki-step__number { color: var(--color-star-gold); font-family: var(--font-heading); font-size: 2.4rem; line-height: 1; }
.poradniki-step h3 { font-size: clamp(1.55rem, 2vw, 1.9rem); }
.poradniki-step p { max-width: 38ch; }
.poradniki-basics blockquote { max-width: 32ch; margin-top: var(--space-7); margin-bottom: 0; }

.poradniki-mechanics { background: linear-gradient(180deg, transparent, rgb(27 33 69 / 38%), transparent); }
.poradniki-mechanics__intro { max-width: 64ch; }
.poradniki-mechanics__intro h2 { margin-top: var(--space-3); }
.poradniki-mechanics__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; gap: var(--space-5); margin-top: var(--space-7); }
.poradniki-mechanic { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--surface-glass); box-shadow: var(--shadow-soft); backdrop-filter: blur(14px); }
.poradniki-mechanic h3, .poradniki-mechanic p { margin: 0; }
.poradniki-mechanic p { max-width: 36ch; }
.poradniki-mechanic details { width: 100%; margin: 0; }
.poradniki-diagram { position: relative; width: 100%; height: 2.5rem; overflow: hidden; }
.poradniki-diagram::before, .poradniki-diagram::after { position: absolute; content: ""; }
.poradniki-diagram::before { top: 50%; right: 0; left: 0; height: 1px; background: var(--color-starlight-silver); }
.poradniki-diagram::after { top: calc(50% - 0.35rem); left: 18%; width: 0.7rem; aspect-ratio: 1; border-radius: 50%; background: var(--color-comet-cyan); box-shadow: var(--shadow-glow-cyan); }
.poradniki-diagram--break::before { background: linear-gradient(90deg, var(--color-starlight-silver) 44%, transparent 44% 53%, var(--color-comet-cyan) 53%); }
.poradniki-diagram--follow::after { left: 58%; box-shadow: -5rem -0.9rem 0 -0.1rem var(--color-comet-cyan), var(--shadow-glow-cyan); }
.poradniki-diagram--dot::after { left: 68%; background: var(--color-nebula-magenta); box-shadow: -3rem 0 0 -0.1rem var(--color-nebula-magenta), -6rem 0 0 -0.1rem var(--color-nebula-magenta); }
.poradniki-text-link { display: inline-block; margin-top: var(--space-6); font-weight: 700; }

.poradniki-team__heading { max-width: 60ch; }
.poradniki-team__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; gap: var(--space-7); margin-top: var(--space-7); }
.poradniki-team__media { min-width: 0; margin: 0; }
.poradniki-team__media img { width: 100%; aspect-ratio: 4 / 5; border: 1px solid var(--color-border); border-radius: var(--radius-md); object-fit: cover; object-position: center; box-shadow: var(--shadow-soft); }
.poradniki-team__layers { display: flex; min-width: 0; flex-direction: column; gap: var(--space-5); }
.poradniki-layer { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); min-width: 0; gap: var(--space-4); padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-border); }
.poradniki-layer:last-child { padding-bottom: 0; border-bottom: 0; }
.poradniki-layer > span { color: var(--color-star-gold); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.11em; text-transform: uppercase; }
.poradniki-layer p { max-width: 42ch; }

.poradniki-builds { background: radial-gradient(circle at 85% 45%, rgb(56 35 68 / 45%), transparent 32rem); }
.poradniki-builds__intro { max-width: 56ch; }
.poradniki-builds__intro h2 { margin-top: var(--space-3); }
.poradniki-builds__boards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; gap: var(--space-5); margin-top: var(--space-7); }
.poradniki-board { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); border: 1px solid var(--color-border); border-top-color: var(--color-starlight-silver); border-radius: var(--radius-sm); background: rgb(10 13 28 / 82%); box-shadow: var(--shadow-soft); }
.poradniki-board h3, .poradniki-board p { margin: 0; }
.poradniki-board p { max-width: 34ch; }
.poradniki-note { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); margin-top: var(--space-5); padding: var(--space-5); border-left: 2px solid var(--color-comet-cyan); background: rgb(27 33 69 / 70%); }
.poradniki-note h3, .poradniki-note p, .poradniki-note details { margin: 0; }
.poradniki-note p { max-width: 70ch; }

.poradniki-exploration__heading { max-width: 62ch; }
.poradniki-exploration__heading h2 { margin-top: var(--space-3); }
.poradniki-exploration__scene { position: relative; display: grid; grid-template-columns: minmax(0, 58fr) minmax(0, 42fr); min-width: 0; margin-top: var(--space-7); overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--surface-strong); box-shadow: var(--shadow-soft); }
.poradniki-exploration__scene > figure { grid-column: 1 / -1; grid-row: 1; min-width: 0; margin: 0; }
.poradniki-exploration__scene img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: center; }
.poradniki-exploration__tips { z-index: 1; grid-column: 2; grid-row: 1; display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: var(--space-5); padding: var(--space-6); background: linear-gradient(90deg, rgb(10 13 28 / 72%), rgb(10 13 28 / 91%)); }
.poradniki-exploration__tips article { display: grid; grid-template-columns: 2rem minmax(0, 1fr); min-width: 0; gap: var(--space-3); }
.poradniki-exploration__tips article > span { color: var(--color-star-gold); font-size: var(--text-sm); font-weight: 700; }
.poradniki-exploration__tips h3 { font-size: clamp(1.5rem, 2.2vw, 1.8rem); }
.poradniki-exploration__tips p { max-width: 50ch; }

.poradniki-legend__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; gap: var(--space-7); }
.poradniki-legend__intro { min-width: 0; }
.poradniki-legend__intro .lead { max-width: 54ch; }
.poradniki-legend__items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; gap: var(--space-5); }
.poradniki-legend-item { display: grid; grid-template-columns: 2rem minmax(0, 1fr); min-width: 0; gap: var(--space-3); padding: var(--space-4); border-top: 1px solid var(--color-border-strong); background: rgb(27 33 69 / 38%); }
.poradniki-legend-item > span { color: var(--color-star-gold); font-size: var(--text-xs); font-weight: 700; }
.poradniki-legend-item h3 { font-size: 1.5rem; }
.poradniki-legend-item p { max-width: 35ch; }
.poradniki-legend-item--advice { border-top-color: var(--color-comet-cyan); }
.poradniki-legend-item--route { border-top-color: var(--color-nebula-magenta); }

.poradniki-destinations__intro { max-width: 55ch; }
.poradniki-destinations__intro h2 { margin-top: var(--space-3); }
.poradniki-destinations__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; gap: var(--space-5); margin-top: var(--space-7); }
.poradniki-destination { position: relative; display: flex; min-width: 0; min-height: 16rem; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); border: 1px solid var(--color-border); border-top: 2px solid var(--color-comet-cyan); border-radius: var(--radius-sm); background: var(--surface-strong); color: var(--color-text); text-decoration: none; transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast); }
.poradniki-destination::after { position: absolute; top: -0.35rem; right: var(--space-5); width: 0.55rem; aspect-ratio: 1; border-radius: 50%; background: var(--color-comet-cyan); content: ""; transition: box-shadow var(--transition-fast); }
.poradniki-destination h3, .poradniki-destination p { margin: 0; }
.poradniki-destination p { max-width: 32ch; color: var(--color-text-muted); }
.poradniki-destination > span { color: var(--color-text-muted); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; }
.poradniki-destination > strong { margin-top: auto; }
.poradniki-destination:hover { border-color: var(--color-comet-cyan); box-shadow: var(--shadow-glow-cyan); transform: translateY(-2px); }
.poradniki-destination:hover::after { box-shadow: var(--shadow-glow-cyan); }

.poradniki-final__panel { display: grid; grid-template-columns: minmax(0, 55fr) minmax(0, 45fr); min-width: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--surface-strong); box-shadow: var(--shadow-soft); }
.poradniki-final__content { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-7); }
.poradniki-final__content h2, .poradniki-final__content p { margin: 0; }
.poradniki-final__content p { max-width: 56ch; }
.poradniki-final__actions { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-2); }
.poradniki-final__line { position: relative; min-width: 0; }
.poradniki-final__line::before { position: absolute; top: 50%; right: 0; left: -10%; height: 1px; background: linear-gradient(90deg, var(--color-comet-cyan), transparent); content: ""; }
.poradniki-final__line::after { position: absolute; top: calc(50% - 0.35rem); left: 45%; width: 0.7rem; aspect-ratio: 1; border-radius: 50%; background: var(--color-comet-cyan); box-shadow: var(--shadow-glow-cyan); content: ""; }

@keyframes poradniki-orbit { 0%, 100% { left: 0; opacity: .55; } 50% { left: calc(100% - .55rem); opacity: 1; } }

@media (max-width: 1019px) {
  .poradniki-hero__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .poradniki-hero__content { min-height: 0; }
  .poradniki-hero__media { height: auto; aspect-ratio: 16 / 9; }
  .poradniki-hero__media img { object-position: 65% center; }
  .poradniki-basics__grid, .poradniki-team__grid, .poradniki-legend__grid { grid-template-columns: minmax(0, 1fr); }
  .poradniki-basics__steps { grid-template-columns: minmax(0, 1fr); }
  .poradniki-step p { max-width: 58ch; }
  .poradniki-team__media { width: min(100%, 36rem); }
  .poradniki-team__layers { width: 100%; }
}

@media (max-width: 920px) {
  .poradniki-route__stations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .poradniki-route__stations::before { display: none; }
  .poradniki-station { grid-template-columns: 2rem minmax(0, 1fr); }
  .poradniki-mechanics__grid, .poradniki-builds__boards { grid-template-columns: minmax(0, 1fr); }
  .poradniki-mechanic p, .poradniki-board p { max-width: 58ch; }
  .poradniki-exploration__scene { grid-template-columns: minmax(0, 1fr); overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .poradniki-exploration__scene > figure { grid-column: 1; grid-row: auto; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); }
  .poradniki-exploration__scene img { aspect-ratio: 4 / 3; }
  .poradniki-exploration__tips { grid-column: 1; grid-row: auto; padding: var(--space-6) 0 0; background: transparent; }
  .poradniki-legend__items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 839px) {
  .poradniki-final__panel { grid-template-columns: minmax(0, 1fr); }
  .poradniki-final__line { height: 3rem; }
  .poradniki-final__line::before { top: 1rem; left: var(--space-7); }
  .poradniki-final__line::after { top: 0.65rem; left: 65%; }
}

@media (max-width: 767px) {
  .poradniki-hero { padding-block: var(--space-6) var(--space-8); }
  .poradniki-hero__grid { gap: var(--space-5); }
  .poradniki-hero h1 { font-size: clamp(2.65rem, 12vw, 3.35rem); }
  .poradniki-hero__lead { font-size: 1.125rem; }
  .poradniki-hero__actions, .poradniki-final__actions { width: 100%; flex-direction: column; }
  .poradniki-hero__actions .button, .poradniki-final__actions .button { width: 100%; }
  .poradniki-hero__media { aspect-ratio: 4 / 3; }
  .poradniki-route__panel { gap: var(--space-6); padding: var(--space-4); }
  .poradniki-route__stations { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); padding-left: var(--space-3); }
  .poradniki-route__stations::after { position: absolute; top: 0.8rem; bottom: 0.8rem; left: 1.1rem; width: 1px; background: var(--color-comet-cyan); content: ""; }
  .poradniki-station { grid-template-columns: 2rem minmax(0, 1fr); }
  .poradniki-station__number { z-index: 1; }
  .poradniki-basics__grid, .poradniki-team__grid, .poradniki-legend__grid { gap: var(--space-6); }
  .poradniki-step { grid-template-columns: 2.75rem minmax(0, 1fr); }
  .poradniki-mechanics__grid, .poradniki-builds__boards, .poradniki-destinations__grid, .poradniki-legend__items { grid-template-columns: minmax(0, 1fr); }
  .poradniki-mechanic, .poradniki-board { padding: var(--space-4); }
  .poradniki-team__media { width: 100%; }
  .poradniki-layer { grid-template-columns: 4.8rem minmax(0, 1fr); }
  .poradniki-exploration__tips { padding-top: var(--space-5); }
  .poradniki-exploration__tips article { grid-template-columns: 2rem minmax(0, 1fr); }
  .poradniki-destination { min-height: 0; padding: var(--space-4); }
  .poradniki-final__content { padding: var(--space-5); }
}

@media (prefers-reduced-motion: reduce) {
  .poradniki-hero__orbit::after { animation: none; }
}