/*
Theme Name: Klinika Głosu
Theme URI: https://klinikaglosu.pl
Author: Klinika Głosu
Description: Holistyczne centrum głosu, oddechu i ciała. Motyw FSE — edytuj wszystko wizualnie w panelu WordPress.
Version: 1.0
Requires at least: 6.2
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: klinika-glosu
*/

/* ===== ANIMATIONS ===== */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}
.fade-up { opacity: 0; transform: translateY(30px); transition: all 0.7s ease; }
.fade-up.visible { opacity: 1; transform: translateY(0); }
.hero-animate { opacity: 0; animation: fadeUp 0.8s ease forwards; }
.hero-animate-1 { animation-delay: 0.2s; }
.hero-animate-2 { animation-delay: 0.4s; }
.hero-animate-3 { animation-delay: 0.6s; }
.hero-animate-4 { animation-delay: 0.8s; }

/* ===== HERO DECORATIONS ===== */
.hero-section { position: relative; overflow: hidden; }
.hero-section::before {
    content: ''; position: absolute; top: -20%; right: -10%;
    width: 600px; height: 600px; border-radius: 50%;
    background: radial-gradient(circle, var(--wp--preset--color--sand) 0%, transparent 70%);
    opacity: 0.6; pointer-events: none;
}
.hero-section::after {
    content: ''; position: absolute; bottom: -10%; left: -5%;
    width: 400px; height: 400px; border-radius: 50%;
    background: radial-gradient(circle, var(--wp--preset--color--sage-light) 0%, transparent 70%);
    opacity: 0.3; pointer-events: none;
}

/* ===== BADGE ===== */
.kg-badge {
    display: inline-block; font-size: 12px; letter-spacing: 3px;
    text-transform: uppercase; font-weight: 500; padding: 8px 24px;
    border: 1px solid var(--wp--preset--color--terracotta-light);
    border-radius: 30px; color: var(--wp--preset--color--terracotta);
}

/* ===== BUTTONS ===== */
.kg-btn {
    display: inline-block; padding: 16px 36px; border-radius: 40px;
    text-decoration: none; font-size: 15px; font-weight: 500;
    letter-spacing: 0.5px; transition: all 0.3s ease; cursor: pointer; border: none;
}
.kg-btn-primary {
    background: var(--wp--preset--color--terracotta);
    color: var(--wp--preset--color--warm-white);
}
.kg-btn-primary:hover {
    background: var(--wp--preset--color--terracotta-dark);
    color: var(--wp--preset--color--warm-white);
    transform: translateY(-2px); box-shadow: 0 8px 30px rgba(194,123,90,0.3);
}
.kg-btn-outline {
    background: transparent; border: 1.5px solid var(--wp--preset--color--sand);
    color: var(--wp--preset--color--charcoal);
}
.kg-btn-outline:hover {
    border-color: var(--wp--preset--color--terracotta);
    color: var(--wp--preset--color--terracotta);
}

/* ===== CARDS ===== */
.kg-card {
    background: var(--wp--preset--color--cream); border-radius: 16px;
    padding: 36px 32px; border: 1px solid var(--wp--preset--color--sand);
    transition: all 0.3s ease;
}
.kg-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(139,111,92,0.08); }

.kg-service-card {
    background: var(--wp--preset--color--warm-white); border-radius: 20px;
    padding: 44px 36px; border: 1px solid var(--wp--preset--color--sand);
    transition: all 0.4s ease; position: relative; overflow: hidden;
}
.kg-service-card::before {
    content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px;
    background: var(--wp--preset--color--terracotta-light);
    transform: scaleX(0); transform-origin: left; transition: transform 0.4s ease;
}
.kg-service-card:hover::before { transform: scaleX(1); }
.kg-service-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(139,111,92,0.1); }

.kg-who-card {
    background: var(--wp--preset--color--warm-white); border-radius: 16px;
    padding: 32px 28px; border: 1px solid var(--wp--preset--color--sand);
    text-align: center; transition: all 0.3s ease;
}
.kg-who-card:hover { border-color: var(--wp--preset--color--terracotta-light); }

/* ===== PRICING ===== */
.kg-pricing-card {
    background: var(--wp--preset--color--warm-white); border-radius: 20px;
    padding: 40px 32px; border: 1px solid var(--wp--preset--color--sand);
}
.kg-pricing-featured {
    border-color: var(--wp--preset--color--terracotta);
    border-top: 4px solid var(--wp--preset--color--terracotta);
}

/* ===== AUDYT BOX ===== */
.kg-audyt-box {
    background: rgba(194,123,90,0.12); border: 1px solid rgba(194,123,90,0.25);
    border-radius: 20px; padding: 44px 40px;
}
.kg-audyt-step {
    padding: 28px 0; border-bottom: 1px solid rgba(232,221,208,0.15);
    display: flex; gap: 20px; align-items: flex-start;
}
.kg-step-num {
    font-family: var(--wp--preset--font-family--display); font-size: 32px;
    font-weight: 300; color: var(--wp--preset--color--terracotta-light);
    line-height: 1; min-width: 36px;
}
.kg-audyt-list { list-style: none; padding: 0; margin: 0 0 32px; }
.kg-audyt-list li {
    font-size: 15px; padding: 8px 0 8px 24px; position: relative;
    color: var(--wp--preset--color--cream);
}
.kg-audyt-list li::before {
    content: '✦'; position: absolute; left: 0;
    color: var(--wp--preset--color--terracotta-light); font-size: 10px; top: 12px;
}

/* ===== TIMELINE ===== */
.kg-timeline { position: relative; max-width: 700px; margin: 0 auto; }
.kg-timeline::before {
    content: ''; position: absolute; left: 28px; top: 0; bottom: 0; width: 2px;
    background: linear-gradient(to bottom, var(--wp--preset--color--terracotta-light), var(--wp--preset--color--sage-light));
}
.kg-timeline-item { display: flex; gap: 32px; align-items: flex-start; padding: 32px 0; }
.kg-timeline-dot {
    min-width: 58px; height: 58px; border-radius: 50%;
    background: var(--wp--preset--color--cream);
    border: 2px solid var(--wp--preset--color--terracotta-light);
    display: flex; align-items: center; justify-content: center;
    font-family: var(--wp--preset--font-family--display);
    font-size: 22px; font-weight: 600;
    color: var(--wp--preset--color--terracotta);
    position: relative; z-index: 1;
}

/* ===== FAQ ===== */
.kg-faq details { border-bottom: 1px solid var(--wp--preset--color--sand); }
.kg-faq summary {
    padding: 24px 0; cursor: pointer; list-style: none;
    font-family: var(--wp--preset--font-family--display);
    font-size: 20px; font-weight: 500; color: var(--wp--preset--color--charcoal);
    display: flex; justify-content: space-between; align-items: center;
    transition: color 0.3s;
}
.kg-faq summary:hover { color: var(--wp--preset--color--terracotta); }
.kg-faq summary::after { content: '+'; font-size: 24px; color: var(--wp--preset--color--terracotta); transition: transform 0.3s; }
.kg-faq details[open] summary::after { transform: rotate(45deg); }
.kg-faq summary::-webkit-details-marker { display: none; }
.kg-faq .faq-answer { padding: 0 0 24px; font-size: 15px; line-height: 1.8; color: var(--wp--preset--color--earth); }

/* ===== TEAM PAGE ===== */
.kg-team-photo-placeholder {
    width: 140px; height: 140px; border-radius: 50%; margin: 0 auto 24px;
    background: linear-gradient(135deg, var(--wp--preset--color--sand), var(--wp--preset--color--sage-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 48px; color: white; border: 3px solid var(--wp--preset--color--sand);
}
.kg-founder-placeholder {
    width: 100%; aspect-ratio: 4/5; border-radius: 24px;
    background: linear-gradient(135deg, var(--wp--preset--color--sand), var(--wp--preset--color--sage-light));
    display: flex; align-items: center; justify-content: center;
    font-size: 80px; color: white; opacity: 0.8;
}
.kg-team-badge {
    display: inline-block; margin-top: 16px; font-size: 12px; padding: 4px 16px;
    border: 1px solid var(--wp--preset--color--sage-light); border-radius: 20px;
    color: var(--wp--preset--color--sage);
}
.kg-doctor-item {
    padding: 32px; background: var(--wp--preset--color--warm-white);
    border-radius: 16px; border: 1px solid var(--wp--preset--color--sand); margin-bottom: 20px;
}
.kg-founder-quote {
    margin-top: 32px; padding: 24px 28px; background: var(--wp--preset--color--cream-dark);
    border-left: 3px solid var(--wp--preset--color--terracotta-light);
    border-radius: 0 12px 12px 0;
}

/* ===== DARK SECTION GLOW ===== */
.kg-dark-glow { position: relative; overflow: hidden; }
.kg-dark-glow::before {
    content: ''; position: absolute; top: 0; right: 0; width: 50%; height: 100%;
    background: radial-gradient(ellipse at right, rgba(194,123,90,0.1) 0%, transparent 60%);
    pointer-events: none;
}

/* ===== NAV SCROLL ===== */
.kg-nav { transition: all 0.4s ease; }
.kg-nav.scrolled {
    background: rgba(250,246,241,0.95) !important;
    backdrop-filter: blur(12px);
    box-shadow: 0 1px 0 var(--wp--preset--color--sand);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 782px) {
    .kg-audyt-step { flex-direction: column; gap: 8px; }
    .kg-timeline-item { flex-direction: column; gap: 12px; }
    .kg-timeline::before { display: none; }
    .kg-founder-placeholder { aspect-ratio: 3/2; }
}