/* mariuszalin.com — jeden lekki arkusz. Mobile first. Świadomie jeden, ciemny świat: noc z fioletem (od 28.10.2026). */
@font-face{font-family:Cormorant;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/cormorant-latin-ext-300-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:Cormorant;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/cormorant-latin-300-normal.woff2) format("woff2");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:Cormorant;font-style:italic;font-weight:300;font-display:swap;src:url(fonts/cormorant-latin-ext-300-italic.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:Cormorant;font-style:italic;font-weight:300;font-display:swap;src:url(fonts/cormorant-latin-300-italic.woff2) format("woff2");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:Cormorant;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:Cormorant;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-latin-500-normal.woff2) format("woff2");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:Cormorant;font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-latin-ext-500-italic.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:Cormorant;font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-latin-500-italic.woff2) format("woff2");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:Jost;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/jost-latin-ext-300-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/jost-latin-300-normal.woff2) format("woff2");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:Jost;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-latin-400-normal.woff2) format("woff2");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:Jost;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-latin-500-normal.woff2) format("woff2");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:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,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:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");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}

:root{
  --void:#07061a;   /* tło: głęboka przestrzeń z kroplą fioletu */
  --night:#110d28;  /* powierzchnie */
  --veil:#251d45;   /* linie */
  --star:#ebe5d8;   /* tekst */
  --dust:#a4a0c2;   /* tekst drugi */
  --ember:#e6b768;  /* jedyny akcent: światło */
  --nebula:#8b6fe0; /* tylko poświata */
  --f-display:Cormorant,"Cormorant Garamond",Georgia,serif;
  --f-body:Jost,"Avenir Next",Futura,system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gut:max(18px,env(safe-area-inset-left,0px));
  --gutr:max(18px,env(safe-area-inset-right,0px));
  --max:1120px;
  --head:64px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head) + 12px)}
body{margin:0;background:var(--void);color:var(--star);font:300 17px/1.7 var(--f-body);min-height:100vh;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--ember);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:1px solid var(--ember);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ember);color:var(--void);padding:8px 14px}
.skip:focus{left:var(--gut)}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gutr)}
.read{max-width:700px}

/* niebo */
#sky{position:fixed;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(70% 45% at 85% 0%,color-mix(in srgb,var(--nebula) 26%,transparent),transparent 70%),
             radial-gradient(60% 50% at 0% 100%,color-mix(in srgb,#5a3fb8 18%,transparent),transparent 70%),
             radial-gradient(50% 40% at 10% 100%,color-mix(in srgb,var(--ember) 5%,transparent),transparent 70%)}
/* smugi: długie, rozmyte pasma fioletu, które bardzo powoli dryfują (dodawane w site.js) */
.smugi{position:fixed;inset:-20%;z-index:-1;pointer-events:none;overflow:hidden}
.smugi i{position:absolute;display:block;border-radius:50%;filter:blur(60px);mix-blend-mode:screen;will-change:transform}
.smugi i:nth-child(1){width:95%;height:16%;left:-5%;top:24%;transform:rotate(-14deg);background:linear-gradient(90deg,transparent,#7a55e0 30%,#b07cff 55%,#5b3cc4 75%,transparent);opacity:.32;animation:dryf1 70s ease-in-out infinite alternate}
.smugi i:nth-child(2){width:80%;height:11%;left:25%;top:58%;transform:rotate(-24deg);background:linear-gradient(90deg,transparent,#4a2fa8 25%,#9a6cf0 60%,transparent);opacity:.26;animation:dryf2 90s ease-in-out infinite alternate}
.smugi i:nth-child(3){width:60%;height:9%;left:-10%;top:76%;transform:rotate(8deg);background:linear-gradient(90deg,transparent,#c58bff 40%,#6a46d0 70%,transparent);opacity:.18;animation:dryf3 110s ease-in-out infinite alternate}
@keyframes dryf1{to{transform:translate(8%,6%) rotate(-8deg) scaleX(1.12)}}
@keyframes dryf2{to{transform:translate(-10%,-5%) rotate(-30deg) scaleX(.9)}}
@keyframes dryf3{to{transform:translate(12%,-8%) rotate(14deg) scaleX(1.2)}}
@media (prefers-reduced-motion:reduce){.smugi i{animation:none}}

/* ---------- nagłówek ---------- */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:31;background:var(--void)}
.head{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:color-mix(in srgb,var(--void) 82%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid color-mix(in srgb,var(--veil) 70%,transparent)}
.head .wrap{display:flex;align-items:center;gap:10px;min-height:var(--head)}
.logo{font:500 22px/1 var(--f-display);color:var(--star);text-decoration:none;letter-spacing:.01em;white-space:nowrap;margin-right:auto}
.logo span{color:var(--ember)}
.nav{display:none}
.nav a{color:var(--dust);text-decoration:none;font:400 12.5px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;padding:8px 0;border-bottom:1px solid transparent;white-space:nowrap}
.nav a:hover{color:var(--star)}
.nav a[aria-current="page"]{color:var(--star);border-bottom-color:var(--ember)}

.radio{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px 0 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ember) 45%,transparent);background:transparent;color:var(--star);font:400 12px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;max-width:46vw}
.radio:hover{border-color:var(--ember)}
.radio .ico{width:14px;height:14px;flex:none;display:grid;place-items:center}
.radio .ico::before{content:"";border-left:9px solid var(--ember);border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:2px}
.radio .eq{display:none;gap:2px;align-items:flex-end;height:12px}
.radio .eq i{width:2px;background:var(--ember);height:4px;animation:eq 1s ease-in-out infinite}
.radio .eq i:nth-child(2){animation-delay:-.4s}.radio .eq i:nth-child(3){animation-delay:-.7s}
@keyframes eq{50%{height:12px}}
.radio[aria-pressed="true"] .ico{display:none}
.radio[aria-pressed="true"] .eq{display:flex}
.radio[aria-pressed="true"]{background:color-mix(in srgb,var(--ember) 12%,transparent)}
.radio .now{display:none;text-transform:none;letter-spacing:0;font-size:13px;color:var(--dust);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.radio.loading .ico::before{opacity:.4}

.lang{display:inline-flex;align-items:center;font:400 12px/1 var(--f-mono);letter-spacing:.08em;border:1px solid var(--veil);border-radius:999px;height:36px;overflow:hidden}
.lang a,.lang span{padding:0 10px;height:100%;display:grid;place-items:center;text-decoration:none;color:var(--dust)}
.lang span{color:var(--void);background:var(--star)}

.burger{width:40px;height:40px;display:grid;place-items:center;background:none;border:0;color:var(--star);cursor:pointer;margin-right:-8px}
.burger i,.burger i::before,.burger i::after{display:block;width:20px;height:1px;background:currentColor;position:relative;transition:transform .3s,background .3s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0}
.burger i::before{top:-6px}.burger i::after{top:6px}
.menu-open .burger i{background:transparent}
.menu-open .burger i::before{transform:translateY(6px) rotate(45deg)}
.menu-open .burger i::after{transform:translateY(-6px) rotate(-45deg)}

.mnav{position:fixed;inset:calc(var(--head) + env(safe-area-inset-top,0px)) 0 0;z-index:29;background:var(--void);padding:28px var(--gutr) calc(28px + env(safe-area-inset-bottom,0px)) var(--gut);display:flex;flex-direction:column;gap:4px;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.menu-open .mnav{opacity:1;visibility:visible}
.mnav a{font:300 34px/1.25 var(--f-display);color:var(--star);text-decoration:none;padding:6px 0;border-bottom:1px solid var(--veil)}
.mnav a[aria-current="page"]{color:var(--ember)}
.mnav .small{margin-top:auto;padding-top:24px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
.mnav .small a{font:400 14px/1.4 var(--f-body);border:0;color:var(--dust)}
.menu-open{overflow:hidden}

@media (min-width:980px){
  .nav{display:flex;gap:26px;margin-right:18px}
  .burger,.mnav{display:none}
  .radio .now{display:inline}
}
@media (max-width:380px){
  .logo{font-size:19px}
  .radio{padding:0 10px}
  .radio .lbl{display:none}
}

/* ---------- typografia ---------- */
h1,h2,h3{font-family:var(--f-display);font-weight:300;line-height:1.06;margin:0;text-wrap:balance;letter-spacing:-.005em}
h1{font-size:clamp(44px,10.5vw,92px)}
h2{font-size:clamp(32px,6.2vw,52px)}
h3{font-size:clamp(25px,4vw,32px);line-height:1.15;font-weight:500}
h1 em,h2 em,h3 em{font-style:italic;color:var(--ember)}
p{margin:0}
.eyebrow{font:400 12px/1.4 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ember)}
.lead{font-size:clamp(17px,2.2vw,19px);color:var(--dust);max-width:48ch}
.muted{color:var(--dust)}
.prose{display:grid;gap:16px;max-width:64ch}
.prose h3{margin-top:12px}

/* ---------- sekcje ---------- */
main{display:block}
.sec{padding-block:clamp(44px,7vw,80px) 0;display:grid;gap:clamp(22px,4vw,36px)}
.sec + .sec{border-top:1px solid var(--veil);margin-top:clamp(44px,7vw,80px)}
.sec.tight{padding-top:clamp(28px,5vw,48px)}
.hero{display:grid;gap:30px;padding-block:clamp(36px,8vw,88px) 0;align-items:center}
.hero .txt{display:grid;gap:22px;justify-items:start}
@media (min-width:860px){
  .hero{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .hero.flip .side{order:-1}
}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;font:400 13px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:1px solid var(--ember);background:var(--ember);color:var(--void);transition:filter .2s,border-color .2s}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--star);border-color:color-mix(in srgb,var(--star) 28%,transparent)}
.btn.ghost:hover{border-color:var(--star)}
@media (max-width:520px){.btns .btn{flex:1 1 100%}}

/* oddychające światło */
.orbwrap{display:grid;justify-items:center;gap:16px}
.orb{width:min(320px,70vw);aspect-ratio:1;border-radius:50%;position:relative;max-width:100%}
.orb::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle,#fff6e2 0%,var(--ember) 12%,color-mix(in srgb,var(--ember) 28%,transparent) 34%,transparent 68%);
  transform:scale(var(--s,.62));opacity:var(--o,.75);transition:transform 4s cubic-bezier(.45,0,.55,1),opacity 4s ease}
.orb::after{content:"";position:absolute;inset:7%;border-radius:50%;border:1px solid color-mix(in srgb,var(--nebula) 30%,transparent)}
.phase{display:flex;gap:14px;font:400 11.5px/1 var(--f-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--dust)}
.phase span{opacity:.35;transition:opacity .6s,color .6s}
.phase span.on{opacity:1;color:var(--ember)}
.orb-ctl{background:none;border:0;color:var(--dust);font:400 12px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;padding:6px}
.orb-ctl:hover{color:var(--star)}

/* drzwi */
.doors{display:grid;gap:1px;background:var(--veil);border:1px solid var(--veil);border-radius:12px;overflow:hidden}
.door{background:color-mix(in srgb,var(--void) 78%,transparent);padding:28px 24px;display:grid;gap:10px;align-content:start;text-decoration:none;color:inherit;transition:background .4s}
.door:hover{background:color-mix(in srgb,var(--night) 94%,transparent)}
.door .k{font:400 11px/1.4 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ember)}
.door h3{font-size:28px}
.door p{color:var(--dust);font-size:16px}
.door .go{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--star);margin-top:6px}
@media (min-width:860px){.doors{grid-template-columns:repeat(3,minmax(0,1fr))}}

.facts{display:grid;gap:22px}
.fact{display:grid;gap:4px;border-left:1px solid var(--veil);padding-left:18px}
.fact b{font:300 clamp(44px,7vw,58px)/1 var(--f-display);color:var(--ember);font-variant-numeric:tabular-nums}
.fact span{color:var(--dust);font-size:15px;max-width:30ch}
@media (min-width:700px){.facts{grid-template-columns:repeat(3,minmax(0,1fr))}}

.split{display:grid;gap:28px;align-items:start}
@media (min-width:860px){.split{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px}.split.even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.photo{aspect-ratio:4/5;width:100%;border-radius:10px;overflow:hidden;border:1px solid var(--veil);position:relative;
  background:radial-gradient(circle at 50% 36%,color-mix(in srgb,var(--star) 14%,transparent) 0 17%,transparent 18%),radial-gradient(ellipse at 50% 96%,color-mix(in srgb,var(--star) 11%,transparent) 0 40%,transparent 41%),linear-gradient(180deg,var(--night),var(--void))}
@media (max-width:859px){.photo{max-width:440px}.cover{max-width:320px}}
.photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.92)}
.photo.wide{aspect-ratio:16/9;max-width:none}
.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--void) 70%,transparent))}

blockquote.quote{margin:0;font:300 italic clamp(24px,3.6vw,34px)/1.35 var(--f-display);max-width:32ch;text-wrap:balance}
blockquote.quote footer{font:400 12px/1 var(--f-mono);letter-spacing:.16em;color:var(--dust);margin-top:14px;font-style:normal;text-transform:uppercase}

/* listy, kroki, daty */
.rows{display:grid;border-top:1px solid var(--veil)}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--veil)}
.row b{font-weight:500}
.row .d{font:400 15px/1.3 var(--f-mono);font-variant-numeric:tabular-nums}
.row .st{font:400 11.5px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}
.row .st.on{color:var(--ember)}
.row small{display:block;color:var(--dust);font-size:14.5px}

.steps{display:grid;gap:24px;counter-reset:s}
.step{display:grid;gap:6px;align-content:start}
.step::before{counter-increment:s;content:counter(s);font:300 38px/1 var(--f-display);color:var(--ember)}
.step h4{margin:0;font:500 16px/1.3 var(--f-body);letter-spacing:.02em}
.step p{color:var(--dust);font-size:15.5px}
.steps.nonum .step::before{content:none}
@media (min-width:600px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:980px){.steps.four{grid-template-columns:repeat(4,minmax(0,1fr))}.steps.three{grid-template-columns:repeat(3,minmax(0,1fr))}}

ul.clean{margin:0;padding:0;list-style:none;display:grid;gap:10px}
ul.clean li{padding-left:22px;position:relative}
ul.clean li::before{content:"";position:absolute;left:2px;top:.8em;width:9px;height:1px;background:var(--ember)}

.note{border-left:1px solid var(--ember);padding:4px 0 4px 18px;color:var(--dust);font-size:15.5px;max-width:64ch}
.card{border:1px solid var(--veil);border-radius:12px;padding:clamp(20px,4vw,30px);background:color-mix(in srgb,var(--night) 70%,transparent);display:grid;gap:14px}

details{border-top:1px solid var(--veil)}
details:last-of-type{border-bottom:1px solid var(--veil)}
summary{cursor:pointer;list-style:none;padding:18px 32px 18px 0;position:relative;font:500 17px/1.4 var(--f-body)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font:300 26px/1 var(--f-display);color:var(--ember);transition:transform .3s}
details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
details .inner{padding:0 0 22px;display:grid;gap:12px;color:var(--dust)}

/* oś czasu */
.timeline{display:grid;border-left:1px solid var(--veil);margin-left:4px}
.tl{display:grid;gap:4px;padding:0 0 30px 24px;position:relative}
.tl::before{content:"";position:absolute;left:-4px;top:8px;width:7px;height:7px;border-radius:50%;background:var(--ember);box-shadow:0 0 12px var(--ember)}
.tl b{font:400 13px/1.4 var(--f-mono);color:var(--ember);letter-spacing:.06em}
.tl h4{margin:0;font:500 23px/1.2 var(--f-display)}
.tl p{color:var(--dust);font-size:16px;max-width:60ch}
@media (min-width:700px){.tl{grid-template-columns:96px minmax(0,1fr);gap:22px}.tl>div{display:grid;gap:4px}}

/* sklep */
.shop{display:grid;gap:36px}
@media (min-width:700px){.shop{grid-template-columns:repeat(2,minmax(0,1fr))}}
.book{display:grid;gap:14px;align-content:start}
.cover{aspect-ratio:3/4;border-radius:6px;border:1px solid var(--veil);overflow:hidden;position:relative;display:grid;place-items:center;text-align:center;padding:24px;
  background:radial-gradient(circle at 50% 28%,color-mix(in srgb,var(--ember) 22%,transparent),transparent 62%),var(--night)}
.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.cover .t{font:300 clamp(30px,5vw,40px)/1.05 var(--f-display);position:relative}
.cover .a{display:block;font:400 11px/1 var(--f-mono);letter-spacing:.2em;color:var(--dust);margin-bottom:14px}
.cover.flame{background:conic-gradient(from 200deg at 50% 55%,color-mix(in srgb,var(--ember) 40%,var(--night)),color-mix(in srgb,var(--nebula) 55%,var(--night)),var(--night),color-mix(in srgb,var(--ember) 30%,var(--night)))}
.cover.music{background:repeating-radial-gradient(circle at 50% 50%,var(--night) 0 7px,color-mix(in srgb,var(--star) 6%,var(--night)) 7px 8px)}
.book .meta{display:flex;flex-wrap:wrap;gap:6px 14px;font:400 12px/1.4 var(--f-mono);color:var(--dust);letter-spacing:.06em}
.book .price{font:300 34px/1 var(--f-display);color:var(--ember)}
.book h3{font-size:30px}
.pick{font-style:italic;font-family:var(--f-display);font-size:20px;color:var(--star);line-height:1.4;border-left:1px solid var(--veil);padding-left:16px}
.links-row{display:flex;flex-wrap:wrap;gap:10px}
.chip{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:1px solid var(--veil);border-radius:999px;color:var(--star);text-decoration:none;font-size:14.5px}
.chip:hover{border-color:var(--ember)}

/* bramka wideo + lekkie osadzenia */
.gate{border:1px solid var(--veil);border-radius:12px;overflow:hidden;background:color-mix(in srgb,var(--night) 75%,transparent)}
.gate .top{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--veil);font:400 11.5px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.gate .top i{width:8px;height:8px;border-radius:50%;background:var(--ember);box-shadow:0 0 10px var(--ember);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.gate .body{padding:clamp(20px,4vw,30px);display:grid;gap:16px;justify-items:start}
.gate .slot{width:100%;min-height:0}
.gate .slot.on{min-height:620px}
.yt{position:relative;aspect-ratio:16/9;width:100%;border-radius:10px;overflow:hidden;border:1px solid var(--veil);background:var(--night) center/cover no-repeat;cursor:pointer;display:grid;place-items:center;color:var(--star);padding:0;font:inherit}
.yt::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--void) 70%,transparent))}
.yt span{position:relative;display:inline-flex;align-items:center;gap:10px;font:400 12.5px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;border:1px solid color-mix(in srgb,var(--star) 40%,transparent);border-radius:999px;padding:14px 20px;background:color-mix(in srgb,var(--void) 60%,transparent)}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

.copy{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--veil);border-radius:6px;color:var(--dust);font:400 12px/1 var(--f-body);padding:8px 10px;cursor:pointer}
.copy:hover{color:var(--star);border-color:var(--dust)}
.pay{display:grid;gap:0;border-top:1px solid var(--veil)}
.pay div{display:grid;gap:6px;padding:16px 0;border-bottom:1px solid var(--veil)}
.pay b{font:400 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ember)}
.pay code{font:400 15px/1.5 var(--f-mono);color:var(--star);word-break:break-all}
@media (min-width:700px){.pay div{grid-template-columns:150px minmax(0,1fr) auto;align-items:center}}

/* formularz kontaktowy */
.cform{display:grid;gap:8px;margin-top:6px}
.cform label{font:400 12px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dust);margin-top:8px}
.cform input,.cform textarea{width:100%;background:color-mix(in srgb,var(--night) 80%,transparent);border:1px solid var(--veil);border-radius:8px;color:var(--star);font:300 16px/1.5 var(--f-body);padding:12px 14px}
.cform textarea{resize:vertical;min-height:130px}
.cform input:focus,.cform textarea:focus{outline:none;border-color:var(--ember)}
.cform .btn{justify-self:start;margin-top:12px}
.cform .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.cform .fine{font-size:13.5px;color:var(--dust)}
.cform .status{font-size:15px;color:var(--ember);min-height:1em}
.radio.resume{animation:resume 1.6s ease-in-out infinite;border-color:var(--ember)}
@keyframes resume{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--ember) 18%,transparent)}}

/* galeria */
.gfilter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.gfilter button{min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--veil);background:none;color:var(--dust);font:400 12.5px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.gfilter button[aria-pressed="true"]{color:var(--void);background:var(--ember);border-color:var(--ember)}
.gallery{columns:2 150px;column-gap:12px}
@media (min-width:760px){.gallery{columns:3;column-gap:16px}}
@media (min-width:1100px){.gallery{columns:4}}
.gi{break-inside:avoid;margin:0 0 14px;display:grid;gap:6px}
.gi[hidden]{display:none!important}
.gi a{display:block;border-radius:8px;overflow:hidden;border:1px solid var(--veil);background:var(--night)}
.gi img{width:100%;height:auto;transition:transform .5s ease,filter .5s ease;filter:saturate(.9)}
.gi a:hover img{transform:scale(1.03);filter:saturate(1)}
.gi figcaption{font-size:13.5px;line-height:1.4;color:var(--dust)}
.gstrip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.gs{display:block;aspect-ratio:1;border-radius:8px;overflow:hidden;border:1px solid var(--veil);background:var(--night)}
.gs img{width:100%;height:100%;object-fit:cover;filter:brightness(.5) saturate(.55) sepia(.12);transition:transform .5s ease,filter .7s ease}
.gs:hover img,.gs:focus-visible img{transform:scale(1.05);filter:none}
.lb{position:fixed;inset:0;z-index:60;background:var(--void);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(56px + env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));touch-action:pan-y}
.lb[hidden]{display:none!important}
.lb img{max-width:100%;max-height:calc(100% - 64px);object-fit:contain;border-radius:4px;min-height:0}
.lb p{text-align:center;color:var(--star);font:300 italic 20px/1.4 var(--f-display);margin-top:12px;min-height:1.4em}
.lb button{position:absolute;background:color-mix(in srgb,var(--night) 80%,transparent);border:1px solid var(--veil);color:var(--star);width:44px;height:44px;border-radius:50%;cursor:pointer;font:300 22px/1 var(--f-body);display:grid;place-items:center}
.lb .x{top:calc(8px + env(safe-area-inset-top,0px));right:max(12px,env(safe-area-inset-right,0px))}
.lb .pv{left:max(12px,env(safe-area-inset-left,0px));top:50%}
.lb .nx{right:max(12px,env(safe-area-inset-right,0px));top:50%}
.lb-open{overflow:hidden}

/* stopka */
.foot{margin-top:clamp(64px,10vw,120px);border-top:1px solid var(--veil);padding-block:40px calc(32px + env(safe-area-inset-bottom,0px))}
.foot .wrap{display:grid;gap:28px}
.foot .cols{display:grid;gap:28px}
@media (min-width:760px){.foot .cols{grid-template-columns:1.3fr 1fr 1fr}}
.foot h4{margin:0 0 10px;font:400 11.5px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot a{color:var(--star);text-decoration:none;font-size:15.5px}
.foot a:hover{color:var(--ember)}
.foot .sign{font:300 italic 26px/1.3 var(--f-display)}
.foot .copy-line{font-size:13px;color:var(--dust);display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between}

/* przejście między stronami (miękkie, nie przerywa radia) */
main{transition:opacity .25s ease}
main.leaving{opacity:0}

@media (prefers-reduced-motion:reduce){
  .orb::before,main{transition:none}
  .radio .eq i,.gate .top i{animation:none}
}

/* Dziennik świetlisty */
.card.warn{border-color:var(--ember)}
.diary-toc{display:flex;flex-wrap:wrap;gap:8px}
.diary{display:grid;gap:clamp(36px,6vw,56px);max-width:72ch}
.diary article{display:grid;gap:14px;scroll-margin-top:90px}
.diary h3{margin:12px 0 0;display:grid;gap:4px}
.diary h3 span{font:400 11.5px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.diary p{color:var(--dust)}

/* Blog */
.post-grid{display:grid;gap:clamp(18px,3vw,28px)}
@media (min-width:640px){.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:980px){.post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.post-card{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--veil);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;background:color-mix(in srgb,var(--night) 55%,transparent);transition:border-color .4s,transform .4s}
.post-card:hover{border-color:color-mix(in srgb,var(--ember) 60%,var(--veil));transform:translateY(-2px)}
.pc-img{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--night)}
.pc-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.8) brightness(.85);transition:filter .5s,transform .8s}
.post-card:hover .pc-img img{filter:saturate(.95) brightness(.95);transform:scale(1.03)}
.pc-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,color-mix(in srgb,var(--void) 75%,transparent))}
.pc-txt{display:grid;gap:10px;padding:22px 22px 24px;align-content:start}
.pc-txt h3{font-size:clamp(24px,3vw,28px)}
.pc-txt .muted{font-size:15.5px}
.pc-txt .go{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--star);margin-top:4px}
.post-hero .eyebrow a{color:inherit;text-decoration:none}
.post-hero .eyebrow a:hover{text-decoration:underline}
.post-photo{aspect-ratio:4/3;max-width:460px}
.post-body{font-size:18px;line-height:1.75}
.post-body p{color:var(--star)}
.post-body.fade{position:relative}
.post-body.fade::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;pointer-events:none;background:linear-gradient(180deg,transparent,var(--void))}
.book-cta{grid-template-columns:1fr;align-items:center;gap:22px;border-color:color-mix(in srgb,var(--ember) 45%,var(--veil))}
.book-cta .cover.sm{width:120px;padding:0;aspect-ratio:3/4}
@media (min-width:640px){.book-cta{grid-template-columns:140px minmax(0,1fr)}.book-cta .cover.sm{width:140px}}
.post-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.post-nav a{text-decoration:none;color:var(--star);font:300 20px/1.25 var(--f-display)}
.post-nav a span{display:block;font:400 11px/1.4 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ember);margin-bottom:6px}
.post-nav .next{text-align:right}
.post-nav .all{font:400 12px/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dust);border:1px solid var(--veil);border-radius:999px;padding:10px 16px}
.post-nav .all:hover{border-color:var(--ember);color:var(--star)}
@media (max-width:640px){.post-nav{grid-template-columns:1fr 1fr}.post-nav .all{grid-column:1/-1;grid-row:1;justify-self:center}}

/* W mediach + flipbook */
.press{display:grid;gap:26px;align-items:start}
@media (min-width:700px){.press{grid-template-columns:190px minmax(0,1fr)}}
.press .small{font-size:14px}
.press-cover{position:relative;width:190px;padding:0;border:1px solid var(--veil);border-radius:4px;overflow:hidden;background:#fff;cursor:pointer;transform:rotate(-2deg);box-shadow:0 18px 40px -18px rgba(0,0,0,.8);transition:transform .5s,box-shadow .5s}
.press-cover:hover,.press-cover:focus-visible{transform:rotate(0) translateY(-3px);box-shadow:0 22px 50px -16px color-mix(in srgb,var(--ember) 35%,transparent)}
.press-cover img{display:block;width:100%;height:auto}
.press-badge{position:absolute;left:10px;bottom:10px;font:400 11px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;background:var(--ember);color:var(--void);padding:8px 10px;border-radius:999px}
html.flip-lock{overflow:hidden}
.fbook{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:color-mix(in srgb,var(--void) 97%,transparent);color:var(--star)}
.fbook::backdrop{background:rgba(3,4,8,.85)}
.fbook[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);overflow:hidden}
.flip-top{display:flex;align-items:center;gap:14px;padding:12px var(--gutr) 12px var(--gut);border-bottom:1px solid var(--veil)}
.flip-title{font:300 18px/1.2 var(--f-display);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flip-count{font:400 12px/1 var(--f-mono);letter-spacing:.12em;color:var(--dust)}
.flip-x{width:44px;height:44px;border-radius:50%;border:1px solid var(--veil);background:none;color:var(--star);font-size:24px;line-height:1;cursor:pointer}
.flip-x:hover{border-color:var(--ember)}
.flip-stage{position:relative;display:grid;place-items:center;min-height:0;padding:16px var(--gut)}
.flip-ctrl{display:flex;justify-content:center;align-items:center;gap:10px;padding:12px var(--gut) calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--veil)}
.flip-btn{min-width:48px;height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--veil);background:none;color:var(--star);font:400 18px/1 var(--f-body);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.flip-btn.txt{font:400 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.flip-btn:hover:not(:disabled){border-color:var(--ember)}
.flip-btn:disabled{opacity:.35;cursor:default}
/* rozkładówka (komputer) */
.fb-book{position:relative;display:grid;grid-template-columns:1fr 1fr;height:min(calc(100dvh - 170px),calc((100vw - 80px) * .7074));aspect-ratio:1162/822;perspective:2600px}
.fb-pg{position:relative;overflow:hidden;cursor:zoom-in}
.fb-pg.has{background:#fff;box-shadow:0 20px 50px -20px rgba(0,0,0,.9)}
.fb-pg img,.fb-face img{display:block;width:100%;height:100%;object-fit:cover}
.fb-pg.l.has::after{content:"";position:absolute;inset:0 0 0 auto;width:8%;background:linear-gradient(90deg,transparent,rgba(0,0,0,.18))}
.fb-pg.r.has::after{content:"";position:absolute;inset:0 auto 0 0;width:8%;background:linear-gradient(270deg,transparent,rgba(0,0,0,.18))}
.fb-leaf{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.55,.05,.3,1);z-index:3;pointer-events:none}
.fb-leaf[hidden]{display:none}
.fb-leaf.to-left{transform:rotateY(-180deg)}
.fb-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff}
.fb-face.back{transform:rotateY(180deg)}
/* telefon: jedna strona, przesuwanie palcem */
.fb-track{display:flex;gap:14px;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.fb-track::-webkit-scrollbar{display:none}
.fb-track .fb-one{flex:0 0 100%;scroll-snap-align:center;display:grid;place-items:center;min-height:0}
.fb-track img{max-width:100%;max-height:100%;width:auto;height:auto;background:#fff;box-shadow:0 16px 40px -18px rgba(0,0,0,.9);cursor:zoom-in}
/* powiększenie */
.fb-zoom{position:absolute;inset:0;overflow:auto;background:var(--void);z-index:5;cursor:zoom-out;-webkit-overflow-scrolling:touch}
.fb-zoom img{display:block;margin:0 auto;width:max(100%,1000px);max-width:1700px;height:auto;background:#fff}
@media (prefers-reduced-motion:reduce){.fb-leaf{transition:none}}
.back-link{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid var(--veil);border-radius:999px;font:400 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dust);text-decoration:none;transition:border-color .3s,color .3s}
.back-link:hover{border-color:var(--ember);color:var(--star)}

/* ---------- pokaz slajdów z muzyką (galeria) ---------- */
.gshow{margin-bottom:18px}
.ss{position:fixed;inset:0;z-index:70;background:#000;overflow:hidden;color:var(--star)}
.ss[hidden]{display:none!important}
.ss .sl{position:absolute;inset:0;opacity:0;transition:opacity 1.8s ease}
.ss .sl.on{opacity:1}
.ss .bg{position:absolute;inset:-40px;background:center/cover no-repeat;filter:blur(36px) brightness(.32) saturate(.8)}
.ss .sl img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform-origin:50% 45%}
.ss .sl.alt img{transform-origin:55% 60%}
.ss .sl.on img{animation:ssZoom 9s ease-out forwards}
@keyframes ssZoom{from{transform:scale(1)}to{transform:scale(1.07)}}
.ss::after{content:"";position:absolute;inset:auto 0 0;height:34%;background:linear-gradient(180deg,transparent,rgba(0,0,0,.72));pointer-events:none}
.ss .cap{position:absolute;z-index:2;left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));transform:translate(-50%,8px);width:min(90%,820px);margin:0;text-align:center;font:300 italic clamp(18px,2.4vw,26px)/1.4 var(--f-display);opacity:0;transition:opacity 1.2s ease .5s,transform 1.2s ease .5s;text-shadow:0 1px 12px rgba(0,0,0,.8)}
.ss .cap.on{opacity:.95;transform:translate(-50%,0)}
.ss .bar{position:absolute;z-index:3;top:0;left:0;right:0;height:2px;background:rgba(255,255,255,.08)}
.ss .bar i{display:block;height:100%;width:0;background:var(--ember)}
.ss .bar i.run{animation:ssBar 6.5s linear forwards}
@keyframes ssBar{from{width:0}to{width:100%}}
.ss .cnt{position:absolute;z-index:3;top:calc(18px + env(safe-area-inset-top,0px));left:max(18px,env(safe-area-inset-left,0px));font:400 12px/1 var(--f-mono);letter-spacing:.12em;color:var(--dust)}
.ss button{background:color-mix(in srgb,var(--night) 70%,transparent);border:1px solid var(--veil);color:var(--star);width:48px;height:48px;border-radius:50%;cursor:pointer;font:300 24px/1 var(--f-body);display:grid;place-items:center;padding:0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ss button:hover{border-color:var(--ember)}
.ss .x{position:absolute;z-index:3;top:calc(10px + env(safe-area-inset-top,0px));right:max(12px,env(safe-area-inset-right,0px))}
.ss .ctl{position:absolute;z-index:3;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;gap:12px}
.ss .x,.ss .ctl,.ss .cnt{transition:opacity .6s ease}
.ss.idle .x,.ss.idle .ctl,.ss.idle .cnt{opacity:0}
.ss.idle{cursor:none}
.ss .pp span{width:14px;height:16px;border-left:4px solid currentColor;border-right:4px solid currentColor}
.ss .pp.paused span{width:0;height:0;border:0;border-left:15px solid currentColor;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.ss .mu{position:relative}
.ss .mu .eq{display:flex;align-items:flex-end;gap:3px;height:16px}
.ss .mu .eq i{display:block;width:3px;height:30%;background:currentColor;border-radius:1px}
.ss .mu.on{border-color:var(--ember);color:var(--ember)}
.ss .mu.on .eq i{animation:ssEq 1s ease-in-out infinite}
.ss .mu.on .eq i:nth-child(2){animation-delay:-.35s}.ss .mu.on .eq i:nth-child(3){animation-delay:-.7s}
.ss .mu.loading .eq i{animation:ssEq 1.6s ease-in-out infinite;opacity:.6}
.ss .mu .mute{position:absolute;width:26px;height:2px;background:currentColor;transform:rotate(-45deg);opacity:.85}
.ss .mu.on .mute,.ss .mu.loading .mute{display:none}
@keyframes ssEq{0%,100%{height:25%}50%{height:100%}}
@media (max-width:600px){.ss .ctl{gap:10px}.ss button{width:44px;height:44px}.ss .cap{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.ss .sl.on img{animation:none}.ss .sl{transition-duration:.6s}}
