.poradniki-page { overflow: hidden; }
.poradniki-page .container { width: min(100% - 2rem, var(--container-max)); }
.poradniki-hero { padding: clamp(3rem, 7vw, 6rem) 0 var(--space-8); background: var(--color-night-navy); }
.poradniki-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6); align-items: center; }
.poradniki-hero__copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-5); }
.poradniki-hero__copy > * { margin: 0; }
.poradniki-hero h1 { max-width: 11ch; font-size: clamp(2.25rem, 5.4vw, 4rem); }
.poradniki-hero__lead { max-width: 58ch; font-size: var(--font-size-18); line-height: 1.5; color: var(--color-paper-light); }
.poradniki-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; min-width: 0; }
.poradniki-text-link { display: inline-flex; min-height: 2.75rem; align-items: center; font-family: var(--font-heading); font-size: var(--font-size-14); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.poradniki-hero__status { display: flex; align-items: center; gap: var(--space-2); max-width: 52ch; color: var(--color-muted-blue); font-size: var(--font-size-14); }
.poradniki-hero__status span { width: .75rem; height: .75rem; flex: 0 0 .75rem; background: var(--color-neon-lime); border-radius: var(--radius-pixel); }
.poradniki-hero__visual { width: 100%; min-width: 0; margin: 0; border: var(--border-dark); border-radius: var(--radius-panel); overflow: hidden; background: var(--color-ink-blue); }
.poradniki-hero__visual img { width: 100%; height: auto; aspect-ratio: 16 / 7; object-fit: cover; object-position: center; }
.poradniki-section-intro { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); min-width: 0; }
.poradniki-section-intro > * { margin: 0; }
.poradniki-section-intro h2 { max-width: 18ch; }
.poradniki-section-intro p { color: var(--color-muted-blue); }
.poradniki-section-intro--goals { max-width: 62ch; margin-bottom: var(--space-7); }
.poradniki-section-intro--goals p { max-width: 62ch; }
.poradniki-goals__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.poradniki-goal-card { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast); }
.poradniki-goal-card > * { margin: 0; }
.poradniki-goal-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-block); }
.poradniki-goal-card h3 { font-size: var(--font-size-24); }
.poradniki-goal-card p { max-width: 34ch; color: var(--color-muted-blue); }
.poradniki-goal-card a { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--space-2); margin-top: auto; font-family: var(--font-heading); font-size: var(--font-size-14); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.poradniki-goal-card__marker { display: inline-flex; min-width: 2rem; min-height: .45rem; background: var(--color-neon-lime); border-radius: var(--radius-pixel); }
.poradniki-goal-card--turquoise .poradniki-goal-card__marker { background: var(--color-pixel-turquoise); }
.poradniki-goal-card--purple .poradniki-goal-card__marker { background: var(--color-lavender-purple); }
.poradniki-goal-card--coral .poradniki-goal-card__marker { align-items: center; min-height: 1.5rem; padding: 0 .5rem; background: var(--color-coral-orange); color: var(--color-night-navy); font-family: var(--font-heading); font-size: var(--font-size-12); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.poradniki-goal-card--quick .poradniki-goal-card__marker { background: var(--color-neon-lime); }
.poradniki-rhythm { background: var(--color-night-navy); }
.poradniki-rhythm__panel { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 7fr) minmax(0, 3fr); gap: var(--space-5); padding: clamp(1rem, 3vw, 3rem); border: var(--border-light); border-radius: var(--radius-panel); background: var(--color-paper-light); color: var(--color-night-navy); }
.poradniki-rhythm__index { display: flex; flex-direction: column; gap: var(--space-8); padding-top: var(--space-8); color: #7581a9; font-family: var(--font-heading); font-size: clamp(2rem, 5vw, 4rem); font-weight: 800; line-height: 1; }
.poradniki-rhythm__content { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); }
.poradniki-rhythm__content > * { margin: 0; }
.poradniki-rhythm__content h2 { max-width: 18ch; }
.poradniki-rhythm__lead { max-width: 68ch; font-size: var(--font-size-18); line-height: 1.5; }
.poradniki-rules { display: flex; width: 100%; flex-direction: column; gap: var(--space-6); }
.poradniki-rule { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); gap: var(--space-4); min-width: 0; }
.poradniki-rule__number { color: #167b72; font-family: var(--font-heading); font-weight: 800; }
.poradniki-rule div { min-width: 0; }
.poradniki-rule h3 { margin-bottom: var(--space-3); }
.poradniki-rule p { max-width: 68ch; margin: 0; }
.poradniki-rule .tag { margin-bottom: var(--space-3); }
.poradniki-rhythm__landscape { position: relative; min-width: 0; min-height: 100%; overflow: hidden; border-left: 1px solid var(--color-light-line); background: repeating-linear-gradient(0deg, transparent 0 22px, #d8dff5 22px 24px); }
.poradniki-rhythm__landscape span { position: absolute; display: block; width: 3rem; height: 3rem; background: var(--color-neon-lime); transform: rotate(45deg); }
.poradniki-rhythm__landscape span:nth-child(1) { top: 12%; right: 18%; }
.poradniki-rhythm__landscape span:nth-child(2) { top: 47%; right: 48%; background: var(--color-pixel-turquoise); }
.poradniki-rhythm__landscape span:nth-child(3) { right: 8%; bottom: 12%; background: var(--color-coral-orange); }
.poradniki-section-intro--scenarios { margin-bottom: var(--space-7); }
.poradniki-scenarios__list { display: flex; flex-direction: column; gap: var(--space-5); }
.poradniki-scenario { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 7fr) minmax(0, 3fr); gap: var(--space-5); min-width: 0; padding: var(--space-6); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); overflow: hidden; }
.poradniki-scenario__label { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.poradniki-scenario__label strong { color: var(--color-muted-blue); font-family: var(--font-heading); font-size: var(--font-size-32); }
.poradniki-scenario__copy { min-width: 0; }
.poradniki-scenario__copy h3 { margin-bottom: var(--space-3); }
.poradniki-scenario__copy p { max-width: 56ch; }
.poradniki-scenario__copy ul { max-width: 52ch; margin-bottom: 0; }
.poradniki-scenario__tip { display: inline-block; padding: var(--space-2) var(--space-3); border-left: 4px solid var(--color-coral-orange); background: var(--color-deep-navy); color: var(--color-paper-light); font-family: var(--font-heading); font-weight: 700; }
.poradniki-scenario__motif { display: flex; min-width: 0; align-items: center; justify-content: center; gap: var(--space-2); }
.poradniki-scenario__motif i { display: block; width: 1.25rem; height: 4.5rem; background: var(--color-coral-orange); }
.poradniki-scenario--water .poradniki-scenario__motif i { height: 1rem; background: var(--color-pixel-turquoise); }
.poradniki-scenario--pressure .poradniki-scenario__motif i:nth-child(2) { height: 6rem; }
.poradniki-paths__heading { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-5); align-items: start; }
.poradniki-paths__heading > * { min-width: 0; }
.poradniki-paths__heading .eyebrow { width: max-content; }
.poradniki-paths__heading h2 { grid-column: 1; max-width: 16ch; }
.poradniki-paths__lead { max-width: 60ch; margin: calc(var(--space-5) * -1) 0 var(--space-7); margin-left: calc(5 / 12 * 100% + var(--space-5)); color: var(--color-muted-blue); }
.poradniki-paths__list { display: flex; width: min(100%, 62.5rem); flex-direction: column; gap: var(--space-5); }
.poradniki-path { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-6); border: var(--border-dark); border-left-width: 4px; border-radius: var(--radius-card); background: var(--color-ink-blue); }
.poradniki-path > * { margin: 0; }
.poradniki-path h3 { font-size: var(--font-size-24); }
.poradniki-path p { max-width: 54ch; color: var(--color-muted-blue); }
.poradniki-path a { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--space-2); font-family: var(--font-heading); font-size: var(--font-size-14); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.poradniki-path--characters { border-left-color: var(--color-pixel-turquoise); }
.poradniki-path--worlds { border-left-color: var(--color-lavender-purple); }
.poradniki-path--challenges { border-left-color: var(--color-coral-orange); }
.poradniki-section-intro--modes { max-width: 60ch; margin-bottom: var(--space-7); }
.poradniki-section-intro--modes p { max-width: 60ch; }
.poradniki-modes__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.poradniki-mode { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-6); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); }
.poradniki-mode > * { margin: 0; }
.poradniki-mode h3 { font-size: var(--font-size-24); }
.poradniki-mode p, .poradniki-mode ul { max-width: 40ch; }
.poradniki-mode--multi { border-top: 4px solid var(--color-lavender-purple); }
.poradniki-mode--offline { border-top: 4px solid var(--color-pixel-turquoise); }
.poradniki-section-intro--plan { max-width: 60ch; margin-bottom: var(--space-7); }
.poradniki-section-intro--plan p { max-width: 60ch; color: var(--color-muted-blue); }
.poradniki-plan__steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-4); position: relative; }
.poradniki-plan__steps::before { position: absolute; z-index: 0; top: 2rem; right: 10%; left: 10%; height: 2px; background: repeating-linear-gradient(90deg, var(--color-pixel-line) 0 10px, transparent 10px 18px); content: ""; }
.poradniki-step { position: relative; z-index: 1; display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-5); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); }
.poradniki-step > * { margin: 0; }
.poradniki-step > span { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; background: var(--color-deep-navy); color: var(--color-neon-lime); font-family: var(--font-heading); font-weight: 800; }
.poradniki-step h3 { font-size: var(--font-size-18); margin-bottom: var(--space-2); }
.poradniki-step p { max-width: 32ch; margin: 0; color: var(--color-muted-blue); font-size: var(--font-size-14); }
.poradniki-step--goal { border-color: var(--color-neon-lime); }
.poradniki-step--goal > span { background: var(--color-neon-lime); color: var(--color-night-navy); }
.poradniki-section-intro--assumptions { margin-bottom: var(--space-7); }
.poradniki-assumptions__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.poradniki-assumption { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-5); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); }
.poradniki-assumption > * { margin: 0; }
.poradniki-assumption h3 { font-size: var(--font-size-24); }
.poradniki-assumption p { max-width: 44ch; color: var(--color-muted-blue); }
.poradniki-assumption__instead, .poradniki-assumption__try { font-family: var(--font-heading); font-size: var(--font-size-12); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.poradniki-assumption__instead { color: var(--color-coral-orange); }
.poradniki-assumption__try { color: var(--color-pixel-turquoise); }
.poradniki-section-intro--next { max-width: 60ch; margin-bottom: var(--space-7); }
.poradniki-section-intro--next p { max-width: 56ch; color: var(--color-muted-blue); }
.poradniki-next__list { display: flex; width: min(100%, 67.5rem); flex-direction: column; gap: var(--space-4); }
.poradniki-next-link { display: grid; grid-template-columns: minmax(3rem, 1fr) minmax(0, 6fr) minmax(9rem, 2fr); gap: var(--space-5); align-items: center; min-width: 0; padding: var(--space-5); border: var(--border-dark); border-left-width: 4px; border-radius: var(--radius-card); background: var(--color-ink-blue); color: var(--color-paper-light); text-decoration: none; transition: transform var(--transition-fast), box-shadow var(--transition-fast); }
.poradniki-next-link:hover { transform: translateX(4px); box-shadow: var(--shadow-block); color: var(--color-paper-light); }
.poradniki-next-link--lime { border-left-color: var(--color-neon-lime); }
.poradniki-next-link--turquoise { border-left-color: var(--color-pixel-turquoise); }
.poradniki-next-link--coral { border-left-color: var(--color-coral-orange); }
.poradniki-next-link__number { color: var(--color-muted-blue); font-family: var(--font-heading); font-size: var(--font-size-32); font-weight: 800; }
.poradniki-next-link__content { display: flex; min-width: 0; flex-direction: column; gap: var(--space-2); }
.poradniki-next-link__content strong { font-family: var(--font-heading); font-size: var(--font-size-24); }
.poradniki-next-link__content > span { max-width: 44ch; color: var(--color-muted-blue); }
.poradniki-next-link__cta { display: inline-flex; min-width: 0; align-items: center; gap: var(--space-2); font-family: var(--font-heading); font-size: var(--font-size-14); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.poradniki-note { padding-top: 0; background: var(--color-night-navy); }
.poradniki-note__panel { display: grid; width: min(100%, 50rem); grid-template-columns: 2rem minmax(0, 1fr); gap: var(--space-4); padding: var(--space-5); border: var(--border-dark); border-radius: var(--radius-card); background: var(--color-ink-blue); }
.poradniki-note__panel svg { width: 2rem; color: var(--color-pixel-turquoise); }
.poradniki-note__panel div { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.poradniki-note__panel div > * { margin: 0; }
.poradniki-note__panel h2 { font-size: var(--font-size-24); }
.poradniki-note__panel p { max-width: 68ch; color: var(--color-muted-blue); }
@media (max-width: 62.5rem) { .poradniki-plan__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } .poradniki-plan__steps::before { display: none; } }
@media (max-width: 56.25rem) { .poradniki-hero__grid { grid-template-columns: 1fr; } .poradniki-hero__visual { order: 2; } .poradniki-rhythm__panel { grid-template-columns: 1fr; } .poradniki-rhythm__index { display: none; } .poradniki-rhythm__landscape { display: none; } .poradniki-scenario { grid-template-columns: 1fr; gap: var(--space-4); } .poradniki-scenario__label { flex-direction: row; align-items: center; } .poradniki-scenario__motif { justify-content: flex-start; min-height: 1.5rem; } .poradniki-scenario__motif i { width: 4rem; height: .75rem; } .poradniki-scenario--water .poradniki-scenario__motif i { height: .75rem; } .poradniki-scenario--pressure .poradniki-scenario__motif i:nth-child(2) { height: .75rem; } .poradniki-paths__heading { grid-template-columns: 1fr; gap: var(--space-4); } .poradniki-paths__heading h2 { grid-column: auto; } .poradniki-paths__lead { margin: var(--space-5) 0 var(--space-7); } .poradniki-paths__list { width: 100%; } }
@media (max-width: 52.5rem) { .poradniki-goals__grid, .poradniki-assumptions__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 53.75rem) { .poradniki-next-link { grid-template-columns: minmax(3rem, 1fr) minmax(0, 7fr); } .poradniki-next-link__cta { grid-column: 2; } }
@media (max-width: 47.5rem) { .poradniki-modes__grid { grid-template-columns: 1fr; } }
@media (max-width: 40rem) { .poradniki-page .container { width: min(100% - 2rem, var(--container-max)); } .poradniki-hero { padding-top: var(--space-7); } .poradniki-hero__actions { width: 100%; flex-direction: column; align-items: stretch; } .poradniki-hero__actions .button, .poradniki-hero__actions .poradniki-text-link { width: 100%; } .poradniki-goals__grid, .poradniki-assumptions__grid, .poradniki-plan__steps { grid-template-columns: 1fr; } .poradniki-goal-card, .poradniki-mode, .poradniki-scenario, .poradniki-path, .poradniki-assumption { padding: var(--space-5); } .poradniki-rule { grid-template-columns: 1fr; gap: var(--space-2); } .poradniki-rule__number { font-size: var(--font-size-24); } .poradniki-step { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); } .poradniki-next-link { grid-template-columns: 1fr; gap: var(--space-3); } .poradniki-next-link__cta { grid-column: auto; min-height: 2.75rem; } .poradniki-note__panel { grid-template-columns: 1.5rem minmax(0, 1fr); padding: var(--space-4); } .poradniki-note__panel svg { width: 1.5rem; } }
@media (prefers-reduced-motion: reduce) { .poradniki-goal-card:hover, .poradniki-next-link:hover { transform: none; } }
