/* templates/core/clases_esqui.html */

.hero-clases {
        background-attachment: fixed;
        background-repeat: no-repeat;
    }

    .hero-clases h1 {
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
    }

    .hero-clases h2 {
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
    }

    .hero-clases .lead {
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
        font-size: 1.1rem;
    }

    .btn-success:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 35px rgba(37, 211, 102, 0.5) !important;
    }

    .btn-outline-light:hover {
        transform: translateY(-3px);
        background: rgba(255, 255, 255, 0.2);
    }

    @media (max-width: 768px) {
        .hero-clases {
            min-height: 65vh;
            padding: 40px 0 !important;
        }

        .hero-clases h1 {
            font-size: 2rem;
        }

        .hero-clases h2 {
            font-size: 1.1rem;
        }

        .hero-clases .lead {
            font-size: 0.95rem;
        }
    }

.booking-btn {
                                position: relative;
                                overflow: hidden;
                                font-weight: 700;
                                letter-spacing: 0.5px;
                                transition: all 0.3s ease;
                                border: none;
                                padding: 1rem 2rem !important;
                                border-radius: 0.5rem;
                            }

                            .booking-btn::before {
                                content: '';
                                position: absolute;
                                top: 0;
                                left: -100%;
                                width: 100%;
                                height: 100%;
                                background: rgba(255, 255, 255, 0.2);
                                transition: left 0.3s ease;
                                z-index: 0;
                            }

                            .booking-btn:hover::before {
                                left: 100%;
                            }

                            .booking-btn-danger {
                                background: linear-gradient(135deg, #800020 0%, #B8002D 100%);
                                color: white;
                                box-shadow: 0 8px 20px rgba(128, 0, 32, 0.3);
                            }

                            .booking-btn-danger:hover {
                                background: linear-gradient(135deg, #B8002D 0%, #800020 100%);
                                transform: translateY(-3px);
                                box-shadow: 0 12px 30px rgba(128, 0, 32, 0.4);
                                color: white;
                            }

                            .booking-btn-primary {
                                background: linear-gradient(135deg, #1E88E5 0%, #1565C0 100%);
                                color: white;
                                box-shadow: 0 8px 20px rgba(30, 136, 229, 0.3);
                            }

                            .booking-btn-primary:hover {
                                background: linear-gradient(135deg, #1565C0 0%, #1E88E5 100%);
                                transform: translateY(-3px);
                                box-shadow: 0 12px 30px rgba(30, 136, 229, 0.4);
                                color: white;
                            }

                            .card-booking {
                                transition: all 0.3s ease;
                                position: relative;
                            }

                            .card-booking:hover {
                                transform: translateY(-8px);
                                box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12) !important;
                            }

                            @media (max-width: 768px) {
                                .booking-btn {
                                    padding: 0.875rem 1.5rem !important;
                                    font-size: 0.95rem;
                                }
                            }