:root {
   --background: #ffffff;
   --background--300: #e8e8e8;
   --background--400: #a89888;

   --foreground: #2E2A25;
   --foreground--300: #423c35;
   --foreground--200: #767676;

   --border: #e0e0e0;
   --border-dark: #797676;
   --border-darker: rgba(255,255,255,.07);

   --color-accent: #DC1E35;
   --color-accent-light: rgba(220,30,53, 0.1);

   --default-duration: 250ms;
   --default-max-width: 1800px;

   --red: #D0021B;
   --red-darker: #a8001a;
   --dark: #1a1a1a;
   --text: #888;
   --white: #ffffff;
   --light: #f5f5f5;
   --gray-100: #f5f5f5;
   --gray-200: #eee;
   --gray-300: #ccc;
   --gray-400: #bbb;
   --gray-500: #aaa;
   --gray-600: #999;
   --gray-700: #888;
   --gray-800: #777;
   --gray-900: #666;
   --gray-950: #555;
   --gray-850: #444;
   --gray-750: #333;
}

*,
*:before,
*:after {
    color: var(--foreground);
    font-family: 'Barlow', sans-serif;
}


/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
    
}

body.no-scroll {
	overflow: hidden;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Barlow Condensed', sans-serif;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
    font-weight: 800;
    color: var(--dark);
}

a.link-underline-gray {
    text-decoration: none;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.813rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--dark);
    background: none;
    border: none;
    cursor: pointer;
    border-bottom: 1.5px solid var(--border);
    transition: color 0.2s, border-color 0.2s;
}

a.link-underline-gray:hover { color: var(--red); border-color: var(--red); }


/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
  display: block;
  width: 100%;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}


/**
 * Default container 
 */
.container {
    width: 90%;
    max-width: var(--default-max-width);
    margin: 0 auto;
}

/*
 * Default section
 */

.section {
    padding: 3rem 0;
}

.section-title {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: clamp(40px, 4.5vw, 62px);
    font-weight: 900;
    text-transform: uppercase;
    line-height: 0.95;
    color: var(--white);
    margin: 0;
    margin-bottom: 1.25rem;
    position: relative;
}

.section-title span.highlight { color: var(--red); font-family: inherit; }

.section-title.dark {
    color: var(--dark);
}

.section-label {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: var(--red);
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .section-label::before {
    content: '';
    display: block;
    width: 24px; height: 2px;
    background: var(--red);
    flex-shrink: 0;
  }

  .section-link {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--dark);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    border-bottom: 1.5px solid var(--dark);
    transition: color 0.2s, border-color 0.2s;
  }
.section-link svg { transition-duration: 0.2s;}
  .section-link:hover { color: var(--red); border-color: var(--red); }
  .section-link svg { width: 0.875rem; height: 0.875rem; transition: transform 0.2s; }
  .section-link:hover svg { stroke: var(--red); transform: translateX(4px); }

  .section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 3rem;
  }

  .section-header .section-title { margin-bottom: 0;}

  .info-section {
    background: var(--dark);
    padding: 64px 48px;
    position: relative;
    overflow: hidden;
  }

  .info-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
  }

  .info-section::after {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: 3px;
    background: var(--red);
  }

  .info-section-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 5rem;
    position: relative;
    z-index: 1;
  }

/**
 * Buttons 
 */

.btn {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.813rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 0.5rem 1rem;
    color: black;
    border: none;
    cursor: pointer;
    width: fit-content;
    transition: background 0.2s, transform 0.15s;
    position: relative;
    text-decoration: none;
}

.btn:has(svg) {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.btn:has(svg) svg {
    width: 0.875rem;
    height: 0.875rem;
    transition: transform 0.15s;
}

.btn:has(svg):hover svg {
    transform: translateX(5px);
}

.btn--red {
    background-color: var(--red);
    color: var(--white);
}

.btn--red:has(svg) svg {
    stroke: var(--white);
}

.btn--red:hover {
    background-color: var(--red-darker);
    color: var(--white);
}

.btn--dark {
    background-color: var(--dark);
    color: var(--white);
}

.btn--dark:has(svg) svg {
    fill: var(--white);
}



/**
 * Main navigation 
 */
.main-nav {
  border-bottom: 2px solid var(--red);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  transition: transform 0.7s cubic-bezier(.16, 1, .3, 1);
  background-color: var(--white);
}

.main-nav.hidden {
  transform: translateY(-100%);
}

.main-nav__top {
    padding: 0.8rem;
    border-bottom: 1px solid var(--border);
}

.main-nav__contact {
    display: flex;
    justify-content: right;
}

.main-nav__contact ul {
    list-style: none;
    display: flex;
    gap: 0.625rem;
    align-items:center;
    padding: 0;
    margin: 0;
}

.main-nav__contact-item a svg {
    width: 0.8rem;
    height: 0.8rem;
    fill: var(--red);
}

.main-nav__contact-item a {
    font-size: 0.8rem;
    display: flex;
    align-items: center;
    gap: 0.5em;
    text-decoration: none;
    transition: color 0.2s;
}

.main-nav__contact-item a:hover {
    color: var(--red);
}


.main-nav__bottom {
    padding-top: 0.8rem;
    padding-bottom: 1.1rem;
    color: red;
}

.main-nav-page-logo {
    max-width: 200px;
}

.main-nav__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#hamburger {
    display: none;
    cursor: pointer;
}

.hamburger__line {
    width: 30px;
    height: 2px !important;
    background-color: var(--foreground);
}

.hamburger__line:nth-child(2) {
    margin: 5px 0;
}


.main-nav-links ul {
    list-style: none; 
    display: flex;
    align-items: center;
    gap: 2rem;
}

.main-nav-links ul li a {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 1px;
}

.main-nav-links .page-menu .page-menu__item {
    position: relative;
}

.main-nav-links .page-menu .page-menu__item:before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -5px;
    width: 0;
    height: 2px;
    background-color: var(--color-accent);
    transition-duration: var(--default-duration);
}

.main-nav-links .page-menu .page-menu__item:hover a {
    color: var(--foreground--200);
}

.main-nav-links .page-menu .page-menu__item:hover:before {
    width: 100%;
}

/*
* * Page header
*/

.page-header {
  background: var(--dark);
  padding: 3rem 3rem 2.75rem 0;
  position: relative;
  overflow: hidden;
}

/* siatka */
.page-header::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

/* czerwona belka lewa */
.page-header::after {
  content: '';
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: 3px;
  background: var(--red);
}

.ph-inner {
  position: relative; z-index: 1;
}

/* breadcrumb */
.breadcrumb {
  display: flex; align-items: center; gap: 0.5rem;
  margin-bottom: 0.875rem;
}
.breadcrumb a, .breadcrumb span {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.625rem; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
  text-decoration: none; transition: color .2s;
}
.breadcrumb a { color: rgba(255,255,255,.25); margin: 0; }
.breadcrumb a:hover { color: rgba(255,255,255,.5); }
.breadcrumb .breadcrumb-current { color: var(--red); }
.breadcrumb-sep { width: 14px; height: 1px; background: rgba(255,255,255,.15); }

/*
 ** Site overlay
 */

    #site-overlay {
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background: rgba(0,0,0,0.6);	
        z-index: 10001;
        opacity: 0;
        transition: opacity var(--default-duration) ease;
        visibility: hidden;
    }

    #site-overlay.show {
        visibility: visible;
        opacity: 1;
    }

    #site-overlay.hide {
        opacity: 0;
    }

/*
 ** Mobile navigation
 */

#mobile-nav {
	max-width: 400px;
    width: 100%;
	position: fixed;
	right: -100%;
	top: 0;
	bottom: 0;
	z-index: 10002;
	visibility: hidden;
	transition: right 0.2s ease;
  background: var(--dark);
  overflow: scroll;
  display: flex;
  flex-direction: column;
  box-shadow: 8px 0 40px rgba(0,0,0,.35);
}

#site-overlay.mobile-nav__overlay.show ~ #mobile-nav {
    right: 0;
	visibility: visible;
}

#site-overlay.mobile-nav__overlay.hide ~ #mobile-nav {
	right: -100%;
}

/* siatka tło */
#mobile-nav::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

.menu-header {
  padding: 1.5rem;
  border-bottom: 1px solid var(--border-darker);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative; z-index: 1;
}

/* logo */
.menu-logo {
  display: flex; align-items: center; gap: 0; text-decoration: none;
}
.menu-logo-box {
  background: var(--red);
  padding: 5px 11px;
  position: relative;
}
.menu-logo-box::after {
  content: '';
  position: absolute; right: -8px; top: 0;
  border-top: 34px solid var(--red);
  border-right: 8px solid transparent;
}
.menu-logo-text {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 20px; font-weight: 900; font-style: italic;
  color: var(--white); line-height: 1;
}
.menu-logo-bar {
  width: 3px; height: 28px;
  background: var(--red); margin: 0 7px 0 15px;
}
.menu-logo-sub {
  display: flex; flex-direction: column;
}
.menu-logo-sub-main {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 900; text-transform: uppercase;
  color: var(--white); line-height: 1.1;
}
.menu-logo-sub-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase; color: var(--gray-850); margin-top: 2px;
}

/* przycisk X zamknięcia */
.menu-close {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,255,255,.1);
  background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: border-color .2s, background .2s;
  flex-shrink: 0;
}
.menu-close:hover { border-color: var(--red); background: rgba(208,2,27,.1); }
.menu-close svg {
  width: 14px; height: 14px;
  fill: none; stroke: rgba(255,255,255,.5);
  stroke-width: 2; stroke-linecap: round;
  transition: stroke .2s;
}
.menu-close:hover svg { stroke: var(--white); }

.menu-nav {
  flex: 1;
  position: relative; z-index: 1;
}

.menu-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px 0 28px;
  height: 56px;
  text-decoration: none;
  border-bottom: 1px solid var(--border-darker);
  position: relative;
  transition: background .15s;
  cursor: pointer;
}
.menu-item:last-child { border-bottom: none; }
.menu-item:hover { background: rgba(255,255,255,.03); }

/* czerwona belka przy hover */
.menu-item::before {
  content: '';
  position: absolute; top: 0; left: 3px; bottom: 0;
  width: 0; background: rgba(208,2,27,.15);
  transition: width .2s ease;
}
.menu-item:hover::before { width: calc(100% - 3px); }

/* czerwona kreska lewa aktywnego */
.menu-item.active::after {
  content: '';
  position: absolute; top: 0; left: 0; bottom: 0;
  width: 3px; background: var(--red);
}

.menu-item-left {
  display: flex; align-items: center; gap: 14px;
  position: relative; z-index: 1;
}

.menu-item-num {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 2px;
  color: var(--gray-750); min-width: 20px;
}
.menu-item.active .menu-item-num { color: var(--red); }

.menu-item-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 700;
  letter-spacing: 1.5px; text-transform: uppercase;
  color: rgba(255,255,255,.45);
  transition: color .15s;
}
.menu-item:hover .menu-item-label { color: var(--white); }
.menu-item.active .menu-item-label { color: var(--white); }

.menu-item-arrow {
  position: relative; z-index: 1;
  width: 20px; height: 20px;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .2s, transform .2s;
}
.menu-item:hover .menu-item-arrow { opacity: 1; transform: translateX(3px); }
.menu-item-arrow svg {
  width: 14px; height: 14px;
  fill: none; stroke: var(--red);
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

/* ── DANE KONTAKTOWE ── */
.menu-contact {
  padding: 20px 28px;
  border-top: 1px solid var(--border-darker);
  display: flex; flex-direction: column; gap: 12px;
  position: relative; z-index: 1;
}

.menu-contact-item {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
  transition: opacity .2s;
}
.menu-contact-item:hover { opacity: .7; }

.menu-contact-icon {
  width: 28px; height: 28px;
  background: rgba(208,2,27,.12);
  border: 1px solid rgba(208,2,27,.2);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.menu-contact-icon svg {
  width: 12px; height: 12px; fill: var(--red);
}

.menu-contact-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; font-weight: 700; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--gray-850);
  display: block; margin-bottom: 1px;
}
.menu-contact-value {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: .5px;
  color: var(--gray-500);
}

/* ── CTA ── */
.menu-cta {
  padding: 20px 28px 28px;
  position: relative; z-index: 1;
  border-top: 1px solid var(--border);
}

.menu-cta-btn {
  display: flex; align-items: center; justify-content: center;
  gap: 9px; width: 100%;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: 2.5px; text-transform: uppercase;
  padding: 14px 20px;
  background: var(--red); color: var(--white);
  text-decoration: none;
  transition: background .2s;
}
.menu-cta-btn:hover { background: var(--red-darker); }
.menu-cta-btn svg {
  width: 13px; height: 13px;
  fill: none; stroke: var(--white);
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .2s;
}
.menu-cta-btn:hover svg { transform: translateX(3px); }

/* ── STOPKA ── */
.menu-footer {
  padding: 14px 28px;
  border-top: 1px solid var(--border);
  position: relative; z-index: 1;
}
.menu-footer-text {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 9px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase; color: var(--gray-950);
}

/*
 ** Footer
*/
footer {
    background: var(--dark);
    position: relative;
    overflow: hidden;
  }

  /* siatka w tle */
  footer::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
  }

  /* czerwona kreska na górze */
  footer::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--red);
  }

  .footer-main {
    padding: 3.5rem 0 3rem 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem;
    position: relative;
    z-index: 1;
  }

  /* ── KOLUMNA 1 – logo + opis ── */

  .footer-logo {
    display: block;
    text-decoration: none;
    margin-bottom: 1.25rem;
    max-width: 200px;
  }

  .footer-desc {
    font-size: 0.844rem;
    line-height: 1.7;
    color: var(--gray-800);
    margin-bottom: 1.5rem;
    max-width: 280px;
  }

  /* social */
  .footer-social-btn {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 0.563rem 1.125rem;
    background: transparent;
    color: var(--gray-700);
    border: 1px solid var(--gray-700);
    cursor: pointer;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.2s;
    width: fit-content;
  }

  .footer-social-btn:hover {
    background: var(--red);
    border-color: var(--red);
    color: var(--white);
  }

  .footer-social-btn:hover svg {
    fill: var(--white);
  }

  .footer-social-btn svg { width: 0.813rem; height: 0.813rem; fill: var(--gray-700); transition: all 0.2s;}

  .footer-nav-links ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    padding: 0;
  }


  .footer-nav-links ul li a {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--gray-700);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    transition: color 0.2s;
    max-width: fit-content;
  }

  .footer-nav-links ul li:last-child a { border-bottom: none; }

  .footer-nav-links ul li a::before {
    content: '';
    display: block;
    width: 0.25rem; height: 0.25rem;
    background: var(--gray-850);
    flex-shrink: 0;
    transition: background 0.2s;
  }

  .footer-nav-links ul li a:hover { color: var(--white); }
  .footer-nav-links ul li a:hover::before { background: var(--red); }

  /* ── KOLUMNA 3 – kontakt ── */
  .footer-contact-items {
    display: flex;
    flex-direction: column;
  }

  .contact-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    text-decoration: none;
    max-width: fit-content;
  }

  .contact-item:last-child { border-bottom: none; }

  .contact-item svg {
    width: 0.875rem; height: 0.875rem;
    fill: var(--red);
    flex-shrink: 0;
    margin-top: 0.125rem;
  }

  .contact-label {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--gray-950);
    display: block;
    margin-bottom: 0.125rem;
  }

  .contact-value {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--gray-400);
    letter-spacing: 0.5px;
    transition: color 0.2s;
  }

  a.contact-item:hover .contact-value { color: var(--white); }

  /* ══════════════════════
     BOTTOM BAR
  ══════════════════════ */
  .footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.06);
    position: relative;
    z-index: 1;
  }

  .footer-bottom-inner {
    padding: 1rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
  }

  .footer-copy {
    font-size: 0.75rem;
    color: var(--gray-700);
    font-weight: 500;
  }

  .footer-copy strong { color: var(--gray-700); }

  .footer-policy {
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gray-700);
    text-decoration: none;
    border-bottom: 1px solid var(--gray-700);
    padding-bottom: 1px;
    transition: color 0.2s, border-color 0.2s;
  }

  .footer-policy:hover { color: var(--red); border-color: var(--red); }

  .footer-show-cookie-banner {
    font-family: 'Barlow Condensed', sans-serif;
    border: none;
    background: none;
    font-size: 0.813rem;
    color: var(--gray-800);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1.5rem;
    cursor: pointer;
  }

  .footer-show-cookie-banner svg {
    fill: var(--gray-800);
    width: 1rem;
    height: 1rem;
  }

  .footer-show-cookie-banner:hover {
    color: var(--gray-500);
  }

  .footer-show-cookie-banner:hover svg {
    fill: var(--gray-500);
  }

  /*
  ** Contact banner template
  */

   .cta-section {
    background: var(--dark);
    padding: 64px 48px;
    position: relative;
    overflow: hidden;
  }

  /* siatka w tle */
  .cta-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 60px 60px;
    pointer-events: none;
  }

  /* czerwona kreska lewa */
  .cta-section::after {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: 3px;
    background: var(--red);
  }

  .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3.75rem;
    position: relative;
    z-index: 1;
  }

  .cta-right {
    display: flex;
    align-items: center;
    gap: 3rem;
    flex-shrink: 0;
    border-left: 1px solid rgba(255,255,255,0.08);
    padding-left: 3rem;
  }

  .cta-desc {
    font-size: 0.875rem;
    line-height: 1.7;
    color: var(--gray-800);
    max-width: 260px;
  }

    /* 
  ** Why section 
  */

  .why-left {
    display: flex;
    align-items: center;
    gap: 4rem;
  }

  .why-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0;
    border-left: 1px solid rgba(255,255,255,0.08);
    padding-left: 3rem;
  }

  .why-list li {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--gray-300);
    transition: color 0.2s;
  }

  .why-list li:first-child { padding-top: 0; }
  .why-list li:last-child  { border-bottom: none; padding-bottom: 0; }
  .why-list li:hover { color: var(--white); }

  .why-list li::before {
    content: '';
    display: block;
    width: 0.375rem; height: 0.375rem;
    background: var(--red);
    flex-shrink: 0;
  }

  /*
  * * Cookie banner
  */

  .cookie-banner {
    z-index: 10005;
  width: 100%;
  max-width: 960px;
  background: var(--dark);
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translate(-50%, 0);
  overflow: hidden;
  border: 2px solid var(--red);
  display: none;
  max-height: 500px;
  overflow: auto;
}

.cookie-banner.show {
  display: block;
}

/* siatka tło */
.cookie-banner::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

.cookie-inner {
  position: relative; z-index: 1;
  padding: 28px 32px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
}

/* ── IKONA ── */
.cookie-icon-wrap {
  width: 44px; height: 44px;
  background: rgba(208,2,27,.12);
  border: 1px solid rgba(208,2,27,.25);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cookie-icon-wrap svg {
  width: 20px; height: 20px; fill: var(--red);
}

/* ── TREŚĆ ── */
.cookie-content {}

.cookie-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 900;
  text-transform: uppercase; letter-spacing: 1px;
  color: #fff; margin-bottom: 4px;
  display: flex; align-items: center; gap: 10px;
}

.cookie-desc {
  font-size: 13px; line-height: 1.65; color: var(--gray-700);
  max-width: 580px;
}
.cookie-desc a {
  color: var(--red); text-decoration: underline;
  text-underline-offset: 2px;
}
.cookie-desc a:hover { color: #ff1a35; }

/* ── PRZYCISKI ── */
.cookie-actions {
  display: flex; flex-direction: column; gap: 8px;
  flex-shrink: 0;
}

.btn-cookie {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 11px 24px; border: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  gap: 7px; white-space: nowrap;
  transition: background .2s, transform .15s;
}

/* akceptuj – czerwony */
.btn-cookie--accept {
  background: var(--red);
  position: relative; overflow: hidden;
}

.btn-cookie--accept span {
  color: var(--white);
}

.btn-cookie--accept::before {
  content: '';
  position: absolute; inset: 0;
  background: #a8001a;
  transform: translateX(-101%);
  transition: transform .25s ease;
}
.btn-cookie--accept:hover::before { transform: translateX(0); }
.btn-cookie--accept span,
.btn-cookie--accept svg { position: relative; z-index: 1; }
.btn-cookie--accept svg {
  width: 11px; height: 11px;
  fill: none; stroke: #fff;
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
}

.btn-cookie--reject {
  background: none;
  border: 1px solid rgba(255,255,255,.1);
  color: var(--gray-800);
  transition: border-color .2s, color .2s;
}
.btn-cookie--reject:hover {
  border-color: rgba(255,255,255,.25);
  color: #888;
}

/* ════════════════════════════════════════
   ROZSZERZONA WERSJA Z CHECKBOXAMI
════════════════════════════════════════ */
.cookie-expanded {
  border-top: 1px solid rgba(255,255,255,.06);
  padding: 20px 32px 24px;
  position: relative; z-index: 1;
  display: none; /* domyślnie schowane */
}
.cookie-expanded.show { display: block; }

.cookie-expanded-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--gray-900);
  margin-bottom: 16px;
  display: flex; align-items: center; gap: 8px;
}
.cookie-expanded-title::before {
  content: ''; width: 14px; height: 2px; background: var(--red);
}

.cookie-types {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: 20px;
}

.cookie-type {
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
  display: flex; align-items: flex-start; gap: 12px;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  max-width: 300px;
}
.cookie-type:hover { border-color: rgba(255,255,255,.1); }
.cookie-type.disabled { opacity: .4; cursor: not-allowed; }

/* toggle switch */
.toggle {
  width: 32px; height: 18px;
  background: #333; border-radius: 0;
  position: relative; flex-shrink: 0;
  margin-top: 2px;
  transition: background .2s;
  cursor: pointer;
}

.cookie-checkbox:checked + .toggle { background: var(--red); }
.toggle.locked { background: #2a2a2a; cursor: not-allowed; }

.toggle::after {
  content: '';
  position: absolute; top: 3px; left: 3px;
  width: 12px; height: 12px;
  background: #666;
  transition: transform .2s, background .2s;
}
.cookie-checkbox:checked + .toggle::after { transform: translateX(14px); background: #fff; }
.toggle.locked::after { background: #444; }

.cookie-type-text {}
.cookie-type-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: #aaa; display: block;
  margin-bottom: 3px;
}
.cookie-type-desc {
  font-size: 11px; line-height: 1.5; color: var(--gray-900);
}

/* dolna belka rozszerzonego */
.cookie-expanded-footer {
  display: flex; align-items: center;
  justify-content: space-between; gap: 16px;
}



.btn-cookie--save {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 10px 22px; border: none; cursor: pointer;
  background: var(--dark);
  border: 1px solid rgba(255,255,255,.15);
  color: #888;
  transition: border-color .2s, color .2s;
}
.btn-cookie--save:hover { border-color: rgba(255,255,255,.3); color: #fff; }

.cookie-settings-link {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 2px;
  text-transform: uppercase; color: var(--gray-800);
  cursor: pointer; text-decoration: none;
  transition: color .2s;
  background: none; border: none;
  margin-top: 0.5rem;
}
.cookie-settings-link:hover { color: var(--gray-500); }


    /* ══════════════════════
     KEYFRAMES
  ══════════════════════ */
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  @keyframes fadeIn {
    to { opacity: 1; }
  }


/*
 ** Global media queries
 */

@media only screen and (max-width: 968px) {
    #hamburger {
        display: block;
    }

    .main-nav-links,
    .main-nav__fb-link {
        display: none !important;
    }

    .footer-main {
    
      grid-template-columns: 1fr;
    }

    .footer-bottom-inner {
      flex-direction: column;
      align-items: start;
      gap: 0.2rem;
    }

    .cookie-banner {
      width: 100vw;
      bottom: 0;
      left: 0;
      right: 0;
      transform: translate(0, 0);
      border-left: none;
      border-bottom: none;
      border-right: none;
    }
}

@media only screen and (max-width: 768px) {
  .why-left {
      flex-direction: column;
      gap: 2rem;
      align-items: start;
  }

  .why-list {
    padding: 0;
    border: none;
  }

  .info-section-inner {
    grid-template-columns: 1fr;
        gap: 1rem;
  }

  .info-section {
    padding: 2rem;
  }

  .cta-right {
    padding: 0;
    flex-direction: column;
    align-items: start;
  }
}

@media only screen and (max-width: 668px) {
  .cookie-inner {
    grid-template-columns: 1fr;
  }
}

@media only screen and (max-width: 568px) {
  .container {
    width: 100%;
  }

  .main-nav__bottom,
  .footer-main,
  .footer-bottom,
  .section-header,
  .page-header {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .info-section {
    padding: 1.5rem;
  }
}

@media only screen and (max-width: 568px) { 
  .cookie-expanded-footer {
    flex-direction: column;
  }

  .cookie-expanded-footer button {
  width: 100%;
}
}