/* wer.lash · base — fonts, tokens, reset, header, buttons.
   Treść jest w pełni widoczna bez JS; motion.js tylko ją ulepsza. */
@font-face{font-family:Jost;src:url('../assets/fonts/jost-latin-ext.woff2') format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Jost;src:url('../assets/fonts/jost-latin.woff2') format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Bodoni;src:url('../assets/fonts/bodoni-moda-latin-ext.woff2') format('woff2');font-weight:400 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Bodoni;src:url('../assets/fonts/bodoni-moda-latin.woff2') format('woff2');font-weight:400 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Bodoni;font-style:italic;src:url('../assets/fonts/bodoni-moda-italic-latin.woff2') format('woff2');font-weight:400 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122}

:root{--ink:#000;--paper:#fff;--sand:#edeae3;--mute:#5b5750;--mute-d:#bdb8b0;--pad:clamp(20px,5vw,72px);--hdr:72px}
*{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%;overflow-x:hidden;overscroll-behavior-x:none;max-width:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Jost,system-ui,sans-serif;font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip;overscroll-behavior-x:none;max-width:100%;position:relative}
h1,h2,h3,p,figure,ol,ul,dl,dd,blockquote{margin:0}
h1,h2,h3{font-weight:700}
ol,ul{padding:0}
a{color:inherit;text-decoration:none;text-underline-offset:6px}
a:hover{text-decoration:underline}
button,summary{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.45}
button,a,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid currentColor;outline-offset:5px}
img{width:100%;height:auto;display:block}
svg{display:block;width:100%;height:auto}
::selection{color:var(--paper);background:var(--ink)}

.access-skip{position:fixed;left:20px;top:-100px;z-index:200;background:#fff;color:#000;padding:14px 18px}
.access-skip:focus{top:20px}

/* header — difference blend keeps the nav legible on white, sand and black scenes */
.site-header{position:fixed;z-index:90;left:0;right:0;top:0;height:var(--hdr);padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;gap:24px;color:#fff;mix-blend-mode:difference;pointer-events:none}
.site-header>*{pointer-events:auto}
.logo{font-size:32px;font-weight:500;letter-spacing:-.035em;line-height:1}
.nav-links{display:flex;align-items:center;gap:clamp(14px,2vw,30px);font-size:15px}
.nav-links a{display:flex;align-items:center;min-height:44px}
.menu{display:none;position:relative}
.menu summary{display:flex;align-items:center;min-height:44px;list-style:none;font-size:15px;cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu nav{position:absolute;top:56px;right:0;width:230px;padding:10px 22px;background:#000;border:1px solid #fff;display:flex;flex-direction:column}
.menu nav a{padding:13px 0;font-size:17px}

.eyebrow{font-size:13px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;font-weight:500;margin-bottom:22px}
.quiet{font-size:14px;line-height:1.5}
.lead{font-size:19px;line-height:1.55;max-width:48ch;margin-top:24px;color:var(--mute)}
.body-copy{font-size:19px;line-height:1.6;max-width:50ch}
.body-copy+.body-copy{margin-top:18px}
.text-link{display:inline-flex;align-items:center;min-height:44px;font-size:16px;text-decoration:underline}

.cta{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:16px 30px;background:#000;color:#fff;font-weight:500;font-size:16px;letter-spacing:.01em;border:0;border-radius:2px;white-space:nowrap;text-decoration:none;box-shadow:inset 0 0 0 1.5px #000;transition:background-color .25s,color .25s;will-change:transform}
.cta:hover{background:#fff;color:#000;text-decoration:none}
.fixed-cta{position:fixed;z-index:80;bottom:24px;right:24px;box-shadow:0 0 0 2px #fff,0 10px 30px rgba(0,0,0,.3)}
.fixed-cta:hover{box-shadow:0 0 0 2px #000,0 10px 30px rgba(0,0,0,.3)}
.fixed-cta{transition:opacity .3s,transform .3s,background-color .25s,color .25s}
.fixed-cta.is-away{opacity:0;pointer-events:none;transform:translateY(14px)}
.cta-light{background:#fff;color:#000;box-shadow:inset 0 0 0 1.5px #fff}
.cta-light:hover{background:#000;color:#fff}
.cta-line{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px #fff}
.cta-line:hover{background:#fff;color:#000}

html.js-wait [data-hero-title],html.js-wait .hero-figure,html.js-wait .hero-badge,html.js-wait .hero-script{visibility:hidden}
.scene{position:relative}
.scene-skip{position:relative;z-index:30;display:inline-flex;min-height:44px;align-items:center;font-size:14px;text-decoration:underline}
.full-photo{display:block;position:relative}
.full-photo img{object-fit:contain}
.photo-caption{display:flex;justify-content:space-between;gap:20px;font-size:14px;line-height:1.4;margin-top:12px}
.draw-line{display:block;height:1px;background:currentColor;transform-origin:0 50%}

.signature{font-family:Bodoni,serif;font-style:italic;font-weight:500}

@media(max-width:1099px){.fixed-cta{bottom:18px;right:18px}}
@media(max-width:899px){
  .nav-links{display:none}.menu{display:block}
  /* na telefonie/tablecie pasek ma własne tło — przy blendzie menu prześwitywało */
  .site-header{mix-blend-mode:normal;background:rgba(255,255,255,.96);color:#000;border-bottom:1px solid #000}
  .menu nav{background:#fff;color:#000;border:1px solid #000}
}
@media(max-width:767px){
  body{font-size:17px}
  :root{--hdr:64px}
  .logo{font-size:26px}
  .fixed-cta{bottom:12px;right:12px;min-height:50px;padding:12px 20px;font-size:15px}
  .body-copy,.lead{font-size:17px}
  .quiet,.photo-caption{font-size:13px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}