/* ================================================================
   style.css — blogslubny.pl
   Główny arkusz stylów — wspólny standard dla wszystkich podstron
   Wersja: 2026.1

   SPIS TREŚCI:
   01. Design Tokens (CSS Custom Properties)
   02. Reset & Base
   03. Custom Cursor
   04. Loader
   05. Topbar
   06. Navbar + Hamburger + Mobile Drawer
   07. Search Overlay
   08. Helpers — Layout, Typography, Buttons, Chips
   09. Hero (strona główna)
   10. Marquee
   11. Kategorie — 7 Silosów
   12. Featured Articles — Editorial Grid
   13. Nisza Miesiąca
   14. Trending TOP 5
   15. Nisze Tematyczne
   16. Newsletter
   17. Social Media
   18. O mnie — Sekcja Bio + E-E-A-T
   19. Współpraca — Box Sponsorowany
   20. Footer
   21. Back to Top
   22. Accessibility & Focus
   23. Print Styles

   UŻYCIE NA PODSTRONACH:
   Dołącz ten plik jako pierwszy arkusz stylów.
   Nadpisuj wybrane reguły w osobnym pliku np. page.css
   lub sekcją <style> na konkretnej podstronie.
================================================================ */

/* ============================================================
   DESIGN TOKENS
============================================================ */
:root {
  --ivory:      #FAF7F2;
  --cream:      #F0E8DC;
  --warm:       #E6D9C8;
  --sand:       #D9C9B4;
  --champagne:  #C8B094;
  --blush:      #DDB8AE;
  --rose:       #C07B6C;
  --rose-dk:    #8E4D40;
  --rose-lt:    #E8C4BC;
  --sage:       #8FA688;
  --sage-lt:    #BDD0B7;
  --sage-dk:    #5E7A58;
  --gold:       #B8925A;
  --gold-lt:    #D4AD78;
  --ink:        #2A2420;
  --ink-s:      #3D3430;
  --muted:      #7A6E68;
  --lt-muted:   #A8A09A;
  --brd:        rgba(184,146,90,.15);
  --brd-md:     rgba(184,146,90,.28);
  --brd-lt:     rgba(184,146,90,.08);

  --f-serif:    'Fraunces', Georgia, serif;
  --f-sans:     'Outfit', system-ui, sans-serif;

  --ease:  cubic-bezier(.4,0,.2,1);
  --eout:  cubic-bezier(0,.55,.4,1);
  --dur:   .32s;

  --s1: 0 2px 18px rgba(42,36,32,.05);
  --s2: 0 8px 40px rgba(42,36,32,.09);
  --s3: 0 20px 60px rgba(42,36,32,.13);
}

/* ============================================================
   RESET & BASE
============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}
body{font-family:var(--f-sans);font-weight:300;background:var(--ivory);color:var(--ink-s);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit;transition:color var(--dur)}
ul{list-style:none;padding:0;margin:0}
::selection{background:var(--warm);color:var(--ink)}
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:var(--rose);border-radius:2px}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ============================================================
   CUSTOM CURSOR
============================================================ */
#cur-d,#cur-r{
  position:fixed;top:0;left:0;border-radius:50%;
  pointer-events:none;z-index:99999;
  transform:translate(-50%,-50%);
}
#cur-d{width:5px;height:5px;background:var(--rose)}
#cur-r{
  width:28px;height:28px;
  border:1px solid var(--rose);
  transition:width .38s var(--ease),height .38s var(--ease),opacity .3s,border-color .3s;
}
#cur-r.hov{width:48px;height:48px;border-color:var(--sage)}
@media(hover:none){#cur-d,#cur-r{display:none}}

/* ============================================================
   LOADER
============================================================ */
#ldr{
  position:fixed;inset:0;z-index:99990;
  background:var(--ink);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:2rem;
  transition:opacity .7s var(--ease) .1s;
}
#ldr.gone{opacity:0;pointer-events:none}
.ld-logo{
  font-family:var(--f-serif);
  font-size:clamp(1.6rem,4vw,2.8rem);
  font-weight:300;font-style:italic;
  color:var(--ivory);letter-spacing:.06em;
}
.ld-logo b{font-style:normal;font-weight:500;color:var(--gold-lt)}
.ld-track{width:120px;height:1px;background:rgba(255,255,255,.08);overflow:hidden}
.ld-bar{height:100%;width:0;background:var(--gold-lt);animation:ldFill 1.8s var(--ease) forwards}
@keyframes ldFill{to{width:100%}}

/* ============================================================
   TOPBAR
============================================================ */
#topbar{
  background:var(--ink-s);
  color:rgba(250,247,242,.45);
  font-size:.65rem;font-weight:300;
  letter-spacing:.14em;text-align:center;
  padding:.6rem 1rem;
  border-bottom:1px solid rgba(184,146,90,.15);
}
#topbar a{color:var(--gold-lt);border-bottom:1px dotted var(--gold);transition:color .25s}
#topbar a:hover{color:var(--ivory)}
#topbar strong{color:rgba(250,247,242,.75);font-weight:500}

/* ============================================================
   NAVBAR
============================================================ */
#nav{
  position:sticky;top:0;z-index:200;
  background:rgba(250,247,242,.97);
  backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--brd);
  transition:box-shadow var(--dur);
}
#nav.shadowed{box-shadow:var(--s1)}
.nav-w{
  max-width:1380px;margin:0 auto;
  padding:0 clamp(1.2rem,3vw,2.5rem);
  display:flex;align-items:center;height:66px;gap:1rem;
}
.nav-logo{
  font-family:var(--f-serif);
  font-size:1.35rem;font-weight:400;font-style:italic;
  color:var(--ink);letter-spacing:.02em;flex-shrink:0;
}
.nav-logo span{font-style:normal;color:var(--rose)}
.nav-logo sub{font-size:.55rem;font-style:normal;color:var(--lt-muted);vertical-align:text-bottom;letter-spacing:.1em}
.nav-spacer{flex:1}

.nav-links{display:flex;align-items:center;gap:.05rem}
.nav-links a{
  font-size:.68rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);padding:.45rem .85rem;
  position:relative;transition:color var(--dur);
}
.nav-links a::after{
  content:'';position:absolute;bottom:2px;left:.85rem;right:.85rem;
  height:1px;background:var(--rose);
  transform:scaleX(0);transform-origin:right;
  transition:transform .28s var(--ease);
}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1);transform-origin:left}

.nav-search-btn{
  width:36px;height:36px;
  border:1px solid var(--brd-md);background:transparent;
  display:flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:.9rem;cursor:pointer;
  transition:all var(--dur);
}
.nav-search-btn:hover{background:var(--rose);border-color:var(--rose);color:var(--ivory)}

.nav-cta{
  font-family:var(--f-sans);font-size:.65rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--ivory);background:var(--rose);
  padding:.58rem 1.4rem;border:none;cursor:pointer;
  transition:background var(--dur),transform .2s;white-space:nowrap;
}
.nav-cta:hover{background:var(--rose-dk);transform:translateY(-1px);color:var(--ivory)}

/* Hamburger */
.burger{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:.35rem;
}
.burger span{display:block;width:22px;height:1.5px;background:var(--ink-s);transition:var(--dur) var(--ease);transform-origin:center}
.burger.x span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger.x span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media(max-width:1100px){.nav-links{display:none}.burger{display:flex}}
@media(max-width:640px){.nav-cta{display:none}}

/* Mobile Drawer */
#drw{
  position:fixed;inset:0;z-index:190;
  background:var(--ivory);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:2.2rem;
  opacity:0;visibility:hidden;
  transition:opacity .36s var(--ease),visibility .36s;
}
#drw.open{opacity:1;visibility:visible}
#drw a{
  font-family:var(--f-serif);
  font-size:clamp(1.8rem,5vw,3rem);
  font-weight:300;font-style:italic;
  color:var(--ink);transition:color .22s;
}
#drw a:hover{color:var(--rose)}
#drw .drw-cta{
  font-family:var(--f-sans);font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  background:var(--rose);color:var(--ivory);
  padding:.85rem 2.5rem;margin-top:.5rem;
}

/* Search overlay */
#search-ov{
  position:fixed;inset:0;z-index:300;
  background:rgba(250,247,242,.97);
  backdrop-filter:blur(20px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;
}
#search-ov.open{opacity:1;visibility:visible}
.search-inner{width:min(680px,90vw);text-align:center}
.search-label{
  font-family:var(--f-serif);font-size:.75rem;font-style:italic;
  color:var(--lt-muted);letter-spacing:.15em;margin-bottom:1.5rem;display:block;
}
.search-input-wrap{position:relative}
.search-inp{
  width:100%;border:none;border-bottom:2px solid var(--ink);
  background:transparent;outline:none;
  font-family:var(--f-serif);font-size:clamp(1.6rem,4vw,2.5rem);
  font-weight:300;color:var(--ink);
  padding:.5rem 3rem .5rem 0;
  text-align:center;
}
.search-inp::placeholder{color:var(--sand)}
.search-close{
  position:absolute;top:50%;right:0;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;
  font-size:1.1rem;color:var(--muted);transition:color var(--dur);
}
.search-close:hover{color:var(--rose)}
.search-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:2rem}
.search-tag{
  font-size:.65rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--rose);border:1px solid var(--brd-md);padding:.3rem .75rem;
  cursor:pointer;transition:all .22s;
}
.search-tag:hover{background:var(--rose);color:var(--ivory);border-color:var(--rose)}

/* ============================================================
   HELPERS
============================================================ */
.wrap{max-width:1380px;margin:0 auto;padding:0 clamp(1.2rem,3vw,2.5rem)}
.sec{padding:clamp(4.5rem,8vw,8rem) clamp(1.2rem,3vw,2.5rem)}
.sec-narrow{padding:clamp(3.5rem,6vw,6rem) clamp(1.2rem,3vw,2.5rem)}

.eyebrow{
  display:inline-flex;align-items:center;gap:.65rem;
  font-family:var(--f-sans);font-size:.62rem;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1rem;
}
.eyebrow::before{content:'';display:block;width:20px;height:1px;background:currentColor}

h1,h2,h3,h4{font-family:var(--f-serif);font-weight:400;color:var(--ink);line-height:1.08}
.t-hero {font-size:clamp(3.5rem,8vw,8rem);line-height:.92;font-weight:300}
.t-xl   {font-size:clamp(2.4rem,5vw,4.5rem);line-height:.96}
.t-lg   {font-size:clamp(1.9rem,3.5vw,3.2rem)}
.t-md   {font-size:clamp(1.3rem,2vw,1.9rem)}
.t-sm   {font-size:1.1rem}
em.fancy{font-style:italic;color:var(--rose)}
.lead{
  font-family:var(--f-sans);font-size:clamp(.95rem,1.4vw,1.1rem);
  font-weight:300;color:var(--muted);line-height:1.82;max-width:540px;
}

/* Buttons */
.btn-rose{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--f-sans);font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ivory);background:var(--rose);
  padding:.95rem 2.2rem;border:none;cursor:pointer;
  position:relative;overflow:hidden;transition:transform .22s;
}
.btn-rose::before{
  content:'';position:absolute;inset:0;
  background:var(--rose-dk);
  transform:scaleX(0);transform-origin:right;
  transition:transform .35s var(--ease);
}
.btn-rose:hover{transform:translateY(-2px);color:var(--ivory)}
.btn-rose:hover::before{transform:scaleX(1);transform-origin:left}
.btn-rose span,.btn-rose i{position:relative;z-index:1}

.btn-outline{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--f-sans);font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);padding:.92rem 2.1rem;
  border:1.5px solid rgba(42,36,32,.2);cursor:pointer;
  transition:all .28s;
}
.btn-outline:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink);transform:translateY(-2px)}

.btn-ghost-rose{
  display:inline-flex;align-items:center;gap:.45rem;
  font-family:var(--f-sans);font-size:.65rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--rose);border-bottom:1px solid var(--brd-md);
  padding-bottom:2px;transition:all .22s;
}
.btn-ghost-rose:hover{color:var(--rose-dk);gap:.7rem;border-color:var(--rose)}

.sep{display:block;width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--brd-md) 50%,transparent)}

/* Category tag chip */
.chip{
  display:inline-block;font-size:.58rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--rose);background:rgba(192,123,108,.07);
  border:1px solid rgba(192,123,108,.2);
  padding:.28rem .7rem;transition:all .22s;
}
.chip:hover{background:var(--rose);color:var(--ivory);border-color:var(--rose)}
.chip.sage{color:var(--sage-dk);background:rgba(95,122,88,.06);border-color:rgba(95,122,88,.2)}
.chip.sage:hover{background:var(--sage-dk);color:var(--ivory)}
.chip.gold{color:var(--gold);background:rgba(184,146,90,.07);border-color:rgba(184,146,90,.22)}
.chip.gold:hover{background:var(--gold);color:var(--ivory)}

/* ============================================================
   HERO — EDITORIAL MAGAZINE COVER
============================================================ */
#hero{
  background:var(--ivory);
  min-height:100svh;
  display:grid;
  grid-template-rows:1fr auto;
  overflow:hidden;
  position:relative;
}
.hero-main{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:end;
  padding:clamp(2rem,5vw,5rem) clamp(1.2rem,3vw,2.5rem) 0;
  max-width:1380px;margin:0 auto;width:100%;
  padding-top:clamp(5rem,10vw,9rem);
}
/* Left: editorial large text */
.hero-l{padding-right:clamp(1.5rem,4vw,4rem);padding-bottom:clamp(3rem,5vw,5rem)}
.hero-overline{
  display:flex;align-items:center;gap:.8rem;
  font-size:.6rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--lt-muted);margin-bottom:2rem;
}
.hero-overline-dot{
  width:6px;height:6px;border-radius:50%;background:var(--sage);
  animation:blink 2.8s ease infinite;
}
@keyframes blink{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.6)}}
.hero-h1{
  margin-bottom:2.2rem;
  overflow:hidden;
}
.hero-h1 .line{overflow:hidden;display:block}
.hero-h1 .line-in{
  display:block;
  animation:slideIn .9s var(--eout) both;
}
.hero-h1 .line:nth-child(1) .line-in{animation-delay:.2s}
.hero-h1 .line:nth-child(2) .line-in{animation-delay:.36s}
.hero-h1 .line:nth-child(3) .line-in{animation-delay:.52s}
.hero-h1 .line:nth-child(4) .line-in{animation-delay:.68s}
@keyframes slideIn{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
.hero-subtext{
  font-family:var(--f-sans);font-size:clamp(.9rem,1.4vw,1.05rem);
  font-weight:300;color:var(--muted);line-height:1.8;
  max-width:400px;margin-bottom:2.8rem;
  opacity:0;animation:fuIn .8s var(--ease) .85s forwards;
}
@keyframes fuIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.hero-actions{
  display:flex;flex-wrap:wrap;gap:.85rem;
  opacity:0;animation:fuIn .8s var(--ease) 1s forwards;
}

/* Right: featured big card */
.hero-r{
  position:relative;align-self:stretch;
  opacity:0;animation:fuIn .9s var(--ease) .7s forwards;
}
.hero-feature-card{
  position:relative;
  height:100%;min-height:500px;
  overflow:hidden;
  background:var(--warm);
}
.hfc-img{
  width:100%;height:100%;
  background:linear-gradient(160deg,#f0e8dc 0%,#dcc4ac 40%,#c4906a 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(6rem,12vw,14rem);
  position:relative;
}
/* decorative pattern */
.hfc-img::before{
  content:'';
  position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 20% 80%,rgba(192,123,108,.2) 0%,transparent 40%),
    radial-gradient(circle at 80% 20%,rgba(143,166,136,.15) 0%,transparent 40%);
}
.hfc-overlay{
  position:absolute;bottom:0;left:0;right:0;
  background:linear-gradient(to top,rgba(42,36,32,.75) 0%,transparent 70%);
  padding:2.5rem 2rem 2rem;
}
.hfc-chip{
  font-size:.56rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-lt);border:1px solid rgba(212,173,120,.35);
  padding:.28rem .7rem;display:inline-block;margin-bottom:.9rem;
}
.hfc-title{
  font-family:var(--f-serif);font-weight:400;font-style:italic;
  font-size:clamp(1.1rem,2.5vw,1.7rem);
  color:var(--ivory);line-height:1.25;margin-bottom:.8rem;
}
.hfc-meta{font-size:.68rem;color:rgba(250,247,242,.5);display:flex;gap:1rem}
/* Issue date badge */
.hero-issue{
  position:absolute;top:2rem;right:2rem;
  background:var(--ivory);
  padding:1rem 1.2rem;text-align:center;
  border:1px solid var(--brd-md);
}
.hi-month{font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--lt-muted)}
.hi-num{font-family:var(--f-serif);font-size:2.2rem;color:var(--ink);line-height:1;margin:.2rem 0}
.hi-year{font-size:.6rem;font-weight:500;letter-spacing:.1em;color:var(--rose)}

/* Hero bottom strip */
.hero-strip{
  background:var(--ink);
  display:flex;align-items:stretch;
  overflow:hidden;
}
.hero-strip-item{
  flex:1;
  display:flex;align-items:center;gap:1rem;
  padding:1.2rem clamp(1.2rem,2.5vw,2rem);
  border-right:1px solid rgba(255,255,255,.05);
  transition:background .28s;cursor:default;
}
.hero-strip-item:last-child{border-right:none}
.hero-strip-item:hover{background:rgba(255,255,255,.04)}
.hsi-ico{font-size:1.2rem;flex-shrink:0}
.hsi-label{font-size:.58rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,247,242,.3)}
.hsi-val{font-family:var(--f-serif);font-size:.95rem;color:var(--ivory)}

@media(max-width:1024px){
  .hero-main{grid-template-columns:1fr}
  .hero-r{display:none}
  .hero-l{padding-right:0;padding-bottom:3rem}
}
@media(max-width:640px){
  .hero-strip{flex-wrap:wrap}
  .hero-strip-item{flex:1 1 45%;border-bottom:1px solid rgba(255,255,255,.05)}
}

/* ============================================================
   MARQUEE
============================================================ */
.mband{background:var(--rose);overflow:hidden;padding:.72rem 0}
.mtrack{display:flex;white-space:nowrap;animation:mq 32s linear infinite}
.mitem{
  display:inline-flex;align-items:center;gap:1.4rem;
  padding:0 2rem;font-size:.62rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;
  color:rgba(250,247,242,.75);
}
.mdot{width:3px;height:3px;border-radius:50%;background:rgba(250,247,242,.4);flex-shrink:0}
@keyframes mq{to{transform:translateX(-50%)}}

/* ============================================================
   SILOSY — 7 KATEGORII BLOGA
============================================================ */
#kategorie{background:var(--cream)}
.kat-header{
  max-width:1380px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:1.5rem;margin-bottom:3rem;
}
.kat-grid{
  max-width:1380px;margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5px;background:var(--sand);border:1.5px solid var(--sand);
}
/* 7 boxes: row 1 = 4, row 2 = 3 wider */
.kat-box{
  background:var(--ivory);
  padding:2rem 1.8rem 2.4rem;
  display:flex;flex-direction:column;
  position:relative;overflow:hidden;
  cursor:pointer;transition:background .32s;
  text-decoration:none;
}
.kat-box:hover{background:var(--ink)}
.kat-box::after{
  content:'';
  position:absolute;top:0;left:0;right:0;height:2.5px;
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
/* Color accent per silo */
.kb1::after{background:var(--sage)}
.kb2::after{background:var(--gold)}
.kb3::after{background:var(--rose)}
.kb4::after{background:var(--blush)}
.kb5::after{background:var(--sage-dk)}
.kb6::after{background:var(--champagne)}
.kb7::after{background:var(--rose-dk)}
.kat-box:hover::after{transform:scaleX(1)}

.kb-num{
  font-family:var(--f-serif);font-size:.68rem;font-style:italic;
  color:var(--blush);margin-bottom:.9rem;
  transition:color .3s;
}
.kat-box:hover .kb-num{color:rgba(250,247,242,.3)}
.kb-ico{font-size:1.6rem;margin-bottom:.85rem;display:block}
.kb-name{
  font-family:var(--f-serif);font-size:1.18rem;font-weight:400;
  color:var(--ink);margin-bottom:.65rem;line-height:1.2;
  transition:color .3s;
}
.kat-box:hover .kb-name{color:var(--ivory)}
.kb-desc{
  font-size:.74rem;color:var(--muted);line-height:1.65;
  flex:1;transition:color .3s;
}
.kat-box:hover .kb-desc{color:rgba(250,247,242,.4)}
.kb-count{
  font-size:.6rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sage);margin-top:1.2rem;transition:color .3s;
}
.kat-box:hover .kb-count{color:rgba(250,247,242,.35)}
.kb-arr{
  position:absolute;bottom:1.4rem;right:1.4rem;
  width:28px;height:28px;
  border:1px solid var(--brd-md);
  display:flex;align-items:center;justify-content:center;
  font-size:.8rem;color:var(--lt-muted);
  transition:all .3s;
}
.kat-box:hover .kb-arr{background:var(--rose);border-color:var(--rose);color:var(--ivory);transform:translate(2px,-2px)}

/* 7th box spans remaining */
.kb7-wrap{grid-column:span 4;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5px;background:var(--sand)}
@media(max-width:1100px){.kat-grid{grid-template-columns:repeat(3,1fr)}.kb7-wrap{grid-column:span 3}}
@media(max-width:768px){.kat-grid{grid-template-columns:repeat(2,1fr)}.kb7-wrap{grid-column:span 2;grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.kat-grid{grid-template-columns:1fr}.kb7-wrap{grid-column:span 1;grid-template-columns:1fr}}

/* ============================================================
   WYRÓŻNIONE ARTYKUŁY — EDITORIAL GRID
============================================================ */
#featured{background:var(--ivory)}
.feat-header{
  max-width:1380px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:1.5rem;margin-bottom:2.8rem;
}
.feat-grid{
  max-width:1380px;margin:0 auto;
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr;
  grid-template-rows:auto auto;
  gap:1.5px;background:var(--sand);
  border:1.5px solid var(--sand);
}
.fart{
  background:var(--ivory);
  display:flex;flex-direction:column;
  overflow:hidden;transition:background .28s;
  text-decoration:none;
}
.fart:hover{background:var(--cream)}
.fart.big{grid-row:span 2}

.fart-img{overflow:hidden;flex-shrink:0}
.fi-inner{
  width:100%;aspect-ratio:16/9;
  display:flex;align-items:center;justify-content:center;
  font-size:3rem;
  transition:transform .55s var(--ease);
}
.fart.big .fi-inner{aspect-ratio:3/4;font-size:6rem;min-height:300px}
.fart:hover .fi-inner{transform:scale(1.05)}

/* Featured image colour palettes */
.fi-1{background:linear-gradient(145deg,#f0e8dc,#d4a87a)}
.fi-2{background:linear-gradient(145deg,#e8dcd0,#c4907a)}
.fi-3{background:linear-gradient(145deg,#d8e0d0,#9ab08a)}
.fi-4{background:linear-gradient(145deg,#e0d4c8,#b89878)}
.fi-5{background:linear-gradient(145deg,#ccd8c4,#8aab80)}

.fart-body{padding:1.6rem 1.8rem 2rem;display:flex;flex-direction:column;flex:1}
.fart.big .fart-body{padding:2rem 2.2rem 2.4rem}
.fa-cat{
  font-size:.58rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--rose);margin-bottom:.6rem;
}
.fa-title{
  font-family:var(--f-serif);font-size:1.05rem;font-weight:400;
  color:var(--ink);line-height:1.28;margin-bottom:.6rem;
  transition:color .22s;
}
.fart.big .fa-title{font-size:clamp(1.2rem,2.5vw,1.7rem)}
.fart:hover .fa-title{color:var(--rose-dk)}
.fa-exc{
  font-size:.78rem;color:var(--muted);line-height:1.68;flex:1;
  margin-bottom:1rem;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.fa-meta{
  display:flex;align-items:center;gap:.8rem;
  font-size:.66rem;color:var(--lt-muted);
  border-top:1px solid var(--brd);padding-top:.9rem;
}
.fa-meta span{display:flex;align-items:center;gap:.3rem}
.fa-hot{
  display:inline-flex;align-items:center;gap:.3rem;
  background:rgba(192,123,108,.1);
  border:1px solid rgba(192,123,108,.2);
  font-size:.56rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--rose);
  padding:.2rem .6rem;
}
@media(max-width:1024px){.feat-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.feat-grid{grid-template-columns:1fr}.fart.big{grid-row:auto}}

/* ============================================================
   NISZA MIESIĄCA — SPOTLIGHT
============================================================ */
#nisza{background:var(--ink)}
.nisza-w{
  max-width:1380px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1.4fr;
  gap:clamp(3rem,6vw,6rem);align-items:center;
}
.nisza-l .eyebrow{color:var(--gold-lt)}
.nisza-l h2{color:var(--ivory);margin-bottom:1.2rem}
.nisza-l .lead{color:rgba(250,247,242,.45);margin-bottom:2.5rem}
.nisza-articles{
  display:flex;flex-direction:column;gap:1px;
  background:rgba(184,146,90,.1);
  border:1px solid rgba(184,146,90,.1);
  margin-top:2.5rem;
}
.na-item{
  background:var(--ink);padding:1.2rem 1.5rem;
  display:flex;align-items:flex-start;gap:1rem;
  transition:background .28s;text-decoration:none;
}
.na-item:hover{background:rgba(184,146,90,.06)}
.na-num{
  font-family:var(--f-serif);font-size:1.5rem;font-style:italic;
  color:rgba(250,247,242,.15);flex-shrink:0;line-height:1;margin-top:.1rem;
}
.na-title{
  font-family:var(--f-serif);font-size:.95rem;
  color:rgba(250,247,242,.7);line-height:1.3;
  transition:color .22s;
}
.na-item:hover .na-title{color:var(--gold-lt)}
.na-tag{
  font-size:.56rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:.3rem;
}
/* Right: big feature highlight */
.nisza-r{
  background:linear-gradient(150deg,#3a2e28 0%,#50382a 50%,#7a5030 100%);
  padding:3rem 2.8rem;
  position:relative;overflow:hidden;
}
.nisza-r::before{
  content:'';
  position:absolute;inset:1.5rem;
  border:1px solid rgba(184,146,90,.2);
  pointer-events:none;
}
.nr-label{
  font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-lt);margin-bottom:1.5rem;
  display:flex;align-items:center;gap:.7rem;
}
.nr-label::after{content:'';flex:1;height:1px;background:rgba(184,146,90,.25)}
.nr-big{font-size:clamp(4rem,10vw,9rem);margin-bottom:1.5rem;line-height:1}
.nr-title{
  font-family:var(--f-serif);font-size:clamp(1.2rem,2.5vw,1.9rem);
  font-weight:300;font-style:italic;
  color:var(--ivory);line-height:1.25;margin-bottom:1rem;
}
.nr-desc{
  font-size:.8rem;color:rgba(250,247,242,.45);
  line-height:1.72;margin-bottom:1.8rem;
}
.nr-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:2rem}
.nr-tag{
  font-size:.56rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(184,146,90,.25);padding:.25rem .65rem;
}
@media(max-width:960px){.nisza-w{grid-template-columns:1fr}}

/* ============================================================
   TRENDING — TOP 5
============================================================ */
#trending{background:var(--cream)}
.trend-w{max-width:1380px;margin:0 auto}
.trend-hdr{
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:1.5rem;margin-bottom:2.8rem;
}
.trend-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(2rem,4vw,4rem);align-items:start;
}
.trend-list{display:flex;flex-direction:column;gap:0}
.trend-item{
  display:flex;align-items:flex-start;gap:1.4rem;
  padding:1.4rem 0;border-bottom:1px solid var(--brd);
  text-decoration:none;transition:padding-left .22s;
}
.trend-item:first-child{border-top:1px solid var(--brd)}
.trend-item:hover{padding-left:.4rem}
.tn{
  font-family:var(--f-serif);font-size:2rem;font-style:italic;
  color:var(--blush);flex-shrink:0;line-height:1;margin-top:.1rem;
}
.t-cat{
  font-size:.56rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--rose);display:block;margin-bottom:.25rem;
}
.t-title{
  font-family:var(--f-serif);font-size:.98rem;
  color:var(--ink);line-height:1.28;transition:color .22s;
}
.trend-item:hover .t-title{color:var(--rose-dk)}
.t-meta{font-size:.66rem;color:var(--lt-muted);margin-top:.35rem}
/* Right sticky quote card */
.trend-aside{position:sticky;top:85px}
.ta-quote{
  background:var(--ivory);border:1px solid var(--brd-md);
  padding:2.5rem 2.2rem;margin-bottom:1.5px;
}
.ta-q{
  font-family:var(--f-serif);font-size:3rem;line-height:.8;
  color:var(--blush);margin-bottom:.8rem;
}
.ta-text{
  font-family:var(--f-serif);font-size:1.12rem;font-style:italic;
  color:var(--ink);line-height:1.75;margin-bottom:1.5rem;
}
.ta-source{font-size:.65rem;color:var(--lt-muted);letter-spacing:.06em}
.ta-stats{
  background:var(--ink);padding:1.6rem 1.8rem;
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background-clip:padding-box;
}
.ts-item{background:var(--ink);padding:.9rem 1.2rem}
.ts-num{font-family:var(--f-serif);font-size:1.6rem;color:var(--gold-lt);line-height:1}
.ts-lbl{font-size:.6rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(250,247,242,.3);margin-top:.3rem}
@media(max-width:960px){.trend-grid{grid-template-columns:1fr}.trend-aside{position:static}}

/* ============================================================
   NOWE NISZE — ODKRYJ TEMATY
============================================================ */
#nisze{background:var(--ivory)}
.nisze-hdr{
  max-width:1380px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:1.5rem;margin-bottom:3rem;
}
.nisze-grid{
  max-width:1380px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1.5px;background:var(--sand);border:1.5px solid var(--sand);
}
.nbox{
  background:var(--ivory);padding:2rem 1.8rem;
  display:flex;flex-direction:column;gap:0;
  transition:background .3s;text-decoration:none;
  position:relative;overflow:hidden;
}
.nbox::before{
  content:'';
  position:absolute;bottom:0;left:0;right:0;height:2px;
  transform:scaleX(0);transform-origin:right;
  transition:transform .38s var(--ease);
}
.nb-rose::before{background:var(--rose)}
.nb-sage::before{background:var(--sage-dk)}
.nb-gold::before{background:var(--gold)}
.nbox:hover::before{transform:scaleX(1);transform-origin:left}
.nbox:hover{background:var(--cream)}
.nbox-tag{margin-bottom:1rem}
.nbox-ico{font-size:1.5rem;margin-bottom:.8rem;display:block}
.nbox-title{
  font-family:var(--f-serif);font-size:1.1rem;
  color:var(--ink);margin-bottom:.6rem;line-height:1.2;
  transition:color .22s;
}
.nbox:hover .nbox-title{color:var(--rose-dk)}
.nbox-desc{font-size:.74rem;color:var(--muted);line-height:1.65;flex:1;margin-bottom:1.2rem}
.nbox-footer{
  display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--brd);padding-top:.9rem;
  font-size:.62rem;color:var(--lt-muted);
}
.nbox-arr{color:var(--rose);font-size:.9rem;transition:transform .22s}
.nbox:hover .nbox-arr{transform:translate(4px,-2px)}
@media(max-width:900px){.nisze-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.nisze-grid{grid-template-columns:1fr}}

/* ============================================================
   NEWSLETTER
============================================================ */
#newsletter{
  background:var(--rose);
  padding:clamp(4rem,7vw,6.5rem) clamp(1.2rem,3vw,2.5rem);
  position:relative;overflow:hidden;
}
#newsletter::before{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(ellipse at 80% 50%,rgba(255,255,255,.07),transparent 60%);
  pointer-events:none;
}
.nl-w{
  max-width:680px;margin:0 auto;
  text-align:center;position:relative;
}
.nl-w .eyebrow{color:rgba(250,247,242,.6);justify-content:center}
.nl-w .eyebrow::before{background:rgba(250,247,242,.4)}
.nl-w h2{color:var(--ivory);margin-bottom:1rem}
.nl-w p{
  font-size:.95rem;color:rgba(250,247,242,.65);
  line-height:1.8;margin-bottom:2.5rem;
}
.nl-form{display:flex;max-width:480px;margin:0 auto;gap:0}
.nl-form input{
  flex:1;
  font-family:var(--f-sans);font-size:.85rem;font-weight:300;
  background:rgba(250,247,242,.15);
  border:1.5px solid rgba(250,247,242,.3);border-right:none;
  color:var(--ivory);padding:.85rem 1.2rem;outline:none;
  transition:border-color .28s;
  appearance:none;
}
.nl-form input::placeholder{color:rgba(250,247,242,.45)}
.nl-form input:focus{border-color:rgba(250,247,242,.7)}
.nl-form button{
  font-family:var(--f-sans);font-size:.65rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  background:var(--ivory);color:var(--rose-dk);
  border:none;padding:.85rem 1.6rem;cursor:pointer;
  white-space:nowrap;transition:background .28s,color .28s;
}
.nl-form button:hover{background:var(--ink);color:var(--ivory)}
.nl-note{font-size:.65rem;color:rgba(250,247,242,.38);margin-top:.85rem}
.nl-ok{
  display:none;
  background:rgba(250,247,242,.12);border:1px solid rgba(250,247,242,.25);
  padding:.85rem 1.5rem;font-size:.8rem;color:var(--ivory);margin-top:1rem;
}
.nl-ok.show{display:block}
@media(max-width:540px){.nl-form{flex-direction:column}.nl-form input{border-right:1.5px solid rgba(250,247,242,.3);border-bottom:none}}

/* ============================================================
   SOCIAL MEDIA
============================================================ */
#social{background:var(--ivory)}
.soc-inner{
  max-width:1380px;margin:0 auto;
  display:grid;grid-template-columns:0.8fr 1.2fr;
  gap:clamp(3rem,5vw,5rem);align-items:center;
}
.soc-cards{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1.5px;background:var(--sand);border:1.5px solid var(--sand);
}
.sc{
  background:var(--ivory);padding:1.8rem 1.6rem;
  display:flex;flex-direction:column;gap:.8rem;
  transition:background .28s;text-decoration:none;
}
.sc:hover{background:var(--ink)}
.sc-ico{
  width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.15rem;transition:all .28s;
}
.sfb{background:rgba(24,119,242,.08)}
.sig{background:rgba(225,48,108,.08)}
.sli{background:rgba(10,102,194,.08)}
.syt{background:rgba(255,0,0,.08)}
.sc:hover .sc-ico{background:rgba(255,255,255,.08)}
.sc-nm{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);transition:color .28s}
.sc:hover .sc-nm{color:var(--ivory)}
.sc-hd{font-size:.68rem;color:var(--lt-muted);transition:color .28s}
.sc:hover .sc-hd{color:rgba(250,247,242,.38)}
@media(max-width:960px){.soc-inner{grid-template-columns:1fr}}

/* ============================================================
   FOOTER
============================================================ */
footer{background:var(--ink);padding:clamp(4rem,6vw,5.5rem) clamp(1.2rem,3vw,2.5rem) 0}
.ft{max-width:1380px;margin:0 auto}
.ft-top{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:clamp(2rem,4vw,3.5rem);
  padding-bottom:clamp(3rem,5vw,4rem);
  border-bottom:1px solid rgba(184,146,90,.1);
  margin-bottom:2rem;
}
.ft-brand-logo{
  font-family:var(--f-serif);font-size:1.6rem;font-style:italic;
  font-weight:300;color:var(--ivory);display:block;margin-bottom:.9rem;
}
.ft-brand-logo b{font-style:normal;font-weight:500;color:var(--gold-lt)}
.ft-tagline{
  font-family:var(--f-serif);font-style:italic;font-size:1rem;
  color:rgba(250,247,242,.3);line-height:1.65;margin-bottom:1.3rem;
}
.ft-about{font-size:.72rem;color:rgba(250,247,242,.24);line-height:1.72}
.ft-soc{display:flex;gap:.55rem;margin-top:1.4rem}
.ft-soc a{
  width:34px;height:34px;
  border:1px solid rgba(184,146,90,.15);
  display:flex;align-items:center;justify-content:center;
  color:rgba(250,247,242,.3);font-size:.82rem;
  transition:all .28s;
}
.ft-soc a:hover{border-color:var(--gold-lt);color:var(--gold-lt);transform:translateY(-3px)}
.ft-col-h{
  font-family:var(--f-serif);font-size:.95rem;
  color:var(--ivory);margin-bottom:1.2rem;
}
.ft-col ul{display:flex;flex-direction:column;gap:.55rem}
.ft-col ul a{
  font-size:.72rem;color:rgba(250,247,242,.28);
  transition:all .22s;display:inline-block;
}
.ft-col ul a:hover{color:var(--gold-lt);padding-left:4px}
.ft-bot{
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:1rem;
  font-size:.64rem;color:rgba(250,247,242,.18);
  padding:1.8rem 0 2rem;
}
.ft-bot a{color:rgba(250,247,242,.18);transition:color .2s}
.ft-bot a:hover{color:var(--gold-lt)}
.ft-bot-r{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:center}
/* Visitor counter */
.vctr{
  display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid rgba(184,146,90,.12);padding:.32rem .8rem;
}
.vnum{font-family:var(--f-serif);font-size:.9rem;color:var(--gold-lt)}
/* Reset instruksja ukryta w tytule */
@media(max-width:960px){.ft-top{grid-template-columns:1fr 1fr;gap:2rem}}
@media(max-width:540px){.ft-top{grid-template-columns:1fr}}

/* ============================================================
   O MNIE — E-E-A-T
============================================================ */
#o-mnie{background:var(--cream)}
.omnie-wrap{
  max-width:1380px;margin:0 auto;
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:clamp(3rem,6vw,6rem);
  align-items:start;
}
.om-left{display:flex;flex-direction:column;gap:0}
.om-portrait{position:relative}
.om-img{
  width:100%;aspect-ratio:4/5;
  background:linear-gradient(150deg,#f0e8dc 0%,#dcc4ac 40%,#c4906a 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(5rem,12vw,11rem);
  position:relative;overflow:hidden;
}
.om-img::before{
  content:'';position:absolute;inset:1.5rem;
  border:1px solid rgba(184,146,90,.22);pointer-events:none;z-index:1;
}
.om-img::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 80%,rgba(192,123,108,.15),transparent 55%);
}
.om-badge{
  position:absolute;bottom:-1.3rem;right:-1.3rem;
  background:var(--rose);padding:1.6rem 1.4rem;
  text-align:center;min-width:110px;box-shadow:var(--s2);
}
.om-badge-num{
  font-family:var(--f-serif);font-size:2.6rem;
  line-height:1;color:var(--ivory);font-weight:300;
}
.om-badge-num sup{font-size:1.2rem;vertical-align:super}
.om-badge-lbl{
  font-size:.55rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(250,247,242,.75);margin-top:.35rem;
}
.om-proof{
  display:flex;align-items:center;justify-content:center;
  gap:0;margin-top:2.5rem;
  border:1px solid var(--brd-md);background:var(--ivory);
}
.om-proof-item{flex:1;padding:1.2rem 1rem;text-align:center}
.om-proof-sep{width:1px;height:60px;background:var(--brd);flex-shrink:0}
.om-proof-num{
  display:block;font-family:var(--f-serif);font-size:1.8rem;
  color:var(--ink);line-height:1;
}
.om-proof-num sup{font-size:.85rem;color:var(--rose)}
.om-proof-lbl{
  display:block;font-size:.58rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--lt-muted);margin-top:.3rem;
}
.om-right{padding-top:.5rem}
.om-lead{
  font-family:var(--f-serif);font-size:clamp(1rem,1.5vw,1.18rem);
  font-weight:400;font-style:italic;
  color:var(--muted);line-height:1.8;
  max-width:540px;margin-top:1.2rem;margin-bottom:2.5rem;
}
.om-creds{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1px;background:var(--brd);border:1px solid var(--brd);
  margin-bottom:2.2rem;
}
.om-cred{
  background:var(--ivory);padding:1.4rem 1.5rem;
  display:flex;align-items:flex-start;gap:1rem;
  transition:background var(--dur);
}
.om-cred:hover{background:var(--warm)}
.om-cred-ico{font-size:1.3rem;flex-shrink:0;margin-top:.1rem}
.om-cred-title{font-family:var(--f-serif);font-size:.95rem;color:var(--ink);margin-bottom:.35rem}
.om-cred-txt{font-size:.74rem;color:var(--muted);line-height:1.62;margin:0}
.om-pubs{
  display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;
  padding:1.8rem 0;
  border-top:1px solid var(--brd);border-bottom:1px solid var(--brd);
  margin-bottom:2rem;
}
.om-pubs-lbl{
  font-size:.58rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--lt-muted);white-space:nowrap;
}
.om-pub{
  font-family:var(--f-serif);font-size:1rem;font-style:italic;
  color:var(--lt-muted);transition:color var(--dur);
}
.om-pub:hover{color:var(--rose)}
.om-cta-row{display:flex;flex-wrap:wrap;gap:.85rem;margin-bottom:2rem}
.om-quote{
  border-left:2.5px solid var(--rose);
  padding:1.2rem 1.6rem;
  background:rgba(192,123,108,.05);
  margin-top:1.5rem;
}
.om-quote p{
  font-family:var(--f-serif);font-size:1.02rem;font-style:italic;
  color:var(--ink-s);line-height:1.72;margin-bottom:.6rem;
}
.om-quote cite{font-size:.68rem;font-weight:500;letter-spacing:.08em;color:var(--lt-muted);font-style:normal}
@media(max-width:1024px){
  .omnie-wrap{grid-template-columns:1fr}
  .om-img{aspect-ratio:3/2;font-size:5rem}
  .om-badge{right:0;bottom:-1rem}
}
@media(max-width:540px){.om-creds{grid-template-columns:1fr}.om-proof{flex-wrap:wrap}}


/* ============================================================
   BOX WSPÓŁPRACY — Artykuły sponsorowane / SEO / AI
============================================================ */
#wspolpraca{background:var(--ink)}
.ws-wrap{max-width:1380px;margin:0 auto}

/* Header sekcji */
.ws-top{
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:1.5rem;margin-bottom:3rem;
}
.ws-top .eyebrow{color:var(--gold-lt)}
.ws-top h2{color:var(--ivory)}
.ws-top .lead{color:rgba(250,247,242,.42);max-width:480px;margin-top:.8rem}

/* Główna karta — dark elegant */
.ws-main{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:1px;background:rgba(184,146,90,.12);
  border:1px solid rgba(184,146,90,.12);
  margin-bottom:1px;
}

/* Lewa — opis oferty */
.ws-card{
  background:var(--ink);
  padding:2.4rem 2.6rem;
}
.ws-card-dark{background:rgba(184,146,90,.05)}

/* AI badge */
.ws-ai-badge{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--f-sans);font-size:.6rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(184,146,90,.3);
  padding:.32rem .85rem;margin-bottom:1.6rem;
}
.ws-ai-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--sage);animation:blink 2.5s ease infinite;
}

.ws-card-title{
  font-family:var(--f-serif);font-size:clamp(1.3rem,2.5vw,1.9rem);
  font-weight:300;color:var(--ivory);line-height:1.2;margin-bottom:1rem;
}
.ws-card-title em{font-style:italic;color:var(--gold-lt)}
.ws-card-desc{
  font-size:.82rem;color:rgba(250,247,242,.45);
  line-height:1.75;margin-bottom:2rem;
}

/* Lista usług */
.ws-services{
  display:flex;flex-direction:column;gap:1px;
  background:rgba(184,146,90,.1);
  border:1px solid rgba(184,146,90,.1);
  margin-bottom:2rem;
}
.ws-srv{
  background:var(--ink);
  padding:1.1rem 1.4rem;
  display:flex;align-items:flex-start;gap:1rem;
  transition:background .28s;
}
.ws-srv:hover{background:rgba(184,146,90,.06)}
.ws-srv-ico{font-size:1.1rem;flex-shrink:0;margin-top:.1rem}
.ws-srv-name{
  font-family:var(--f-serif);font-size:.95rem;
  color:rgba(250,247,242,.8);margin-bottom:.2rem;
}
.ws-srv-txt{font-size:.72rem;color:rgba(250,247,242,.35);line-height:1.55}

/* CTA buttons */
.ws-btns{display:flex;flex-wrap:wrap;gap:.8rem}
.btn-gold-fill{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--f-sans);font-size:.68rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);background:var(--gold);
  padding:.92rem 2.2rem;border:none;cursor:pointer;
  transition:background .3s,transform .2s;
}
.btn-gold-fill:hover{background:var(--gold-lt);transform:translateY(-2px);color:var(--ink)}
.btn-ghost-light{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--f-sans);font-size:.68rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:rgba(250,247,242,.6);
  padding:.9rem 2rem;
  border:1.5px solid rgba(250,247,242,.15);
  transition:all .28s;
}
.btn-ghost-light:hover{border-color:var(--gold);color:var(--gold-lt)}

/* Prawa — pakiety */
.ws-packages{
  background:var(--ink);
  padding:2.4rem 2.2rem;
  display:flex;flex-direction:column;gap:1px;
}
.ws-pkg{
  background:rgba(250,247,242,.03);
  border:1px solid rgba(184,146,90,.12);
  padding:1.4rem 1.6rem;
  position:relative;overflow:hidden;
  transition:border-color .3s,background .3s;
  cursor:default;
}
.ws-pkg:hover{border-color:rgba(184,146,90,.35);background:rgba(184,146,90,.05)}
.ws-pkg.featured{border-color:var(--gold);background:rgba(184,146,90,.07)}
.ws-pkg-label{
  font-size:.56rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold);margin-bottom:.6rem;
  display:flex;align-items:center;gap:.5rem;
}
.ws-pkg-ico{font-size:.95rem}
.ws-pkg-name{
  font-family:var(--f-serif);font-size:1.05rem;
  color:var(--ivory);margin-bottom:.4rem;
}
.ws-pkg-desc{font-size:.72rem;color:rgba(250,247,242,.38);line-height:1.6;margin-bottom:.9rem}
.ws-pkg-tags{display:flex;flex-wrap:wrap;gap:.4rem}
.ws-pkg-tag{
  font-size:.55rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(184,146,90,.22);padding:.22rem .6rem;
}
.ws-pkg-badge{
  position:absolute;top:.8rem;right:.9rem;
  font-size:.55rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  background:var(--gold);color:var(--ink);padding:.22rem .65rem;
}

/* Bottom bar — statystyki zasięgu */
.ws-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;background:rgba(184,146,90,.1);
  border:1px solid rgba(184,146,90,.1);
}
.ws-stat{
  background:var(--ink);
  padding:1.4rem 1.6rem;text-align:center;
  transition:background .28s;
}
.ws-stat:hover{background:rgba(184,146,90,.05)}
.ws-stat-num{
  font-family:var(--f-serif);font-size:1.9rem;
  color:var(--gold-lt);line-height:1;margin-bottom:.3rem;
}
.ws-stat-num sup{font-size:.9rem;color:var(--rose);vertical-align:super}
.ws-stat-lbl{
  font-size:.58rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(250,247,242,.28);
}

@media(max-width:1024px){.ws-main{grid-template-columns:1fr}}
@media(max-width:640px){.ws-stats{grid-template-columns:1fr 1fr}}

/* Back to top */
#btt{
  position:fixed;bottom:1.8rem;right:1.8rem;z-index:400;
  width:42px;height:42px;
  background:var(--ivory);color:var(--rose);
  border:1px solid var(--brd-md);
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;cursor:pointer;
  opacity:0;pointer-events:none;
  transition:all .28s;transform:translateY(8px);
  box-shadow:var(--s2);
}
#btt.show{opacity:1;pointer-events:auto;transform:translateY(0)}
#btt:hover{background:var(--rose);color:var(--ivory);border-color:var(--rose);transform:translateY(-2px)}

/* ================================================================
   18b. O MNIE — dodatkowe style sekcji Bio
================================================================ */

    #o-mnie { background: var(--cream); }
    .bio-wrap {
      max-width: 1380px; margin: 0 auto;
      display: grid;
      grid-template-columns: 340px 1fr;
      gap: clamp(3rem, 6vw, 6rem);
      align-items: start;
    }

    /* Portrait column */
    .bio-portrait { position: relative; }
    .bio-img {
      width: 100%; aspect-ratio: 3/4;
      background: linear-gradient(155deg, #e6d9c8 0%, #d4c0a0 35%, #c49870 70%, #a87848 100%);
      display: flex; align-items: center; justify-content: center;
      font-size: clamp(5rem, 12vw, 9rem);
      position: relative; overflow: hidden;
    }
    .bio-img::before {
      content: '';
      position: absolute; inset: 1.4rem;
      border: 1px solid rgba(184,146,90,.2);
      pointer-events: none;
    }
    .bio-img::after {
      content: '';
      position: absolute; inset: 0;
      background: radial-gradient(ellipse at 25% 75%, rgba(192,123,108,.15), transparent 55%);
    }
    .bio-badge {
      position: absolute; bottom: -1rem; right: -1rem;
      background: var(--rose);
      padding: 1.4rem 1.2rem;
      text-align: center; min-width: 100px;
      box-shadow: var(--s2);
    }
    .bio-badge-num {
      font-family: var(--f-serif);
      font-size: 2.4rem; line-height: 1;
      color: var(--ivory); font-weight: 400;
    }
    .bio-badge-lbl {
      font-size: .55rem; font-weight: 600;
      letter-spacing: .14em; text-transform: uppercase;
      color: rgba(250,247,242,.7); margin-top: .3rem;
    }
    .bio-pubs {
      margin-top: 2.5rem;
      display: flex; flex-direction: column; gap: .6rem;
    }
    .bio-pub-lbl {
      font-size: .58rem; font-weight: 600;
      letter-spacing: .18em; text-transform: uppercase;
      color: var(--lt-muted);
    }
    .bio-pub-list {
      display: flex; flex-wrap: wrap; gap: .4rem;
    }
    .bio-pub {
      font-family: var(--f-serif); font-style: italic;
      font-size: .9rem; color: var(--muted);
      background: var(--ivory);
      border: 1px solid var(--brd);
      padding: .28rem .75rem;
      transition: all .22s;
    }
    .bio-pub:hover { color: var(--rose); border-color: var(--brd-md); }

    /* Content column */
    .bio-content { padding-top: .5rem; }
    .bio-content .eyebrow { margin-bottom: 1rem; }
    .bio-name {
      font-family: var(--f-serif);
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 300; color: var(--ink);
      line-height: 1.05; margin-bottom: .5rem;
    }
    .bio-role {
      font-family: var(--f-serif); font-style: italic;
      font-size: 1rem; color: var(--muted);
      margin-bottom: 2rem;
    }
    .bio-text {
      font-family: var(--f-sans); font-size: .92rem;
      font-weight: 300; color: var(--ink-s);
      line-height: 1.85; margin-bottom: 1.4rem;
      max-width: 620px;
    }
    .bio-text strong { font-weight: 600; color: var(--ink); }

    /* Credentials row */
    .bio-creds {
      display: grid; grid-template-columns: repeat(3, 1fr);
      gap: 1px; background: var(--sand);
      border: 1.5px solid var(--sand);
      margin: 2.5rem 0;
    }
    .bc-item {
      background: var(--ivory);
      padding: 1.4rem 1.5rem;
      transition: background .28s;
    }
    .bc-item:hover { background: var(--warm); }
    .bc-ico { font-size: 1.2rem; margin-bottom: .65rem; display: block; }
    .bc-title {
      font-family: var(--f-serif);
      font-size: .95rem; color: var(--ink);
      margin-bottom: .3rem;
    }
    .bc-text {
      font-size: .72rem; color: var(--muted);
      line-height: 1.6;
    }

    /* Timeline */
    .bio-timeline {
      display: flex; flex-direction: column; gap: 0;
      border-left: 1px solid var(--brd-md);
      margin: 2rem 0 2.5rem 1rem;
      padding-left: 2rem;
    }
    .bt-item {
      position: relative;
      padding-bottom: 1.8rem;
    }
    .bt-item:last-child { padding-bottom: 0; }
    .bt-item::before {
      content: '';
      position: absolute; left: -2.38rem; top: .35rem;
      width: 8px; height: 8px; border-radius: 50%;
      background: var(--rose);
      box-shadow: 0 0 0 3px rgba(192,123,108,.15);
    }
    .bt-year {
      font-size: .6rem; font-weight: 600;
      letter-spacing: .16em; text-transform: uppercase;
      color: var(--gold); margin-bottom: .25rem;
    }
    .bt-text {
      font-size: .82rem; color: var(--ink-s); line-height: 1.6;
    }
    .bt-text strong { color: var(--ink); font-weight: 600; }

    /* Quote pull */
    .bio-quote {
      background: var(--ink);
      padding: 2rem 2.2rem;
      position: relative; overflow: hidden;
      margin-top: 2rem;
    }
    .bio-quote::before {
      content: '"';
      position: absolute; top: -1rem; left: 1.5rem;
      font-family: var(--f-serif); font-size: 8rem;
      color: rgba(184,146,90,.1); line-height: 1;
    }
    .bq-text {
      font-family: var(--f-serif); font-style: italic;
      font-size: clamp(1rem, 1.8vw, 1.25rem);
      font-weight: 300; color: var(--ivory);
      line-height: 1.7; position: relative; z-index: 1;
    }
    .bq-source {
      font-size: .65rem; font-weight: 500;
      letter-spacing: .12em; text-transform: uppercase;
      color: var(--gold-lt); margin-top: 1.1rem;
      display: block; position: relative; z-index: 1;
    }

    @media (max-width: 960px) {
      .bio-wrap { grid-template-columns: 1fr; }
      .bio-img { aspect-ratio: 4/3; font-size: 5rem; }
      .bio-badge { right: 0; bottom: -.8rem; }
      .bio-creds { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 540px) {
      .bio-creds { grid-template-columns: 1fr; }
    }

/* ================================================================
   PRINT STYLES
================================================================ */

@media print {
  #nav, #topbar, #ldr, #cur-d, #cur-r, #btt,
  #newsletter, #social, .mband, #wspolpraca { display: none !important; }
  body { color: #000; background: #fff; font-size: 12pt; }
  a[href]::after { content: " (" attr(href) ")"; font-size: .7em; color: #666; }
  h2, h3 { page-break-after: avoid; }
  .omnie-wrap, .nisza-w { grid-template-columns: 1fr; }
}