* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background: #FAF7F2; color: #2C2C2C; overflow-x: hidden; }

/* ── SCROLL REVEAL BASE ── */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ── STAGGERED CHILDREN ── */
.reveal-stagger > * {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.65s ease, transform 0.65s ease;
}
.reveal-stagger.visible > *:nth-child(1) { opacity:1; transform:none; transition-delay:.05s; }
.reveal-stagger.visible > *:nth-child(2) { opacity:1; transform:none; transition-delay:.15s; }
.reveal-stagger.visible > *:nth-child(3) { opacity:1; transform:none; transition-delay:.25s; }
.reveal-stagger.visible > *:nth-child(4) { opacity:1; transform:none; transition-delay:.35s; }
.reveal-stagger.visible > *:nth-child(5) { opacity:1; transform:none; transition-delay:.45s; }
.reveal-stagger.visible > *:nth-child(6) { opacity:1; transform:none; transition-delay:.55s; }

/* ── HERO ANIMATIONS ── */
@keyframes fadeInUp   { 0%   { opacity:0; transform:translateY(30px); }  100% { opacity:1; transform:translateY(0); } }
@keyframes fadeInRight{ 0%   { opacity:0; transform:translateX(40px); }  100% { opacity:1; transform:translateX(0); } }
@keyframes fadeIn     { 0%   { opacity:0; }                               100% { opacity:1; } }
@keyframes float      { 0%,100% { transform:translateY(0); }  50% { transform:translateY(-12px); } }
@keyframes countUp    { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@keyframes overlayIn  { from { opacity:0; } to { opacity:1; } }
@keyframes subtlePulse { 0%,100%{ box-shadow:0 0 0 0 rgba(107,127,62,.35); } 60%{ box-shadow:0 0 0 10px rgba(107,127,62,0); } }
@keyframes shimmer { 0%{ background-position:-400px 0; } 100%{ background-position:400px 0; } }

.anim-up    { animation: fadeInUp    1s cubic-bezier(.2,.8,.2,1) both; }
.anim-right { animation: fadeInRight 1s cubic-bezier(.2,.8,.2,1) both; }
.anim-float { animation: float 6s ease-in-out infinite; }
.anim-fade  { animation: fadeIn 1.2s cubic-bezier(.2,.8,.2,1) both; }

/* ── IMAGE HOVER ── */
.img-hover { overflow: hidden; }
.img-hover img { transition: transform 0.7s ease; }
.img-hover:hover img { transform: scale(1.05); }

/* ── GALLERY ── */
.gallery-item { position:relative; overflow:hidden; border-radius:.75rem; }
.gallery-item img { transition: transform 0.6s ease; width:100%; height:100%; object-fit:cover; }
.gallery-item::after {
    content:''; position:absolute; inset:0;
    background: rgba(107,127,62,.28);
    opacity:0; transition: opacity 0.35s ease;
}
.gallery-item:hover::after { opacity:1; }
.gallery-item:hover img { transform:scale(1.08); }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #FAF7F2; }
::-webkit-scrollbar-thumb { background: rgba(107,127,62,.2); border-radius: 4px; }

/* ── NAV ── */
.nav-link { position: relative; }
.nav-link::after { content:''; position:absolute; bottom:-2px; left:0; width:0; height:1px; background:#6B7F3E; transition:width 0.3s ease; }
.nav-link:hover::after { width:100%; }

/* ── CARDS ── */
.benefit-card { transition: transform 0.4s ease, box-shadow 0.4s ease; }
.benefit-card:hover { transform: translateY(-8px); box-shadow: 0 24px 48px rgba(107,127,62,.13); }
.benefit-card:hover .benefit-icon { transform: scale(1.12) rotate(-3deg); }
.benefit-icon { transition: transform 0.4s cubic-bezier(.2,.8,.2,1); }

.class-card-hover { transition: transform 0.4s cubic-bezier(.2,.8,.2,1), box-shadow 0.4s ease; }
.class-card-hover:hover { transform: translateY(-8px); box-shadow: 0 24px 48px rgba(0,0,0,.09); }

.testimonial-card { transition: transform 0.35s ease, box-shadow 0.35s ease; }
.testimonial-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(0,0,0,.07); }

/* ── SCHEDULE ── */
.schedule-table { border-collapse: separate; border-spacing: 0; width: 100%; }
.schedule-table th, .schedule-table td { padding:0; border:1px solid #e8edde; }
.schedule-table th { background:#6B7F3E; color:#fff; font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; padding:16px 8px; }
.schedule-table th:first-child { border-top-left-radius:16px; }
.schedule-table th:last-child  { border-top-right-radius:16px; }
.schedule-table td { vertical-align:middle; padding:14px 12px; background:#fff; transition:background 0.3s ease; }
.schedule-table td:first-child { background:#f5f7f0; font-weight:600; font-size:13px; color:#556832; text-align:center; vertical-align:middle; min-width:90px; white-space:nowrap; }
.schedule-table tr:last-child td:first-child { border-bottom-left-radius:16px; }
.schedule-table tr:last-child td:last-child  { border-bottom-right-radius:16px; }
.schedule-table td:hover { background:#faf7f2; }
.schedule-table td:first-child:hover { background:#f5f7f0; }
.schedule-cell { cursor:pointer; transition:all 0.3s ease; border-radius:8px; padding:6px; text-align:center; }
.schedule-cell:hover { background:#f5f7f0; transform:scale(1.04); }
.class-badge { display:inline-block; font-size:11px; font-weight:600; color:#fff; padding:3px 10px; border-radius:6px; }
.class-badge.hatha     { background:#6B7F3E; }
.class-badge.vinyasa   { background:#B8956A; }
.class-badge.yin       { background:#60a5fa; }
.class-badge.ashtanga  { background:#ef4444; }
.class-badge.meditacion{ background:#8b5cf6; }
.class-badge.prenatal  { background:#ec4899; }
.day-tab { transition:all 0.3s ease; }
.day-tab.active { background:#6B7F3E; color:#fff; }
.day-tab:not(.active):hover { background:#e8edde; }

/* ── CLASS IMAGE ── */
.class-img-wrapper {
    position:relative; width:100%; height:15rem; overflow:hidden;
    background:#ffffff; display:flex; align-items:center; justify-content:center;
}
.class-img-wrapper img {
    width:100%; height:100%; object-fit:contain; object-position:center;
    transition:transform 0.7s ease;
}
.class-img-wrapper:hover img { transform:scale(1.05); }

/* ── FORM & UI ── */
.stat-number { display:inline-block; }
.form-input { transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease; }
.form-input:focus { transform: translateY(-1px); }
.social-icon { transition: all 0.3s ease; }
.social-icon:hover { transform: translateY(-3px); }

/* ── BACK TO TOP ── */
#backToTop {
    position:fixed; bottom:2rem; right:2rem; z-index:99;
    width:44px; height:44px; border-radius:50%;
    background:#6B7F3E; color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 4px 20px rgba(107,127,62,.35);
    opacity:0; transform:translateY(10px);
    transition:opacity 0.3s ease, transform 0.3s ease;
    cursor:pointer; border:none;
}
#backToTop.show { opacity:1; transform:translateY(0); }
#backToTop:hover { background:#556832; transform:translateY(-2px); }

/* ── LOADER ── */
#pageLoader {
    position:fixed; inset:0; z-index:9999;
    background:#FAF7F2;
    display:flex; align-items:center; justify-content:center;
    transition:opacity 0.5s ease, visibility 0.5s ease;
}
#pageLoader.hidden { opacity:0; visibility:hidden; }
.loader-logo { animation:float 1.5s ease-in-out infinite; }

/* ── NAV CTA ── */
.nav-cta { transition:all 0.3s ease; }
.nav-cta:hover { transform:translateY(-1px); box-shadow:0 8px 20px rgba(107,127,62,.3); }

/* ═══════════ MODALES (RESERVAS + LEGAL) ═══════════ */
.modal-reservas-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(5, 5, 5, 0.92);
    z-index: 9999;
    backdrop-filter: blur(12px);
    animation: fadeIn 0.35s ease;
}
.modal-reservas-overlay.active {
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal-reservas-container {
    position: relative;
    width: 95%;
    max-width: 1200px;
    height: 92vh;
    background: #FAF7F2;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.4);
    animation: slideUp 0.45s cubic-bezier(.2,.8,.2,1);
    border: 1px solid rgba(107,127,62,0.2);
}
.modal-reservas-container iframe {
    width: 100%; height: 100%; border: none;
}
.btn-cerrar-modal {
    position: absolute;
    top: 18px; right: 18px;
    width: 48px; height: 48px;
    background: rgba(107,127,62,0.95);
    color: white;
    border: none;
    border-radius: 50%;
    font-size: 1.4rem;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}
.btn-cerrar-modal:hover {
    background: #3F4E26;
    transform: rotate(90deg) scale(1.08);
}
@keyframes slideUp {
    from { opacity: 0; transform: translateY(40px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 768px) {
    .modal-reservas-container {
        width: 100%; height: 100vh; border-radius: 0;
    }
}
