
:root {
  --color-ink:        #241710;
  --color-brown:      #6B3D24;
  --color-terracotta: #B86140;
  --color-sand:       #EDE0C6;
  --color-ecru:       #F7F0E0;
  --color-stamp-gray: #685A4B;
  --color-white:      #FFFFFF;

  --color-ink-rgb:    36 23 16;
  --color-ecru-rgb:   247 240 224;
  --seq-bg-1-rgb:     245 240 232;
  --seq-bg-3-rgb:     111 95 78;
  --seq-bg-4-rgb:     59 31 16;
  --zw-cien-rgb:      34 26 15;
  --seq-accent-rgb:   133 63 39;
  --cien-rgb:         17 17 17;
  --aurora-1-rgb:     202 158 100;
  --aurora-2-rgb:     184 122 76;
  --aurora-3-rgb:     210 190 160;
  --seq-bg-2-plama-rgb: 251 246 234;
  --seq-bg-2-cien-rgb:  235 223 203;
  --seq-bg-3-plama-rgb: 118 88 63;
  --seq-bg-3-cien-rgb:  79 67 55;
  --seq-bg-4-plama-rgb: 94 52 24;
  --seq-bg-4-cien-rgb:  42 21 10;

  --seq-bg-1:      #F5F0E8;
  --seq-bg-2:      #DDD6CA;
  --seq-bg-3:      #6F5F4E;
  --seq-bg-4:      #3B1F10;
  --zw-cien:       #221A0F;
  --seq-ink-on-light: var(--color-ink);
  --seq-ink-on-dark:  var(--color-ecru);
  --seq-accent:       #853F27;
  --seq-accent-dark:  #F6EAD6;

  --seq-tytul-na-jasnym:  var(--color-brown);
  --seq-tytul-na-ciemnym: #F0E2D2;
  --seq-opis-na-jasnym:   var(--seq-bg-4);
  --seq-opis-na-ciemnym:  #E6DFD2;
  --seq-cta-focus-jasny:  #665A4C;
  --seq-cta-focus-ciemny: var(--seq-bg-1);

  --logo-brown:    #3B1F10;

  --stopka-tekst:  var(--seq-ink-on-light);
  --stopka-drugi:  var(--color-brown);
  --stopka-linia:  rgba(36, 23, 16, 0.12);


  --font-serif:   'Playfair Display', Georgia, serif;
  --font-sans:  'Work Sans', ui-sans-serif, system-ui, sans-serif;

  --tekst-xs:   0.68rem;
  --tekst-s:    0.75rem;
  --tekst-m:    0.85rem;
  --tekst-l:    0.95rem;
  --tekst-xl:   1.05rem;
  --tekst-2xl:  1.15rem;
  --tekst-3xl:  1.40rem;

  --display-1: clamp(2.5rem, 7vw, 4.5rem);
  --display-2: clamp(2.4rem, 5vw, 4rem);
  --display-3: clamp(2rem, 4vw, 3rem);
  --display-4: clamp(1.9rem, 4vw, 2.75rem);


  --nav-height:    5rem;
  --nav-odstep:    0.75rem;
  --pasek-przegladarki: 0px;
  --radius:        14px;
  --tlo-gradient:  linear-gradient(168deg, var(--seq-bg-1) 0%, var(--seq-bg-2) 58%, var(--seq-bg-1) 100%);
  --seq-bg-2-drugi: #F5EEE0;
  --seq-bg-3-drugi: #594C3E;
  --seq-bg-4-drugi: #542C17;
  --seq-grad-2: linear-gradient(168deg, var(--seq-bg-2) 0%, var(--seq-bg-2-drugi) 58%, var(--seq-bg-2) 100%);
  --seq-grad-3: linear-gradient(168deg, var(--seq-bg-3) 0%, var(--seq-bg-3-drugi) 58%, var(--seq-bg-3) 100%);
  --seq-grad-4: linear-gradient(168deg, var(--seq-bg-4) 0%, var(--seq-bg-4-drugi) 58%, var(--seq-bg-4) 100%);

  --seq-bg-2-plama: #FBF6EA;
  --seq-bg-2-cien:  #EBDFCB;
  --seq-bg-3-plama: #76583F;
  --seq-bg-3-cien:  #4F4337;
  --seq-bg-4-plama: #5E3418;
  --seq-bg-4-cien:  #2A150A;
  --seq-tlo-2: radial-gradient(64% 60% at 18% 12%, rgb(var(--seq-bg-2-plama-rgb) / 0.96), rgb(var(--seq-bg-2-plama-rgb) / 0) 72%), radial-gradient(58% 54% at 86% 90%, rgb(var(--seq-bg-2-cien-rgb) / 0.90), rgb(var(--seq-bg-2-cien-rgb) / 0) 72%), var(--seq-grad-2);
  --seq-tlo-3: radial-gradient(64% 60% at 18% 12%, rgb(var(--seq-bg-3-plama-rgb) / 0.92), rgb(var(--seq-bg-3-plama-rgb) / 0) 72%), radial-gradient(58% 54% at 86% 90%, rgb(var(--seq-bg-3-cien-rgb) / 0.90), rgb(var(--seq-bg-3-cien-rgb) / 0) 72%), radial-gradient(78% 68% at 50% 46%, rgb(var(--seq-bg-3-cien-rgb) / 0) 46%, rgb(var(--seq-bg-3-cien-rgb) / 0.55) 100%), var(--seq-grad-3);
  --seq-tlo-4: radial-gradient(64% 60% at 18% 12%, rgb(var(--seq-bg-4-plama-rgb) / 0.92), rgb(var(--seq-bg-4-plama-rgb) / 0) 72%), radial-gradient(58% 54% at 86% 90%, rgb(var(--seq-bg-4-cien-rgb) / 0.90), rgb(var(--seq-bg-4-cien-rgb) / 0) 72%), radial-gradient(78% 68% at 50% 46%, rgb(var(--seq-bg-4-cien-rgb) / 0) 46%, rgb(var(--seq-bg-4-cien-rgb) / 0.55) 100%), var(--seq-grad-4);



  --motion-ease-out:         cubic-bezier(0.16, 1, 0.3, 1);
  --motion-ease-unfold:      cubic-bezier(0.45, 0, 0.15, 1);
  --motion-ease-kurtyna:     cubic-bezier(0.76, 0, 0.24, 1);
  --motion-ease-reveal:      cubic-bezier(0.25, 0, 0.1, 1);
  --motion-reveal-dur:       1250ms;
  --motion-reveal-clip-dur:  1400ms;
  --motion-reveal-photo-dur: 1600ms;

}

@supports (height: 1lvh) and (height: 1svh) {
  :root { --pasek-przegladarki: calc(100lvh - 100svh); }

}
