/* =========================================================
   STYLES.CSS — ONE CLEAN FILE (TOP NAV + DRAWER) ✅
   - Top navbar fixed + drawer
   - Sidebar OFF
   - Watermark (OFF on HOME)
   - Buttons sheen
   - Hero / page-hero / about / marquee / portfolio / clients / contact
   - PROJEKTY:
     • sticky "Wyzwania" (desktop)
     • większy odstęp między "Wyzwania" a kartami
     • mobile: padding L/R + wyrównanie sekcji
     • H1 w projektach: desktop nigdy nie ucina, mobile mocno się skaluje
   - KLIENCI:
     • animacja poprawiona na mobile (mniej jitter/hover-pause)
   - PODSTRONY PROJEKTÓW:
     • hover zdjęć = żółta ramka (jak Klienci)
     • likwidacja lupki (cursor + ewentualne pseudo-elementy)
========================================================= */

/* =========================
   RESET / BASE
========================= */
*{ box-sizing:border-box; }
html,body{ height:100%; }

body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:#0b0b0b;
  color:#f2f2f2;
  position: relative;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
:focus{ outline:none; }
:focus-visible{ outline: 3px solid rgba(37,99,235,.35); outline-offset: 3px; }

/* =========================
   LOCAL FONT — Audiowide
========================= */
/* Audiowide is enqueued through WordPress for better stylesheet ordering. */
.audiowide-regular{
  font-family: "Audiowide", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* =========================
   HEADINGS SYSTEM (GLOBAL)
========================= */
h1, h2, h3{
  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: .06em;
  line-height: 1.05;
  text-transform: uppercase;
  margin: 0 0 18px;
}
h1{ font-size: clamp(44px, 5vw, 86px); }
h2{ font-size: clamp(28px, 3.6vw, 56px); }
h3{ font-size: 18px; letter-spacing: .04em; }

/* =========================
   THEME / VARS
========================= */
:root{
  --acid:#2563EB;
  --signal:#9CFF2E;
  --ink:#0b0b0b;

  --muted:rgba(242,242,242,.72);
  --muted2:rgba(242,242,242,.60);

  --card-border:#262626;
  --radius:18px;
  --shadow: 0 18px 40px rgba(0,0,0,.45);

  /* NAV */
  --nav-h: 78px;
  --nav-gap: 14px;
  --nav-max: 1100px;

  /* KLIENCI */

  /* ABOUT marquee */
  --about-gap: 14px;           /* odstęp jak w UI */
  --about-speed: 42s;          /* wolniej niż klienci */
}

/* =========================
   CONTAINER
========================= */
.container{
  max-width:1100px;
  margin:0 auto;
  padding:0 28px;
}
@media (max-width: 799px){
  .container{ padding:0 18px; }
}

/* =========================
   LAYOUT (TOP NAV) — sidebar OFF
========================= */
.layout{ min-height:100vh; display:block; }
.sidebar{ display:none !important; }

.main{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding-top: calc(var(--nav-h) + var(--nav-gap) + 16px);
}
.page--home .main{ padding-top: 0; }

/* =========================
   BUTTONS + SHEEN
========================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:16px 18px;
  border-radius:14px;
  background:var(--acid);
  color:var(--ink);

  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;

  letter-spacing:.10em;
  border:1px solid rgba(0,0,0,.25);
  box-shadow: var(--shadow);
  width: fit-content;
  cursor:pointer;

  position: relative;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn--compact{ padding:14px 16px; }
.btn--wide{ width:100%; justify-content:center; }

.btn__arrow{
  width:28px; height:28px;
  border-radius:10px;
  background:rgba(0,0,0,.12);
  display:grid;
  place-items:center;
}

.btn::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  transform: translateX(-65%) rotate(18deg);
  opacity:.7;
  pointer-events:none;
  transition: transform .6s ease;
}
.btn:hover{
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(37,99,235,.25),
    0 18px 55px rgba(37,99,235,.35),
    0 28px 70px rgba(0,0,0,.55);
  filter: saturate(1.08);
}
.btn:hover::after{ transform: translateX(65%) rotate(18deg); }
.btn:active{
  transform: translateY(0);
  box-shadow:
    0 0 0 1px rgba(37,99,235,.18),
    0 14px 40px rgba(0,0,0,.45);
}

.btn.ghost{
  background: rgba(255,255,255,.08);
  color: rgba(242,242,242,.90);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow:none;
}
.btn.ghost::after{ opacity:.35; }

.btn.mini{
  padding:10px 12px;
  border-radius:14px;
  font-size:11px;
  letter-spacing:.10em;
  box-shadow:none;
}

/* =========================
   SHARED CARD
========================= */
.card{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border: 1px solid var(--card-border);
  border-radius: var(--radius);
  padding: 22px 20px;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
}
.card__title{ margin:0 0 8px; font-size:18px; font-weight:900; }
.card__text{ margin:0; color:var(--muted); line-height:1.55; font-size:14px; }

/* =========================
   FOOTER
========================= */
.footer{
  background: var(--acid);
  color: var(--ink);
  padding: 26px 28px;
  margin-top: auto;
}
.footer__inner{
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 100px;
  text-align: center;
}
.footer__item{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.footer__label{
  font-size: 11px;
  letter-spacing: .22em;
  font-weight: 800;
  opacity: .7;
  margin-bottom: 6px;
}
.footer__value{
  color: var(--ink);
  font-weight: 900;
  letter-spacing: .06em;
  font-size: 15px;
}
.footer__value:hover{ text-decoration: underline; }
@media (max-width: 799px){
  .footer{ padding: 22px 18px; }
  .footer__inner{ flex-direction: column; gap: 14px; }
}
.footer a,
.footer__value{
  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* =========================
   NAV TOGGLE (drawer checkbox)
========================= */
.nav-toggle{ display:none; }

/* =========================================================
   NAVBAR (TOP)
========================================================= */
.navbar{
  position: fixed;
  top: var(--nav-gap);
  left: 0;
  right: 0;
  z-index: 9999;
  background: transparent;
  will-change: transform;
  transition: transform .22s ease, opacity .22s ease;
}
.navbar.is-hidden{
  transform: translateY(-120%);
  opacity: 1;
}
.navbar__inner{
  height: var(--nav-h);
  max-width: var(--nav-max);
  margin: 0 auto;
  padding: 0 18px;

  display: flex;
  align-items: center;
  gap: 12px;

  border-radius: 18px;
  background: rgba(0,0,0,.72);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
}
.navbar__brand{ display:flex; align-items:center; }
.navbar__logo,
.drawer__logo{
  height: 44px;
  width: auto;
  display:block;
  filter:
    brightness(0) invert(1)
    drop-shadow(0 0 10px rgba(37,99,235,.35))
    drop-shadow(0 0 30px rgba(37,99,235,.18));
}
@media (max-width: 799px){
  .navbar__logo{ height: 40px; }
}

.navbar__nav{
  margin-left: auto;
  display:flex;
  align-items:center;
  gap: 10px;
}
.navbar__link{
  position: relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 14px;
  border-radius: 14px;

  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;

  letter-spacing: .10em;
  font-size: 12px;

  color: rgba(242,242,242,.92);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);

  overflow:hidden;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.navbar__link::before{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.40), transparent);
  transform: translateX(-70%) rotate(18deg);
  opacity: 0;
  transition: transform .55s ease, opacity .18s ease;
  pointer-events:none;
}
.navbar__link:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.10);
  border-color: rgba(37,99,235,.35);
  color: #fff;
}
.navbar__link:hover::before{
  opacity: .75;
  transform: translateX(70%) rotate(18deg);
}
.navbar__link.is-active{
  background: var(--acid);
  border-color: rgba(0,0,0,.25);
  color: var(--ink);
}
.navbar__link.is-active:hover{ color:#fff; }
.navbar__cta.btn{
  margin-left: 12px;
  border-radius: 14px !important;
  transform: scale(.9);
  transform-origin: center right;
}

/* =========================================================
   HAMBURGER (navbar)
========================================================= */
.hamburger{
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;

  width: 56px;
  height: 56px;
  border-radius: 18px;

  background: rgba(255,255,255,.06);
  border: 1px solid rgba(37,99,235,.35);
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);

  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}
.hamburger span{
  display:block;
  width: 30px;
  height: 6px;
  background: rgba(242,242,242,.92);
  border-radius: 999px;
  transition: transform .18s ease, opacity .14s ease;
  transform-origin:center;
}
.nav-toggle:checked ~ .layout .hamburger span:nth-child(1){ transform: translateY(8px) rotate(45deg); }
.nav-toggle:checked ~ .layout .hamburger span:nth-child(2){ opacity: 0; }
.nav-toggle:checked ~ .layout .hamburger span:nth-child(3){ transform: translateY(-8px) rotate(-45deg); }

/* =========================================================
   DRAWER (MOBILE/TABLET)
========================================================= */
.drawer{ display:none; }
.nav-toggle:checked ~ .layout .drawer{ display:block; }

.drawer{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.70);
  backdrop-filter: blur(10px);
  z-index: 10000;
}
.drawer__closearea{ position:absolute; inset:0; }

.drawer__nav{
  position:absolute;
  left: 12px;
  top: 12px;
  width: min(380px, 88vw);
  height: calc(100% - 24px);
  padding: 18px 16px;
  border-radius: 22px;

  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 22px 0 80px rgba(0,0,0,.65);
  color: rgba(242,242,242,.92);
}
.drawer__brand{
  display:flex;
  justify-content:flex-start;
  padding: 6px 6px 18px;
}
.drawer__item{
  display:flex;
  justify-content:space-between;
  align-items:baseline;

  padding: 14px 14px;
  margin-bottom: 10px;
  border-radius: 16px;

  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.drawer__item:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.08);
  border-color: rgba(37,99,235,.35);
}
.drawer__item.is-active{
  background: rgba(37,99,235,.20);
  border-color: rgba(37,99,235,.35);
}
.drawer__label{
  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing:.10em;
  font-size: 12px;
}
.drawer__num{ font-weight: 900; opacity: .7; }
.drawer__cta{ margin-top: 14px; }

/* =========================================================
   MOBILE NAV: tylko LOGO + HAMBURGER (bez piguły)
========================================================= */
@media (max-width: 1024px){
  .navbar__nav{ display:none; }
  .navbar__cta{ display:none; }
  .hamburger{ display:flex; margin-left:auto; }

  .navbar__inner{
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    border-radius: 0;
    padding: 0 14px;
    height: var(--nav-h);

    display:flex;
    align-items:center;
    justify-content:space-between;
  }

  .nav-toggle:checked ~ .layout .navbar__brand{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-6px);
  }
}
.nav-toggle:checked ~ .layout .navbar{ transform: translateY(-120%); }

/* =========================================================
   HERO + VIDEO BG (HOME)
========================================================= */
.hero{
  position: relative;
  min-height: 100vh;
  flex: 1;
  display: flex;
  align-items: center;
  overflow: hidden;
  background:#000;
}
.hero__bgVideo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center center;
  z-index:0;
}
.hero__overlay{
  position:absolute;
  inset:0;
  background: radial-gradient(1200px 700px at 40% 50%, rgba(0,0,0,.25), rgba(0,0,0,.75));
  z-index:1;
}
.hero__inner{
  max-width: 980px;
  margin-left: 56px;
  margin-right: 56px;
  display:flex;
  flex-direction:column;
  gap: 22px;
  position: relative;
  z-index:2;
}
.hero__inner--center{
  width:100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 28px;
}
@media (max-width: 799px){
  .hero__inner{ margin-left: 18px; margin-right: 18px; }
  .hero__inner--center{ padding: 0 18px; }
}
.kicker{
  font-size: 12px;
  letter-spacing: .18em;
  font-weight: 700;
  opacity: .86;
}
.hero__title{
  margin: 0;
  font-weight: 900;
  letter-spacing: .05em;
  line-height: .95;
  text-transform: uppercase;
  font-size: clamp(44px, 5.2vw, 92px);
  text-shadow: 0 10px 35px rgba(0,0,0,.45);
}

/* =========================================================
   PAGE HERO
========================================================= */
.page-hero{ padding: 56px 28px 10px; }
.page-hero__inner{
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
}
.page-hero__title{
  margin: 0 0 26px;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: .95;
  text-transform: uppercase;
  font-size: clamp(44px, 5vw, 86px);
}
@media (max-width: 799px){
  .page-hero{ padding: 18px 18px 0; }
}

.about-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
  margin-bottom: 80px;
}
.about-col{ max-width: 520px; }

.about-text{
  margin: 0 0 20px;
  color: var(--muted);
  line-height: 1.7;
  font-size: 14px;
}

.big-quote{
  margin-top: 20px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(242,242,242,.38);
  line-height: 1.15;
  font-size: clamp(22px, 2.6vw, 36px);

  font-family: "Audiowide", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* =========================
   PAGE ABOUT — GRID AREAS
========================= */
.page--about .about-grid{
  grid-template-areas:
    "p1  p2"
    "btn p2";
  align-items: start;
}
.page--about .about-grid .about-col{ display: contents; }

.page--about .about-grid > .about-col:nth-child(1) > .about-text{
  grid-area: p1;
  max-width: 520px;
}
.page--about .about-grid > .about-col:nth-child(2) > .about-text{
  grid-area: p2;
  max-width: 520px;
}
.page--about .about-grid > .about-col:nth-child(1) > .btn{
  grid-area: btn;
  justify-self: start;
  align-self: start;
  margin-top: 20px;
}

@media (max-width: 1279px){
  .about-grid{ grid-template-columns: 1fr; }
  .page--about .about-grid{
    grid-template-areas:
      "p1"
      "p2"
      "btn";
  }
  .page--about .about-grid > .about-col:nth-child(1) > .btn{ margin-top: 20px; }
}

.page--about .about-col > .btn{ margin-top: 20px !important; }
.page--about .page-hero{ padding-bottom: 40px; }

.page--about .marquee-section{
  margin-top: 20px;
  padding-top: 20px;
}

@media (max-width: 799px){
  .page--about .page-hero{ padding-bottom: 32px; }
  .page--about .marquee-section{
    margin-top: 24px;
    padding-top: 24px;
  }
}

.page--about .about-grid{ margin-bottom: 40px; }
.page--about .big-quote{ margin-top: 0 !important; }

/* =========================================================
   ABOUT / MARQUEE — JAK KLIENCI (BEZ JS) + ZERO PRZERWY
   Wymaga: w HTML w .marquee__track są DWA IDENTYCZNE SETY kart (A + B)
========================================================= */

:root{
  --about-gap: 14px;
  --about-speed: 60s; /* wolniej */
}

@media (max-width: 799px){
  :root{
    --about-gap: 12px;
    --about-speed: 78s; /* jeszcze wolniej na mobile */
  }
}

.marquee-section{
  padding: 26px 0 60px;
  overflow: hidden;
}

.marquee-section .marquee{
  position: relative;
  width: 100%;
  padding: 0 18px;
}
@media (max-width: 799px){
  .marquee-section .marquee{ padding: 0 12px; }
}

.marquee-section .marquee__viewport{
  width: 100%;
  overflow: hidden;
  position: relative;
  padding: 16px 0;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  contain: layout paint;
}

/* fade (lewo/prawo) */
.marquee-section .marquee__fade{
  position:absolute;
  top:0; bottom:0;
  width: 90px;
  pointer-events:none;
  z-index: 3;
}
.marquee-section .marquee__fade--left{
  left:0;
  background: linear-gradient(90deg, rgba(11,11,11,1), rgba(11,11,11,0));
}
.marquee-section .marquee__fade--right{
  right:0;
  background: linear-gradient(270deg, rgba(11,11,11,1), rgba(11,11,11,0));
}
@media (max-width: 1279px){
  .marquee-section .marquee__fade{ width: 70px; }
}
@media (max-width: 799px){
  .marquee-section .marquee__fade{ width: 56px; }
}

/* TRACK: 2 sety => przesuwamy o -50% */
.marquee-section .marquee__track{
  display:flex;
  flex-wrap: nowrap;
  align-items: stretch;

  /* klucz: gap jest na TRACKU, ale NIE dokładaj żadnych marginów na końcu setów */
  gap: var(--about-gap);
  width: max-content;

  will-change: transform;
  transform: translate3d(0,0,0);
  -webkit-transform: translate3d(0,0,0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;

  animation: about-marquee-horizontal var(--about-speed) linear infinite;
}

/* ✅ dokładnie jak Klienci */
@keyframes about-marquee-horizontal{
  from{ transform: translate3d(0,0,0); }
  to  { transform: translate3d(-50%,0,0); }
}

/* WAŻNE: sety NIE mogą mieć własnego gap/margin, bo robi “podwójny” odstęp i wrażenie przerwy */
.marquee-section .marquee__set{
  display:flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0;          /* <-- reset */
  margin: 0;       /* <-- reset */
  padding: 0;      /* <-- reset */
}

/* karta (tylko w marquee) */
.marquee-section .marquee__card{
  flex: 0 0 auto;
  width: 360px;
}
@media (max-width: 1279px){
  .marquee-section .marquee__card{ width: 340px; }
}
@media (max-width: 799px){
  .marquee-section .marquee__card{ width: 300px; }
}

/* pauza tylko na desktop */
@media (hover:hover) and (pointer:fine){
  .marquee-section .marquee__viewport:hover .marquee__track{
    animation-play-state: paused;
  }
}
/* dotyk: nie pauzuj */
@media (hover:none) and (pointer:coarse){
  .marquee-section .marquee__viewport:hover .marquee__track{
    animation-play-state: running !important;
  }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .marquee-section .marquee__track{ animation:none !important; }
}

/* =========================================================
   PORTFOLIO — GRID + CARDS
========================================================= */
.lead{
  margin:0;
  color: var(--muted);
  line-height: 1.6;
  font-size: 14px;
}
.projects{ padding: 18px 0 44px; }

/* ✅ AUTO-DOPASOWANIE SIATKI DO ILOŚCI KAFLI */
.projectsGrid{
  display: grid;
  gap: 18px;
  align-items: start;

  /* automatyczna liczba kolumn zależnie od szerokości i ilości kart */
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

  /* przy małej ilości kart wygląda naturalnie */
  justify-content: center;
}

@media (max-width: 1100px){
  .projectsGrid{ gap:16px; }
}
@media (max-width: 740px){
  .projects{ padding: 18px 0 40px; }
  .projectsGrid{ gap:14px; }
}

.pCard{
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  background: rgba(255,255,255,.03);
  overflow: hidden;
  min-height: 210px;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}
.pCard:hover{
  transform: translateY(-2px);
  border-color: rgba(37,99,235,.45);
  background: rgba(255,255,255,.05);
}
.pTitle{
  margin:0;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .06em;
  opacity:.95;
}
.pSub{
  margin: 10px 0 0;
  color: rgba(242,242,242,.60);
  font-size: 12px;
  line-height: 1.65;
}
@media (hover:hover) and (pointer:fine){
  .pCard:hover }
.pCard.is-open 
/* =========================================================
   KLIENCI — HERO + TŁO + KARUZELA
========================================================= */
.clients-hero{position:relative;overflow:hidden;}

.clients-carousel{
  margin-top: auto;
  padding: 36px 0 56px;
  position: relative;
  z-index: 2;
}
.clients-carousel__viewport{
  width: 100%;
  overflow: hidden;
  position: relative;
  padding: 16px 0;
  -webkit-transform: translateZ(0);
}
.clients-carousel__fade{
  position:absolute;
  top:0; bottom:0;
  width: 90px;
  pointer-events:none;
  z-index: 3;
}
.clients-carousel__fade--top{ left:0; background: linear-gradient(90deg, rgba(0,0,0,1), rgba(0,0,0,0)); }
.clients-carousel__fade--bottom{ right:0; background: linear-gradient(270deg, rgba(0,0,0,1), rgba(0,0,0,0)); }
@media (max-width: 1279px){ .clients-carousel__fade{ width: 70px; } }
@media (max-width: 799px){ .clients-carousel__fade{ width: 56px; } }

/* track — animacja + stabilizacja */
.clients-carousel__track{
  display:flex;
  flex-wrap: nowrap;
  align-items:center;
  gap: 36px;
  width: max-content;

  will-change: transform;
  animation: clients-horizontal 18s linear infinite;

  transform: translate3d(0,0,0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0,0,0);
}
.clients-carousel__viewport:hover .clients-carousel__track{ animation-play-state: paused; }

@keyframes clients-horizontal{
  from{ transform: translate3d(0,0,0); }
  to{ transform: translate3d(-50%,0,0); }
}

@media (prefers-reduced-motion: reduce){ .clients-carousel__track{ animation:none; } }
@media (max-width: 1279px){ .clients-carousel__track{ animation-duration: 20s; } }
@media (max-width: 799px){ .clients-carousel__track{ animation-duration: 22s; } }

/* Na dotyku: nie pauzuj (hover jest losowy) + wolniej */
@media (hover: none) and (pointer: coarse){
  .clients-carousel__viewport:hover .clients-carousel__track{
    animation-play-state: running !important;
  }
}
@media (max-width: 768px){
  .clients-carousel__track{
    animation-duration: 28s !important;
    animation-timing-function: linear !important;
  }
}

/* KAFEL LOGO — większy */
.client-line{
  flex: 0 0 auto;
  width: clamp(220px, 20vw, 260px);
  height: 150px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;

  opacity: .96;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.client-line:hover{
  transform: translateY(-3px);
  background: rgba(255,255,255,.10);
  border-color: rgba(37,99,235,.55);
}

/* LOGOTYP */
.client-line__media{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.client-line__img{
  max-width: 88%;
  max-height: 78%;
  width: auto;
  height: auto;

  object-fit: contain;
  filter: grayscale(1) brightness(1.08);
  transition: filter .18s ease, transform .18s ease;
}
.client-line:hover .client-line__img{
  filter: grayscale(0) brightness(1.05);
  transform: scale(1.05);
}

/* tablet */
@media (max-width: 1200px){
  .client-line{
    width: clamp(200px, 24vw, 240px);
    height: 140px;
  }
}
/* mobile */
@media (max-width: 768px){
  .clients-carousel{ padding: 28px 0 40px; }
  .client-line{
    width: 78vw;
    max-width: 260px;
    height: 130px;
  }
  .client-line__img{
    max-width: 90%;
    max-height: 80%;
  }
}

/* =========================================================
   KONTAKT — FORM (NO OVERFLOW OUTSIDE)
========================================================= */
.contact-box{ margin-top: 18px; padding: 0 0 36px; }
.contact-form{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  box-shadow: 0 18px 45px rgba(0,0,0,.55);
  padding: 22px;
  max-width: 980px;
  overflow: hidden;
  overflow-x: hidden;
}
.contact-form *{ max-width: 100%; min-width: 0; }

.contact-grid-2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.contact-grid-2--tight{ margin-top: 10px; gap: 18px; }
.contact-grid-2 > .field{ margin-top: 0; }
.field{ margin-top: 14px; }
.field:first-child{ margin-top: 0; }

.field label{
  display:block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(242,242,242,.92);
  margin: 0 0 10px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  width:100%;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.92);
  padding: 14px 14px;
  font-size: 14px;
  outline: none;
}
.contact-form textarea{ resize: vertical; min-height: 120px; }

.contact-form input::placeholder,
.contact-form textarea::placeholder{ color: rgba(242,242,242,.45); }

.contact-form input:focus,
.contact-form textarea:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.fieldset{ border: 0; padding: 0; margin: 18px 0 0; }
.fieldset legend{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(242,242,242,.92);
  margin-bottom: 10px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.opt{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  padding: 7px 0;
  color: rgba(242,242,242,.88);
  font-size: 14px;
  line-height: 1.3;
  cursor: pointer;
  user-select:none;
  flex-wrap: wrap;
  max-width: 100%;
  min-width: 0;
}
.opt input{
  width: 14px;
  height: 14px;
  accent-color: var(--acid);
}

.form-actions{
  margin-top: 18px;
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.form-msg{
  margin: 0;
  font-size: 13px;
  color: rgba(242,242,242,.70);
}

@media (max-width: 900px){
  .contact-form{ padding: 18px; }
  .contact-grid-2{ grid-template-columns: 1fr; }
  .contact-grid-2--tight{ grid-template-columns: 1fr; }
}
@media (max-width: 799px){
  .contact-box{ padding-bottom: 26px; }
  .contact-form{ border-radius: 18px; padding: 16px; }
  .field label{ font-size: 12px; }
  .opt{ font-size: 13px; }
  .contact-form textarea{ min-height: 110px; }
}

/* =========================================================
   RODO (NO OVERFLOW OUTSIDE)
========================================================= */
.field--rodo{ margin-top: 14px; }
.rodo-consent{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  line-height: 1.35;
  flex-wrap: wrap;
  max-width: 100%;
  min-width: 0;
}
.rodo-consent input{
  width: 14px;
  height: 14px;
  accent-color: var(--acid);
  margin-top: 3px;
}
.rodo-consent span{
  font-weight: 900;
  color: rgba(242,242,242,.92);
  font-size: 14px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.rodo-consent a{
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.rodo-consent:hover span{ color: rgba(242,242,242,1); }
.rodo-consent:hover a{ text-decoration-thickness: 2px; }

/* =========================================================
   PRIVACY PAGE — odstęp przed footerem
========================================================= */
.page--privacy .card{ margin-bottom: 36px; }

/* =========================================================
   CONTACT — szerokość jak PORTFOLIO (1100px)
========================================================= */
.page--contact .contact-form{
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

/* =========================================================
   PROJECT PAGE (case study)
========================================================= */
.page--project .main{
  padding-top: calc(var(--nav-h) + var(--nav-gap) + 16px);
}

/* ✅ Sticky-killer guard: nie dawaj overflow:hidden na rodzicach sticky */
.page--project{ overflow-x: clip; }
@supports not (overflow: clip){
  .page--project{ overflow-x: hidden; }
}
.page--project .page-hero__inner,
.page--project .project-hero,
.page--project .container,
.page--project .main{ min-width: 0; }

/* ✅ PROJEKTY: MOBILE padding L/R + wyrównanie sekcji */
@media (max-width: 799px){
  .page--project .container{ padding-left: 20px; padding-right: 20px; }
  .page--project .page-hero{ padding-left: 20px; padding-right: 20px; }
  .page--project .project-challenges{ padding-left: 20px; padding-right: 20px; }
  .page--project .project-gallery{ padding-left: 20px; padding-right: 20px; }
  .page--project }

.project-hero{ padding-top: 56px; }
.project-title{ font-size: clamp(54px, 6vw, 96px); }

.project-lead{
  margin: 0;
  max-width: 860px;
  color: rgba(242,242,242,.55);
  line-height: 1.75;
  font-size: 18px;
}
@media (max-width: 799px){
  .project-lead{ font-size: 15px; }
}

/* =========================================================
   PROJEKTY — WYZWANIA (STICKY + GAP + NO HYPHENS)
========================================================= */
.project-challenges{ padding: 34px 0 20px; }

.project-challenges__inner{
  display: grid;
  grid-template-columns: 420px 1fr;
  column-gap: 64px;
  row-gap: 28px;
  align-items: start;
  overflow: visible;
}
.project-challenges,
.project-challenges__inner{ overflow: visible; }

.project-challenges__side{
  position: sticky;
  top: calc(var(--nav-h) + var(--nav-gap) + 18px);
  align-self: start;
  z-index: 5;
}

.project-challenges__title{
  margin: 0 0 18px;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1.05;
  text-transform: uppercase;
  font-size: clamp(34px, 3.2vw, 52px);

  white-space: normal;
  overflow: visible;
  text-overflow: clip;

  hyphens: none;
  word-break: normal;
  overflow-wrap: normal;
}
.project-challenges__cta{ margin-top: 10px; }

.project-challenges__cards{
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-top: 18px;
}

.project-card{
  padding: 22px 22px;
  border-radius: 18px;
}
.project-card__title{
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(242,242,242,.92);
}
.project-card__text{
  margin: 0;
  color: rgba(242,242,242,.65);
  line-height: 1.7;
  font-size: 13px;
}

@media (max-width: 900px){
  .project-challenges__inner{ grid-template-columns: 1fr; }
  .project-challenges__side{ position: static; top: auto; }
  .project-challenges__cards{ margin-top: 22px; }
}

@media (max-width: 799px){
  .project-challenges__title br{ display:none; }
  .project-challenges__title{
    font-size: clamp(16px, 5.2vw, 30px);
    letter-spacing: .02em;
    line-height: 1.06;
    hyphens: none;
    word-break: normal;
    overflow-wrap: normal;
  }
}
@media (max-width: 420px){
  .project-challenges__title{ font-size: clamp(14px, 5vw, 26px); }
}
@media (max-width: 360px){
  .project-challenges__title{ font-size: clamp(13px, 4.8vw, 24px); }
}

/* =========================================================
   PROJECT GALLERY / NEXT
========================================================= */
.project-gallery{ padding: 26px 0 20px; }

/* ✅ AUTO-DOPASOWANIE DO ILOŚCI "FRAME'ÓW" (zdjęć) */
.project-gallery__grid{
  display: grid;
  gap: 18px;

  /* automatyczna liczba kolumn zależnie od miejsca */
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));

  /* przy 1–2 zdjęciach wygląda naturalnie */
  justify-content: center;
}

/* Kafel zdjęcia */
.project-shot{
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;

  /* ✅ rekomendacja: równe ramki / spójny wygląd */
  aspect-ratio: 16 / 10;
  display: grid;
}

/* ✅ HOVER: żółta ramka jak Klienci */
@media (hover:hover) and (pointer:fine){
  .project-shot:hover{
    transform: translateY(-2px);
    border-color: rgba(37,99,235,.55);
    background: rgba(255,255,255,.05);
    box-shadow:
      0 0 0 1px rgba(37,99,235,.22),
      0 18px 55px rgba(37,99,235,.16),
      0 28px 70px rgba(0,0,0,.55);
  }
}

.project-shot img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;

  cursor: pointer;
  transition: filter .18s ease, transform .18s ease;
}
@media (hover:hover) and (pointer:fine){
  .project-shot:hover img{
    filter: brightness(1.05);
    transform: scale(1.01);
  }
}

/* ✅ jeśli gdzieś był pseudo-element z lupką — ubij */
.project-shot::after{ content: none !important; }
.project-shot .zoom,
.project-shot .zoom-icon,
.project-shot .loupe,
.project-shot .magnifier{ display:none !important; }


/* tablet / mobile */
@media (max-width: 900px){
  .project-gallery__grid{
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  }
}

/* =========================================================
   REDUCED MOTION
========================================================= */
@media (prefers-reduced-motion: reduce){
  .btn, .navbar__link, .drawer__item, .project-shot, .project-shot img{ transition:none !important; }
  .btn::after, .navbar__link::before{ display:none !important; }
  .clients-carousel__track, .marquee-section .marquee__track{ animation:none !important; }
}

/* =========================================================
   LIGHTBOX PRO — arrows + swipe
========================================================= */
.lightbox{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.88);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}
.lightbox.is-open{ opacity: 1; pointer-events: auto; }
.lightbox__stage{
  position: relative;
  width: min(92vw, 1400px);
  height: 88vh;
  display: grid;
  place-items: center;
}
.lightbox__img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 30px 120px rgba(0,0,0,.75);
  user-select: none;
  -webkit-user-drag: none;
  touch-action: pan-y;
}
.lightbox__btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 0;
  border: 1px solid rgba(37,99,235,.35);
  background: rgba(255,255,255,.08);
  color: rgba(242,242,242,.95);
  display: grid;
  place-items: center;
  cursor: pointer;

  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, opacity .16s ease;
}
.lightbox__btn:hover{
  transform: translateY(-50%) scale(1.04);
  background: rgba(255,255,255,.12);
  border-color: rgba(37,99,235,.55);
}
.lightbox__btn--prev{ left: -14px; }
.lightbox__btn--next{ right: -14px; }
@media (max-width: 799px){
  .lightbox__btn--prev{ left: 8px; }
  .lightbox__btn--next{ right: 8px; }
}
.lightbox__btn svg{ width: 22px; height: 22px; }
.lightbox__close{
  position: fixed;
  top: 18px;
  right: 18px;
  width: 52px;
  height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: rgba(242,242,242,.95);
  cursor: pointer;
  display: grid;
  place-items: center;
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
}
.lightbox__close:hover{ border-color: rgba(37,99,235,.45); }
.lightbox__counter{
  position: fixed;
  left: 18px;
  top: 20px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(242,242,242,.92);
  font-size: 12px;
  letter-spacing: .08em;
  font-weight: 800;
}
@media (max-width: 799px){
  .lightbox__counter{
    top: auto;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
  }
}

/* =========================================================
   PROJEKTY — H1 / nazwa projektu (FIX: desktop nie ucina)
========================================================= */
.page--project .page-hero__title,
.page--project .project-title,
.page--project h1{
  max-width: 100%;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;

  hyphens: none !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.page--project .page-hero__title.title--domain,
.page--project .project-title.title--domain,
.page--project h1.title--domain{
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
@media (max-width: 799px){
  .page--project .page-hero__title br,
  .page--project .project-title br,
  .page--project h1 br{ display:none !important; }

  .page--project .page-hero__title,
  .page--project .project-title,
  .page--project h1{
    font-size: clamp(14px, 4.8vw, 28px) !important;
    letter-spacing: .01em !important;
    line-height: 1.06 !important;
  }
}
@media (max-width: 420px){
  .page--project .page-hero__title,
  .page--project .project-title,
  .page--project h1{ font-size: clamp(12px, 4.4vw, 24px) !important; }
}
@media (max-width: 360px){
  .page--project .page-hero__title,
  .page--project .project-title,
  .page--project h1{ font-size: clamp(11px, 4.1vw, 22px) !important; }
}

/* =========================================================
   PROJEKTY — pRowTitle font Audiowide
========================================================= */

/* =========================
   COOKIE MODAL (minimal)
========================= */
.cookie-modal-open{ overflow: hidden; }

#cookieModal[aria-hidden="true"]{ display:none; }

#cookieModal{
  position: fixed;
  inset: 0;
  z-index: 30000;
}

.cookie-modal__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
}

.cookie-modal__panel{
  position: relative;
  width: min(560px, 92vw);
  margin: 8vh auto 0;
  border-radius: 18px;
  background: rgba(20,20,20,.96);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 120px rgba(0,0,0,.6);
  padding: 18px;
  color: #f2f2f2;
}

.cookie-modal__head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.cookie-modal__title{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 14px;
}

.cookie-modal__x{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.cookie-modal__desc{
  margin: 0 0 14px;
  color: rgba(242,242,242,.75);
  font-size: 13px;
  line-height: 1.5;
}

.cookie-modal__list{
  display:flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.cookie-toggle{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
}

.cookie-toggle input{ margin-top: 3px; accent-color: var(--acid); }

.cookie-toggle__text{ display:flex; flex-direction:column; gap: 2px; }
.cookie-toggle__name{ font-weight: 900; letter-spacing: .04em; }
.cookie-toggle__note{ font-size: 12px; opacity: .75; }

.cookie-toggle--locked{ opacity: .75; }

.cookie-modal__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.cookie-btn{
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: #fff;
  cursor:pointer;
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .08em;
  font-size: 11px;
  text-transform: uppercase;
}

.cookie-btn--primary{
  background: var(--acid);
  color: var(--ink);
  border-color: rgba(0,0,0,.20);
}
.cookie-btn:hover{ filter: brightness(1.05); }

/* =========================
   COOKIE BANNER (first visit)
========================= */
.cookie-banner{
  position: fixed;
  left: 0; right: 0;
  bottom: 0;
  z-index: 25000;
  padding: 14px;
  pointer-events: none; /* aktywne dopiero jak visible */
}

.cookie-banner.is-visible{
  pointer-events: auto;
}

.cookie-banner__inner{
  max-width: 1100px;
  margin: 0 auto;
  border-radius: 18px;
  background: rgba(0,0,0,.78);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);

  padding: 16px;
  display:flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  transform: translateY(16px);
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease;
}

.cookie-banner.is-visible .cookie-banner__inner{
  transform: translateY(0);
  opacity: 1;
}

.cookie-banner__title{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
  margin-bottom: 6px;
}

.cookie-banner__desc{
  color: rgba(242,242,242,.72);
  font-size: 13px;
  line-height: 1.45;
  max-width: 62ch;
}

.cookie-banner__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* mobile */
@media (max-width: 900px){
  .cookie-banner__inner{
    flex-direction: column;
    align-items: stretch;
  }
  .cookie-banner__actions{
    width: 100%;
    justify-content: stretch;
  }
  .cookie-banner__actions .cookie-btn{
    flex: 1 1 auto;
    text-align: center;
  }
}

/* =========================================================
   FOOTER CONTACT — YELLOW / ACID (SPÓJNY + MOBILE FIX)
========================================================= */
.footer-contact{
  background: var(--acid);
  color: var(--ink);
  padding: 40px 28px 18px;
}

/* INNER */
.footer-contact__inner{
  max-width: 1100px;
  margin: 0 auto;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

/* BRAND */
.footer-contact__brand{
  display:flex;
  flex-direction:column;
  gap: 12px;

  order: 1;
  align-items: flex-start;
  text-align: left;
}

.footer-contact__logo{
  width: 150px;
  height: auto;
  filter: drop-shadow(0 6px 24px rgba(0,0,0,.35));
}

.footer-contact__tagline{
  margin: 0;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: .85;
  font-family: "Audiowide", ui-sans-serif, system-ui;
}

/* CONTACT DATA */
.footer-contact__data{
  display:flex;
  align-items: center;
  gap: 26px;

  order: 2;
  min-width: 0;
}

/* ITEM (kafel) */
.footer-contact__item{
  display:flex;
  flex-direction:column;
  gap: 6px;

  padding: 14px 16px;
  border-radius: 18px;

  background: rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.18);

  text-decoration: none;
  color: var(--ink);

  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, border-color .14s ease;

  /* ✅ FIX: nigdy nie wymuszaj szerokości na mobile */
  min-width: 240px;
  max-width: 520px;
  overflow: hidden; /* nic nie wyjdzie poza ramkę */
}

.footer-contact__item:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
  background: rgba(0,0,0,.10);
  border-color: rgba(0,0,0,.24);
}

.footer-contact__label{
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 900;
  opacity: .75;
}

/* ✅ FIX: value (mail/telefon) mieści się w ramce */
.footer-contact__value{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  font-size: 18px;
  letter-spacing: .08em;
  line-height: 1.15;

  display:block;
  width: 100%;
  max-width: 100%;
  min-width: 0;

  /* łamanie bez nachodzenia na border */
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* BOTTOM BAR */
.footer-contact__bottom{
  max-width: 1100px;
  margin: 28px auto 0;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.18);

  display:flex;
  justify-content: center;
  align-items: center;
  gap: 10px;

  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 800;
}

.footer-contact__sep{ opacity:.55; }

/* COOKIE BUTTON */
.footer-contact__cookies{
  background: transparent;
  border: 0;
  padding: 0;

  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 900;

  cursor: pointer;
  color: var(--ink);

  text-decoration: underline;
  text-underline-offset: 4px;
}
.footer-contact__cookies:hover{ opacity: .75; }

/* =========================================================
   MOBILE — kontakt nad logo + centrowanie + dopasowanie fontów
========================================================= */
@media (max-width: 900px){
  .footer-contact{ padding: 34px 18px 16px; }

  .footer-contact__inner{
    flex-direction: column;
    align-items: center;
    gap: 22px;
  }

  /* kontakt NA GÓRZE */
  .footer-contact__data{
    order: 1;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    text-align: center;
  }

  /* ✅ Kafel: pełna szerokość, ale bez wymuszania min-width */
  .footer-contact__item{
    min-width: 0;
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    padding: 16px 16px;
  }

  .footer-contact__label{
    font-size: 11px;
    letter-spacing: .20em;
  }

  /* ✅ Telefon = mail (ten sam sizing), mniej “tracking” żeby nie nachodziło */
  .footer-contact__value{
    text-align: center;
    font-size: clamp(14px, 4.2vw, 18px);
    letter-spacing: clamp(.02em, 0.7vw, .07em);
    line-height: 1.15;
  }

  /* logo POD spodem */
  .footer-contact__brand{
    order: 2;
    align-items: center;
    text-align: center;
  }
  .footer-contact__logo{ margin: 0 auto; }

  /* bottom bar na kolumnę */
  .footer-contact__bottom{
    flex-direction: column;
    gap: 6px;
    text-align:center;
  }
}

/* ultra-małe ekrany */
@media (max-width: 380px){
  .footer-contact__value{
    font-size: 14px;
    letter-spacing: .03em;
  }
}

/* =========================================================
   MOBILE ONLY — kontakt nad logo + centrowanie logo
========================================================= */
@media (max-width: 900px){

  .footer-contact__inner{
    flex-direction: column;
    align-items: center;
    gap: 26px;
  }

  /* kontakt NA GÓRZE */
  .footer-contact__data{
    order: 1;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    text-align: center;
  }

  /* logo POD spodem + centrowanie */
  .footer-contact__brand{
    order: 2;
    align-items: center;
    text-align: center;
  }

  .footer-contact__logo{ margin: 0 auto; }

  /* bottom bar na kolumnę */
  .footer-contact__bottom{
    flex-direction: column;
    gap: 6px;
  }
}

/* =========================================================
   CONSULTATION / BOOKING — CLEAN (page--consultation)
   Wklej do styles.css (na końcu)
========================================================= */

.page--consultation .booking{
  padding: 18px 0 56px;
}

.page--consultation .booking__wrap{
  position: relative;
}

.page--consultation .booking-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: start;
}

.page--consultation .booking-col{ min-width: 0; }

.page--consultation .booking-card{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 26px;
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  padding: 18px;
  overflow: hidden;
}

/* Header in card */
.page--consultation .booking-head{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.page--consultation .booking-head--tight{
  margin-bottom: 10px;
}

.page--consultation .booking-head__left{
  display:flex;
  gap: 12px;
  align-items:flex-start;
}

.page--consultation .booking-ic{
  width: 34px;
  height: 34px;
  display:grid;
  place-items:center;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
}

.page--consultation .booking-kicker{
  font-size: 12px;
  letter-spacing: .14em;
  font-weight: 900;
  opacity: .85;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.page--consultation .booking-h{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-size: 28px;
  line-height: 1.05;
}

.page--consultation .booking-datebadge{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .10em;
  opacity: .85;
  padding-top: 10px;
  white-space: nowrap;
}

/* Month bar (new row) */
.page--consultation .booking-monthbar{
  display:flex;
  align-items:center;
  justify-content: center;
  gap: 12px;
  padding: 8px 0 2px;
  margin-bottom: 8px;
}

.page--consultation .booking-month{
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .08em;
  opacity: .92;
  min-width: 180px;
  text-align:center;
}

.page--consultation .booking-navbtn{
  width: 54px;
  height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.95);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size: 28px;
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
}
.page--consultation .booking-navbtn:hover{
  border-color: rgba(37,99,235,.35);
}

/* Calendar */
.page--consultation .booking-dow{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  padding: 8px 4px 2px;
  opacity: .75;
  font-weight: 900;
  letter-spacing: .12em;
  font-size: 12px;
  text-align:center;
}

.page--consultation .booking-days{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px;
  padding: 10px 4px 6px;
}

/* day cell */
.page--consultation .cal-day{
  height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(242,242,242,.92);
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .06em;
  cursor:pointer;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.18);
  transition: transform .12s ease, border-color .12s ease, background .12s ease, opacity .12s ease;
}

.page--consultation .cal-day:hover{
  border-color: rgba(37,99,235,.35);
  transform: translateY(-1px);
}

.page--consultation .cal-day.is-selected{
  background: rgba(37,99,235,.95);
  color: #0b0b0b;
  border-color: rgba(0,0,0,.25);
}

.page--consultation .cal-day.is-disabled{
  opacity: .30;
  cursor: not-allowed;
  transform: none;
}

.page--consultation .cal-day.is-outside{
  opacity: .60;
}

/* Legend */
.page--consultation .booking-legend{
  display:flex;
  gap: 18px;
  align-items:center;
  padding: 10px 4px 0;
  opacity: .75;
}

.page--consultation .legend-dot{
  width: 18px; height: 18px;
  border-radius: 6px;
  display:inline-block;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  margin-right: 8px;
  vertical-align: middle;
}
.page--consultation .legend-dot.is-selected{
  background: rgba(0,0,0,1);
  border-color: rgba(0,0,0,.5);
}
.page--consultation .legend-dot.is-available{ background: rgba(255,255,255,.10); }
.page--consultation .legend-dot.is-disabled{ background: rgba(255,255,255,.02); opacity:.5; }

/* Right column hints */
.page--consultation .booking-hint{
  margin: 8px 0 14px;
  color: rgba(242,242,242,.72);
  line-height: 1.6;
  font-size: 15px;
}
.page--consultation .booking-note{
  margin: 12px 0 0;
  color: rgba(242,242,242,.60);
  font-size: 13px;
}

/* Times */
.page--consultation .booking-times{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

/* pills (time) */
.page--consultation .pill{
  height: 64px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.95);
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .06em;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, opacity .12s ease;
}
.page--consultation .pill:hover{
  border-color: rgba(37,99,235,.35);
  transform: translateY(-1px);
}
.page--consultation .pill.is-selected{
  background: rgba(0,0,0,.92);
  border-color: rgba(37,99,235,.40);
  box-shadow: 0 0 0 1px rgba(37,99,235,.18);
}
.page--consultation .pill.is-disabled{
  opacity: .28;
  cursor: not-allowed;
  transform: none;
}

/* Topics */
.page--consultation .booking-topics{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.page--consultation .topic{
  height: 72px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.95);
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .06em;
  cursor:pointer;
  text-align:left;
  padding: 0 18px;
  display:flex;
  align-items:center;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.page--consultation .topic:hover{
  border-color: rgba(37,99,235,.35);
  transform: translateY(-1px);
}
.page--consultation .topic.is-selected{
  background: rgba(0,0,0,.92);
  border-color: rgba(37,99,235,.40);
  box-shadow: 0 0 0 1px rgba(37,99,235,.18);
}

/* Form section spacing */
.page--consultation .booking-formwrap{
  margin-top: 18px;
}

.page--consultation .booking-fields{
  margin-top: 16px;
  display: grid;
  gap: 18px;
}

.page--consultation .booking-grid2{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

/* Make fields feel “less tight” */
.page--consultation .field{ margin-top: 0; }
.page--consultation .field label{
  display:block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(242,242,242,.92);
  margin: 0 0 10px;
}

.page--consultation .booking-form input[type="text"],
.page--consultation .booking-form input[type="email"],
.page--consultation .booking-form input[type="tel"],
.page--consultation .booking-form textarea{
  width:100%;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.92);
  padding: 16px 16px;
  font-size: 14px;
  outline: none;
}

.page--consultation .booking-form textarea{
  resize: vertical;
  min-height: 170px;
}

.page--consultation .booking-form input::placeholder,
.page--consultation .booking-form textarea::placeholder{
  color: rgba(242,242,242,.45);
}

.page--consultation .booking-form input:focus,
.page--consultation .booking-form textarea:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

/* Summary box */
.page--consultation .booking-finalsummary{
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(242,242,242,.82);
  display:grid;
  gap: 8px;
}

/* Responsive */
@media (max-width: 1024px){
  .page--consultation .booking-grid{ grid-template-columns: 1fr; }
  .page--consultation .booking-times{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page--consultation .booking-grid2{ grid-template-columns: 1fr; }
}

@media (max-width: 540px){
  .page--consultation .booking-times{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page--consultation .booking-h{ font-size: 24px; }
}

/* =========================================================
   BONUS: LEPSZY UKŁAD DLA 1 i 2 ZDJĘĆ (progressive enhancement)
   - działa w Chrome/Edge/Safari (zależnie od wersji)
   - fallback: auto-fit zadziała wszędzie
========================================================= */
.project-gallery__grid:has(> :nth-child(1):last-child){
  grid-template-columns: minmax(280px, 980px);
  justify-content: center;
}
.project-gallery__grid:has(> :nth-child(2):last-child){
  grid-template-columns: repeat(2, minmax(260px, 520px));
  justify-content: center;
}


/* =========================================================
   HOW — CAROUSEL (scroll-snap + arrows) ✅
   - Safari safe (no <li> counters)
   - No fades here (nie zasłania treści)
   - CTA centered on desktop
   - Track padding aligns with .container
========================================================= */

.how--carousel{
  padding: 18px 0 44px; /* jak portfolio */
}

.how--carousel .how__head{ margin-bottom: 18px; }
.how--carousel .how__title{ margin: 0 0 18px; }
.how--carousel .how__lead{
  margin: 0;
  max-width: 78ch;
  color: var(--muted);
  line-height: 1.6;
  font-size: 14px;
}

/* Safari guard: jeśli ktoś użyje ul/ol w środku — nie pokazuj numeracji */
.how--carousel ul,
.how--carousel ol{
  list-style: none;
  padding: 0;
  margin: 0;
}

/* top bar */
.howc__top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  margin-bottom: 10px;
}

.howc__hint{
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 800;
  opacity: .65;
}

.howc__nav{
  display:flex;
  gap: 10px;
}

.howc__btn{
  width: 54px;
  height: 54px;
  border-radius: 0;
  border: 1px solid rgba(37,99,235,.35);
  background: rgba(255,255,255,.06);
  color: rgba(242,242,242,.95);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size: 22px;
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}
.howc__btn:hover{
  transform: translateY(-1px);
  border-color: rgba(37,99,235,.55);
  background: rgba(255,255,255,.10);
}
.howc__btn:active{ transform: translateY(0); }

/* viewport (bez fade/ciemnych masek) */
.howc__viewport{
  position: relative;
  overflow: hidden;
  padding: 12px 0 16px;
}

/* ❌ usuń pseudo-fade jeśli gdzieś zostało */
.howc__viewport::before,
.howc__viewport::after{ display:none !important; }

/* scroll area — padding jak .container */
.howc__track{
  display:flex;
  gap: 18px;
  align-items: stretch;

  overflow-x: auto;
  overflow-y: hidden;

  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;

  /* MOBILE (.container = 18px) */
  padding: 8px 18px;
  margin: 0 -18px;
  scroll-padding-left: 18px;
  scroll-padding-right: 18px;

  scrollbar-width: none;
}
.howc__track::-webkit-scrollbar{ display:none; }

/* DESKTOP (.container = 28px) */
@media (min-width: 800px){
  .howc__track{
    padding: 10px 28px;
    margin: 0 -28px;
    scroll-padding-left: 28px;
    scroll-padding-right: 28px;
  }
}

/* karta */
.howCard{
  flex: 0 0 auto;
  width: min(520px, 86vw); /* mobile: prawie pełna */
  min-height: 220px;

  border-radius: 18px;
  padding: 18px;
  overflow: hidden;

  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 12px 30px rgba(0,0,0,.35);

  scroll-snap-align: start;
  scroll-margin-left: 28px;
  scroll-margin-right: 28px;

  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}
@media (hover:hover) and (pointer:fine){
  .howCard:hover{
    transform: translateY(-2px);
    border-color: rgba(37,99,235,.45);
    background: rgba(255,255,255,.05);
  }
}

/* top */
.howCard__top{
  display:flex;
  align-items:center;
  gap: 12px;
  margin-bottom: 10px;
}

.howCard__num{
  width: 54px;
  height: 34px;
  border-radius: 16px;
  background: rgba(37,99,235,.14);
  border: 1px solid rgba(37,99,235,.28);
  color: rgba(242,242,242,.92);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family: "Audiowide", ui-sans-serif, system-ui;
  letter-spacing: .10em;
  font-size: 12px;
}

.howCard__h{
  margin: 0;
  font-family: "Audiowide", ui-sans-serif, system-ui;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 14px;
  line-height: 1.15;
}

.howCard__p{
  margin: 0;
  color: rgba(242,242,242,.62);
  line-height: 1.65;
  font-size: 13px;
}

/* ostatnia karta jako link — bez podkreśleń */
a.howCard{ text-decoration: none; color: inherit; }

/* CTA */
.how--carousel .how__cta{ margin-top: 14px; }
@media (min-width: 900px){
  .how--carousel .how__cta{
    display:flex;
    justify-content: center; /* desktop: wyśrodkuj */
  }
}

/* desktop: karty mniejsze */
@media (min-width: 1024px){
  .howCard{ width: 420px; }
}

/* mobile: odstępy H2 jak H1/Klienci + CTA full width */
@media (max-width: 799px){
  .how--carousel .how__title{
    margin: 0 0 26px; /* jak page-hero__title spacing */
  }
  .howc__hint{ display:none; }
  .howc__btn{ width: 52px; height: 52px; }
  .how--carousel .how__cta .btn{ width: 100%; justify-content: center; }
}

/* =========================================================
   CLIENTS — MOVE FADES HERE (viewport) ✅
   - wykorzystujemy cień tutaj (nie w HOW)
========================================================= */

/* jeśli masz w HTML .clients-carousel__fade — wyłącz, żeby nie było podwójnie */
.clients-carousel__fade{ display:none !important; }

.clients-carousel__viewport{
  position: relative;
}

/* fade left/right */
.clients-carousel__viewport::before,
.clients-carousel__viewport::after{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width: 90px;
  pointer-events:none;
  z-index: 3;
}
.clients-carousel__viewport::before{
  left:0;
  background: linear-gradient(90deg, rgba(0,0,0,1), rgba(0,0,0,0));
}
.clients-carousel__viewport::after{
  right:0;
  background: linear-gradient(270deg, rgba(0,0,0,1), rgba(0,0,0,0));
}
@media (max-width: 1279px){
  .clients-carousel__viewport::before,
  .clients-carousel__viewport::after{ width: 70px; }
}
@media (max-width: 799px){
  .clients-carousel__viewport::before,
  .clients-carousel__viewport::after{ width: 56px; }
}

/* =========================================================
   LIGHTBOX — CAPTION ON IMAGE (only after open)
   - overlay na dole, wyśrodkowany
   - nie wychodzi poza obręb "stage" (a praktycznie: poza zdjęcie)
========================================================= */

.lightbox__stage{
  position: relative; /* już masz, ale zostawiam jako pewnik */
}

/* domyślnie: overlay na dole (w obrębie lightbox stage) */
.lightbox__caption{
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);

  /* nie wychodź poza obszar obrazu/stage */
  max-width: calc(100% - 120px); /* zostawia miejsce na strzałki */
  width: fit-content;

  padding: 12px 14px;
  border-radius: 16px;

  background: rgba(0,0,0,.62);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);

  color: rgba(242,242,242,.92);
  font-size: 12px;
  line-height: 1.25;
  letter-spacing: .10em;
  text-transform: uppercase;

  text-align: center;
  overflow-wrap: anywhere;

  box-shadow: 0 18px 55px rgba(0,0,0,.55);
  pointer-events: none;

  z-index: 2; /* nad obrazem */
}

/* Mobile: zmniejsz margines na strzałki */
@media (max-width: 799px){
  .lightbox__caption{
    bottom: 16px;
    max-width: calc(100% - 72px);
    font-size: 11px;
    letter-spacing: .08em;
  }
}
/* =========================================================
   NAVIGATION V3 — FLAT / EDITORIAL / TECHNICAL
========================================================= */
@media (min-width: 1025px){
  body .navbar{top:16px;}
  body .navbar__inner{
    height:72px;
    max-width:min(1440px,calc(100vw - 64px));
    padding:0 0 0 18px;
    gap:0;
    border-radius:0;
    border:0;
    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.12);
    background:rgba(10,10,10,.88);
    backdrop-filter:blur(18px);
    box-shadow:0 18px 60px rgba(0,0,0,.22);
  }
  body .navbar__brand{gap:10px;min-width:220px;}
  body .navbar__logo{width:auto;height:38px;}
  body .navbar__brandtext{display:block;font-size:9px;line-height:1.08;letter-spacing:.09em;}
  body .navbar__nav{height:100%;margin-left:auto;gap:0;}
  body .navbar__link{
    height:100%;
    padding:0 20px;
    border:0;
    border-left:1px solid rgba(255,255,255,.06);
    border-radius:0;
    background:transparent;
    color:rgba(242,242,242,.68);
    font-size:10px;
    letter-spacing:.14em;
    transform:none;
    overflow:visible;
    transition:color .22s ease,background .22s ease;
  }
  body .navbar__link::before{display:none;}
  body .navbar__link::after{
    content:"";
    position:absolute;
    left:20px;
    right:20px;
    bottom:-1px;
    height:2px;
    background:var(--acid);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .24s ease;
  }
  body .navbar__link:hover{transform:none;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.06);color:var(--paper);}
  body .navbar__link:hover::after,body .navbar__link.is-active::after{transform:scaleX(1);}
  body .navbar__link.is-active{background:transparent;border-color:rgba(255,255,255,.06);color:var(--acid);}
  body .navbar__link.is-active:hover{color:var(--acid);}
  body .navbar__cta.btn{
    align-self:stretch;
    margin:0 0 0 16px;
    padding:0 14px 0 20px;
    min-width:218px;
    border-radius:0!important;
    transform:none;
    box-shadow:none;
    border:0;
    border-left:1px solid rgba(0,0,0,.14);
    font-size:9px;
    letter-spacing:.11em;
  }
  body .navbar__cta.btn:hover{transform:none;box-shadow:none;}
  body .navbar__cta .btn__arrow{width:34px;height:34px;border-radius:0;}
}

@media (max-width: 1024px){
  body .navbar__inner{max-width:calc(100vw - 28px);padding:0 4px 0 10px;border-radius:0;border:0;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(10,10,10,.82);backdrop-filter:blur(16px);box-shadow:none;}
  body .hamburger{width:52px;height:52px;border-radius:0;background:transparent;border:0;border-left:1px solid rgba(255,255,255,.1);box-shadow:none;}
  body .hamburger span{height:2px;width:24px;border-radius:0;}
}


/* FOOTER REDESIGN V4 */
.footer-contact{
  background:#0b0b0b;
  color:var(--paper, #f2f2f2);
  padding: 54px 0 20px;
  border-top:1px solid rgba(255,255,255,.08);
}
.footer-contact__inner,
.footer-contact__bottom{
  width:min(1380px, calc(100vw - 64px));
  max-width:1380px;
  margin-left:auto;
  margin-right:auto;
}
.footer-contact__inner{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(140px,.48fr) minmax(240px,.7fr) minmax(260px,.75fr);
  grid-template-areas:"cta brand phone mail";
  gap:32px;
  align-items:center;
}
.footer-contact__cta{grid-area:cta;max-width:none;align-items:flex-start;gap:16px;padding-right:10px;order:unset}
.footer-contact__brand{grid-area:brand;justify-self:center;align-items:center;text-align:center;gap:16px;order:unset}
.footer-contact__data{display:contents;order:unset}
.footer-contact__item--phone{grid-area:phone}
.footer-contact__item--mail{grid-area:mail}
.footer-contact__item{
  min-width:0;
  width:100%;
  min-height:148px;
  justify-content:center;
  padding:26px 30px;
  border-radius:28px;
  background:rgba(255,255,255,.028);
  border:1px solid rgba(255,255,255,.11);
  color:var(--paper, #f2f2f2);
  box-shadow:none;
}
.footer-contact__item:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 38px rgba(0,0,0,.22);
  background:rgba(255,255,255,.05);
  border-color:rgba(37,99,235,.38);
}
.footer-contact__label{
  color:rgba(242,242,242,.68);
  font-size:11px;
  letter-spacing:.22em;
}
.footer-contact__value{
  color:#fff;
  font-size:clamp(18px,1.5vw,24px);
  letter-spacing:.06em;
  line-height:1.15;
}
.footer-contact__logo{
  width:116px;
  filter:invert(1) brightness(.98) opacity(.92);
}
.footer-contact__tagline{
  color:rgba(242,242,242,.8);
  line-height:1.35;
  letter-spacing:.16em;
}
.footer-contact__cta .footer-contact__label{color:var(--acid, #2563EB)}
.footer-contact__ctaText{
  color:rgba(242,242,242,.76);
  font-size:clamp(16px,1.2vw,18px);
  line-height:1.45;
  max-width:760px;
}
.footer-contact__ctaActions{display:flex;flex-wrap:wrap;gap:22px;align-items:center;flex-direction:row}
.footer-contact__textlink{
  color:var(--paper, #f2f2f2);
  font-size:12px;
  letter-spacing:.12em;
}
.footer-contact__textlink::after{background:var(--acid, #2563EB)}
.footer-contact__textlink span{color:var(--acid, #2563EB)}
.footer-contact__bottom{
  margin-top:34px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  justify-content:flex-start;
  color:rgba(242,242,242,.64);
}
.footer-contact__cookies{color:var(--paper, #f2f2f2)}

@media (max-width: 1260px){
  .footer-contact__inner{
    grid-template-columns:minmax(0,1fr) minmax(220px,.75fr) minmax(220px,.75fr);
    grid-template-areas:
      "cta cta brand"
      "phone mail brand";
    align-items:stretch;
  }
  .footer-contact__brand{align-self:center}
}

@media (max-width: 900px){
  .footer-contact{padding:40px 0 18px}
  .footer-contact__inner,
  .footer-contact__bottom{width:calc(100vw - 24px)}
  .footer-contact__inner{
    grid-template-columns:1fr;
    grid-template-areas:
      "cta"
      "brand"
      "phone"
      "mail";
    gap:20px;
  }
  .footer-contact__cta,
  .footer-contact__brand{padding-right:0;align-items:center;text-align:center}
  .footer-contact__ctaText{max-width:640px}
  .footer-contact__ctaActions{flex-direction:column;align-items:center;width:100%}
  .footer-contact__cta .btn{width:100%;max-width:560px;justify-content:center}
  .footer-contact__item{min-height:0;padding:20px 18px;border-radius:22px;text-align:center;align-items:center}
  .footer-contact__value{font-size:clamp(16px,5.2vw,20px);letter-spacing:.04em;text-align:center}
  .footer-contact__bottom{justify-content:center;flex-wrap:wrap;text-align:center;gap:8px}
}

@media (max-width: 520px){
  .footer-contact__item{padding:18px 16px}
  .footer-contact__value{font-size:15px;letter-spacing:.03em}
  .footer-contact__logo{width:92px}
}


/* FOOTER REDESIGN V5 */
.footer-contact{
  position:relative;
  background:#0b0b0b;
  color:var(--paper, #f2f2f2);
  padding:0 0 22px;
  border-top:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}
.footer-contact::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:76px 76px;
  opacity:.45;
}
.footer-contact__inner,
.footer-contact__bottom{
  position:relative;
  z-index:1;
  width:min(1380px, calc(100vw - 64px));
  max-width:1380px;
  margin:0 auto;
}
.footer-contact__inner{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(180px,.45fr) minmax(0,.95fr);
  gap:40px;
  align-items:end;
  padding:58px 0 40px;
}
.footer-contact__cta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
  max-width:none;
}
.footer-contact__title{
  margin:0;
  max-width:820px;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(28px,3.5vw,54px);
  line-height:1.02;
  text-transform:uppercase;
  color:var(--paper, #f2f2f2);
}
.footer-contact__label{
  display:inline-block;
  color:var(--acid, #2563EB);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.footer-contact__ctaText{
  margin:0;
  max-width:720px;
  color:rgba(242,242,242,.72);
  font-size:16px;
  line-height:1.7;
}
.footer-contact__ctaActions{
  display:flex;
  flex-wrap:wrap;
  gap:18px 24px;
  align-items:center;
}
.footer-contact__textlink{
  display:inline-flex;
  align-items:center;
  gap:12px;
  position:relative;
  padding-bottom:6px;
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--paper, #f2f2f2);
}
.footer-contact__textlink::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--acid, #2563EB);
  transform:scaleX(.3);
  transform-origin:left;
  transition:transform .25s ease;
}
.footer-contact__textlink:hover::after{transform:scaleX(1)}
.footer-contact__textlink span{color:var(--acid, #2563EB)}
.footer-contact__brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-height:100%;
  padding:24px 12px;
  border-left:1px solid rgba(255,255,255,.08);
  border-right:1px solid rgba(255,255,255,.08);
}
.footer-contact__logo{
  width:108px;
  height:auto;
  filter:invert(1) opacity(.92);
}
.footer-contact__tagline{
  margin:0;
  color:rgba(242,242,242,.82);
  font-family:"Audiowide",sans-serif;
  font-size:11px;
  line-height:1.45;
  letter-spacing:.15em;
  text-align:center;
  text-transform:uppercase;
}
.footer-contact__data{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  align-self:stretch;
}
.footer-contact__item{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  min-height:142px;
  padding:24px 24px 24px;
  border-radius:0;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.11);
  color:var(--paper, #f2f2f2);
  text-decoration:none;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.footer-contact__item:hover{
  background:rgba(255,255,255,.045);
  border-color:rgba(37,99,235,.38);
  transform:translateY(-2px);
  box-shadow:none;
}
.footer-contact__item .footer-contact__label{margin-bottom:14px;color:rgba(242,242,242,.58)}
.footer-contact__value{
  display:block;
  width:100%;
  max-width:100%;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(18px,1.25vw,22px);
  line-height:1.2;
  letter-spacing:.05em;
  color:#fff;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.footer-contact__bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(242,242,242,.58);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:800;
}
.footer-contact__cookies{
  background:transparent;
  border:0;
  padding:0;
  color:var(--paper, #f2f2f2);
  font:inherit;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:4px;
}
.footer-contact__cookies:hover{opacity:.72}

@media (max-width: 1240px){
  .footer-contact__inner{
    grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
    gap:26px 28px;
  }
  .footer-contact__cta{grid-column:1 / -1}
  .footer-contact__brand{border-right:0}
}

@media (max-width: 900px){
  .footer-contact{padding-bottom:18px}
  .footer-contact__inner,
  .footer-contact__bottom{width:calc(100vw - 24px)}
  .footer-contact__inner{
    grid-template-columns:1fr;
    gap:20px;
    padding:40px 0 28px;
  }
  .footer-contact__cta{align-items:flex-start}
  .footer-contact__title{font-size:clamp(24px,10vw,40px)}
  .footer-contact__ctaActions{flex-direction:column;align-items:stretch;width:100%}
  .footer-contact__cta .btn{width:100%;max-width:none;justify-content:center}
  .footer-contact__brand{
    border:1px solid rgba(255,255,255,.08);
    padding:20px 18px;
  }
  .footer-contact__data{grid-template-columns:1fr}
  .footer-contact__item{min-height:0;padding:20px 18px}
  .footer-contact__bottom{
    flex-direction:column;
    justify-content:center;
    text-align:center;
    gap:8px;
  }
}


/* FOOTER REDESIGN V6 */
.footer-contact{
  position:relative;
  background:#0b0b0b;
  color:var(--paper, #f2f2f2);
  padding:54px 0 22px;
  border-top:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}
.footer-contact::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:76px 76px;
  opacity:.42;
}
.footer-contact__inner{
  position:relative;
  z-index:1;
  width:min(1440px, calc(100vw - 64px));
  margin:0 auto;
}
.footer-contact__top,
.footer-contact__middle,
.footer-contact__bottom{
  display:grid;
  grid-template-columns:repeat(12, minmax(0, 1fr));
  gap:24px;
}
.footer-contact__top{
  align-items:end;
  padding-bottom:28px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.footer-contact__lead{grid-column:1 / span 9;}
.footer-contact__brand{
  grid-column:10 / span 3;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  gap:16px;
  min-height:100%;
  padding-left:18px;
  border-left:1px solid rgba(255,255,255,.08);
}
.footer-contact__kicker{
  display:inline-block;
  margin-bottom:18px;
  color:var(--acid, #2563EB);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.footer-contact__headline{
  margin:0;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(36px,5vw,76px);
  line-height:.98;
  letter-spacing:-.02em;
  text-transform:uppercase;
  color:var(--paper, #f2f2f2);
}
.footer-contact__headline span{
  color:transparent;
  -webkit-text-stroke:1px var(--acid, #2563EB);
}
.footer-contact__logo{
  width:94px;
  height:auto;
  filter:invert(1) opacity(.95);
}
.footer-contact__brandText{
  margin:0;
  color:rgba(242,242,242,.78);
  font-family:"Audiowide",sans-serif;
  font-size:11px;
  line-height:1.5;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-contact__middle{
  align-items:start;
  padding:28px 0 24px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.footer-contact__copy{grid-column:1 / span 5;}
.footer-contact__copy p{
  margin:0;
  max-width:540px;
  color:rgba(242,242,242,.72);
  font-size:17px;
  line-height:1.72;
}
.footer-contact__actions{
  grid-column:6 / span 3;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:18px;
}
.footer-contact__actions .btn{
  min-width:min(100%, 360px);
}
.footer-contact__textlink{
  display:inline-flex;
  align-items:center;
  gap:12px;
  position:relative;
  padding-bottom:6px;
  color:var(--paper, #f2f2f2);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-contact__textlink::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--acid, #2563EB);
  transform:scaleX(.38);
  transform-origin:left;
  transition:transform .25s ease;
}
.footer-contact__textlink:hover::after{transform:scaleX(1)}
.footer-contact__textlink span{color:var(--acid, #2563EB)}
.footer-contact__contact{
  grid-column:9 / span 4;
  display:flex;
  flex-direction:column;
  gap:0;
  border:1px solid rgba(255,255,255,.1);
}
.footer-contact__line{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:22px 24px;
  color:var(--paper, #f2f2f2);
  text-decoration:none;
  min-width:0;
}
.footer-contact__line + .footer-contact__line{
  border-top:1px solid rgba(255,255,255,.1);
}
.footer-contact__line:hover{
  background:rgba(255,255,255,.035);
}
.footer-contact__lineLabel{
  color:rgba(242,242,242,.56);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.footer-contact__lineValue{
  display:block;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(20px,1.8vw,29px);
  line-height:1.18;
  letter-spacing:.02em;
  color:#fff;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.footer-contact__bottom{
  align-items:center;
  padding-top:16px;
}
.footer-contact__nav{
  grid-column:1 / span 7;
  display:flex;
  flex-wrap:wrap;
  gap:16px 28px;
}
.footer-contact__nav a,
.footer-contact__legal,
.footer-contact__cookies{
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-contact__nav a{
  color:rgba(242,242,242,.78);
}
.footer-contact__nav a:hover{color:var(--paper, #f2f2f2)}
.footer-contact__legal{
  grid-column:8 / span 5;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:22px;
  color:rgba(242,242,242,.56);
}
.footer-contact__cookies{
  background:transparent;
  border:0;
  padding:0;
  color:var(--paper, #f2f2f2);
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:4px;
}
.footer-contact__cookies:hover{opacity:.72}

@media (max-width: 1100px){
  .footer-contact__top,
  .footer-contact__middle,
  .footer-contact__bottom{grid-template-columns:repeat(8, minmax(0, 1fr));}
  .footer-contact__lead{grid-column:1 / span 8;}
  .footer-contact__brand{grid-column:1 / span 8; border-left:0; padding-left:0; flex-direction:row; align-items:center;}
  .footer-contact__copy{grid-column:1 / span 4;}
  .footer-contact__actions{grid-column:5 / span 4;}
  .footer-contact__contact{grid-column:1 / span 8;}
  .footer-contact__bottom{row-gap:14px}
  .footer-contact__nav{grid-column:1 / span 8;}
  .footer-contact__legal{grid-column:1 / span 8; justify-content:flex-start;}
}

@media (max-width: 760px){
  .footer-contact{
    padding:34px 0 18px;
  }
  .footer-contact__inner{
    width:calc(100vw - 28px);
  }
  .footer-contact__top,
  .footer-contact__middle,
  .footer-contact__bottom{grid-template-columns:1fr; gap:18px;}
  .footer-contact__lead,
  .footer-contact__brand,
  .footer-contact__copy,
  .footer-contact__actions,
  .footer-contact__contact,
  .footer-contact__nav,
  .footer-contact__legal{grid-column:1;}
  .footer-contact__headline{font-size:clamp(28px,10.2vw,48px)}
  .footer-contact__brand{
    align-items:flex-start;
    gap:14px;
    padding-top:4px;
  }
  .footer-contact__middle{padding:22px 0 20px}
  .footer-contact__copy p{font-size:16px}
  .footer-contact__actions{align-items:stretch}
  .footer-contact__actions .btn{width:100%; justify-content:center}
  .footer-contact__line{padding:18px 18px}
  .footer-contact__lineValue{font-size:clamp(18px,6.2vw,24px)}
  .footer-contact__bottom{padding-top:14px}
  .footer-contact__nav{gap:12px 16px}
  .footer-contact__legal{flex-direction:column; align-items:flex-start; gap:10px}
}


/* FOOTER REDESIGN V7 */
.footer-contact{
  position:relative;
  background:#0b0b0b;
  color:var(--paper,#f2f2f2);
  padding:72px 0 24px;
  border-top:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}
.footer-contact::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:76px 76px;
  opacity:.42;
}
.footer-contact__inner{
  position:relative;
  z-index:1;
  width:min(1440px, calc(100vw - 64px));
  margin:0 auto;
}
.footer-contact__grid{
  display:grid;
  grid-template-columns:minmax(0, 1.08fr) minmax(420px, .92fr);
  gap:72px;
  align-items:end;
  padding-bottom:32px;
}
.footer-contact__content{
  min-width:0;
}
.footer-contact__kicker{
  display:inline-block;
  margin-bottom:20px;
  color:var(--acid,#2563EB);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.footer-contact__headline{
  margin:0;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(40px,5.3vw,88px);
  line-height:.95;
  letter-spacing:-.02em;
  text-transform:uppercase;
  color:var(--paper,#f2f2f2);
}
.footer-contact__headline span{
  color:transparent;
  -webkit-text-stroke:1px var(--acid,#2563EB);
}
.footer-contact__copy{
  margin:26px 0 0;
  max-width:680px;
  color:rgba(242,242,242,.72);
  font-size:18px;
  line-height:1.72;
}
.footer-contact__aside{
  min-width:0;
  display:grid;
  gap:24px;
  align-self:stretch;
}
.footer-contact__brandline{
  display:flex;
  align-items:center;
  gap:18px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-contact__logo{
  width:72px;
  height:auto;
  flex:0 0 auto;
  filter:invert(1) opacity(.95);
}
.footer-contact__brandcopy{
  display:grid;
  gap:6px;
  min-width:0;
}
.footer-contact__brandcopy strong,
.footer-contact__brandcopy span{
  font-family:"Audiowide",sans-serif;
  text-transform:uppercase;
}
.footer-contact__brandcopy strong{
  font-size:16px;
  letter-spacing:.08em;
  color:var(--paper,#f2f2f2);
}
.footer-contact__brandcopy span{
  font-size:10px;
  letter-spacing:.16em;
  color:rgba(242,242,242,.58);
}
.footer-contact__actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px 24px;
}
.footer-contact__actions .btn{
  min-width:min(100%, 360px);
}
.footer-contact__textlink{
  display:inline-flex;
  align-items:center;
  gap:12px;
  position:relative;
  padding-bottom:6px;
  color:var(--paper,#f2f2f2);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-contact__textlink::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:1px;
  background:var(--acid,#2563EB);
  transform:scaleX(.34);
  transform-origin:left;
  transition:transform .25s ease;
}
.footer-contact__textlink:hover::after{transform:scaleX(1)}
.footer-contact__textlink span{color:var(--acid,#2563EB)}
.footer-contact__panel{
  display:grid;
  gap:0;
  border-top:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-contact__item{
  display:grid;
  gap:10px;
  padding:18px 0;
  color:var(--paper,#f2f2f2);
  text-decoration:none;
  min-width:0;
}
.footer-contact__item + .footer-contact__item{
  border-top:1px solid rgba(255,255,255,.1);
}
.footer-contact__item:hover .footer-contact__value{color:var(--acid,#2563EB)}
.footer-contact__label{
  display:inline-block;
  color:rgba(242,242,242,.54);
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.footer-contact__value{
  display:block;
  font-family:"Audiowide",sans-serif;
  font-size:clamp(22px,1.75vw,31px);
  line-height:1.15;
  letter-spacing:.02em;
  color:#fff;
  overflow-wrap:anywhere;
  word-break:break-word;
  transition:color .2s ease;
}
.footer-contact__bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px 28px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
  flex-wrap:wrap;
}
.footer-contact__nav{
  display:flex;
  flex-wrap:wrap;
  gap:16px 28px;
}
.footer-contact__nav a,
.footer-contact__legal,
.footer-contact__cookies{
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-contact__nav a{
  color:rgba(242,242,242,.78);
}
.footer-contact__nav a:hover{color:var(--paper,#f2f2f2)}
.footer-contact__legal{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  gap:22px;
  color:rgba(242,242,242,.56);
}
.footer-contact__cookies{
  background:transparent;
  border:0;
  padding:0;
  color:var(--paper,#f2f2f2);
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:4px;
}
.footer-contact__cookies:hover{opacity:.72}

/* stronger overrides for story pages */
.story-page .footer-contact{background:#0b0b0b; border-top:1px solid rgba(255,255,255,.08); padding-top:72px}
.story-page .footer-contact__copy{color:rgba(242,242,242,.72)}
.story-page .footer-contact__item{background:none; border-left:0; border-right:0; color:var(--paper,#f2f2f2)}
.story-page .footer-contact__bottom{border-color:rgba(255,255,255,.1); color:rgba(242,242,242,.56)}
.story-page .footer-contact__cookies{color:var(--paper,#f2f2f2)}

@media (max-width: 1180px){
  .footer-contact__grid{
    grid-template-columns:1fr;
    gap:40px;
  }
  .footer-contact__copy{max-width:760px}
  .footer-contact__aside{max-width:760px}
}

@media (max-width: 760px){
  .footer-contact{padding:44px 0 18px}
  .footer-contact__inner{width:calc(100vw - 28px)}
  .footer-contact__grid{gap:28px; padding-bottom:24px}
  .footer-contact__headline{font-size:clamp(30px,10.6vw,50px)}
  .footer-contact__copy{margin-top:22px; font-size:16px}
  .footer-contact__brandline{align-items:flex-start}
  .footer-contact__logo{width:56px}
  .footer-contact__brandcopy strong{font-size:14px}
  .footer-contact__actions{align-items:stretch; flex-direction:column}
  .footer-contact__actions .btn{width:100%; justify-content:center}
  .footer-contact__value{font-size:clamp(18px,6.3vw,24px)}
  .footer-contact__bottom{align-items:flex-start; gap:14px}
  .footer-contact__legal{justify-content:flex-start; gap:10px; flex-direction:column; align-items:flex-start}
}


/* FOOTER REDESIGN V8 */
.footer-contact__actions{
  display:grid;
  gap:18px;
  align-content:start;
}
.footer-contact__subactions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px 28px;
}
.footer-contact__textlink--phone{
  color:var(--paper,#f2f2f2);
}
.footer-contact__panel,
.footer-contact__item,
.footer-contact__label,
.footer-contact__value{
  display:none;
}
.story-page .footer-contact__panel,
.story-page .footer-contact__item,
.story-page .footer-contact__label,
.story-page .footer-contact__value{
  display:none;
}

@media (max-width: 760px){
  .footer-contact__subactions{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
}


/* FOOTER REDESIGN V9 — WIDE DESKTOP FIX */
.footer-contact{
  padding:64px 0 22px !important;
}
.footer-contact__inner{
  width:min(1360px, calc(100vw - 80px)) !important;
  max-width:1360px !important;
}
.footer-contact__grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 430px !important;
  gap:80px !important;
  align-items:end !important;
  padding-bottom:34px !important;
}
.footer-contact__content{
  min-width:0 !important;
  max-width:860px !important;
}
.footer-contact__headline{
  font-size:clamp(46px,4vw,68px) !important;
  line-height:.98 !important;
  letter-spacing:-.018em !important;
  max-width:860px !important;
}
.footer-contact__headline br{
  display:block !important;
}
.footer-contact__copy{
  max-width:760px !important;
  font-size:17px !important;
  line-height:1.65 !important;
}
.footer-contact__aside{
  min-width:0 !important;
  max-width:430px !important;
  width:100% !important;
  justify-self:end !important;
  align-self:end !important;
  display:flex !important;
  flex-direction:column !important;
  gap:24px !important;
}
.footer-contact__brandline{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  padding:0 0 20px !important;
  border-bottom:1px solid rgba(255,255,255,.1) !important;
}
.footer-contact__logo{
  width:64px !important;
  flex:0 0 64px !important;
}
.footer-contact__brandcopy{
  min-width:0 !important;
}
.footer-contact__brandcopy strong{
  font-size:14px !important;
  line-height:1.25 !important;
}
.footer-contact__brandcopy span{
  font-size:9px !important;
  line-height:1.45 !important;
}
.footer-contact__actions{
  width:100% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:16px !important;
}
.footer-contact__actions .btn{
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  justify-content:space-between !important;
}
.footer-contact__subactions{
  width:100% !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px 24px !important;
  align-items:center !important;
}
.footer-contact__textlink{
  white-space:nowrap !important;
  font-size:10px !important;
}
.footer-contact__bottom{
  margin:0 !important;
  padding-top:18px !important;
}

@media (min-width: 1400px){
  .footer-contact__grid{
    grid-template-columns:minmax(0,1fr) 440px !important;
    gap:92px !important;
  }
  .footer-contact__content{max-width:900px !important;}
  .footer-contact__headline{
    font-size:clamp(54px,3.85vw,70px) !important;
    max-width:900px !important;
  }
}

@media (min-width: 1101px) and (max-width: 1399px){
  .footer-contact__inner{
    width:min(1240px, calc(100vw - 56px)) !important;
  }
  .footer-contact__grid{
    grid-template-columns:minmax(0,1fr) 370px !important;
    gap:52px !important;
  }
  .footer-contact__headline{
    font-size:clamp(42px,4vw,58px) !important;
  }
  .footer-contact__aside{
    max-width:370px !important;
  }
}

@media (max-width: 1100px){
  .footer-contact__inner{
    width:calc(100vw - 44px) !important;
  }
  .footer-contact__grid{
    grid-template-columns:1fr !important;
    gap:38px !important;
  }
  .footer-contact__content{
    max-width:900px !important;
  }
  .footer-contact__headline{
    font-size:clamp(38px,7vw,62px) !important;
    max-width:900px !important;
  }
  .footer-contact__aside{
    max-width:620px !important;
    justify-self:start !important;
  }
}

@media (max-width: 760px){
  .footer-contact{
    padding:40px 0 18px !important;
  }
  .footer-contact__inner{
    width:calc(100vw - 28px) !important;
  }
  .footer-contact__grid{
    gap:28px !important;
    padding-bottom:24px !important;
  }
  .footer-contact__headline{
    font-size:clamp(30px,10.6vw,48px) !important;
  }
  .footer-contact__copy{
    font-size:16px !important;
  }
  .footer-contact__aside{
    max-width:none !important;
  }
  .footer-contact__subactions{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}


/* FOOTER REDESIGN V10 */
.footer-contact{
  padding:64px 0 22px !important;
  background:#0b0b0b !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
}
.footer-contact__inner{
  width:min(1360px, calc(100vw - 80px)) !important;
  max-width:1360px !important;
  margin:0 auto !important;
}
.footer-contact__hero{
  display:grid !important;
  grid-template-columns:minmax(360px, .92fr) minmax(520px, 1.08fr) !important;
  gap:72px !important;
  align-items:start !important;
  padding-bottom:36px !important;
}
.footer-contact__left,
.footer-contact__right{
  min-width:0 !important;
}
.footer-contact__left{
  display:grid !important;
  align-content:start !important;
  gap:22px !important;
}
.footer-contact__right{
  display:flex !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
}
.footer-contact__kicker{
  margin-bottom:0 !important;
}
.footer-contact__headline{
  margin:0 !important;
  max-width:760px !important;
  font-size:clamp(50px, 4.2vw, 74px) !important;
  line-height:.96 !important;
  letter-spacing:-.02em !important;
  text-wrap:balance;
}
.footer-contact__copy{
  margin:0 !important;
  max-width:520px !important;
  font-size:18px !important;
  line-height:1.72 !important;
  color:rgba(242,242,242,.74) !important;
}
.footer-contact__meta{
  display:grid !important;
  gap:20px !important;
  margin-top:4px !important;
}
.footer-contact__brandline{
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  padding:18px 0 0 !important;
  border-top:1px solid rgba(255,255,255,.1) !important;
  border-bottom:0 !important;
}
.footer-contact__logo{
  width:64px !important;
  flex:0 0 64px !important;
}
.footer-contact__brandcopy strong{
  font-size:15px !important;
}
.footer-contact__brandcopy span{
  font-size:9px !important;
}
.footer-contact__actions,
.footer-contact__actions .btn,
.btn.btn--compact[href="/konsultacja"]{
  display:none !important;
}
.footer-contact__subactions{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:12px 28px !important;
}
.footer-contact__textlink{
  white-space:nowrap !important;
  font-size:10px !important;
}
.footer-contact__bottom{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:20px 28px !important;
  padding-top:18px !important;
  border-top:1px solid rgba(255,255,255,.1) !important;
  flex-wrap:wrap !important;
}

@media (min-width: 1500px){
  .footer-contact__hero{
    grid-template-columns:minmax(380px, .9fr) minmax(580px, 1.1fr) !important;
    gap:90px !important;
  }
  .footer-contact__headline{
    font-size:clamp(56px, 4vw, 78px) !important;
    max-width:820px !important;
  }
}

@media (min-width: 1101px) and (max-width: 1399px){
  .footer-contact__inner{
    width:min(1240px, calc(100vw - 56px)) !important;
  }
  .footer-contact__hero{
    grid-template-columns:minmax(320px, .94fr) minmax(460px, 1.06fr) !important;
    gap:46px !important;
  }
  .footer-contact__headline{
    font-size:clamp(40px, 4vw, 58px) !important;
    max-width:640px !important;
  }
  .footer-contact__copy{
    max-width:480px !important;
    font-size:17px !important;
  }
}

@media (max-width: 1100px){
  .footer-contact__inner{
    width:calc(100vw - 44px) !important;
  }
  .footer-contact__hero{
    grid-template-columns:1fr !important;
    gap:28px !important;
    padding-bottom:28px !important;
  }
  .footer-contact__right{
    order:-1 !important;
  }
  .footer-contact__headline{
    max-width:900px !important;
    font-size:clamp(38px, 7vw, 62px) !important;
  }
  .footer-contact__copy{
    max-width:860px !important;
    font-size:16px !important;
  }
}

@media (max-width: 760px){
  .footer-contact{
    padding:40px 0 18px !important;
  }
  .footer-contact__inner{
    width:calc(100vw - 28px) !important;
  }
  .footer-contact__headline{
    font-size:clamp(30px, 10.6vw, 48px) !important;
  }
  .footer-contact__subactions{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:12px !important;
  }
  .footer-contact__brandline{
    align-items:flex-start !important;
  }
}


/* FOOTER REDESIGN V11 */
.footer-contact__meta{
  display:block !important;
  margin-top:8px !important;
}
.footer-contact__brandline,
.footer-contact__logo,
.footer-contact__brandcopy{
  display:none !important;
}
.footer-contact__subactions{
  padding-top:18px !important;
  border-top:1px solid rgba(255,255,255,.1) !important;
}
.footer-contact__bottom{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:16px 24px !important;
  padding-top:18px !important;
  border-top:1px solid rgba(255,255,255,.1) !important;
  flex-wrap:wrap !important;
}
.footer-contact__nav{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:14px 24px !important;
}
.footer-contact__legal{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:18px !important;
  color:rgba(242,242,242,.58) !important;
}
.footer-contact__cookies{
  color:var(--paper,#f2f2f2) !important;
  text-decoration:underline !important;
  text-underline-offset:4px !important;
}
@media (max-width: 760px){
  .footer-contact__subactions{
    padding-top:14px !important;
  }
  .footer-contact__bottom{
    align-items:flex-start !important;
  }
  .footer-contact__legal{
    justify-content:flex-start !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }
}


/* FOOTER REDESIGN V12 */
.footer-contact__textlink--phone::after{
  transform:scaleX(.34) !important;
  transform-origin:left !important;
}
.footer-contact__textlink--phone:hover::after{
  transform:scaleX(1) !important;
}


/* FOOTER REDESIGN V13 */
@media (min-width: 761px){
  .footer-contact__bottom{
    display:grid !important;
    grid-template-columns:1fr !important;
    justify-items:center !important;
    align-items:center !important;
    gap:14px !important;
    text-align:center !important;
  }
  .footer-contact__nav{
    justify-content:center !important;
    align-items:center !important;
    gap:14px 42px !important;
  }
  .footer-contact__legal{
    justify-content:center !important;
    align-items:center !important;
    gap:16px 28px !important;
    text-align:center !important;
  }
}

@media (min-width: 1400px){
  .footer-contact__bottom{
    gap:16px !important;
  }
  .footer-contact__nav{
    gap:16px 46px !important;
  }
}


/* FOOTER REDESIGN V14 — FIXED BOTTOM LAYOUT ALL WIDTHS */
.footer-contact__bottom{
  display:grid !important;
  grid-template-columns:1fr !important;
  justify-items:center !important;
  align-items:center !important;
  width:100% !important;
  gap:20px !important;
  padding:30px 0 6px !important;
  border-top:1px solid rgba(255,255,255,.11) !important;
  text-align:center !important;
}
.footer-contact__nav{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:center !important;
  width:max-content !important;
  max-width:100% !important;
  gap:clamp(18px,3vw,46px) !important;
  margin:0 auto !important;
}
.footer-contact__legal{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:center !important;
  width:max-content !important;
  max-width:100% !important;
  gap:clamp(18px,2.5vw,34px) !important;
  margin:0 auto !important;
  color:rgba(242,242,242,.58) !important;
  text-align:center !important;
}
.footer-contact__nav a,
.footer-contact__legal,
.footer-contact__cookies{
  white-space:nowrap !important;
}
.footer-contact__cookies{
  display:inline-block !important;
  flex:0 0 auto !important;
}

@media (max-width: 760px){
  .footer-contact__bottom{
    gap:16px !important;
    padding-top:24px !important;
  }
  .footer-contact__nav{
    gap:clamp(10px,3.7vw,20px) !important;
  }
  .footer-contact__legal{
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:clamp(12px,3.8vw,20px) !important;
  }
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{
    font-size:clamp(7px,2.35vw,10px) !important;
    letter-spacing:clamp(.06em,.35vw,.14em) !important;
  }
}

@media (max-width: 430px){
  .footer-contact__nav{
    gap:9px !important;
  }
  .footer-contact__legal{
    gap:10px !important;
  }
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{
    font-size:7px !important;
    letter-spacing:.045em !important;
  }
}


/* FOOTER REDESIGN V16 - TWO LOCKED ROWS */
.footer-contact__bottom{
  display:block !important;
  width:100% !important;
  padding:28px 0 6px !important;
  border-top:1px solid rgba(255,255,255,.11) !important;
  text-align:center !important;
}
.footer-contact__navrow,
.footer-contact__legalrow{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.footer-contact__legalrow{margin-top:18px !important;}
.footer-contact__nav{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 auto !important;
  gap:clamp(16px,2.8vw,46px) !important;
}
.footer-contact__legal{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 auto !important;
  gap:clamp(16px,2.2vw,34px) !important;
  text-align:center !important;
}
.footer-contact__nav a,
.footer-contact__legal,
.footer-contact__cookies{white-space:nowrap !important;}
@media (max-width:760px){
  .footer-contact__bottom{padding-top:22px !important;}
  .footer-contact__legalrow{margin-top:14px !important;}
  .footer-contact__nav{gap:clamp(9px,3.4vw,18px) !important;}
  .footer-contact__legal{
    flex-direction:row !important;
    justify-content:center !important;
    align-items:center !important;
    gap:clamp(10px,3vw,18px) !important;
  }
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{
    font-size:clamp(7px,2.25vw,10px) !important;
    letter-spacing:clamp(.045em,.25vw,.12em) !important;
  }
}
@media (max-width:430px){
  .footer-contact__nav{gap:8px !important;}
  .footer-contact__legal{gap:9px !important;}
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{
    font-size:7px !important;
    letter-spacing:.04em !important;
  }
}


/* FOOTER REDESIGN V18 - FULL WIDTH BOTTOM ROW */
.footer-contact__inner{
  display:block !important;
}
.footer-contact__hero{
  width:100% !important;
}
.footer-contact__bottom{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  border-top:1px solid rgba(255,255,255,.11) !important;
  text-align:center !important;
}
.footer-contact__bottomInner{
  display:grid !important;
  grid-template-columns:1fr !important;
  justify-items:center !important;
  align-items:center !important;
  width:min(1360px, calc(100vw - 80px)) !important;
  max-width:1360px !important;
  margin:0 auto !important;
  padding:28px 0 6px !important;
  gap:18px !important;
}
.footer-contact__navrow,
.footer-contact__legalrow{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.footer-contact__nav,
.footer-contact__legal{
  width:100% !important;
  max-width:100% !important;
  margin:0 auto !important;
  justify-content:center !important;
  align-items:center !important;
}
.footer-contact__legalrow{
  margin-top:0 !important;
}

@media (max-width: 1399px){
  .footer-contact__bottomInner{
    width:min(1240px, calc(100vw - 56px)) !important;
  }
}
@media (max-width: 760px){
  .footer-contact__bottomInner{
    width:calc(100vw - 28px) !important;
    padding:22px 0 4px !important;
    gap:14px !important;
  }
}


/* FOOTER REDESIGN V19 - MORE BOTTOM SPACING */
.footer-contact__bottomInner{
  padding:46px 0 16px !important;
  gap:28px !important;
}
.footer-contact__legalrow{
  margin-top:0 !important;
}
@media (max-width:760px){
  .footer-contact__bottomInner{
    padding:36px 0 12px !important;
    gap:22px !important;
  }
}


/* =========================================================
   V32 — BLUE + NEON GREEN BUTTON/ACCENT REFINEMENT
   - white text on acid blue surfaces
   - remove the harsh sheen cut line on CTA buttons
   - switch the small CTA accent to neon green
========================================================= */
.btn:not(.ghost){
  background:linear-gradient(135deg,#2563EB 0%,#1D4ED8 100%) !important;
  color:var(--paper) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,.42),
    0 0 0 1px rgba(37,99,235,.18) !important;
  filter:none !important;
}
.btn:not(.ghost) .btn__arrow{
  width:30px;
  height:30px;
  border-radius:10px;
  background:linear-gradient(135deg,var(--signal) 0%,#6CFF2B 100%) !important;
  color:var(--ink) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.18),
    0 10px 24px rgba(156,255,46,.20) !important;
}
.btn:not(.ghost)::after{
  display:none !important;
}
.btn:not(.ghost):hover{
  transform:translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(37,99,235,.22),
    0 20px 56px rgba(29,78,216,.30),
    0 12px 28px rgba(156,255,46,.14),
    0 28px 70px rgba(0,0,0,.52) !important;
  filter:saturate(1.04) brightness(1.02) !important;
}
.btn:not(.ghost):active{
  transform:translateY(0);
  box-shadow:
    0 0 0 1px rgba(37,99,235,.18),
    0 14px 38px rgba(0,0,0,.42) !important;
}
.navbar__link.is-active{
  background:linear-gradient(135deg,#2563EB 0%,#1D4ED8 100%) !important;
  border-color:rgba(255,255,255,.14) !important;
  color:var(--paper) !important;
}
.case-visual__index,
.story-page .skip-link,
.footer{
  color:var(--paper) !important;
}

/* =========================================================
   V35 — CTA BUTTONS: REMOVE SHEEN / KEEP WHITE LABELS
   - no sweep / no glow band
   - white text on blue CTA
   - darker blue inner arrow tile instead of neon highlight
========================================================= */
.btn:not(.ghost){
  background:linear-gradient(135deg,#2563EB 0%,#1D4ED8 100%) !important;
  color:var(--paper) !important;
  border:1px solid rgba(0,0,0,.28) !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.06) inset !important;
  filter:none !important;
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
.btn:not(.ghost)::after{
  display:none !important;
  content:none !important;
}
.btn:not(.ghost):hover,
.btn:not(.ghost):active{
  transform:none !important;
  filter:none !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset !important;
}
.btn:not(.ghost) span{
  color:var(--paper) !important;
}
.btn:not(.ghost) .btn__arrow{
  background:rgba(0,0,0,.10) !important;
  color:var(--paper) !important;
  box-shadow:none !important;
}

/* =========================================================
   V57 — GLOBAL HEADER / MOBILE MENU / COOKIE UI
   Visual language: off-white + ink + electric blue + square geometry
========================================================= */

/* ---------------------------------------------------------
   NAVBAR BRAND — ALWAYS WHITE ON THE DARK/GREY NAVBAR
--------------------------------------------------------- */
body .navbar__brandtext,
body.page:not(.page--home) .navbar__brandtext,
.story-page .navbar__brandtext{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:none !important;
  font-weight:400 !important;
}
body .navbar__brand,
body .navbar__brand:visited,
body .navbar__brand:hover{
  color:#fff !important;
}

/* ---------------------------------------------------------
   MOBILE NAV / HAMBURGER
--------------------------------------------------------- */
@media (max-width:1024px){
  body .navbar,
  body.page:not(.page--home) .navbar,
  .story-page .navbar{
    z-index:10020 !important;
  }

  body .navbar__inner,
  body.page:not(.page--home) .navbar__inner,
  .story-page .navbar__inner{
    background:rgba(20,20,20,.94) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:0 !important;
    box-shadow:0 14px 48px rgba(0,0,0,.20) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
  }

  /* Keep the name visible when the mobile drawer is open. */
  .nav-toggle:checked ~ .layout .navbar__brand{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:none !important;
  }

  body .navbar__brandtext,
  body.page:not(.page--home) .navbar__brandtext,
  .story-page .navbar__brandtext{
    display:block !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-size:8px !important;
    line-height:1.12 !important;
    letter-spacing:.08em !important;
  }

  body .hamburger,
  body .navbar__hamburger{
    display:flex !important;
    width:52px !important;
    height:52px !important;
    margin-left:auto !important;
    padding:0 !important;
    gap:4px !important;
    border:0 !important;
    border-left:1px solid rgba(255,255,255,.11) !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    transition:background .18s ease,border-color .18s ease !important;
  }
  body .hamburger span{
    width:24px !important;
    height:2px !important;
    border-radius:0 !important;
    background:#fff !important;
    transform-origin:center !important;
  }
  .nav-toggle:checked ~ .layout .hamburger{
    background:var(--acid,#2563EB) !important;
    border-left-color:rgba(255,255,255,.18) !important;
  }
  .nav-toggle:checked ~ .layout .hamburger span:nth-child(1){
    transform:translateY(6px) rotate(45deg) !important;
  }
  .nav-toggle:checked ~ .layout .hamburger span:nth-child(2){
    opacity:0 !important;
    transform:scaleX(0) !important;
  }
  .nav-toggle:checked ~ .layout .hamburger span:nth-child(3){
    transform:translateY(-6px) rotate(-45deg) !important;
  }

  body:has(.nav-toggle:checked){overflow:hidden !important;}

  .drawer{
    z-index:10010 !important;
    background:rgba(5,5,5,.56) !important;
    backdrop-filter:blur(10px) !important;
    -webkit-backdrop-filter:blur(10px) !important;
  }
  .drawer__nav{
    left:14px !important;
    right:14px !important;
    top:calc(var(--nav-gap, 12px) + var(--nav-h, 72px) + 10px) !important;
    width:auto !important;
    height:auto !important;
    max-height:calc(100dvh - var(--nav-h, 72px) - 40px) !important;
    overflow:auto !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:0 !important;
    background:
      linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
      #111 !important;
    background-size:52px 52px !important;
    color:#fff !important;
    box-shadow:0 30px 90px rgba(0,0,0,.45) !important;
  }
  .drawer__brand{display:none !important;}
  .drawer__item{
    position:relative !important;
    display:grid !important;
    grid-template-columns:1fr auto !important;
    align-items:center !important;
    min-height:78px !important;
    margin:0 !important;
    padding:20px 24px !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.10) !important;
    border-radius:0 !important;
    background:transparent !important;
    color:rgba(255,255,255,.94) !important;
    transform:none !important;
    transition:background .18s ease,color .18s ease !important;
  }
  .drawer__item::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:3px;
    background:var(--acid,#2563EB);
    transform:scaleY(0);
    transform-origin:bottom;
    transition:transform .2s ease;
  }
  .drawer__item:hover,
  .drawer__item:focus-visible{
    background:rgba(255,255,255,.035) !important;
    color:#fff !important;
  }
  .drawer__item:hover::before,
  .drawer__item:focus-visible::before,
  .drawer__item.is-active::before{
    transform:scaleY(1);
  }
  .drawer__item.is-active{
    background:rgba(37,99,235,.10) !important;
    color:#fff !important;
  }
  .drawer__label{
    font-family:"Audiowide",sans-serif !important;
    font-size:clamp(15px,4.5vw,21px) !important;
    line-height:1.1 !important;
    letter-spacing:.07em !important;
  }
  .drawer__num{
    color:var(--acid,#2563EB) !important;
    opacity:1 !important;
    font-family:"Audiowide",sans-serif !important;
    font-size:9px !important;
    font-weight:400 !important;
    letter-spacing:.12em !important;
  }
  .drawer__cta.btn{
    width:100% !important;
    min-height:68px !important;
    margin:0 !important;
    padding:14px 18px 14px 24px !important;
    border:0 !important;
    border-radius:0 !important;
    justify-content:space-between !important;
    font-size:10px !important;
    letter-spacing:.1em !important;
  }
}

@media (max-width:420px){
  body .navbar__brandtext,
  body.page:not(.page--home) .navbar__brandtext,
  .story-page .navbar__brandtext{
    font-size:7px !important;
  }
  .drawer__item{min-height:70px !important;padding:18px 20px !important;}
  .drawer__label{font-size:15px !important;}
}

/* ---------------------------------------------------------
   COOKIE SETTINGS — LIGHT TECHNICAL SYSTEM
--------------------------------------------------------- */
.cookie-modal__backdrop{
  background:rgba(8,8,8,.58) !important;
  backdrop-filter:blur(12px) saturate(.75) !important;
  -webkit-backdrop-filter:blur(12px) saturate(.75) !important;
}
.cookie-modal__panel{
  width:min(760px,calc(100vw - 32px)) !important;
  max-height:min(880px,calc(100dvh - 32px)) !important;
  margin:16px auto 0 !important;
  overflow:auto !important;
  padding:clamp(24px,3vw,40px) !important;
  border:1px solid rgba(11,11,11,.18) !important;
  border-radius:0 !important;
  background:
    linear-gradient(rgba(11,11,11,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,11,11,.025) 1px,transparent 1px),
    #f2f2f2 !important;
  background-size:52px 52px !important;
  color:#0b0b0b !important;
  box-shadow:0 34px 100px rgba(0,0,0,.34) !important;
}
.cookie-modal__head{
  align-items:center !important;
  margin-bottom:24px !important;
  padding-bottom:20px !important;
  border-bottom:1px solid rgba(11,11,11,.16) !important;
}
.cookie-modal__title{
  color:#0b0b0b !important;
  font-family:"Audiowide",sans-serif !important;
  font-size:clamp(18px,2.2vw,28px) !important;
  font-weight:400 !important;
  line-height:1 !important;
  letter-spacing:.06em !important;
}
.cookie-modal__x{
  width:48px !important;
  height:48px !important;
  border:1px solid rgba(11,11,11,.16) !important;
  border-radius:0 !important;
  background:#e8e8e5 !important;
  color:#0b0b0b !important;
  font-family:"Audiowide",sans-serif !important;
  font-size:24px !important;
  transition:background .18s ease,color .18s ease,border-color .18s ease !important;
}
.cookie-modal__x:hover{
  background:var(--acid,#2563EB) !important;
  border-color:var(--acid,#2563EB) !important;
  color:#fff !important;
}
.cookie-modal__desc{
  max-width:620px !important;
  margin:0 0 28px !important;
  color:rgba(11,11,11,.64) !important;
  font-size:15px !important;
  line-height:1.65 !important;
}
.cookie-modal__list{
  counter-reset:cookie-option !important;
  gap:1px !important;
  margin-bottom:28px !important;
  border:1px solid rgba(11,11,11,.15) !important;
  background:rgba(11,11,11,.15) !important;
}
.cookie-toggle{
  counter-increment:cookie-option !important;
  position:relative !important;
  display:grid !important;
  grid-template-columns:34px 24px 1fr !important;
  align-items:center !important;
  gap:16px !important;
  min-height:92px !important;
  padding:18px 22px !important;
  border:0 !important;
  border-radius:0 !important;
  background:#e8e8e5 !important;
  color:#0b0b0b !important;
  cursor:pointer !important;
  opacity:1 !important;
  transition:background .18s ease,box-shadow .18s ease !important;
}
.cookie-toggle::before{
  content:counter(cookie-option, decimal-leading-zero) !important;
  color:var(--acid,#2563EB) !important;
  font-family:"Audiowide",sans-serif !important;
  font-size:9px !important;
  letter-spacing:.1em !important;
}
.cookie-toggle:hover{
  background:#fff !important;
  box-shadow:inset 0 0 0 1px var(--acid,#2563EB) !important;
}
.cookie-toggle--locked{
  background:#ededeb !important;
  cursor:default !important;
}
.cookie-toggle--locked:hover{
  box-shadow:none !important;
}
.cookie-toggle input{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:22px !important;
  height:22px !important;
  margin:0 !important;
  border:1px solid rgba(11,11,11,.34) !important;
  border-radius:0 !important;
  background:#f7f7f5 !important;
  display:grid !important;
  place-items:center !important;
  cursor:pointer !important;
}
.cookie-toggle input:checked{
  border-color:var(--acid,#2563EB) !important;
  background-color:var(--acid,#2563EB) !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='3' stroke-linecap='square' stroke-linejoin='miter' d='m5 12 4 4 10-10'/%3E%3C/svg%3E") !important;
  background-size:16px 16px !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}
.cookie-toggle input:focus-visible{
  outline:2px solid var(--acid,#2563EB) !important;
  outline-offset:3px !important;
}
.cookie-toggle input:disabled{
  cursor:not-allowed !important;
  opacity:.62 !important;
}
.cookie-toggle__text{gap:5px !important;min-width:0 !important;}
.cookie-toggle__name{
  color:#0b0b0b !important;
  font-family:"Audiowide",sans-serif !important;
  font-size:clamp(13px,1.5vw,17px) !important;
  font-weight:400 !important;
  line-height:1.15 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}
.cookie-toggle__note{
  color:rgba(11,11,11,.58) !important;
  font-size:13px !important;
  line-height:1.45 !important;
  opacity:1 !important;
}
.cookie-modal__actions{
  display:grid !important;
  grid-template-columns:auto minmax(190px,1fr) auto !important;
  gap:10px !important;
  justify-content:stretch !important;
}
.cookie-btn{
  min-height:52px !important;
  padding:12px 18px !important;
  border:1px solid rgba(11,11,11,.18) !important;
  border-radius:0 !important;
  background:#e8e8e5 !important;
  color:#0b0b0b !important;
  font-family:"Audiowide",sans-serif !important;
  font-size:10px !important;
  font-weight:400 !important;
  letter-spacing:.08em !important;
  box-shadow:none !important;
  transition:background .18s ease,color .18s ease,border-color .18s ease !important;
}
.cookie-btn:hover{
  filter:none !important;
  background:#fff !important;
  border-color:var(--acid,#2563EB) !important;
}
.cookie-btn--primary{
  background:var(--acid,#2563EB) !important;
  color:#fff !important;
  border-color:var(--acid,#2563EB) !important;
}
.cookie-btn--primary:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#fff !important;
}

/* First-visit banner uses the same system. */
.cookie-banner{
  padding:16px !important;
}
.cookie-banner__inner{
  max-width:1160px !important;
  border:1px solid rgba(11,11,11,.16) !important;
  border-radius:0 !important;
  background:#f2f2f2 !important;
  color:#0b0b0b !important;
  box-shadow:0 24px 80px rgba(0,0,0,.26) !important;
}
.cookie-banner__title{
  color:#0b0b0b !important;
  font-family:"Audiowide",sans-serif !important;
  font-weight:400 !important;
  letter-spacing:.08em !important;
}
.cookie-banner__desc{color:rgba(11,11,11,.62) !important;}

@media (max-width:700px){
  .cookie-modal__panel{
    width:calc(100vw - 20px) !important;
    max-height:calc(100dvh - 20px) !important;
    margin:10px auto 0 !important;
    padding:20px !important;
  }
  .cookie-modal__head{margin-bottom:18px !important;padding-bottom:16px !important;}
  .cookie-modal__title{font-size:18px !important;}
  .cookie-modal__x{width:42px !important;height:42px !important;}
  .cookie-toggle{
    grid-template-columns:28px 22px 1fr !important;
    gap:12px !important;
    min-height:82px !important;
    padding:15px 14px !important;
  }
  .cookie-toggle__name{font-size:12px !important;}
  .cookie-toggle__note{font-size:11px !important;}
  .cookie-modal__actions{
    grid-template-columns:1fr 1fr !important;
  }
  .cookie-modal__actions .cookie-btn--primary{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
  }
  .cookie-banner__inner{
    border-radius:0 !important;
  }
}

/* =========================================================
   V58 — MOBILE DRAWER CTA ARROW: SQUARE GEOMETRY
========================================================= */
@media (max-width:899px){
  .drawer__cta .btn__arrow,
  .drawer__cta.btn .btn__arrow{
    border-radius:0 !important;
  }
}

/* =========================================================
   V64 — GLOBAL RESPONSIVE FOUNDATION
   One gutter system / safer typography / touch-first mobile UX
========================================================= */
:root{
  --site-max:1460px;
  --site-gutter:48px;
  --nav-edge:32px;
}
@media (min-width:1600px){:root{--site-gutter:64px;--nav-edge:40px;}}
@media (min-width:1280px) and (max-width:1599px){:root{--site-gutter:48px;--nav-edge:32px;}}
@media (min-width:1025px) and (max-width:1279px){:root{--site-gutter:32px;--nav-edge:22px;}}
@media (min-width:768px) and (max-width:1024px){:root{--site-gutter:28px;--nav-edge:14px;}}
@media (min-width:480px) and (max-width:767px){:root{--site-gutter:20px;--nav-edge:10px;}}
@media (max-width:479px){:root{--site-gutter:16px;--nav-edge:10px;}}

html{
  width:100%;
  max-width:100%;
  overflow-x:clip;
  text-size-adjust:100%;
  -webkit-text-size-adjust:100%;
}
body{
  width:100%;
  max-width:100%;
  overflow-x:clip;
}
*,*::before,*::after{box-sizing:border-box;}
.layout,.main,main,section,article,header,footer,nav,form,fieldset,div{min-width:0;}
img,video,svg,canvas,picture{max-width:100%;}
img,video{height:auto;}
iframe{max-width:100%;}

/* Consistent outer alignment across all generic page containers. */
.container,
.page-hero__inner,
.footer-contact__inner,
.footer-contact__bottomInner{
  width:min(calc(100% - (var(--site-gutter) + var(--site-gutter))),var(--site-max)) !important;
  max-width:var(--site-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.container{padding-left:0 !important;padding-right:0 !important;}
.page-hero{padding-left:0 !important;padding-right:0 !important;}

/* Text / controls should shrink inside their own columns instead of widening the page. */
h1,h2,h3,h4,p,li,dd,dt,a,span,strong,label,button{max-width:100%;}
input,select,textarea,button{min-width:0;max-width:100%;}
.btn{
  max-width:100%;
  min-width:0;
}
.btn>span:first-child{min-width:0;}
.btn__arrow{flex:0 0 auto;}

/* Header: same visual frame on every desktop width. */
@media (min-width:1025px){
  body .navbar__inner,
  body.page:not(.page--home) .navbar__inner,
  .story-page .navbar__inner{
    width:min(calc(100vw - (var(--nav-edge) + var(--nav-edge))),var(--site-max)) !important;
    max-width:var(--site-max) !important;
    margin-inline:auto !important;
  }
}

/* Tablet / mobile nav — never touches screen edges and remains usable on short screens. */
@media (max-width:1024px){
  body .navbar__inner,
  body.page:not(.page--home) .navbar__inner,
  .story-page .navbar__inner{
    width:calc(100vw - (var(--nav-edge) + var(--nav-edge))) !important;
    max-width:none !important;
    margin-inline:auto !important;
  }
  .drawer__nav{
    left:var(--nav-edge) !important;
    right:var(--nav-edge) !important;
    width:auto !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
}
@media (max-width:479px){
  body .navbar__inner,
  body.page:not(.page--home) .navbar__inner,
  .story-page .navbar__inner{
    min-height:58px !important;
  }
  body .navbar__logo,
  body.page:not(.page--home) .navbar__logo,
  .story-page .navbar__logo{height:32px !important;width:auto !important;}
  body .hamburger,body .navbar__hamburger{width:48px !important;height:48px !important;}
  .drawer__item{min-height:64px !important;padding:16px 18px !important;}
  .drawer__label{font-size:14px !important;}
  .drawer__cta.btn{min-height:60px !important;padding:12px 14px 12px 18px !important;}
}
@media (max-width:1024px) and (max-height:700px){
  .drawer__nav{max-height:calc(100dvh - 88px) !important;}
  .drawer__item{min-height:56px !important;padding:12px 18px !important;}
  .drawer__cta.btn{min-height:54px !important;}
}

/* Better tap targets, without inflating visual size. */
@media (pointer:coarse){
  button,a,.hamburger,.cookie-toggle{touch-action:manipulation;}
  .story-text-link,.footer-contact__textlink{min-height:36px;align-items:center;}
}

/* Mobile buttons and form fields: prevent overflow + iOS input zoom. */
@media (max-width:767px){
  .btn{
    padding:14px 15px !important;
    gap:10px !important;
    line-height:1.25 !important;
    white-space:normal !important;
    text-align:center !important;
  }
  .btn__arrow{width:34px !important;height:34px !important;}
  input,select,textarea{font-size:16px !important;}
}

/* Footer keeps the requested two-row structure but follows the same gutters. */
.footer-contact__inner,
.footer-contact__bottomInner{
  width:min(calc(100% - (var(--site-gutter) + var(--site-gutter))),1360px) !important;
}
@media (max-width:760px){
  .footer-contact{padding-top:clamp(36px,10vw,52px) !important;}
  .footer-contact__hero{gap:24px !important;padding-bottom:26px !important;}
  .footer-contact__headline{
    font-size:clamp(28px,8.8vw,42px) !important;
    line-height:1 !important;
    overflow-wrap:normal !important;
  }
  .footer-contact__copy{font-size:15px !important;line-height:1.62 !important;}
  .footer-contact__subactions{gap:8px !important;}
  .footer-contact__bottomInner{padding:32px 0 12px !important;gap:18px !important;}
  .footer-contact__nav{gap:clamp(7px,2.2vw,14px) !important;}
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{
    font-size:clamp(6.5px,1.9vw,8px) !important;
    letter-spacing:.035em !important;
  }
}
@media (max-width:350px){
  .footer-contact__nav{gap:5px !important;}
  .footer-contact__nav a,
  .footer-contact__legal,
  .footer-contact__cookies{font-size:6px !important;letter-spacing:.02em !important;}
}

/* Lightbox: full image first, controls never cover too much of a phone screen. */
.lightbox__img{
  max-width:100% !important;
  max-height:calc(100dvh - 72px) !important;
  object-fit:contain !important;
}
.lightbox__btn{border-radius:0 !important;}
@media (max-width:599px){
  .lightbox__stage{width:100% !important;max-width:100% !important;padding-inline:8px !important;}
  .lightbox__img{max-height:calc(100dvh - 58px) !important;border-radius:0 !important;}
  .lightbox__btn{width:44px !important;height:52px !important;}
  .lightbox__btn--prev{left:8px !important;}
  .lightbox__btn--next{right:8px !important;}
  .lightbox__close{top:10px !important;right:10px !important;width:46px !important;height:46px !important;border-radius:0 !important;}
}

/* Cookies: usable even on 320–390 px screens. */
@media (max-width:479px){
  .cookie-modal__panel{
    width:calc(100vw - 16px) !important;
    max-height:calc(100dvh - 16px) !important;
    margin:8px auto 0 !important;
    padding:16px !important;
  }
  .cookie-modal__head{gap:12px !important;}
  .cookie-modal__title{font-size:16px !important;line-height:1.15 !important;}
  .cookie-modal__x{width:40px !important;height:40px !important;flex:0 0 40px !important;}
  .cookie-toggle{
    grid-template-columns:24px 20px minmax(0,1fr) !important;
    gap:10px !important;
    min-height:74px !important;
    padding:13px 12px !important;
  }
  .cookie-toggle input{width:20px !important;height:20px !important;}
  .cookie-toggle__name{font-size:11px !important;overflow-wrap:anywhere;}
  .cookie-toggle__note{font-size:10px !important;overflow-wrap:anywhere;}
  .cookie-modal__actions{grid-template-columns:1fr !important;}
  .cookie-modal__actions .cookie-btn--primary{grid-column:auto !important;grid-row:auto !important;}
  .cookie-btn{width:100% !important;min-height:48px !important;}
}

/* V64.1 — footer shares the exact same horizontal frame as page content. */
.footer-contact__inner,
.footer-contact__bottomInner{
  width:min(calc(100% - (var(--site-gutter) + var(--site-gutter))),var(--site-max)) !important;
  max-width:var(--site-max) !important;
}

/* =========================================================
   V82 — PRIVACY / COOKIE CENTER
   Detailed, expandable inventory in the visual language of the site.
========================================================= */
.cookie-modal-open{overflow:hidden!important;}
#cookieModal[aria-hidden="true"]{display:none!important;}
#cookieModal{position:fixed;inset:0;z-index:40000;overflow:auto;padding:0;}
.cookie-modal__backdrop{position:fixed;inset:0;background:rgba(0,0,0,.66);backdrop-filter:blur(4px);}
.cookie-modal__panel{
  position:relative;
  width:min(1180px,calc(100% - 36px));
  max-height:none;
  margin:16px auto 42px;
  padding:30px 32px 26px;
  background:#f4f4f2;
  color:#0b0b0b;
  border:1px solid rgba(11,11,11,.18);
  border-radius:16px;
  box-shadow:0 30px 110px rgba(0,0,0,.35);
  overflow:visible;
}
.cookie-modal__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:28px;
  padding-bottom:26px;
  margin:0 0 28px;
  border-bottom:1px solid rgba(11,11,11,.18);
}
.cookie-modal__kicker{
  margin-bottom:18px;
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.24em;
  color:var(--acid);
}
.cookie-modal__title{
  margin:0!important;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif!important;
  font-size:clamp(34px,5vw,68px)!important;
  line-height:.98!important;
  letter-spacing:-.045em!important;
  font-weight:800!important;
  text-transform:none!important;
  color:#0b0b0b!important;
}
.cookie-modal__x{
  width:58px;height:58px;
  display:grid;place-items:center;
  border-radius:50%;
  border:1px solid rgba(11,11,11,.3);
  background:transparent;
  color:#0b0b0b;
  font-size:34px;
  font-family:ui-sans-serif,system-ui,sans-serif;
  font-weight:300;
  cursor:pointer;
}
.cookie-modal__x:hover{background:rgba(37,99,235,.08);border-color:var(--acid);}
.cookie-modal__intro{
  margin:0 0 36px;
  padding:24px 26px;
  border-left:4px solid var(--acid);
  background:#ececf0;
  color:rgba(11,11,11,.72);
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:14px;
  line-height:1.75;
}
.cookie-category{padding:4px 0 24px;margin-bottom:26px;border-bottom:1px solid rgba(11,11,11,.16);}
.cookie-category__top{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:15px;}
.cookie-category__top h3{
  margin:0 0 7px!important;
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif!important;
  font-size:25px!important;
  font-weight:800!important;
  letter-spacing:-.025em!important;
  text-transform:none!important;
  color:#0b0b0b!important;
}
.cookie-category__state{
  display:block;
  font-family:"Audiowide",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  color:var(--acid);
}
.cookie-category--inactive .cookie-category__state{color:rgba(11,11,11,.45);}
.cookie-category__desc{max-width:950px;margin:0 0 22px;color:rgba(11,11,11,.68);font-size:15px;line-height:1.65;}
.cookie-switch{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:72px;height:42px;}
.cookie-switch input{position:absolute;opacity:0;pointer-events:none;}
.cookie-switch>span,.cookie-switch--locked,.cookie-switch--off{display:block;width:72px;height:42px;border-radius:30px;background:#d5d7da;border:1px solid rgba(11,11,11,.12);position:relative;transition:.2s ease;}
.cookie-switch i{position:absolute;top:5px;left:5px;width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid rgba(11,11,11,.12);transition:.2s ease;}
.cookie-switch input:checked+span{background:var(--acid);}
.cookie-switch input:checked+span i{transform:translateX(30px);}
.cookie-switch--locked{background:#173b2d;}
.cookie-switch--locked i{transform:translateX(30px);}
.cookie-switch--off{opacity:.55;}
.cookie-details-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:16px 18px;
  border:1px solid rgba(11,11,11,.18);
  background:#f8f8f6;
  color:#0b0b0b;
  cursor:pointer;
  font-family:"Audiowide",sans-serif;
  font-size:10px;
  letter-spacing:.08em;
  text-align:left;
}
.cookie-details-toggle span{display:flex;align-items:center;gap:12px;}
.cookie-details-toggle b{width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(11,11,11,.2);border-radius:50%;font-size:15px;font-family:ui-sans-serif,system-ui,sans-serif;}
.cookie-details-toggle em{font-style:normal;color:rgba(11,11,11,.52);white-space:nowrap;}
.cookie-details-toggle:hover{border-color:var(--acid);}
.cookie-details{padding-top:14px;display:grid;gap:14px;}
.cookie-details[hidden]{display:none!important;}
.cookie-detail-card{position:relative;padding:24px;border:1px solid rgba(11,11,11,.16);background:#f9f9f7;}
.cookie-detail-card__status{position:absolute;right:18px;top:18px;padding:8px 10px;border:1px solid rgba(11,11,11,.15);font-family:"Audiowide",sans-serif;font-size:8px;letter-spacing:.08em;background:#fff;}
.cookie-status--detected{color:#173b2d;border-color:rgba(23,59,45,.35);background:#eef7f2;}
.cookie-status--not-detected{color:#7b365b;border-color:rgba(123,54,91,.28);background:#fff7fb;}
.cookie-status--third-party,.cookie-status--unavailable{color:rgba(11,11,11,.58);background:#f0f0ed;}
.cookie-detail-card__grid{margin:38px 0 0;}
.cookie-detail-card__grid>div{display:grid;grid-template-columns:245px minmax(0,1fr);gap:28px;padding:14px 0;border-bottom:1px solid rgba(11,11,11,.1);}
.cookie-detail-card__grid>div:last-child{border-bottom:0;}
.cookie-detail-card__grid dt{font-family:"Audiowide",sans-serif;font-size:10px;letter-spacing:.05em;color:#0b0b0b;}
.cookie-detail-card__grid dd{margin:0;color:rgba(11,11,11,.68);font-size:14px;line-height:1.58;overflow-wrap:anywhere;}
.cookie-detail-card__grid code{padding:4px 7px;border-radius:4px;background:#e8e8e5;color:#0b0b0b;font-size:13px;}
.cookie-modal__actions{position:sticky;bottom:0;z-index:2;display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin:12px -32px -26px;padding:18px 32px;background:rgba(244,244,242,.97);border-top:1px solid rgba(11,11,11,.16);backdrop-filter:blur(8px);}
.cookie-btn{
  min-height:46px;
  padding:13px 16px;
  border-radius:0;
  border:1px solid rgba(11,11,11,.24);
  background:#fff;
  color:#0b0b0b;
  cursor:pointer;
  font-family:"Audiowide",sans-serif;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.cookie-btn--primary{background:var(--acid)!important;color:#fff!important;border-color:var(--acid)!important;}
.cookie-btn--ghost{background:transparent!important;color:#0b0b0b!important;}
.cookie-btn:hover{filter:none;transform:translateY(-1px);border-color:var(--acid);}

.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:35000;padding:16px;pointer-events:none;}
.cookie-banner.is-visible{pointer-events:auto;}
.cookie-banner__inner{
  max-width:1180px;
  margin:0 auto;
  padding:22px 22px 20px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:end;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  background:rgba(11,11,11,.96);
  color:#f2f2f2;
  box-shadow:0 24px 80px rgba(0,0,0,.45);
  backdrop-filter:blur(12px);
  transform:translateY(18px);
  opacity:0;
  transition:transform .22s ease,opacity .22s ease;
}
.cookie-banner.is-visible .cookie-banner__inner{transform:none;opacity:1;}
.cookie-banner__eyebrow{margin-bottom:9px;color:#7ea4ff;font-family:"Audiowide",sans-serif;font-size:8px;letter-spacing:.18em;}
.cookie-banner__title{margin:0 0 8px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:22px;font-weight:750;letter-spacing:-.025em;text-transform:none;}
.cookie-banner__desc{max-width:760px;color:rgba(242,242,242,.72);font-size:13px;line-height:1.55;}
.cookie-banner__actions{display:flex;gap:9px;align-items:center;justify-content:flex-end;flex-wrap:wrap;}
.cookie-banner .cookie-btn{background:rgba(255,255,255,.07);color:#fff;border-color:rgba(255,255,255,.18);}
.cookie-banner .cookie-btn--ghost{color:#fff!important;border-color:rgba(255,255,255,.28);}

@media(max-width:900px){
  .cookie-modal__panel{width:min(100% - 18px,1180px);margin:9px auto 24px;padding:22px 18px 20px;border-radius:12px;}
  .cookie-modal__head{gap:16px;padding-bottom:20px;margin-bottom:20px;}
  .cookie-modal__x{width:48px;height:48px;font-size:28px;}
  .cookie-modal__intro{padding:18px 16px;font-size:12px;line-height:1.65;margin-bottom:28px;}
  .cookie-category__top h3{font-size:22px!important;}
  .cookie-category__desc{font-size:14px;}
  .cookie-details-toggle{align-items:flex-start;flex-direction:column;gap:10px;}
  .cookie-details-toggle em{white-space:normal;}
  .cookie-detail-card{padding:18px 14px;}
  .cookie-detail-card__status{position:static;display:inline-block;margin-bottom:12px;}
  .cookie-detail-card__grid{margin:0;}
  .cookie-detail-card__grid>div{grid-template-columns:1fr;gap:6px;padding:12px 0;}
  .cookie-modal__actions{margin:10px -18px -20px;padding:14px 18px;display:grid;grid-template-columns:1fr;}
  .cookie-modal__actions .cookie-btn{width:100%;}
  .cookie-banner__inner{grid-template-columns:1fr;align-items:stretch;gap:16px;padding:18px;}
  .cookie-banner__actions{display:grid;grid-template-columns:1fr;}
  .cookie-banner__actions .cookie-btn{width:100%;}
}

/* V83 — COOKIE BANNER: first layer has only settings + accept */
@media (min-width:901px){
  .cookie-banner__actions{display:grid!important;grid-template-columns:auto auto!important;justify-content:end!important;}
}
@media (max-width:900px){
  .cookie-banner__actions{display:grid!important;grid-template-columns:1fr!important;}
}