/*
Theme Name: Lucus
Theme URI: http://lucus.local
Author: Iza i Grześ (build: Claude)
Description: Lekki motyw strony Lucus — Sauna pełna zmysłów. Strona główna wg projektu Claude Design.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: lucus
*/

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: #f4efe4; font-family: 'Jost', sans-serif; color: #2b2a24; overflow-x: hidden; }
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
a:hover { color: #9a5a3c; }
::selection { background: #c98a5a; color: #f4efe4; }

@keyframes lucusRise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes lucusDrift { 0% { transform: translateY(0) scale(1); opacity:.35; } 50% { transform: translateY(-14px) scale(1.05); opacity:.6; } 100% { transform: translateY(0) scale(1); opacity:.35; } }
@keyframes lucusMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes zRise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }

/* FAQ accordion */
.lucus-faq { background: #f4efe4; border: 1px solid rgba(47,61,45,0.12); border-radius: 14px; padding: 2px 26px; }
.lucus-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 22px 0; font-family: 'Cormorant Garamond', serif; font-size: 22px; line-height: 1.25; color: #2f3d2d; }
.lucus-faq summary::-webkit-details-marker { display: none; }
.lucus-faq summary .ico { flex: none; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #9a5a3c; color: #9a5a3c; display: flex; align-items: center; justify-content: center; font-size: 20px; line-height: 1; transition: transform .3s ease; }
.lucus-faq[open] summary .ico { transform: rotate(45deg); }
.lucus-faq .ans { padding: 0 0 24px; font-size: 16px; font-weight: 300; line-height: 1.75; color: #4a483f; }

/* Zielnik category filter buttons */
.lucus-cat-btn { padding: 12px 24px; border-radius: 40px; cursor: pointer; font-family: 'Jost', sans-serif; font-size: 14px; letter-spacing: 0.5px; transition: all .3s ease; }
.lucus-cat-btn:hover { border-color: #2f3d2d; }
.lucus-plant-card.is-hidden { display: none !important; }

/* Hero slideshow */
.lucus-hero-slide { opacity: 0; visibility: hidden; transition: opacity 1s ease; }
.lucus-hero-slide.is-active { opacity: 1; visibility: visible; }
.lucus-hero-slide.is-active .lucus-hero-content { animation: lucusRise 1s ease both; }
.lucus-hero-dot.is-active { background: #f4efe4 !important; transform: scale(1.25); }
.lucus-hero-arrow:hover { background: rgba(201,138,90,0.85) !important; color: #2f3d2d !important; }
@media (max-width: 640px) { .lucus-hero-arrow { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .lucus-hero-slide { transition: none; } .lucus-hero-slide.is-active .lucus-hero-content { animation: none; } }

/* Site logo (SVG) */
.lucus-logo { height: 46px; width: auto; display: block; }
.lucus-logo-footer { height: 40px; width: auto; display: block; filter: brightness(0) invert(1); opacity: 0.92; }
@media (max-width: 900px) {
  .lucus-logo { height: 38px; }
  .lucus-logo-footer { height: 34px; }
}

.lucus-reveal { opacity: 0; transform: translateY(46px); transition: opacity 1s ease, transform 1.1s cubic-bezier(0.22,0.68,0.28,1); will-change: opacity, transform; }
.lucus-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .lucus-reveal { opacity: 1 !important; transform: none !important; transition: none; }
  html { scroll-behavior: auto; }
}

#kontakt input::placeholder { color: rgba(244,239,228,0.75); opacity: 1; }

/* --- hover replacements for Claude Design's style-hover --- */
.h-navjoin:hover { background:#2f3d2d; color:#f4efe4 !important; }
.h-cream:hover { background:#c98a5a !important; color:#f4efe4 !important; }
.h-ghost:hover { background:rgba(246,242,231,0.12) !important; }
.h-terracotta:hover { background:#e7cfa8 !important; }
.h-round:hover { background:#2f3d2d !important; color:#f4efe4 !important; }
.h-herb:hover { color:#e7cfa8 !important; }
.h-link:hover { color:#e7cfa8 !important; }
.h-cardnav:hover { background:#c98a5a !important; color:#f4efe4 !important; }

/* --- marquee --- */
.lucus-marquee-track { display: inline-flex; gap: 60px; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 22px; letter-spacing: 1px; padding-right: 60px; animation: lucusMarquee 26s linear infinite; }

/* --- responsive --- */
@media (max-width: 900px) {
  .lucus-nav-links { display: none !important; }
  .lucus-nav-toggle { display: flex !important; }
  .lucus-grid-2 { grid-template-columns: 1fr !important; gap: 40px !important; }
  .lucus-grid-3 { grid-template-columns: 1fr !important; }
  .lucus-goals { grid-template-columns: 1fr 1fr !important; }
  .lucus-step { flex: 0 0 100% !important; }
  .lucus-story-media img { max-height: 74vh; }
  .lucus-card-stack { aspect-ratio: 3/4; width: 100%; max-width: 400px; margin: 0 auto; }
  #lucusCardStack .lucus-card { border-radius: 20px; }
}
@media (max-width: 820px) {
  .lucus-book { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  .lucus-goals { grid-template-columns: 1fr !important; }
  .lucus-pricegrid { grid-template-columns: 1fr !important; }
  .lucus-footer-grid { grid-template-columns: 1fr !important; }
  .lucus-herbs-grid { grid-template-columns: 1fr !important; }
}

/* mobile nav panel */
.lucus-nav-toggle { display: none; background: none; border: none; cursor: pointer; flex-direction: column; gap: 5px; padding: 6px; }
.lucus-nav-toggle span { display: block; width: 24px; height: 2px; background: #2f3d2d; }
.lucus-mobile-nav { display: none; flex-direction: column; gap: 4px; padding: 10px 6vw 22px; background: rgba(244,239,228,0.97); border-bottom: 1px solid rgba(43,58,44,0.1); }
.lucus-mobile-nav.open { display: flex; }
.lucus-mobile-nav a { padding: 12px 4px; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; color: #4a483f; border-bottom: 1px solid rgba(47,61,45,0.08); }
