:root{
  --bg:#171410;
  --bg-alt:#1c1811;
  --ink:#F2ECDF;
  --ink-muted:#9C9384;
  --accent:#C7963B;
  --accent-dim:rgba(199,150,59,.35);
  --line:rgba(242,236,223,.14);
  --ease: cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);
  font-family:'Work Sans',system-ui,sans-serif;}
::selection{background:var(--accent); color:#171410;}
h1,h2,h3,.num,.brand{font-family:'Fraunces',serif;}
a{color:inherit;}
img{max-width:100%; display:block;}

/* ---------- header (wspólny na wszystkich stronach) ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:28px 40px; pointer-events:none;
  background:linear-gradient(180deg, rgba(23,20,16,.9) 0%, rgba(23,20,16,.6) 60%, rgba(23,20,16,0) 100%);
}
header *{pointer-events:auto;}
.brand{font-size:22px; font-weight:600; letter-spacing:.02em; text-decoration:none; display:inline-block;}
.brand-logo{ display:block; height:46px; width:auto; filter:brightness(0) invert(1); }
nav{display:flex; gap:34px; font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:500;
    letter-spacing:.08em; text-transform:uppercase; color:var(--ink);}
nav a{text-decoration:none; transition:color .2s; padding:4px 0;}
nav a:hover, nav a:focus-visible{color:var(--accent);}
nav a.is-active{color:var(--accent);}
@media (max-width:900px) and (min-width:761px){ nav{gap:20px; font-size:12px;} }
@media (max-width:760px){ nav{display:none;} header{padding:20px 22px;} }

/* =====================================================================
   STRONA GŁÓWNA — poziomy scroll
   ===================================================================== */
body.home{overflow:hidden; height:100%;}
main.track{ display:flex; height:100vh; width:max-content; will-change:transform; }
a.panel{
  position:relative; width:100vw; height:100vh; flex:0 0 auto;
  display:flex; align-items:flex-end; overflow:hidden;
  border-right:1px solid var(--line);
  text-decoration:none; color:inherit; cursor:pointer;
}
a.panel img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:grayscale(1) contrast(1.08) brightness(.85);
  transition:filter .7s var(--ease), transform 1.4s var(--ease);
  transform:scale(1.04);
}
a.panel::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(23,20,16,0) 40%, rgba(23,20,16,.92) 100%);
  pointer-events:none;
}
a.panel:hover img, a.panel:focus-visible img{
  filter:grayscale(.15) contrast(1.05) brightness(.95) sepia(.18);
  transform:scale(1);
}
.panel-info{ position:relative; z-index:2; padding:0 6vw 8vh; max-width:640px; }
.num{ display:block; font-size:13px; color:var(--accent);
  font-family:'JetBrains Mono',monospace; letter-spacing:.12em; margin-bottom:14px;}
.panel-info h2{ font-size:clamp(34px,5vw,64px); font-weight:500; margin:0 0 12px; line-height:1.02;}
.panel-info p{ margin:0; color:var(--ink-muted); font-size:15px; max-width:44ch; line-height:1.55;}
.panel-cta{
  position:absolute; z-index:2; bottom:8vh; right:6vw;
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-muted); opacity:0; transition:opacity .25s var(--ease), color .2s;
}
a.panel:hover .panel-cta, a.panel:focus-visible .panel-cta{ opacity:1; color:var(--accent); }
.panel-cta::after{content:" →";}

.filmstrip{
  position:fixed; left:0; right:0; bottom:0; height:34px; z-index:40;
  background:var(--bg-alt); border-top:1px solid var(--line);
}
.filmstrip-track{
  position:relative; height:100%; margin:0 40px;
  background-image: radial-gradient(circle, rgba(242,236,223,.35) 0 2.5px, transparent 2.6px);
  background-size:26px 100%; background-repeat:repeat-x; background-position:center;
}
.filmstrip-frame{
  position:absolute; top:5px; bottom:5px; left:0;
  border:1px solid var(--accent); background:var(--accent-dim);
  will-change:transform,width;
}

@media (max-width:760px){
  body.home{ overflow:auto; height:auto; }
  main.track{ display:block; width:100%; height:auto; transform:none !important; }
  a.panel{ width:100%; height:100vh; border-right:none; border-bottom:1px solid var(--line); }
  .filmstrip{ display:none; }
  .panel-cta{ opacity:1; }
}
@media (prefers-reduced-motion: reduce){ a.panel img{ transition:none; } }

/* ---------- stopka (wspólna, na wszystkich podstronach oprócz strony głównej) ---------- */
.site-footer{
  background:#12100D; border-top:1px solid var(--line); padding:36px 6vw 24px;
}
.footer-inner{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;
  gap:16px; padding-bottom:24px; margin-bottom:20px; border-bottom:1px solid rgba(242,236,223,.08);
}
.footer-brand{ font-family:'Fraunces',serif; font-size:16px; color:var(--ink); }
.footer-brand span{ color:var(--accent); }
.footer-links{ display:flex; gap:24px; flex-wrap:wrap; }
.footer-links a{
  color:var(--ink-muted); text-decoration:none; font-size:13px;
  font-family:'JetBrains Mono',monospace; letter-spacing:.03em; transition:color .2s;
}
.footer-links a:hover{ color:var(--accent); }
.footer-contact{ display:flex; gap:8px; align-items:center; font-size:13px; color:var(--ink-muted); }
.footer-contact a{ color:var(--ink-muted); text-decoration:none; transition:color .2s; }
.footer-contact a:hover{ color:var(--accent); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px;
  font-size:12px; color:var(--ink-muted); opacity:.7;
}
@media (max-width:640px){
  .footer-inner{ flex-direction:column; align-items:flex-start; }
  .footer-bottom{ justify-content:center; text-align:center; }
}

/* =====================================================================
   PODSTRONA KATEGORII — pionowa, siatka lub tekst
   ===================================================================== */
body.category{ padding-top:0; }
.cat-hero{
  position:relative; height:56vh; min-height:340px; display:flex; align-items:flex-end;
  overflow:hidden;
}
.cat-hero img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:contrast(1.03) brightness(.94);
}
.cat-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(23,20,16,0) 45%, rgba(23,20,16,.85) 100%);
}
.cat-hero-info{ position:relative; z-index:2; padding:0 6vw 6vh; max-width:760px; }
.cat-hero-info h1{ font-size:clamp(32px,5vw,58px); font-weight:500; margin:0 0 14px; line-height:1.05;}
.cat-hero-info p{ margin:0; color:var(--ink-muted); font-size:16px; line-height:1.6; max-width:60ch;}

.page-content{ padding:8vh 6vw; max-width:760px; white-space:pre-line; line-height:1.7; color:var(--ink-muted); font-size:16px;}

.photo-grid{
  columns:3; column-gap:4px;
  padding:4px 4px 0;
}
.grid-item{
  position:relative; overflow:hidden; cursor:zoom-in;
  display:block; border:none; padding:0; background:var(--bg-alt);
  break-inside:avoid; margin-bottom:4px; width:100%;
}
.grid-item img{
  width:100%; height:auto; display:block; object-fit:cover;
  filter:grayscale(1) contrast(1.05) brightness(.9);
  transition:filter 11s var(--ease);
}
.grid-item:hover img, .grid-item:focus-visible img{
  filter:grayscale(.1) contrast(1.02) brightness(1) sepia(.12);
  transition:filter .4s var(--ease);
}
@media (max-width:900px){ .photo-grid{ columns:2; } }
@media (max-width:520px){ .photo-grid{ columns:1; } }

.cat-nav-footer{
  display:flex; justify-content:space-between; align-items:center;
  padding:6vh 6vw 8vh; border-top:1px solid var(--line); margin-top:60px;
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
}
.cat-nav-footer a{ text-decoration:none; color:var(--ink-muted); transition:color .2s; }
.cat-nav-footer a:hover, .cat-nav-footer a:focus-visible{ color:var(--accent); }
.cat-nav-footer .next{ text-align:right; }

/* ---------- kontakt ---------- */
.contact-block p{ margin:0 0 22px; }
.contact-link{
  font-family:'Fraunces',serif; font-size:24px; font-weight:500;
  color:var(--ink); text-decoration:none; border-bottom:1px solid transparent;
  transition:color .2s, border-color .2s;
}
.contact-link:hover, .contact-link:focus-visible{ color:var(--accent); border-color:var(--accent); }
.contact-area{ color:var(--ink-muted); font-size:14px; }

/* ---------- oferta / cennik ---------- */
.offer-page{ padding-bottom:8vh; }
.promo-banner{
  margin:0 6vw 40px; padding:16px 22px; border-radius:8px;
  background:var(--accent-dim); border:1px solid var(--accent); color:var(--ink);
  font-family:'JetBrains Mono',monospace; font-size:13px; letter-spacing:.04em;
}
.offer-section{ padding:0 6vw; margin-bottom:64px; }
.offer-section h2{
  font-size:clamp(22px,3vw,30px); font-weight:500; margin:0 0 22px;
  display:flex; align-items:baseline; gap:10px;
}
.offer-num{ color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:15px; }

.pricing-table-wrap{ overflow-x:auto; }
.pricing-table{ width:100%; border-collapse:collapse; font-size:14px; min-width:520px; }
.pricing-table th, .pricing-table td{
  padding:12px 14px; text-align:center; border-bottom:1px solid var(--line);
}
.pricing-table thead th{
  color:var(--ink-muted); font-weight:500; font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.06em; text-transform:uppercase; text-align:center;
}
.pricing-table tbody th[scope="row"]{
  text-align:left; font-family:'Fraunces',serif; font-weight:500; color:var(--ink); font-size:15px;
}
.pricing-table tbody td{ color:var(--ink-muted); }
.offer-note{ margin-top:14px; color:var(--ink-muted); font-size:13px; font-style:italic; }

.pricing-list{ list-style:none; margin:0; padding:0; max-width:520px; }
.pricing-list li{
  display:flex; justify-content:space-between; gap:20px;
  padding:14px 0; border-bottom:1px solid var(--line); font-size:16px;
}
.pricing-list li .price{ color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:14px; white-space:nowrap; }

.offer-text{ color:var(--ink-muted); line-height:1.7; max-width:60ch; }


/* =====================================================================
   LIGHTBOX — współdzielony (galeria kategorii)
   ===================================================================== */
.lightbox{
  position:fixed; inset:0; z-index:100;
  background:rgba(15,13,10,.97);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .35s var(--ease);
}
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox-figure{ position:relative; max-width:min(88vw,1100px); max-height:80vh; }
.lb-image-frame{ position:relative; display:inline-block; }
.lb-image-frame img{
  display:block; max-width:100%; max-height:80vh; width:auto; height:auto;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.lb-hit{
  position:absolute; top:0; bottom:0; width:50%;
  background:none; border:none; padding:0; margin:0; z-index:3;
}
.lb-hit-prev{
  left:0;
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Ccircle cx='22' cy='22' r='20.5' fill='rgba(23,20,16,0.55)' stroke='%23C7963B' stroke-width='1.5'/%3E%3Cpath d='M25 14l-9 8 9 8' fill='none' stroke='%23C7963B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 22 22, w-resize;
}
.lb-hit-next{
  right:0;
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Ccircle cx='22' cy='22' r='20.5' fill='rgba(23,20,16,0.55)' stroke='%23C7963B' stroke-width='1.5'/%3E%3Cpath d='M19 14l9 8-9 8' fill='none' stroke='%23C7963B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 22 22, e-resize;
}
.lightbox-caption{
  margin-top:18px; display:flex; align-items:baseline; gap:14px;
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; color:var(--ink-muted);
}
.lightbox-caption .lb-num{ color:var(--accent); }
.lightbox-caption h3{ font-family:'Fraunces',serif; font-weight:500; font-size:18px; margin:0; color:var(--ink); letter-spacing:0; }
.lb-btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:4;
  width:44px; height:44px; border-radius:50%; border:1px solid var(--line);
  background:rgba(23,20,16,.6); color:var(--ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .2s, color .2s;
}
.lb-btn:hover, .lb-btn:focus-visible{ border-color:var(--accent); color:var(--accent); }
.lb-prev{ left:16px; } .lb-next{ right:16px; }
.lb-close{
  position:fixed; top:28px; right:36px; width:40px; height:40px; border-radius:50%;
  border:1px solid var(--line); background:rgba(23,20,16,.6); color:var(--ink); cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:border-color .2s, color .2s;
}
.lb-close:hover, .lb-close:focus-visible{ border-color:var(--accent); color:var(--accent); }
