/* Home page styles extracted from resources/views/static/home.blade.php */
.hero-section {
    background-image: url('../images/hero.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (max-width: 768px) {
    .hero-section {
        background-attachment: scroll;
        min-height: 80vh;
        background-position: center top;
    }
}
.hero-overlay { background: rgba(0, 0, 0, 0.4); position: absolute; inset: 0; }
.hero-content { position: relative; z-index: 2; width: 100%; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }

.yellow-banner {
    background-color: #f6e849; color: #36583d; font-family: 'Montserrat', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; padding: 1rem 2rem; border-radius: 4px; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.2); font-size: 1.1rem; line-height: 1.3; max-width: 90%;
}
@media (max-width: 768px) { .yellow-banner { font-size: 0.9rem; padding: 0.8rem 1.5rem; letter-spacing: 0.5px; } }
@media (max-width: 480px) { .yellow-banner { font-size: 0.8rem; padding: 0.7rem 1rem; letter-spacing: 0.3px; } }

.section-title { font-family: 'Montserrat', sans-serif; font-weight: 700; color: #36583d; text-transform: uppercase; letter-spacing: 1px; }
@media (max-width: 768px) { .section-title { font-size: 1.8rem !important; } }
@media (max-width: 480px) { .section-title { font-size: 1.5rem !important; } }

.program-card { position: relative; overflow: hidden; border-radius: 12px; height: 400px; background-size: cover; background-position: center top; background-repeat: no-repeat; transition: transform 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.program-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.2); }

/* Ribbon superiore per sconto e countdown */
.course-top-ribbon { position: absolute; top: 0; left: 0; right: 0; display:flex; justify-content:space-between; align-items:center; padding: 8px 12px; background: rgba(54, 88, 61, 0.85); color: #f6e849; font-family:'Montserrat', sans-serif; font-weight:700; border-radius: 12px 12px 0 0; z-index: 5; }
.course-top-ribbon .r-left, .course-top-ribbon .r-right { font-size: 0.95rem; }
@media (max-width: 480px) { .course-top-ribbon { padding: 6px 10px; } .course-top-ribbon .r-left, .course-top-ribbon .r-right { font-size:0.85rem; } }

/* Responsive program cards */
@media (max-width: 768px) { .program-card { height: 380px; border-radius: 8px; background-position: center center; } }
@media (max-width: 480px) { .program-card { height: 350px; background-position: center top; background-size: cover; } }

/* Specific adjustments for vertical images on mobile */
@media (max-width: 480px) {
    .program-card { aspect-ratio: 4/5; height: auto; min-height: 320px; }
    .program-card[style*="burn-fit.jpg"] { background-position: center 20%; }
    .program-card[style*="booty-boost.jpg"] { background-position: center 30%; }
    .program-card[style*="sculpt-fit.jpg"] { background-position: center 25%; }
    .program-card[style*="personalizzato.jpg"] { background-position: center 35%; }
}

/* Additional tablet optimizations */
@media (min-width: 481px) and (max-width: 768px) { .program-card { aspect-ratio: 3/4; } }

.program-overlay { background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.8) 100%); position: absolute; inset: 0; }
.program-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.5rem; color: white; }
@media (max-width: 480px) { .program-content { padding: 1rem; } }
.program-title { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 1.4rem; text-transform: uppercase; margin-bottom: 0.5rem; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
@media (max-width: 768px) { .program-title { font-size: 1.2rem; } }
@media (max-width: 480px) { .program-title { font-size: 1.1rem; } }
.program-subtitle { font-family: 'Source Sans Pro', sans-serif; font-weight: 400; margin-bottom: 0.25rem; font-size: 1rem; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.program-duration { font-family: 'Source Sans Pro', sans-serif; font-weight: 300; font-size: 0.9rem; margin-bottom: 1rem; opacity: 0.9; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.program-btn { background-color: #36583d; color:white; font-family: 'Montserrat', sans-serif; font-weight:600; text-transform:uppercase; padding:0.7rem 1.2rem; border:none; border-radius:6px; cursor:pointer; transition:all 0.3s ease; text-decoration:none; display:inline-block; font-size:0.8rem; letter-spacing:0.5px; box-shadow:0 2px 8px rgba(0,0,0,0.3); }
.program-btn:hover { background-color:#2a4530; transform: translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.4); }
@media (max-width: 480px) { .program-btn { padding: 0.6rem 1rem; font-size:0.75rem; } }

.body-text { font-family: 'Source Sans Pro', sans-serif; }

/* Grid responsive improvements */
.programs-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:1.5rem; }
@media (min-width: 1200px) { .programs-grid { gap:2rem; } }
@media (max-width: 1023px) { .programs-grid { grid-template-columns: repeat(2, 1fr); gap:1.5rem; } }
@media (max-width: 768px) { .programs-grid { grid-template-columns: repeat(2, 1fr); gap:1rem; } }
@media (max-width: 480px) { .programs-grid { grid-template-columns: 1fr; gap:1rem; } }

/* Section spacing responsive */
.section-spacing { padding: 4rem 0; }
@media (max-width: 768px) { .section-spacing { padding: 3rem 0; } }
@media (max-width: 480px) { .section-spacing { padding: 2rem 0; } }

/* Container responsive */
.container-responsive { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
@media (min-width: 640px) { .container-responsive { padding: 0 1.5rem; } }
@media (min-width: 1024px) { .container-responsive { padding: 0 2rem; } }

/* Workout Options Section */
.workout-options { display:grid; grid-template-columns: 1fr 1fr; gap:0; overflow:hidden; margin: 4rem 0; box-shadow:0 10px 30px rgba(0,0,0,0.1); }
@media (min-width: 769px) { .workout-options { border-radius: 80px 10px 80px 10px; } }
@media (max-width: 768px) { .workout-options { grid-template-columns: 1fr; margin: 2rem 0; border-radius: 20px; } }
.workout-option { position:relative; padding:3rem 2rem; background-size:cover; background-position:center; background-repeat:no-repeat; min-height:300px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.workout-option::before { content:''; position:absolute; inset:0; z-index:1; }
.workout-option-content { position:relative; z-index:2; text-align:left; }
.workout-online { background-image: url('../images/workout-online2.jpg'); }
.workout-online::before { background-color: rgba(54, 88, 61, 0.6); }
.workout-online h3, .workout-online p { color: #f6e849; }
.workout-online .workout-option-btn { background-color: #f6e849; color: #36583d; }
.workout-studio { background-image: url('../images/banner2.jpg'); }
.workout-studio::before { background-color: rgba(246, 232, 73, 0.6); }
.workout-studio h3, .workout-studio p { color: #36583d; }
.workout-studio .workout-option-btn { background-color: #36583d; color: #f6e849; }
.workout-option h3 { font-family:'Montserrat', sans-serif; font-weight: 800; font-size: 3.5rem; text-transform: uppercase; margin-bottom: 1rem; line-height: 1.1; }
.workout-option p { font-family:'Source Sans Pro', sans-serif; margin-bottom:1.5rem; line-height:1.5; font-size:1.1rem; }
.workout-option .workout-option-btn { font-family:'Montserrat', sans-serif; font-weight:600; text-transform:uppercase; padding:0.8rem 1.5rem; border:none; border-radius:50px; text-decoration:none; transition: transform 0.3s ease, background-color 0.3s ease; cursor:pointer; display:inline-block; }
@media (max-width: 768px) { .workout-option h3 { font-size: 2rem; } }
@media (max-width: 480px) { .workout-option h3 { font-size: 1.5rem; } }

/* Emy Section */
.emy-section { background-color: #f8f9fa; padding: 4rem 0; }
@media (max-width: 768px) { .emy-section { padding: 3rem 0; } }
.emy-content { display:grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items:center; }
@media (max-width: 968px) { .emy-content { grid-template-columns: 1fr; gap:2rem; text-align:center; } }
.emy-image { border-radius: 15px; overflow: hidden; box-shadow: 0 15px 35px rgba(0,0,0,0.1); }
.emy-image img { width:100%; height:auto; display:block; }
.emy-text h2 { font-family:'Montserrat', sans-serif; font-weight:700; color:#36583d; font-size:2.2rem; line-height:1.2; margin-bottom:2rem; text-transform:uppercase; }
@media (max-width: 768px) { .emy-text h2 { font-size: 1.8rem; } }
.emy-text p { font-family:'Source Sans Pro', sans-serif; font-size:1.1rem; line-height:1.6; color:#555; margin-bottom:1.5rem; }
.emy-text .highlight { color:#36583d; font-weight:600; }
.emy-btn { background-color:#36583d; color:white; font-family:'Montserrat', sans-serif; font-weight:600; text-transform:uppercase; padding:1rem 2rem; border:none; border-radius:8px; cursor:pointer; transition: all 0.3s ease; text-decoration:none; display:inline-block; font-size:0.9rem; letter-spacing:0.5px; margin-top:1rem; }
.emy-btn:hover { background-color:#2a4530; transform: translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.2); }

/* Video Section */
.video-section { background-color:#36583d; padding:4rem 0; text-align:center; }
@media (max-width: 768px) { .video-section { padding:3rem 0; } }
.video-container { position:relative; max-width:800px; margin:0 auto; border-radius:15px; overflow:hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.3); }
.video-container video { width:100%; height:auto; display:block; }
.video-title { font-family:'Montserrat', sans-serif; font-weight:700; color:#f6e849; font-size:2.5rem; text-transform:uppercase; margin-bottom:2rem; letter-spacing:1px; }
@media (max-width: 768px) { .video-title { font-size:2rem; } }
@media (max-width: 480px) { .video-title { font-size:1.5rem; } }

/* Slider Section */
.slider-section { background-color:white; padding:4rem 0; text-align:center; }
@media (max-width: 768px) { .slider-section { padding:3rem 0; } }
.slider-title { font-family:'Montserrat', sans-serif; font-weight:700; color:#36583d; font-size:2.5rem; text-transform:uppercase; margin-bottom:3rem; letter-spacing:1px; }
@media (max-width: 768px) { .slider-title { font-size:2rem; } }
@media (max-width: 480px) { .slider-title { font-size:1.5rem; } }
.image-slider { position:relative; overflow:hidden; max-width:1200px; margin:0 auto; }
.slider-track { display:flex; transition: transform 0.5s ease; gap:1rem; }
.slider-slide { flex:0 0 auto; width:300px; height:200px; border-radius:12px; overflow:hidden; box-shadow:0 8px 20px rgba(0,0,0,0.1); }
@media (max-width: 768px) { .slider-slide { width:250px; height:167px; } }
@media (max-width: 480px) { .slider-slide { width:200px; height:133px; } }
.slider-slide img { width:100%; height:100%; object-fit:cover; transition: transform 0.3s ease; }
.slider-slide:hover img { transform: scale(1.05); }
.slider-nav { display:flex; justify-content:center; gap:1rem; margin-top:2rem; }
.slider-btn { background-color:#36583d; color:white; border:none; width:50px; height:50px; border-radius:50%; cursor:pointer; transition:all 0.3s ease; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.slider-btn:hover { background-color:#2a4530; transform: scale(1.1); }
.slider-btn:disabled { background-color:#ccc; cursor:not-allowed; transform:none; }

/* Testimonials Section */
.testimonials-section { background-color:#f8f9fa; padding:4rem 0; }
@media (max-width: 768px) { .testimonials-section { padding:3rem 0; } }
.testimonials-title { font-family:'Montserrat', sans-serif; font-weight:700; color:#36583d; font-size:2.2rem; text-transform:uppercase; margin-bottom:3rem; text-align:center; letter-spacing:1px; }
@media (max-width: 768px) { .testimonials-title { font-size:1.8rem; } }
.testimonials-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap:2rem; margin-bottom:3rem; }
.testimonial-card { background:white; padding:2rem; border-radius:15px; box-shadow:0 10px 25px rgba(0,0,0,0.1); text-align:center; position:relative; }
.testimonial-quote { font-family:'Source Sans Pro', sans-serif; font-size:1.1rem; line-height:1.6; color:#555; margin-bottom:1.5rem; font-style:italic; }
.testimonial-author { font-family:'Montserrat', sans-serif; font-weight:600; color:#36583d; font-size:1rem; }
.testimonial-stars { color:#f6e849; font-size:1.2rem; margin-bottom:1rem; }
.testimonials-btn { background-color:#36583d; color:white; font-family:'Montserrat', sans-serif; font-weight:600; text-transform:uppercase; padding:1rem 2rem; border:none; border-radius:8px; cursor:pointer; transition: all 0.3s ease; text-decoration:none; display:block; width:fit-content; margin:0 auto; font-size:0.9rem; letter-spacing:0.5px; }
.testimonials-btn:hover { background-color:#2a4530; transform: translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.2); }

/* Newsletter Section */
.newsletter-section { background-color:#36583d; padding:3rem 0; text-align:center; }
.newsletter-title { font-family:'Montserrat', sans-serif; font-weight:700; color:white; font-size:2rem; text-transform:uppercase; margin-bottom:2rem; letter-spacing:1px; }
@media (max-width: 768px) { .newsletter-title { font-size:1.5rem; } }
.newsletter-form { display:flex; justify-content:center; gap:1rem; max-width:500px; margin:0 auto; }
@media (max-width: 480px) { .newsletter-form { flex-direction:column; gap:1rem; } }
.newsletter-input { flex:1; padding:1rem; border:none; border-radius:8px; font-family:'Source Sans Pro', sans-serif; font-size:1rem; }
.newsletter-btn { background-color:#f6e849; color:#36583d; font-family:'Montserrat', sans-serif; font-weight:700; text-transform:uppercase; padding:1rem 2rem; border:none; border-radius:8px; cursor:pointer; transition: all 0.3s ease; font-size:0.9rem; letter-spacing:0.5px; white-space:nowrap; }
.newsletter-btn:hover { background-color:#f4e030; transform: translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.3); }
