/* ============================================================
   Patty Kania — pattykania.com
   Design: Claude Design handoff (hifi 1:1)
   ============================================================ */

*{margin:0;padding:0;box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:88px}
section[id]{scroll-margin-top:88px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:'DM Sans',sans-serif;
  background:#F7F5F0;
  color:#1A1A18;
  overflow-x:hidden;
}

a{text-decoration:none;color:inherit}
a:hover{color:#8B2E2E}

img{max-width:100%}

@keyframes wave{0%,100%{transform:scaleY(0.4)}50%{transform:scaleY(1)}}

/* ---------- Nawigacja ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:1.5rem 4rem;
  background:rgba(247,245,240,0.92);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #E2DDD6;
}
.nav-logo{display:flex;align-items:center}
.nav-logo img{height:44px;width:auto;display:block}
.nav-links{
  display:flex;gap:2.5rem;
  font-size:0.8rem;font-weight:400;letter-spacing:0.12em;
  text-transform:uppercase;color:#6B6B65;
}
.nav-links a{transition:color 0.2s}
.nav-links a:hover{color:#1A1A18}
.nav-right{display:flex;align-items:center;gap:0.9rem}
.nav-cta{
  font-size:0.75rem;letter-spacing:0.1em;text-transform:uppercase;
  border:1px solid #1A1A18;padding:0.6rem 1.4rem;transition:all 0.2s;
}
.nav-cta:hover{background:#1A1A18;color:#F7F5F0}
.nav-burger{
  display:none;align-items:center;justify-content:center;
  width:40px;height:40px;background:none;border:1px solid #1A1A18;
  color:#1A1A18;font-size:1rem;line-height:1;cursor:pointer;
  font-family:'DM Sans',sans-serif;
}

/* ---------- Menu mobilne ---------- */
.nav-menu{
  position:fixed;top:0;left:0;right:0;bottom:0;z-index:99;
  background:#F7F5F0;padding:6.5rem 1.5rem 2rem;
  display:none;flex-direction:column;overflow:auto;text-align:center;
}
.nav-menu.open{display:flex}
.nav-menu a{
  padding:1.2rem 0;border-top:1px solid #E2DDD6;
  font-size:0.9rem;letter-spacing:0.15em;text-transform:uppercase;color:#1A1A18;
}
.nav-menu a:last-child{border-bottom:1px solid #E2DDD6;color:#8B2E2E}
@media (min-width:861px){.nav-menu{display:none !important}}

/* ---------- Wspólne ---------- */
.kicker{
  font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:#6B6B65;
  display:flex;align-items:center;gap:1rem;
}
.kicker .line{width:1.5rem;height:1px;background:#6B6B65;flex-shrink:0}
em.accent{font-style:italic;color:#8B2E2E}
em.gold{font-style:italic;color:#C4A882}

.btn-fill{
  display:inline-block;background:#1A1A18;color:#F7F5F0;
  padding:0.9rem 2.2rem;font-size:0.8rem;letter-spacing:0.1em;
  text-transform:uppercase;transition:background 0.2s;
}
.btn-fill:hover{background:#8B2E2E;color:#F7F5F0}

/* ---------- Hero ---------- */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;padding-top:80px}
.hero-content{padding:6rem 3rem 6rem 4rem;display:flex;flex-direction:column;justify-content:center}
.hero-kicker{
  font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:#6B6B65;
  margin-bottom:2rem;display:flex;align-items:baseline;gap:1rem;
}
.hero-kicker .line{width:2rem;height:1px;background:#6B6B65;flex-shrink:0;align-self:center}
.hero-kicker span:last-child{min-width:0;line-height:1.8;text-wrap:balance}
.hero h1{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(3rem,7vw,6rem);font-weight:300;line-height:1.05;margin-bottom:1.5rem;
}
.hero-lead{font-size:1rem;line-height:1.8;color:#6B6B65;max-width:28rem;margin-bottom:3rem}
.hero-actions{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.hero-link{
  font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;color:#6B6B65;
  border-bottom:1px solid #E2DDD6;padding-bottom:2px;
  transition:color 0.2s,border-color 0.2s;
}
.hero-link:hover{color:#1A1A18;border-color:#1A1A18}
.hero-img{
  background:#E8E4DC;position:relative;overflow:hidden;min-height:60vh;
}
.hero-img picture{position:absolute;inset:0}
.hero-img img{width:100%;height:100%;object-fit:cover;display:block}
.hero-badge{
  position:absolute;bottom:2.5rem;left:2rem;background:#F7F5F0;
  padding:0.8rem 1.2rem;font-size:0.7rem;letter-spacing:0.12em;
  text-transform:uppercase;color:#6B6B65;pointer-events:none;
}

/* ---------- O mnie ---------- */
.about{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #E2DDD6}
.about-left{padding:7rem 4rem;border-right:1px solid #E2DDD6}
.about-left .kicker{margin-bottom:3rem}
.about h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.4rem,4.5vw,4rem);font-weight:300;line-height:1.1;margin-bottom:2.5rem;
}
.about-left p{font-size:0.95rem;line-height:1.9;color:#6B6B65;margin-bottom:1.5rem}
.stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:3.5rem}
.stat{padding:2rem 1.5rem;border:1px solid #E2DDD6;border-right:none;position:relative}
.stat:last-child{border-right:1px solid #E2DDD6}
.stat::before{content:"";position:absolute;top:0;left:0;width:2px;height:2rem;background:#8B2E2E}
.stat-num{font-family:'Cormorant Garamond',serif;font-size:3.2rem;font-weight:300;line-height:1;margin-bottom:0.5rem}
.stat-label{font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;color:#6B6B65}
.about-right{padding:7rem 4rem;display:flex;flex-direction:column;justify-content:center;background:#F3F0EA}
.about-quote{
  font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:300;font-style:italic;
  line-height:1.5;color:#1A1A18;margin-bottom:3.5rem;
  padding-left:1.5rem;border-left:2px solid #C4A882;
}
.roles{display:flex;flex-direction:column}
.role{
  display:flex;align-items:center;gap:1.2rem;padding:1.1rem 1.4rem;
  border-bottom:1px solid #E2DDD6;font-size:0.85rem;
  transition:background 0.2s,padding-left 0.2s;
}
.role:first-child{border-top:1px solid #E2DDD6}
.role:hover{background:#EDE9E1;padding-left:1.8rem}
.role .dot{width:5px;height:5px;border-radius:50%;background:#8B2E2E;flex-shrink:0}

/* ---------- Wartości ---------- */
.values{border-top:1px solid #E2DDD6;padding:7rem 4rem;background:#1A1A18;color:#F7F5F0}
.values-head{display:flex;justify-content:space-between;align-items:flex-end;gap:4rem;margin-bottom:5rem}
.values h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.2rem,4.5vw,4rem);font-weight:300;line-height:1.1;
}
.values-head p{font-size:0.9rem;line-height:1.8;color:#9B9B93;max-width:22rem}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #2E2E2A}
.value{padding:2.5rem;border-right:1px solid #2E2E2A}
.value:last-child{border-right:none}
.value-num{
  font-family:'Cormorant Garamond',serif;font-size:3.5rem;font-weight:300;
  color:rgba(255,255,255,0.15);line-height:1;margin-bottom:1.5rem;
}
.value-label{font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:#C4A882;margin-bottom:1rem}
.value p{font-size:0.9rem;line-height:1.8;color:#9B9B93}

/* ---------- Usługi ---------- */
.services{border-top:1px solid #E2DDD6;padding:7rem 4rem}
.services h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.2rem,4.5vw,4rem);font-weight:300;line-height:1.1;margin-bottom:3rem;
}
.services-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  border-top:1px solid #E2DDD6;border-left:1px solid #E2DDD6;
}
.svc{
  padding:2.5rem 3rem;border-right:1px solid #E2DDD6;border-bottom:1px solid #E2DDD6;
  transition:background 0.2s;
}
.svc:hover{background:#F0EDE6}
.svc-icon{
  width:64px;height:64px;border:1px solid #E2DDD6;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.5rem;font-size:1.75rem;
}
.svc-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:400;margin-bottom:0.8rem}
.svc p{font-size:0.875rem;line-height:1.8;color:#6B6B65}

/* ---------- Podcast ---------- */
.podcast{
  border-top:1px solid #E2DDD6;background:#111110;color:#F7F5F0;
  display:grid;grid-template-columns:1fr 1fr;
}
.podcast-left{
  padding:6rem 4rem;display:flex;flex-direction:column;justify-content:center;
  border-right:1px solid #252522;
}
.podcast-kicker{
  font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:#C4A882;
  margin-bottom:2rem;display:flex;align-items:center;gap:1rem;
}
.podcast-kicker .line{width:1.5rem;height:1px;background:#C4A882;flex-shrink:0}
.podcast h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.8rem,6vw,5.5rem);font-weight:300;line-height:0.95;
  margin-bottom:2rem;letter-spacing:-0.01em;
}
.podcast h2 em{font-style:italic;color:#C4A882;display:block}
.podcast-desc{font-size:0.95rem;line-height:1.8;color:#6B6B63;margin-bottom:3rem;max-width:30rem}
.platforms{display:flex;flex-direction:column}
.platform{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 0;border-bottom:1px solid #252522;
  font-size:0.8rem;letter-spacing:0.06em;transition:color 0.2s;cursor:pointer;color:#9B9B93;
}
.platform:first-child{border-top:1px solid #252522}
.platform:hover{color:#F7F5F0}
.platform-name{display:flex;align-items:center;gap:1rem}
.platform-num{font-family:'Cormorant Garamond',serif;font-size:1rem;color:#333330;margin-right:0.2rem}
.platform-arrow{font-size:0.9rem;color:#333330;transition:color 0.2s,transform 0.2s}
.podcast-right{
  background:#0D0D0C;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:6rem 4rem;gap:3rem;position:relative;overflow:hidden;
}
.episode-card{
  background:#1A1A18;border:1px solid #252522;
  padding:clamp(1.25rem,3vw,2.5rem);width:100%;position:relative;z-index:1;
}
.episode-label{font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:#C4A882;margin-bottom:1.5rem}
.episode-card iframe{
  border-radius:12px;border:0;width:100%;aspect-ratio:624/351;height:auto;display:block;
}
.equalizer{display:flex;align-items:center;gap:3px;height:24px;margin-top:1.5rem}
.equalizer span{
  display:block;width:2px;background:#C4A882;border-radius:2px;opacity:0.6;
  animation:wave 1.2s ease-in-out infinite;
}
.equalizer span:nth-child(1){height:6px;animation-delay:0s}
.equalizer span:nth-child(2){height:16px;animation-delay:0.1s}
.equalizer span:nth-child(3){height:22px;animation-delay:0.2s}
.equalizer span:nth-child(4){height:12px;animation-delay:0.3s}
.equalizer span:nth-child(5){height:20px;animation-delay:0.4s}
.equalizer span:nth-child(6){height:10px;animation-delay:0.5s}
.equalizer span:nth-child(7){height:18px;animation-delay:0.3s}
.equalizer span:nth-child(8){height:8px;animation-delay:0.15s}

/* ---------- BLYstudio ---------- */
.bly{border-top:1px solid #E2DDD6;display:grid;grid-template-columns:1fr 1fr}
.bly-left{padding:7rem 4rem;border-right:1px solid #E2DDD6;background:#F7F5F0}
.bly-left .kicker{margin-bottom:3rem}
.bly h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2rem,3.5vw,3.2rem);font-weight:300;line-height:1.2;margin-bottom:1.5rem;
}
.bly-left>p{font-size:0.95rem;line-height:1.9;color:#6B6B65;margin-bottom:2.5rem}
.bly-services{display:flex;flex-direction:column;gap:0.75rem;margin-bottom:3rem}
.bly-service{
  display:inline-flex;align-items:center;gap:0.8rem;
  font-size:0.8rem;letter-spacing:0.08em;text-transform:uppercase;color:#6B6B65;
}
.bly-service .dash{width:0.8rem;height:1px;background:#8B2E2E;flex-shrink:0}
.bly-cta{
  display:inline-flex;align-items:center;gap:0.8rem;
  background:#1A1A18;color:#F7F5F0;padding:1rem 2.2rem;
  font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;transition:background 0.2s;
}
.bly-cta:hover{background:#8B2E2E;color:#F7F5F0}
.bly-cta svg{width:14px;height:14px;stroke:currentColor;fill:none}
.bly-img{background:#F0EDE6;position:relative;min-height:32rem;overflow:hidden}
.bly-img img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}

/* ---------- Kontakt ---------- */
.contact{border-top:1px solid #E2DDD6;padding:7rem 4rem;text-align:center;background:#F7F5F0}
.contact-kicker{
  font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:#6B6B65;
  margin-bottom:2.5rem;display:flex;align-items:center;justify-content:center;gap:1rem;
}
.contact-kicker .line{width:2rem;height:1px;background:#6B6B65}
.contact h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.4rem,6vw,5rem);font-weight:300;line-height:1.1;margin-bottom:1.5rem;
}
.contact>p{
  font-size:1rem;color:#6B6B65;margin-bottom:3.5rem;line-height:1.7;
  max-width:36rem;margin-left:auto;margin-right:auto;
}
.contact .btn-fill{padding:1rem 2.5rem;font-size:0.85rem}
.social{
  display:flex;justify-content:center;flex-wrap:wrap;gap:2.5rem;
  margin-top:4rem;padding-top:3rem;border-top:1px solid #E2DDD6;
}
.social a{
  font-size:0.75rem;letter-spacing:0.15em;text-transform:uppercase;color:#6B6B65;
  transition:color 0.2s;
}
.social a:hover{color:#1A1A18}

/* ---------- Stopka ---------- */
.footer{
  border-top:1px solid #E2DDD6;padding:2rem 4rem;
  display:flex;justify-content:space-between;align-items:center;background:#F7F5F0;
}
.footer-left{
  display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;
  font-size:0.75rem;color:#6B6B65;letter-spacing:0.05em;
}
.footer-left a{transition:color 0.2s}
.footer-left a:hover{color:#1A1A18}
.footer-name{font-family:'Cormorant Garamond',serif;font-size:0.95rem;color:#6B6B65}

/* ---------- Baner cookies ---------- */
.cookie-banner{
  position:fixed;bottom:1.25rem;left:1.25rem;z-index:200;
  max-width:22rem;background:#F7F5F0;border:1px solid #E2DDD6;
  padding:1.4rem 1.5rem;box-shadow:0 2px 24px rgba(26,26,24,0.08);
  opacity:0;transform:translateY(0.75rem);pointer-events:none;
  transition:opacity 0.3s,transform 0.3s;
}
.cookie-banner.visible{opacity:1;transform:none;pointer-events:auto}
.cookie-banner p{font-size:0.78rem;line-height:1.65;color:#6B6B65;margin-bottom:1rem}
.cookie-banner p a{color:#1A1A18;border-bottom:1px solid #E2DDD6;transition:color 0.2s,border-color 0.2s}
.cookie-banner p a:hover{color:#8B2E2E;border-color:#8B2E2E}
.cookie-actions{display:flex;gap:0.6rem}
.cookie-btn{
  flex:1;font-family:'DM Sans',sans-serif;font-size:0.7rem;letter-spacing:0.1em;
  text-transform:uppercase;padding:0.6rem 0.5rem;cursor:pointer;transition:all 0.2s;
}
.cookie-accept{background:#1A1A18;color:#F7F5F0;border:1px solid #1A1A18}
.cookie-accept:hover{background:#8B2E2E;border-color:#8B2E2E}
.cookie-reject{background:none;color:#6B6B65;border:1px solid #E2DDD6}
.cookie-reject:hover{color:#1A1A18;border-color:#1A1A18}

/* ---------- Podstrona: polityka prywatności ---------- */
.legal{max-width:52rem;margin:0 auto;padding:10rem 2rem 6rem}
.legal-header{margin-bottom:4rem;padding-bottom:2.5rem;border-bottom:1px solid #E2DDD6}
.legal h1{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.4rem,5vw,4rem);font-weight:300;line-height:1.1;margin-bottom:1.5rem;
}
.legal-dates{font-size:0.8rem;color:#6B6B65;line-height:1.8}
.legal section{margin-bottom:3.5rem}
.legal-num{
  font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:300;
  color:#8B2E2E;line-height:1;margin-bottom:0.75rem;
}
.legal h2{
  font-family:'Cormorant Garamond',serif;
  font-size:1.7rem;font-weight:400;line-height:1.25;margin-bottom:1.25rem;
}
.legal h3{
  font-size:0.8rem;letter-spacing:0.12em;text-transform:uppercase;
  font-weight:500;margin:1.75rem 0 0.75rem;
}
.legal p{font-size:0.925rem;line-height:1.85;color:#6B6B65;margin-bottom:1rem}
.legal ul{margin:0 0 1rem 1.2rem}
.legal li{font-size:0.925rem;line-height:1.85;color:#6B6B65;margin-bottom:0.4rem}
.legal a{color:#1A1A18;border-bottom:1px solid #E2DDD6;transition:color 0.2s,border-color 0.2s}
.legal a:hover{color:#8B2E2E;border-color:#8B2E2E}
.legal-admin{
  background:#F3F0EA;border-left:2px solid #C4A882;
  padding:1.5rem 1.75rem;margin:1.5rem 0;
}
.legal-admin p{margin-bottom:0.35rem;color:#1A1A18}
.legal-back{
  display:inline-flex;align-items:center;gap:0.6rem;
  font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;color:#6B6B65;
  margin-bottom:3rem;border-bottom:none;transition:color 0.2s;
}
.legal-back:hover{color:#8B2E2E}

/* ============================================================
   Responsywność
   ============================================================ */
@media (max-width:980px){
  .hero,.about,.podcast,.bly{grid-template-columns:1fr}
  .values-grid{grid-template-columns:1fr}
  .about-left,.podcast-left,.bly-left{border-right:none;border-bottom:1px solid #E2DDD6}
  .podcast-left{border-bottom:1px solid #252522}
  .value{border-right:none;border-bottom:1px solid #2E2E2A}
  .value:last-child{border-bottom:none}
  .values-head{flex-direction:column;align-items:flex-start;gap:1.5rem;margin-bottom:3.5rem}
  .hero-content,.about-left,.about-right,.values,.services,
  .podcast-left,.podcast-right,.bly-left,.contact{padding:4.5rem 2.5rem}
  .hero-img{min-height:55vh}
}
@media (max-width:900px){
  .services-grid{grid-template-columns:1fr}
  .svc{border-bottom:1px solid #E2DDD6}
  .svc:last-child{border-bottom:none}
}
@media (max-width:860px){
  html{scroll-padding-top:64px}
  section[id]{scroll-margin-top:64px}
  .nav-links{display:none}
  .nav-burger{display:flex}
  .nav{padding:1rem 1.5rem}
}
@media (max-width:640px){
  .hero-content,.about-left,.about-right,.values,.services,
  .podcast-left,.podcast-right,.bly-left,.contact{padding:3.5rem 1.25rem}
  .legal{padding:8rem 1.25rem 4rem}
  .stats{grid-template-columns:1fr}
  .stat{border-right:1px solid #E2DDD6;border-top:none}
  .stat:first-child{border-top:1px solid #E2DDD6}
  .svc{padding:2rem 1.25rem}
  .about-quote{font-size:1.6rem}
  .footer{flex-direction:column;gap:0.75rem;text-align:center;padding:2rem 1.25rem}
  .footer-left{justify-content:center}
  .social{gap:1.25rem 2rem}
  .bly-img{min-height:20rem}
  .cookie-banner{left:0.75rem;right:0.75rem;bottom:0.75rem;max-width:none}
}
@media (max-width:480px){
  .nav-cta{padding:0.5rem 0.9rem;font-size:0.7rem}
}
