/*
Theme Name: Zuza Stankiewicz
Theme URI: https://zuzastankiewicz.pl
Author: osobiscie.com
Description: Motyw WordPress dla Zuzy Stankiewicz — joga, Living Body, retreaty.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: zuza-stankiewicz
*/

/* ==========================================================================
   Zuza Stankiewicz — wspólny arkusz stylów
   Współdzielony przez wszystkie szablony motywu (patrz header.php/footer.php
   dla wspólnych partiali, assets/js/site.js dla wspólnego JS).
   ========================================================================== */

:root {
  --color-ink: #131115;
  --color-paper: #FAFAF4;
  --font-display: 'Anton', sans-serif;
  --font-body: 'Archivo', sans-serif;
}

/* --- Reset / bazowe style --- */
body{margin:0;background:var(--color-paper);font-family:var(--font-body);overflow-x:hidden}
a{color:var(--color-ink);text-decoration:none}
a:hover{color:var(--color-ink);opacity:.6}
::selection{background:var(--color-ink);color:var(--color-paper)}

@keyframes floaty{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}

/* --- Scroll reveal (IntersectionObserver / timeout w site.js) --- */
.zs-reveal-item{opacity:0;transform:translateY(36px);transition:opacity 1s ease,transform 1s ease}
.zs-reveal-item.zs-reveal-delay{transition-delay:.15s}
[data-observe].is-in .zs-reveal-item,[data-hero-reveal].is-in .zs-reveal-item{opacity:1;transform:translateY(0)}

/* --- Przycisk hamburgera (mobile) --- */
.zs-hamburger{display:none}
.zs-hamburger .bar1,.zs-hamburger .bar2,.zs-hamburger .bar3{background:var(--color-ink)}
.zs-hamburger .bar1,.zs-hamburger .bar3{transition:transform .3s ease}
.zs-hamburger .bar2{transition:opacity .3s ease}
.zs-hamburger[aria-expanded="true"] .bar1{transform:translateY(7px) rotate(45deg)}
.zs-hamburger[aria-expanded="true"] .bar2{opacity:0}
.zs-hamburger[aria-expanded="true"] .bar3{transform:translateY(-7px) rotate(-45deg)}

/* --- Menu mobilne (overlay + akordeon "Oferta") --- */
#mobile-menu-overlay{opacity:0;transition:opacity .4s ease}
#mobile-menu-overlay.is-open{opacity:1}
#mobile-menu-inner{transform:translateX(100%);transition:transform .45s cubic-bezier(.16,1,.3,1)}
#mobile-menu-overlay.is-open #mobile-menu-inner{transform:translateX(0)}
#mobile-offer-panel{max-height:0;overflow:hidden;transition:max-height .35s ease}
#mobile-offer-panel.is-open{max-height:260px}
#mobile-offer-icon{transition:transform .3s ease}

/* --- Akordeon FAQ --- */
.zs-faq-panel{max-height:0;overflow:hidden;transition:max-height .35s ease}
.zs-faq-item.is-open .zs-faq-panel{max-height:600px}
.zs-faq-icon{transition:transform .3s ease}

/* --- Przyciski z hover --- */
.zs-btn-hover:hover{opacity:.7}

/* --- Aktywna pozycja menu (klasa current-menu-item dodawana przez wp_nav_menu) --- */
.zs-desktop-nav .current-menu-item > a,
.zs-mobile-menu-inner .current-menu-item > a,
.zs-is-current{opacity:.4}

/* --- Formularz newslettera: stan wysyłki/sukcesu/błędu --- */
.zs-newsletter-msg{font:600 20px/1.5 Archivo;max-width:420px;margin-top:12px;display:none}
.zs-newsletter-msg.is-visible{display:block}

/* --- Slider opinii (strona główna) --- */
.zs-testimonial-track{position:relative}
.zs-testimonial-slide{display:none;opacity:0;transition:opacity .4s ease}
.zs-testimonial-slide.is-active{display:block;opacity:1}
.zs-testimonial-prev,.zs-testimonial-next{transition:opacity .2s ease}
.zs-testimonial-dot{width:9px;height:9px;padding:0;border:none;background:rgba(19,17,21,.2);cursor:pointer;transition:background .2s ease}
.zs-testimonial-dot.is-active{background:var(--color-ink)}
.zs-testimonial-quote{font:italic 400 clamp(19px,2.4vw,26px)/1.5 Archivo;color:#131115;margin:0 0 32px}
.zs-testimonial-quote p{margin:0 0 20px}
.zs-testimonial-quote p:last-child{margin-bottom:0}
.zs-testimonial-quote p:first-child::before{content:"„"}
.zs-testimonial-quote p:last-child::after{content:"”"}
.zs-newsletter-msg.is-error{color:#ff8a80}

/* --- Strona Glowna: loader startowy --- */
#loader{position:fixed;inset:0;z-index:100;background:var(--color-paper);opacity:1;pointer-events:auto;transition:opacity .6s ease .1s}
#loader-logo{position:fixed;top:50%;left:50%;max-width:82vw;transform:translate(-50%,-50%);height:clamp(48px,18vw,140px);opacity:0;transition:top 1.1s cubic-bezier(.65,0,.35,1),left 1.1s cubic-bezier(.65,0,.35,1),transform 1.1s cubic-bezier(.65,0,.35,1),height 1.1s cubic-bezier(.65,0,.35,1),opacity .5s ease}
#loader-logo-ink{position:absolute;top:0;left:0;height:100%;width:auto;clip-path:inset(100% 0 0 0);transition:clip-path 1.15s cubic-bezier(.65,0,.35,1)}

/* --- Strona Glowna: header reagujący na scroll --- */
.zs-header{background:transparent;transition:background .4s ease}
.zs-header.is-scrolled{background:var(--color-paper)}
.zs-header-logo{filter:invert(1) brightness(2);transition:filter .4s ease}
.zs-header.is-scrolled .zs-header-logo{filter:none}
.zs-desktop-nav{color:var(--color-paper);transition:color .4s ease}
.zs-header.is-scrolled .zs-desktop-nav{color:var(--color-ink)}
.zs-header .zs-hamburger .bar{background:var(--color-paper);transition:background .4s ease}
.zs-header.is-scrolled .zs-hamburger .bar{background:var(--color-ink)}

/* --- Strona Glowna: hero (clip-path reveal + zoom) --- */
#hero .zs-hero-clip{clip-path:inset(0 0 100% 0);transition:clip-path 1.5s cubic-bezier(.16,1,.3,1) .1s}
#hero.is-in .zs-hero-clip{clip-path:inset(0 0 0 0)}
#hero .zs-hero-img{transform:scale(1.25);transition:transform 1.8s cubic-bezier(.16,1,.3,1) .1s}
#hero.is-in .zs-hero-img{transform:scale(1)}
#hero .zs-hero-top{opacity:0;transform:translateY(28px);transition:opacity 1.1s ease,transform 1.1s ease}
#hero.is-in .zs-hero-top{opacity:1;transform:translateY(0)}
#hero .zs-hero-bottom{opacity:0;transition:opacity 1.1s ease .3s}
#hero.is-in .zs-hero-bottom{opacity:1}

/* ==========================================================================
   Responsywność — jeden breakpoint odziedziczony z eksportu Claude Design.
   Zweryfikowany na 375 / 768 / 1024px w Fazie 1, Kroku 4.
   ========================================================================== */
@media (max-width:860px){
  /* Header / nawigacja — wspólne dla wszystkich podstron */
  .zs-desktop-nav{display:none !important}
  .zs-hamburger{display:flex !important}
  .zs-header{padding-left:28px !important;padding-right:28px !important}
  .zs-mobile-menu-inner{padding-left:28px !important;padding-right:28px !important}
  .zs-footer-grid{grid-template-columns:1fr !important;gap:48px !important}

  /* Hero (O mnie, Oferta, Yoga, Living Body, Eventy, Retreaty, In English) */
  .zs-hero{padding:150px 28px 60px !important}
  .zs-hero h1{font-size:clamp(48px,15vw,80px) !important}

  /* Sekcje split (O mnie, Yoga, Living Body, Eventy, Retreaty, In English) */
  .zs-split{grid-template-columns:1fr !important;gap:32px !important;padding:60px 28px !important}
  .zs-split-rev{flex-direction:column-reverse !important}

  /* O mnie: cytat + finalna sekcja */
  .zs-quote{padding:100px 28px !important;font-size:clamp(24px,7vw,34px) !important}
  .zs-final{grid-template-columns:1fr !important;gap:40px !important;padding:70px 28px 120px !important}

  /* Oferta: wiersze ofert */
  .zs-offer-row{grid-template-columns:1fr !important;gap:32px !important;padding:70px 28px !important}

  /* FAQ (Yoga, Living Body, Eventy, Retreaty) */
  .zs-faq-q{font-size:19px !important}

  /* Eventy / Retreaty: archiwum */
  .zs-archive-grid{grid-template-columns:1fr 1fr !important;gap:20px !important}

  /* Kontakt */
  .zs-kontakt-grid{grid-template-columns:1fr !important;gap:40px !important;padding:130px 28px 80px !important}
  .zs-kontakt-title{font-size:clamp(48px,15vw,80px) !important}

  /* Strona Glowna */
  .zs-omnie-grid{grid-template-columns:1fr !important;gap:40px !important;padding:120px 28px 80px !important}
  .zs-omnie-title{font-size:clamp(40px,13vw,64px) !important}
  .zs-oferta-grid{grid-template-columns:1fr !important}
  .zs-hero-top{align-items:flex-start !important;text-align:left !important;justify-content:flex-start !important;padding:120px 28px 0 28px !important}
  .zs-hero-top .zs-hero-label{align-self:flex-start !important;text-align:left !important}
  .zs-hero-bottom{left:28px !important}
  .zs-retreat-banner{height:56vh !important}
  .zs-mobile-menu-logo{left:28px !important}
  .zs-testimonial-section{padding:100px 28px !important}
  .zs-testimonial-nav{gap:20px !important;margin-top:40px !important}

  /* Nazare / pojedyncze wydarzenie */
  .zs-event-title{font-size:clamp(48px,15vw,90px) !important}
  .zs-event-cover{height:60vh !important}
  .zs-gallery-grid{grid-template-columns:1fr 1fr !important;gap:12px !important}
}