@layer legacy, reset, tokens, base, layout, components, utilities;
@layer legacy {
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
p, .body-lead {
  text-wrap: pretty;
}
.body-lead {
  font-size: var(--text-lg);
  line-height: var(--leading-relaxed);
  color: var(--color-text-secondary);
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-6);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 500;
  letter-spacing: -0.005em;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color var(--duration-fast) var(--ease-out),
              border-color var(--duration-fast) var(--ease-out),
              color var(--duration-fast) var(--ease-out);
  text-decoration: none;
}
.btn-primary {
  background: var(--color-accent);
  color: var(--color-on-accent);
  border-color: var(--color-accent);
}
.link-inline {
  color: var(--color-text-primary);
  text-decoration: none;
  border-bottom: 1px solid var(--color-border-subtle);
  transition: border-color var(--duration-fast) var(--ease-out);
}
[data-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--duration-slow) var(--ease-out),
              transform var(--duration-slow) var(--ease-out);
  will-change: opacity, transform;
}
.kinetic {
  transform: translateY(14px);
  opacity: 0;
  transition: opacity var(--duration-slow) var(--ease-out),
              transform var(--duration-slow) var(--ease-out),
              font-variation-settings var(--duration-slow) var(--ease-out);
  will-change: transform, opacity, font-variation-settings;
}
}
@layer tokens {
:root {
  --p-czern-1:   #0A0908;   
  --p-czern-2:   #131110;   
  --p-czern-3:   #14110E;   
  --p-czern-4:   #1B1713;   
  --p-czern-5:   #1C1917;   
  --p-czern-6:   #221E1A;   
  --p-czern-7:   #292524;   
  --p-krem:      #F7F3EC;
  --p-kamien-3:  #A8A29E;
  --p-kamien-5:  #86817B;   
  --p-papier:    #FAF8F4;
  --p-bialy:     #FFFFFF;
  --p-papier-2:  #F3EFE8;
  --p-papier-3:  #E7E0D5;
  --p-papier-4:  #D6CCBD;
  --p-atrament:  #1A1814;
  --p-kamien-7:  #5A5248;
  --p-kamien-6:  #6F6760;
  --p-bursztyn:          #D4A574;
  --p-bursztyn-jasny:    #EBC89A;   
  --p-bursztyn-ciemny:   #8D6335;   
  --p-bursztyn-hover:    #A58059;   
  --p-bursztyn-a06:      rgba(212, 165, 116, 0.06);
  --p-bursztyn-a08:      rgba(212, 165, 116, 0.08);
  --p-bursztyn-a09:      rgba(212, 165, 116, 0.09);
  --p-bursztyn-a14:      rgba(212, 165, 116, 0.14);
  --p-bursztyn-a16:      rgba(212, 165, 116, 0.16);
  --p-bursztyn-a38:      rgba(212, 165, 116, 0.38);
  --p-bursztyn-hover-a22: rgba(165, 128, 89, 0.22);  
  --p-bursztyn-hover-a55: rgba(165, 128, 89, 0.55);
  --p-czerwien:          #E85D4F;
  --p-czerwien-ciemna:   #C13E24;   
  --p-szalwia:           #7FA074;
  --p-szalwia-ciemna:    #557449;   
  --p-atrament-wydruku:  #1A1714;
  --p-atrament-wydruku-a72: rgba(26, 23, 20, 0.72);
  --p-atrament-wydruku-a62: rgba(26, 23, 20, 0.62);
  --p-atrament-wydruku-a16: rgba(26, 23, 20, 0.16);
  --p-atrament-wydruku-a14: rgba(26, 23, 20, 0.14);
}
:root,
html[data-theme="dark"] {
  color-scheme: dark;
  --color-bg:              var(--p-czern-1);
  --color-bg-raised:       var(--p-czern-2);
  --color-surface:         var(--p-czern-3);
  --color-surface-2:       var(--p-czern-4);
  --color-bg-secondary:    var(--color-surface);   
  --color-border:          var(--p-czern-5);
  --color-line:            var(--p-czern-6);
  --color-border-subtle:   var(--p-czern-7);
  --color-line-strong:     var(--color-border-subtle);   
  --color-text-primary:    var(--p-krem);
  --color-text-secondary:  var(--p-kamien-3);
  --color-text-tertiary:   var(--p-kamien-5);
  --color-accent:          var(--p-bursztyn);
  --color-accent-hover:    var(--p-bursztyn-hover);
  --color-accent-dim:      var(--color-accent-hover);   
  --color-accent-text:     var(--p-bursztyn-jasny);
  --color-focus:           var(--p-bursztyn);          
  --color-on-accent:       var(--p-atrament);
  --color-accent-faint:    var(--p-bursztyn-a08);
  --color-accent-wash:     var(--p-bursztyn-a06);
  --color-line-amber:      var(--p-bursztyn-a16);
  --color-line-amber-hi:   var(--p-bursztyn-a38);
  --color-signal:          var(--p-czerwien);    
  --color-success:         var(--p-szalwia);
}
html[data-theme="light"] {
  color-scheme: light;
  --color-bg:              var(--p-papier);
  --color-bg-raised:       var(--p-bialy);
  --color-surface:         var(--p-bialy);
  --color-surface-2:       var(--p-papier-2);
  --color-bg-secondary:    var(--color-surface);
  --color-border:          var(--p-papier-3);
  --color-line:            var(--p-papier-3);
  --color-border-subtle:   var(--p-papier-4);
  --color-line-strong:     var(--color-border-subtle);
  --color-text-primary:    var(--p-atrament);
  --color-text-secondary:  var(--p-kamien-7);
  --color-text-tertiary:   var(--p-kamien-6);
  --color-accent:          var(--p-bursztyn);
  --color-accent-hover:    var(--p-bursztyn-hover);
  --color-accent-dim:      var(--color-accent-hover);
  --color-accent-text:     var(--p-bursztyn-ciemny);
  --color-focus:           var(--p-bursztyn-ciemny);   
  --color-accent-faint:    var(--p-bursztyn-a14);
  --color-accent-wash:     var(--p-bursztyn-a09);
  --color-line-amber:      var(--p-bursztyn-hover-a22);
  --color-line-amber-hi:   var(--p-bursztyn-hover-a55);
  --color-signal:          var(--p-czerwien-ciemna);
  --color-success:         var(--p-szalwia-ciemna);
}
:root {
  --font-display: 'Fraunces', 'Times New Roman', serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono:    'Geist Mono', 'JetBrains Mono', ui-monospace, Consolas, monospace;
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   19px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  42px;
  --text-4xl:  56px;
  --text-5xl:  72px;   
  --text-6xl:  96px;
  --text-display: clamp(4rem, 10vw, 9rem);  
  --leading-tight:  1.1;
  --leading-snug:   1.3;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;
  --tracking-tight: -0.03em;   
  --tracking-snug:  -0.015em;  
  --tracking-normal: 0;
  --tracking-wide:  0.05em;    
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-48: 192px;
  --radius-sm: 4px;   
  --radius-md: 8px;   
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(255, 255, 255, 0.02) inset;
  --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.35), 0 10px 24px rgba(0, 0, 0, 0.45), 0 1px 0 rgba(255, 255, 255, 0.03) inset;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-med:  320ms;
  --duration-slow: 520ms;
  --container-narrow: 680px;
  --container-med:    960px;
  --container-wide:   1200px;
  --radius-badge: 4px;
  --radius-ctl:   8px;
  --radius-card:  12px;
  --section-y:    clamp(76px, 8.2vw, 124px);
  --nav-h:        64px;
  --ease-std: cubic-bezier(0.4, 0, 0.2, 1);
}
}
@layer base {
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0.04;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay;
}
html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-optical-sizing: auto;
}
body {
  background: var(--color-bg);
  color: var(--color-text-primary);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  font-feature-settings: 'cv01', 'ss03', 'zero';
  overflow-x: hidden;
}
.display-h1 {
  font-family: var(--font-display);
  font-size: var(--text-display);
  font-weight: 400;
  font-variation-settings: 'opsz' 144, 'SOFT' 50, 'wght' 400;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--color-text-primary);
}
.display-h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 4.5rem);
  font-weight: 500;
  font-variation-settings: 'opsz' 72, 'SOFT' 30, 'wght' 500;
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-snug);
  color: var(--color-text-primary);
}
.chapter-marker {
  font-family: var(--font-display);
  font-size: var(--text-sm);
  font-weight: 600;
  font-variation-settings: 'opsz' 24, 'SOFT' 0, 'wght' 600;
  line-height: 1;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-accent-text);
}
.meta-mono {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--color-text-secondary);
}
.btn-primary:hover {
  background: var(--color-accent-dim);
  border-color: var(--color-accent-dim);
}
.btn-secondary {
  background: transparent;
  color: var(--color-text-primary);
  border-color: var(--color-border-subtle);
}
.btn-secondary:hover {
  border-color: var(--color-text-secondary);
  background: var(--color-bg-raised);
}
.link-inline:hover {
  border-color: var(--color-accent);
}
.artifact-card {
  background: var(--color-bg-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
  transition: border-color var(--duration-med) var(--ease-out);
}
.artifact-card:hover {
  border-color: var(--color-border-subtle);
}
.artifact-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-4);
}
.artifact-meta {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.artifact-body {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.7;
  color: var(--color-text-primary);
  white-space: pre-wrap;
}
.artifact-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--color-text-secondary);
  letter-spacing: 0.02em;
}
.status-sent {
  color: var(--color-success);
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}
.status-sent::before {
  content: '●';
  font-size: 8px;
  line-height: 1;
}
[data-reveal].is-in {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal][data-seq] { transition-delay: calc(var(--seq, 0) * 80ms); }
.kinetic.display-h1 { font-variation-settings: 'opsz' 72, 'SOFT' 50, 'wght' 280; }
.kinetic.display-h2 { font-variation-settings: 'opsz' 48, 'SOFT' 30, 'wght' 340; }
.kinetic.is-in { opacity: 1; transform: translateY(0); }
.kinetic.display-h1.is-in { font-variation-settings: 'opsz' 144, 'SOFT' 50, 'wght' 400; }
.kinetic.display-h2.is-in { font-variation-settings: 'opsz' 72, 'SOFT' 30, 'wght' 500; }
.kinetic em, .kinetic.is-in em { font-variation-settings: 'opsz' 72, 'SOFT' 50, 'wght' 500; }
.chapter-marker.kinetic-marker { display: inline-flex; align-items: center; gap: var(--space-3); }
.chapter-marker.kinetic-marker::before {
  content: '';
  display: inline-block;
  width: 0;
  height: 1px;
  background: var(--color-accent);
  transition: width var(--duration-slow) var(--ease-out);
}
.chapter-marker.kinetic-marker.is-in::before,
[data-reveal].is-in .chapter-marker.kinetic-marker::before { width: 28px; }
.btn .arrow,
.btn [aria-hidden="true"] { display: inline-block; transition: transform var(--duration-fast) var(--ease-out); }
.btn:hover .arrow,
.btn:hover [aria-hidden="true"] { transform: translateX(3px); }
.console {
  background: var(--color-bg-raised);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.console-titlebar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-accent-faint);
}
.console-dots { display: flex; gap: 6px; }
.console-dots span {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--color-border-subtle);
}
.console-title {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  color: var(--color-text-secondary);
}
.console-live {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-success);
}
.console-live .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--color-success);
  animation: consolePulse 1.8s var(--ease-in-out) infinite;
}
@keyframes consolePulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
.console-body {
  padding: var(--space-5);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  line-height: 1.75;
}
.console-log {
  display: flex;
  gap: var(--space-3);
  align-items: baseline;
  opacity: 0;
  transform: translateY(4px);
  animation: consoleLogIn var(--duration-med) var(--ease-out) forwards;
}
.console-log .ts { color: var(--color-text-tertiary); flex: 0 0 auto; }
.console-log .tag { flex: 0 0 auto; color: var(--color-accent-text); letter-spacing: 0.04em; }
.console-log .msg { color: var(--color-text-secondary); }
.console-log .msg strong { color: var(--color-text-primary); font-weight: 500; }
.console-log.ok .tag { color: var(--color-success); }
.console-log:nth-child(1) { animation-delay: 0.20s; }
.console-log:nth-child(2) { animation-delay: 0.70s; }
.console-log:nth-child(3) { animation-delay: 1.20s; }
.console-log:nth-child(4) { animation-delay: 2.10s; }
@keyframes consoleLogIn { to { opacity: 1; transform: translateY(0); } }
.console-draft {
  margin-top: var(--space-4);
  padding: var(--space-4);
  border-left: 2px solid var(--color-accent);
  background: var(--color-accent-faint);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  color: var(--color-text-primary);
  white-space: pre-line;
}
.console-draft .stream-caret {
  display: inline-block;
  width: 8px;
  height: 1.05em;
  vertical-align: -2px;
  margin-left: 2px;
  background: var(--color-accent);
  animation: consoleCaret 1s steps(1) infinite;
}
@keyframes consoleCaret { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
.console-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--color-text-tertiary);
  letter-spacing: 0.03em;
}
.bento {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--space-4);
}
.bento-item {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: border-color var(--duration-med) var(--ease-out),
              box-shadow var(--duration-med) var(--ease-out);
}
.bento-item:hover {
  border-color: var(--color-border-subtle);
  box-shadow: var(--shadow-md);
}
.bento-item.bento-lead {
  background: linear-gradient(180deg, var(--color-accent-faint), transparent 60%), var(--color-bg-raised);
}
.bento-span-2 { grid-column: span 2; }
.bento-span-3 { grid-column: span 3; }
.bento-span-4 { grid-column: span 4; }
.bento-span-6 { grid-column: span 6; }
@media (max-width: 860px) {
  .bento { grid-template-columns: repeat(2, 1fr); }
  .bento-span-2, .bento-span-3, .bento-span-4, .bento-span-6 { grid-column: span 2; }
}
@media (max-width: 560px) {
  .bento { grid-template-columns: 1fr; }
  .bento-span-2, .bento-span-3, .bento-span-4, .bento-span-6 { grid-column: span 1; }
}
.hero-split {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: var(--space-12);
  align-items: start;
}
.hero-split-aside { align-self: start; position: sticky; top: var(--space-8); }
@media (max-width: 920px) {
  .hero-split { grid-template-columns: 1fr; gap: var(--space-12); }
  .hero-split-aside { position: static; order: 2; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .kinetic { opacity: 1 !important; transform: none !important; }
  .kinetic.display-h1 { font-variation-settings: 'opsz' 144, 'SOFT' 50, 'wght' 400 !important; }
  .kinetic em { font-variation-settings: 'opsz' 72, 'SOFT' 50, 'wght' 500 !important; }
  .chapter-marker.kinetic-marker::before { width: 28px !important; }
  .console-log { opacity: 1 !important; transform: none !important; animation: none !important; }
  .console-live .dot { animation: none !important; }
  .console-draft .stream-caret { animation: none !important; opacity: 1 !important; }
  .btn:hover .arrow, .btn:hover [aria-hidden="true"] { transform: none !important; }
}
.pricing-grid{grid-template-columns:repeat(4,1fr);}
@media (max-width:640px){.pricing-grid{grid-template-columns:repeat(2,1fr);} .hero-pricing-strip{padding-left:var(--space-4)!important;padding-right:var(--space-4)!important;}}
}
@layer components {
h1, h2, h3, h4, h5, h6,
.display-h1, .display-h2, .chapter-marker {
  text-wrap: balance;
}
@media (prefers-reduced-motion: reduce) {
  .kinetic.display-h2 { font-variation-settings: 'opsz' 72, 'SOFT' 30, 'wght' 500 !important; }}
html[data-theme="light"] body::before { opacity: 0.028; }
html[data-theme="light"] .display-h2 em,
html[data-theme="light"] .section-headline em,
html[data-theme="light"] .chapter-marker,
html[data-theme="light"] .brand-accent,
html[data-theme="light"] .kwalifikator-cta,
html[data-theme="light"] .polka-cena { color: var(--color-accent-text); }
html[data-theme="light"] .btn-primary { color: var(--color-on-accent); }
html[data-theme="light"] .btn-primary:hover { background: var(--color-accent-dim); border-color: var(--color-accent-dim); }
body { font-feature-settings: 'cv01', 'ss03', 'zero', 'kern', 'liga'; }
h1.display-h2, .hero .display-h2 {
  font-size: clamp(2.5rem, 5.2vw, 4.4rem);
  line-height: 1.04;
  letter-spacing: -0.028em;
}
.display-h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1.12; letter-spacing: -0.02em; }
.section-body { padding-bottom: var(--section-y); }
.section-headline { margin-bottom: var(--space-5); }
.section-lead { margin-bottom: var(--space-10); }
.section-headline em, .display-h2 em { color: var(--color-accent-text); }
h1 em, h1 i { font-style: normal; }
.section p { max-width: 68ch; }
.hero p, .section table p, .pricing-table p { max-width: none; }
.cn-card-price,
.pricing-table,
.pricing-table td,
.pricing-table th,
.polka-cena {
  font-variant-numeric: tabular-nums;
}
.breadcrumb-strona {
  max-width: var(--container-wide, 1180px);
  margin: 0 auto;
  padding: var(--space-4, 12px) var(--space-6, 24px) 0;
  font-size: 0.8125rem;
  color: var(--color-text-tertiary);
}
.breadcrumb-strona a { color: var(--color-accent-text); text-decoration: none; }
.breadcrumb-strona a:hover, .breadcrumb-strona a:focus-visible { text-decoration: underline; }
.navbar,
body > .navbar {
  position: sticky;
  top: 0;
  z-index: 50;
  padding: 0 var(--space-6);
  border-bottom: 1px solid var(--color-line);
  background: var(--color-bg);
}
.navbar-inner,
body > .navbar .navbar-inner {
  display: flex;              
  grid-template-areas: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  max-width: var(--container-wide);
  min-height: var(--nav-h);
  margin: 0 auto;
}
.navbar .brand, body > .navbar .brand {
  font-family: var(--font-display);
  font-variation-settings: 'opsz' 24, 'SOFT' 0, 'wght' 600;
  font-size: 1.125rem;
  letter-spacing: -0.012em;
  color: var(--color-text-primary);
  text-decoration: none;
  white-space: nowrap;
}
.navbar .brand-accent { color: var(--color-accent-text); }
.navbar .nav-links, body > .navbar .nav-links {
  display: flex;
  gap: var(--space-1);
  margin: 0 auto;
  padding: 0;
  list-style: none;
  font-family: var(--font-body);
  font-size: 0.9rem;
  letter-spacing: 0;
  text-transform: none;
  justify-self: center;
}
.navbar .nav-links a {
  display: inline-block;
  padding: 6px 10px;
  border-radius: var(--radius-ctl);
  color: var(--color-text-secondary);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-std), background var(--duration-fast) var(--ease-std);
}
.navbar .nav-links a:hover,
.navbar .nav-links a:focus-visible,
.navbar .nav-links a[aria-current="page"] { color: var(--color-text-primary); background: var(--color-surface-2); }
.nav-actions { display: flex; align-items: center; gap: var(--space-3); flex: 0 0 auto; }
.nav-mode-slot, body > .navbar .nav-mode-slot { display: none; }   
.nav-mode-link {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  text-decoration: none;
  padding: 6px 8px;
  border-radius: var(--radius-ctl);
  white-space: nowrap;
}
.nav-mode-link:hover { color: var(--color-text-primary); background: var(--color-surface-2); }
.navbar .btn-primary, body > .navbar .btn-primary {
  padding: 9px 14px;
  font-size: 0.9rem;
  border-radius: var(--radius-ctl);
  white-space: nowrap;
}
.navbar .hamburger-toggle { display: none; }
@media (max-width: 899px) {
  .navbar, body > .navbar { padding: 0 var(--space-4); }
  .navbar .nav-links, body > .navbar .nav-links { display: none; }
  .nav-mode-link { display: none; }
  .navbar .hamburger-toggle { display: inline-flex; }
  .navbar-inner, body > .navbar .navbar-inner { min-height: 56px; gap: var(--space-3); }
}
.navbar .hamburger-toggle {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 44px;
  height: 44px;
  padding: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.navbar .hamburger-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--color-text-primary);
}
.mobile-menu-overlay[hidden] { display: none; }
.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.95);
  z-index: 1000;
  padding: var(--space-6);
  padding-top: calc(var(--space-6) + env(safe-area-inset-top, 0));
  padding-bottom: calc(var(--space-6) + env(safe-area-inset-bottom, 0));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.mobile-menu-close {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
  width: 44px;
  height: 44px;
  background: transparent;
  border: 0;
  color: white;
  font-size: 32px;
  cursor: pointer;
  line-height: 1;
}
.mobile-menu-nav ul { list-style: none; padding: 0; margin: var(--space-12) 0 0; }
.mobile-menu-nav li { margin-bottom: var(--space-4); }
.mobile-menu-nav a {
  color: white;
  text-decoration: none;
  font-size: 20px;
  display: block;
  padding: var(--space-3) 0;
  min-height: 44px;
  font-family: var(--font-body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
@media (min-width: 900px) and (max-width: 1100px) {
  .navbar .nav-links a { padding: 6px 7px; font-size: 0.85rem; }
  .nav-mode-link { display: none; }
}
.btn { border-radius: var(--radius-ctl); min-height: 44px; font-weight: 500; }
.btn-secondary { border-color: var(--color-line-amber); }
.btn-secondary:hover { border-color: var(--color-line-amber-hi); background: var(--color-accent-wash); }
.btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.dowod-item, .kwalifikator-kafel, .polka-pozycja, .pricing-card,
.artifact-card, .bento-item, .zespol-blok, .wydruk, .hero-founder-card {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  box-shadow: none;
  transition: border-color var(--duration-med) var(--ease-std), background var(--duration-med) var(--ease-std);
}
.dowod-item:hover, .kwalifikator-kafel:hover, .polka-pozycja:hover, .bento-item:hover {
  border-color: var(--color-line-amber);
  transform: none;
}
.kwalifikator-kafel:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.zespol-blok { border-left: 1px solid var(--color-line); padding: var(--space-8); }
.zespol-blok::before {
  content: ''; display: block; width: 40px; height: 2px; background: var(--color-accent); margin-bottom: var(--space-5); border-radius: 2px;
}
.polka-slot { background: transparent; border-style: dashed; border-color: var(--color-border-subtle); }
@media (min-width: 900px) {
  .dowod-grid { grid-template-columns: repeat(6, 1fr); gap: var(--space-5); }
  .dowod-grid > .dowod-item { grid-column: span 3; }
  .dowod-grid > .dowod-item:first-child { grid-column: span 4; }
  .dowod-grid > .dowod-item:nth-child(2) { grid-column: span 2; }
  .kwalifikator-grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
}
.hero { padding-top: clamp(40px, 6vw, 88px); padding-bottom: var(--section-y); }
.hero-split { gap: clamp(32px, 5vw, 80px); align-items: center; }
.hero-split-aside figure.hero-founder-card { padding: var(--space-4); }
.hero-founder-card picture img, .hero-founder-card img { border-radius: calc(var(--radius-card) - 4px); }
.hero-sublead { font-size: 1.125rem; line-height: 1.6; color: var(--color-text-secondary); max-width: 58ch; }
.hero-price { font-size: clamp(1.35rem, 2vw, 1.75rem) !important; }
.cta-note { color: var(--color-text-tertiary); }
.hero-przeglad-dnia .wydruk { padding: var(--space-6) var(--space-7, 28px); }
.wydruk-header { border-bottom: 1px solid var(--color-line); }
.drabina-grid { gap: var(--space-5); }
.pricing-card { padding: var(--space-8) var(--space-7, 28px); gap: var(--space-5); overflow: hidden; }
.drabina-karta-wyrozniona {
  border-color: var(--color-line-amber-hi);
  box-shadow: none;
  background: linear-gradient(180deg, var(--color-accent-wash), transparent 45%), var(--color-surface);
  position: relative;
}
.drabina-karta-wyrozniona::before {
  content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--color-accent);
}
.pricing-tier { color: var(--color-accent-text); letter-spacing: 0.08em; }
.pricing-price { font-size: clamp(2.25rem, 3.4vw, 3.25rem); }
.drabina-opis { font-size: 0.975rem; }
.drabina-mikrotekst { color: var(--color-text-tertiary); }
.wa0-wrap { border: 1px solid var(--color-line); border-radius: var(--radius-card); overflow: hidden; background: var(--color-surface); }
.wa0-table th, .wa0-table td { padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-line); }
.wa0-table tbody tr:last-child td, .wa0-table tbody tr:last-child th { border-bottom: 0; }
.wa0-table .wa0-nasza { background: var(--color-accent-wash); }
@media (max-width: 720px) { .wa0-wrap { border: 0; background: transparent; } .wa0-table tr { border-radius: var(--radius-card); background: var(--color-surface); border-color: var(--color-line) !important; } }
.faq-list { max-width: 760px; }
details.faq-item { border-bottom: 1px solid var(--color-line) !important; }
.faq-summary { padding: var(--space-2) 0; }
.faq-plus { color: var(--color-accent-text); font-family: var(--font-mono); transition: transform var(--duration-fast) var(--ease-std); }
#zamkniecie { text-align: center; }
#zamkniecie .section-headline, #zamkniecie .section-lead { margin-left: auto; margin-right: auto; }
.site-footer { border-top: 1px solid var(--color-line); margin-top: 0; padding: var(--space-16) var(--space-6) var(--space-10); background: var(--color-surface); }
.footer-inner-cols { display: grid; grid-template-columns: 1fr; gap: var(--space-10); max-width: var(--container-wide); margin: 0 auto; }
.footer-cols { display: grid; grid-template-columns: 1fr; gap: var(--space-6); width: 100%; }
.footer-claim { margin: var(--space-3) 0 0; max-width: 46ch; font-size: var(--text-sm); line-height: 1.6; color: var(--color-text-secondary); }
.footer-col-h { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.06em; text-transform: uppercase; margin: 0 0 var(--space-3); font-weight: 400; }
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.footer-col a { font-size: var(--text-sm); }
.footer-legal { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; }
.footer-legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (min-width: 900px) {
  .footer-inner-cols { grid-template-columns: 1.4fr 2fr; }
  .footer-legal { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: baseline; }
  .footer-cols { grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
}
.footer-brandline .brand { font-family: var(--font-display); font-size: 1.25rem; font-variation-settings: 'opsz' 24, 'SOFT' 0, 'wght' 600; color: var(--color-text-primary); text-decoration: none; }
.footer-brandline .brand-accent { color: var(--color-accent-text); }
.footer-col-h { color: var(--color-text-tertiary); }
.footer-col a { text-decoration: none; color: var(--color-text-secondary); }
.footer-col a:hover { color: var(--color-text-primary); text-decoration: underline; text-underline-offset: 3px; }
.footer-legal { border-top: 1px solid var(--color-line); padding-top: var(--space-6); }
.footer-year { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.08em; color: var(--color-text-tertiary); }
.kinetic:not(.display-h1):not(h1) { transition-property: opacity, transform; }
.hero-split {
  position: relative;
  isolation: isolate;
  --kadr-1x: url("/assets/warsztat-noc-1600.webp");
  --kadr-2x: url("/assets/warsztat-noc-2400.webp");
}
html[data-theme="light"] .hero-split {
  --kadr-1x: url("/assets/warsztat-dzien-1600.webp");
  --kadr-2x: url("/assets/warsztat-dzien-2400.webp");
}
.hero-split::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  top: calc(-1 * (var(--nav-h, 64px) + clamp(28px, 3.4vw, 48px)));
  bottom: calc(-1 * var(--space-10, 64px));
  background:
    linear-gradient(180deg,
      rgba(10, 9, 8, 0.42) 0%,
      rgba(10, 9, 8, 0.50) 26%,
      rgba(10, 9, 8, 0.72) 58%,
      rgba(10, 9, 8, 0.94) 74%,
      var(--color-bg) 86%) 0 0 / 100% 100% no-repeat,
    image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
      center 54% / cover no-repeat;
  filter: saturate(0.70) contrast(1.06);
  pointer-events: none;
}
html[data-theme="light"] .hero-split::before {
  background:
    linear-gradient(180deg,
      rgba(250, 248, 244, 0.52) 0%,
      rgba(250, 248, 244, 0.62) 24%,
      rgba(250, 248, 244, 0.82) 54%,
      rgba(250, 248, 244, 0.96) 72%,
      var(--color-bg) 84%) 0 0 / 100% 100% no-repeat,
    image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
      center 54% / cover no-repeat;
  filter: saturate(0.74) contrast(1.02);
}
@media (max-width: 760px) {
  .hero-split::before {
    background:
      linear-gradient(180deg,
        rgba(10, 9, 8, 0.50) 0%,
        rgba(10, 9, 8, 0.78) 14%,
        var(--color-bg) 22%) 0 0 / 100% 100% no-repeat,
      image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
        center 46% / cover no-repeat;
  }
  html[data-theme="light"] .hero-split::before {
    background:
      linear-gradient(180deg,
        rgba(250, 248, 244, 0.58) 0%,
        rgba(250, 248, 244, 0.86) 12%,
        var(--color-bg) 20%) 0 0 / 100% 100% no-repeat,
      image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
        center 46% / cover no-repeat;
  }
}
@media (min-width: 900px) {
  .hero { padding-top: clamp(20px, 2.6vw, 36px); }
  .hero-split {
    margin-bottom: var(--space-6);
    align-items: start;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
    gap: clamp(24px, 3.4vw, 56px);
  }
  .hero-split-aside img,
  .hero-founder-card picture img,
  .hero-founder-card img { max-height: 320px; width: 100%; object-fit: cover; }
}
.klisza-lekki  { filter: saturate(0.88) contrast(1.06) brightness(0.96) sepia(0.10); }
.klisza-sredni { filter: saturate(0.60) contrast(1.13) brightness(0.85) sepia(0.30) hue-rotate(-6deg); }
.hero-split-aside img,
.hero-founder-card img,
.hero-founder-card picture img {
  filter: saturate(0.88) contrast(1.06) brightness(0.96) sepia(0.10);
}
html[data-theme="light"] .hero-split-aside img,
html[data-theme="light"] .hero-founder-card img,
html[data-theme="light"] .hero-founder-card picture img,
html[data-theme="light"] .klisza-lekki {
  filter: saturate(0.90) contrast(1.03) sepia(0.08);
}
html[data-theme="light"] .klisza-sredni {
  filter: saturate(0.60) contrast(1.13) brightness(0.935) sepia(0.30) hue-rotate(-6deg);
}
.kadr-filmowy {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  aspect-ratio: 2 / 1;
  background: #000;
}
.kadr-filmowy > img,
.kadr-filmowy > picture > img { width: 100%; height: 100%; object-fit: cover; }
.kadr-filmowy::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(118% 96% at 50% 44%, transparent 34%, rgba(8, 6, 4, 0.74) 100%);
}
@media (min-width: 760px) { .kadr-filmowy { aspect-ratio: 2.39 / 1; } }
.przelacznik-swiatla {
  display: inline-flex;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-sm, 4px);
  overflow: hidden;
  flex-shrink: 0;
}
.przelacznik-swiatla button {
  appearance: none;
  border: 0;
  margin: 0;
  background: transparent;
  color: var(--color-text-tertiary);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  padding: 6px 11px;
  cursor: pointer;
  line-height: 1.2;
  transition: background-color var(--duration-fast, .15s) var(--ease-out, ease),
              color var(--duration-fast, .15s) var(--ease-out, ease);
}
.przelacznik-swiatla button:hover { color: var(--color-text-primary); }
.przelacznik-swiatla button[aria-pressed="true"] {
  background: var(--color-accent);
  color: var(--color-on-accent);
}
.przelacznik-swiatla button:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
}
.przelacznik-swiatla .znak { display: none; }
@media (max-width: 1439px) {
  .przelacznik-swiatla .slowo { display: none; }
  .przelacznik-swiatla .znak { display: inline; font-size: 15px; line-height: 1; letter-spacing: 0; }
  .przelacznik-swiatla button { padding: 6px 9px; }
}
@media (max-width: 640px) {
  .navbar .przelacznik-swiatla { display: none; }
}
.mm-swiatlo { display: flex; align-items: center; gap: var(--space-3); }
.mm-swiatlo .przelacznik-swiatla .slowo { display: inline; }
.mm-swiatlo .przelacznik-swiatla .znak { display: none; }
.mm-swiatlo .przelacznik-swiatla button { padding: 9px 16px; font-size: 12px; }
@media (max-width: 480px) {
  .przelacznik-swiatla button { padding: 5px 8px; }
}
.wydruk {
  background: var(--color-bg-raised);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}
.wydruk-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-3);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: none;
}
.wydruk-label  { color: var(--color-text-primary); }
.wydruk-czas   { color: var(--color-text-tertiary); }
.wydruk-zakres {
  margin-left: auto;
  padding: 2px var(--space-2);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-sm);
  color: var(--color-text-tertiary);
  white-space: normal;
}
.wydruk-lista {
  counter-reset: wydruk;
  list-style: none;
  margin: var(--space-5) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  line-height: 1.75;
  color: var(--color-text-secondary);
}
.wydruk-lista > li {
  counter-increment: wydruk;
  position: relative;
  padding-left: 3.2ch;
}
.wydruk-lista > li::before {
  content: counter(wydruk, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 0;
  color: var(--papier-akcent);
  font-variant-numeric: tabular-nums;
}
.wydruk-lista strong {
  font-weight: 600;
  color: var(--color-text-primary);
}
.wydruk-stopka {
  margin-top: var(--space-5);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  color: var(--color-text-tertiary);
}
@media (min-width: 720px) {
  .wydruk { padding: var(--space-6) var(--space-8); }
}
[data-reveal], .kinetic {
  opacity: 1;
  transform: none;
}
@keyframes wow-wydruk-wiersz {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero-split-aside .wydruk-lista > li {
  animation: wow-wydruk-wiersz 220ms cubic-bezier(0.4, 0, 0.2, 1) both;
}
.hero-split-aside .wydruk-lista > li:nth-child(1) { animation-delay: 0ms; }
.hero-split-aside .wydruk-lista > li:nth-child(2) { animation-delay: 60ms; }
.hero-split-aside .wydruk-lista > li:nth-child(3) { animation-delay: 120ms; }
.hero-split-aside .wydruk-lista > li:nth-child(4) { animation-delay: 180ms; }
@media (prefers-reduced-motion: reduce) {
  .hero-split-aside .wydruk-lista > li {
    animation: none;
    opacity: 1;
    transform: none;
  }
}
.hero-headline h1.display-h2 {
  font-size: clamp(2.75rem, 5.6vw, 5rem);
  line-height: 1.02 !important;
  letter-spacing: -0.03em !important;
  font-variation-settings: 'opsz' 144, 'SOFT' 50, 'wght' 500 !important;
}
main p { max-width: 68ch; }
.hero-price,
.pricing-price,
.wydruk-lista,
.wydruk-czas,
.wydruk-zakres,
.wa0-table {
  font-variant-numeric: tabular-nums;
}
@media (min-width: 900px) {
  .hero { padding-top: clamp(16px, 2vw, 28px); padding-bottom: var(--space-8, 32px); }
  .hero-split { margin-bottom: var(--space-4, 16px) !important; }
  .hero-headline .display-h2 { margin-bottom: var(--space-6, 24px); }
  .hero-price { margin-top: var(--space-4, 16px) !important; }
  .cta-row { margin-top: var(--space-6, 24px) !important; }
  .hero { padding-left: 16px; padding-right: 0; }
  .hero-split {
    grid-template-columns: minmax(0, 718px) minmax(400px, 1fr);
    gap: var(--space-6, 24px);
  }
  .hero > .hero-split::before { left: calc(50% - 8px); }
  .hero-split-aside .wydruk-lista { font-size: 13px; line-height: 1.55; }
}
.hero-przeglad-dnia { margin-top: var(--space-8, 32px) !important; }
.hero-split-aside .wydruk-lista { gap: var(--space-4, 16px); }
@media (max-width: 760px) {
  .hero { padding-top: var(--space-6, 24px); padding-bottom: var(--space-6, 24px); }
  .hero-split { margin-bottom: var(--space-6, 24px) !important; gap: var(--space-6, 24px); }
  .hero-headline .display-h2 { margin-bottom: var(--space-4, 16px); }
}
.hero-split-aside .wydruk-toggle {
  display: none;
  margin-top: var(--space-4, 16px);
  padding: 0;
  background: none;
  border: 0;
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--color-accent-text, var(--color-accent));
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.hero-split-aside .wydruk-toggle:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
}
@media (max-width: 760px) {
  .hero-split-aside .wydruk-lista > li:nth-child(n + 3) { display: none; }
  .hero-split-aside .wydruk-lista.is-rozwinieta > li:nth-child(n + 3) { display: list-item; }
  .hero-split-aside .wydruk-toggle { display: inline-block; }
}
.sekcja-architekt {
  padding: var(--section-y, clamp(64px, 9vw, 128px)) var(--space-6, 24px);
}
.sekcja-architekt .hero-founder-card {
  max-width: var(--container-med, 760px);
  margin: 0 auto;
  padding: var(--space-6, 24px);
}
@media (min-width: 720px) {
  .sekcja-architekt .hero-founder-card {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: var(--space-7, 28px);
    align-items: start;
    padding: var(--space-7, 28px);
  }
  .sekcja-architekt .hero-founder-card picture {
    grid-column: 1;
  }
  .sekcja-architekt .hero-founder-card picture img {
    max-height: 220px;
    border-radius: var(--radius-card, 12px);
  }
  .sekcja-architekt .hero-founder-card figcaption {
    grid-column: 2;
  }
}
.navbar .przelacznik-swiatla button {
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.9rem;
  min-height: 44px;
  padding: 10px 14px;
}
.mm-swiatlo .przelacznik-swiatla button {
  text-transform: none;
  letter-spacing: 0;
}
#masz-gdzie-probowac .section-lead { margin-bottom: 0; }
.eyebrow, .seclabel, .kicker, .label-mono, .article-eyebrow, .sd-eyebrow,
.hero-eyebrow, .section-eyebrow, .section-head .section-eyebrow,
.przeglad-eyebrow, .hub-eyebrow, .section-label, .kinetic-marker,
.featured-flag {
  text-transform: none;
  letter-spacing: 0;
}
.cn-cta-btn,
.sd-cta-btn,
.sd-architect-cta,
.nav-cta,
.agents-custom-bridge .bridge-cta {
  border-radius: var(--radius-ctl, 8px);
  transition: background-color var(--duration-fast, 150ms) var(--ease-std, cubic-bezier(0.4,0,0.2,1)),
              border-color var(--duration-fast, 150ms) var(--ease-std, cubic-bezier(0.4,0,0.2,1)),
              color var(--duration-fast, 150ms) var(--ease-std, cubic-bezier(0.4,0,0.2,1)),
              opacity var(--duration-fast, 150ms) var(--ease-std, cubic-bezier(0.4,0,0.2,1));
}
.cn-cta-btn:hover,
.sd-cta-btn:hover,
.nav-cta:hover,
.agents-custom-bridge .bridge-cta:hover {
  transform: none;
  box-shadow: none;
}
.cn-cta-btn:focus-visible,
.sd-cta-btn:focus-visible,
.sd-architect-cta:focus-visible,
.nav-cta:focus-visible,
.agents-custom-bridge .bridge-cta:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
}
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.field:focus-visible,
.sd-form-input:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-ctl, 8px);
}
.field {
  display: block;
  width: 100%;
  min-height: 44px;
  padding: var(--space-3, 12px) var(--space-4, 16px);
  background: var(--color-surface-2, var(--color-bg-secondary));
  color: var(--color-text-primary);
  border: 1px solid var(--color-line, var(--color-border));
  border-radius: var(--radius-ctl, 8px);
  font-family: var(--font-body);
  font-size: var(--text-base, 1rem);
}
.field:hover { border-color: var(--color-line-amber-hi, var(--color-accent)); }
.field[aria-invalid="true"] { border-color: #E2452F; }
summary:focus-visible,
.details summary:focus-visible,
.details-toggle:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
  border-radius: var(--radius-ctl, 8px);
}
summary:hover { background: var(--color-accent-wash); }
.details {
  border: 1px solid var(--color-line, var(--color-border));
  border-radius: var(--radius-card, 12px);
  overflow: hidden;
}
.details summary {
  min-height: 44px;
  padding: var(--space-4, 16px) var(--space-5, 20px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
}
.details summary::-webkit-details-marker { display: none; }
.switch {
  display: inline-flex;
  border: 1px solid var(--color-line, var(--color-border));
  border-radius: var(--radius-ctl, 8px);
  overflow: hidden;
}
.switch button {
  min-height: 44px;
  min-width: 44px;
  padding: 10px 14px;
  background: transparent;
  color: var(--color-text-secondary);
  border: 0;
  font-family: var(--font-body);
  font-size: 0.9rem;
}
.switch button[aria-pressed="true"] { background: var(--color-accent); color: var(--color-on-accent); }
.switch button:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.szyna {
  position: fixed;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 30;
  display: none;
  flex-direction: column;
  gap: 10px;
}
@media (min-width: 1580px) { .szyna { display: flex; } }
@media (min-width: 1580px) and (max-width: 1659px) { .szyna .szyna-tytul { display: none; } }
.szyna a {
  display: flex;
  align-items: center;
  gap: 9px;
  text-decoration: none;
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--color-text-tertiary);
  transition: color 0.3s, font-weight 0.3s;
}
.szyna i { display: block; width: 16px; height: 1px; background: currentColor; transition: width 0.3s; }
.szyna a[aria-current="true"] { color: var(--color-accent-text); font-weight: 600; }
.szyna a[aria-current="true"] i { width: 28px; height: 2px; }
.szyna a:hover { color: var(--color-text-secondary); }
.chapter-marker-rozdzial {
  display: block;
  margin: 0 0 var(--space-4, 16px);
  text-transform: none;
  letter-spacing: 0;
}
.kadr-filmowy.klisza-duo { background: var(--color-accent); }
.klisza-duo { position: relative; }
.klisza-duo img,
.klisza-duo > picture > img {
  filter: grayscale(1) contrast(1.0) brightness(1.35);
  mix-blend-mode: multiply;
  background: var(--color-accent);
}
html[data-theme="light"] .klisza-duo img,
html[data-theme="light"] .klisza-duo > picture > img {
  filter: grayscale(1) contrast(1.0) brightness(1.20);
}
.klisza-duo .kino-maska { position: absolute; inset: 0; z-index: 1; background: #2A1E12; mix-blend-mode: lighten; pointer-events: none; }
.sekcja-architekt .hero-founder-card { margin: 0 auto !important; }
.architekt-rama-portretu { max-width: 240px; margin: 0 auto var(--space-4, 16px); }
.architekt-rama-portretu picture,
.architekt-rama-portretu img { display: block; width: 100%; }
.sekcja-architekt .hero-founder-card .architekt-rama-portretu picture img {
  aspect-ratio: 4 / 5;
  height: auto;
  max-height: none;
  object-fit: cover;
  border-radius: var(--radius-card, 12px);
}
@media (min-width: 720px) {
  .sekcja-architekt .hero-founder-card { grid-template-columns: 240px 1fr; }
  .architekt-rama-portretu { margin: 0; max-width: none; }
}
.wydruk--zaczerniony { max-width: 480px; }
.wydruk--zaczerniony .wydruk-zakres { background: #0B0B0C; color: transparent; border-radius: 3px; user-select: none; }
html[data-theme="light"] .wydruk--zaczerniony .wydruk-zakres { background: var(--papier-tekst); }
.wydruk-podpis { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.03em; color: var(--color-text-tertiary); text-align: center; margin-top: var(--space-4, 16px); }
.wydruk--miniatura { min-height: 96px; height: auto; padding: 14px 18px; max-width: none; }
.wydruk--miniatura .wydruk-header { border: 0; padding: 0; margin: 0 0 6px; }
.wydruk--miniatura .wydruk-label { font-size: 0.92rem; }
.wydruk--miniatura .wydruk-lista { display: none; }
.wydruk--miniatura .wydruk-mini-tekst { font-size: 0.86rem; line-height: 1.4; color: var(--color-text-secondary); margin: 0; }
.wydruk-granica { margin-top: 10px; font-size: 0.86rem; line-height: 1.5; color: var(--color-text-tertiary); }
.wydruk {
  --papier: var(--p-papier);
  --papier-tekst: var(--p-atrament-wydruku);
  --papier-cichy: var(--p-atrament-wydruku-a72);
  --papier-ledwo: var(--p-atrament-wydruku-a62); 
  --papier-linia: var(--p-atrament-wydruku-a14);
  --papier-akcent: var(--p-bursztyn-ciemny);   
  background: var(--papier);
  border-color: var(--papier-linia);
  color: var(--papier-tekst);
}
html[data-theme="light"] .wydruk { --papier: var(--p-bialy); --papier-linia: var(--p-atrament-wydruku-a16); }
.wydruk-header { border-bottom-color: var(--papier-linia); }
.wydruk-label { color: var(--papier-tekst); }
.wydruk-czas { color: var(--papier-akcent); }
.wydruk-zakres { color: var(--papier-ledwo); border-color: var(--papier-linia); }
.wydruk-lista { color: var(--papier-cichy); }
.wydruk-lista strong { color: var(--papier-tekst); }
.wydruk-stopka { color: var(--papier-ledwo); border-top-color: var(--papier-linia); }
.wydruk--miniatura .wydruk-mini-tekst { color: var(--papier-ledwo); }
[data-skala] .section-headline { font-size: calc(clamp(1.9rem, 3.6vw, 3rem) * var(--sk, 1)); }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .kadr-parallax { animation: kino-kadr-drift linear both; animation-timeline: view(); animation-range: entry 0% cover 100%; }
    @keyframes kino-kadr-drift { from { object-position: 50% 50%; } to { object-position: 54% 50%; } }
  }
}
.kadr-filmowy.karta--scena {
  width: 100vw;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
.kadr-filmowy .karta-tresc {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(20px, 4vw, 40px);
}
.karta-tresc .chapter-marker { color: var(--color-accent); text-shadow: 0 1px 12px rgba(8, 6, 4, 0.8), 0 1px 2px rgba(8, 6, 4, 0.6); }
.karta-tresc .display-h2 {
  color: #F6F1E8;
  margin: 0;
  max-width: 22ch;
  text-shadow: 0 2px 30px rgba(8, 6, 4, 0.65), 0 1px 3px rgba(8, 6, 4, 0.45);
}
.kadr-filmowy.karta--scena::before {
  background: radial-gradient(130% 100% at 50% 50%, transparent 45%, rgba(8, 6, 4, 0.38) 100%);
}
.kadr-filmowy .klisza-sredni {
  filter: saturate(0.60) contrast(1.0) brightness(1.65) sepia(0.30) hue-rotate(-6deg);
}
html[data-theme="light"] .kadr-filmowy .klisza-sredni {
  filter: saturate(0.60) contrast(0.98) brightness(1.75) sepia(0.30) hue-rotate(-6deg);
}
.hero-split::before {
  bottom: -220px;
  background:
    linear-gradient(90deg,
      rgba(10, 9, 8, 0.58) 0%,
      rgba(10, 9, 8, 0.42) 36%,
      rgba(10, 9, 8, 0) 58%) 0 0 / 100% 100% no-repeat,
    linear-gradient(180deg,
      rgba(10, 9, 8, 0.42) 0%,
      rgba(10, 9, 8, 0.35) 30%,
      rgba(10, 9, 8, 0.35) 100%) 0 0 / 100% 100% no-repeat,
    image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
      center 54% / cover no-repeat;
}
.sekcja-architekt.section-body { padding-left: var(--space-8); padding-right: var(--space-8); }
.wydruk-link-poufny { margin: var(--space-3, 12px) 0 0; text-align: center; max-width: 480px; }
html:not([data-theme="light"]) .hero-split .cta-note { color: var(--color-text-secondary); }
@media (max-width: 760px) {
  .hero-split::before {
    bottom: auto;
    height: min(96svh, 780px);
    background:
      linear-gradient(180deg,
        rgba(10, 9, 8, 0.36) 0%,
        rgba(10, 9, 8, 0.34) 40%,
        rgba(10, 9, 8, 0.60) 68%,
        rgba(10, 9, 8, 0.94) 86%,
        var(--color-bg) 100%) 0 0 / 100% 100% no-repeat,
      image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
        30% 62% / cover no-repeat;
  }
  html[data-theme="light"] .hero-split::before {
    background:
      linear-gradient(180deg,
        rgba(250, 248, 244, 0.54) 0%,
        rgba(250, 248, 244, 0.60) 40%,
        rgba(250, 248, 244, 0.80) 68%,
        rgba(250, 248, 244, 0.96) 86%,
        var(--color-bg) 100%) 0 0 / 100% 100% no-repeat,
      image-set(var(--kadr-1x) 1x, var(--kadr-2x) 2x)
        30% 62% / cover no-repeat;
  }
}
.dzw-opak {
  --papier: var(--p-papier);
  --papier-tekst: var(--p-atrament-wydruku);
  --papier-cichy: var(--p-atrament-wydruku-a72);
  --papier-linia: var(--p-atrament-wydruku-a14);
  position: relative;
  margin-top: clamp(28px, 3.4vw, 44px);
}
html[data-theme="light"] .dzw-opak { --papier: var(--p-bialy); --papier-linia: var(--p-atrament-wydruku-a16); }
#dzwignia.section-body {
  max-width: var(--container-med, 960px);
  margin-inline: auto;
  padding: 0 var(--space-8, 32px) var(--space-24, 96px);
}
.dzw-opak,
#dzwignia .trzy {
  --dzw-szer: min(var(--container-wide, 1200px), calc(100vw - 2 * var(--space-8, 32px)));
  width: var(--dzw-szer);
  margin-inline: calc(50% - var(--dzw-szer) / 2);
}
.dzw {
  position: relative;
  isolation: isolate;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card, 12px);
  background: var(--color-bg-raised);
  overflow: hidden;
  aspect-ratio: 1200 / 430;
}
html[data-theme="light"] .dzw { background: #EFEAE0; border-color: rgba(26, 23, 20, 0.14); }
.dzw svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.dzw .blat { stroke: var(--color-border-subtle); stroke-width: 1.5; }
.dzw .podpora { fill: var(--color-surface, var(--color-bg-raised)); stroke: var(--color-border-subtle); stroke-width: 1.2; }
html[data-theme="light"] .dzw .podpora { fill: #E3DCCF; }
.dzw .belka { fill: rgba(212, 165, 116, 0.22); stroke: var(--color-accent); stroke-width: 1.8; }
html[data-theme="light"] .dzw .belka { fill: #D9D1C2; }
.dzw .os {
  transform: rotate(var(--kat, 11deg));
  transition: transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) { .dzw .os { transition: none; } }
.dzw .poziom {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  transform: rotate(calc(-1 * var(--kat, 11deg)));
  transition: transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1);
}
@media (prefers-reduced-motion: reduce) { .dzw .poziom { transition: none; } }
.dzw .kartka { fill: var(--papier); stroke: var(--papier-linia); stroke-width: 1; }
.dzw .kartka-t { font-family: var(--font-mono); font-size: 11px; fill: var(--papier-cichy); }
.dzw .kartka-t.b { font-family: var(--font-display); font-size: 13.5px; font-weight: 600; fill: var(--papier-tekst); }
.dzw .amber { fill: var(--color-accent); }
.dzw .amber-t { font-family: var(--font-display); font-size: 15px; font-weight: 600; fill: var(--color-on-accent); }
.dzw .amber-s { font-family: var(--font-mono); font-size: 10.5px; fill: rgba(23, 18, 12, 0.7); }
.dzw .etykieta { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.06em; fill: var(--color-text-tertiary); }
.dzw .etykieta.b { fill: var(--color-accent); }
.dzw .reka {
  fill: none; stroke: var(--color-accent); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
  opacity: 0; transition: opacity 0.6s 0.3s, transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1); transform: translateY(-10px);
}
.dzw.wcisnieta .reka { opacity: 0.95; transform: translateY(0); }
.dzw .cien-stosu { fill: rgba(0, 0, 0, 0.35); transition: opacity 0.9s; opacity: 0; }
.dzw.wcisnieta .cien-stosu { opacity: 1; }
.dzw-pod {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 3vw, 40px);
  margin-top: 18px; font-family: var(--font-mono); font-size: 11.5px; color: var(--color-text-tertiary);
}
.dzw-pod b { color: var(--color-text-primary); font-weight: 500; }
.dzw-pod .p { text-align: right; }
@media (max-width: 640px) {
  .dzw { aspect-ratio: 1200 / 600; }
  .dzw-pod { grid-template-columns: 1fr; }
  .dzw-pod .p { text-align: left; }
}
.trzy {
  margin-top: clamp(32px, 4.5vw, 56px);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 32px);
}
@media (max-width: 860px) { .trzy { grid-template-columns: 1fr; } }
.trzy h3 { font-family: var(--font-display); font-weight: 600; font-size: 1.14rem; margin: 0 0 8px; letter-spacing: -0.01em; color: var(--color-text-primary); }
.trzy p { margin: 0; color: var(--color-text-secondary); line-height: 1.62; font-size: 0.97rem; }
.trzy .n { font-family: var(--font-mono); font-size: 11px; color: var(--color-accent-text); letter-spacing: 0.06em; display: block; margin-bottom: 10px; }
}