/* Experiences Styles */

.bhaya-site .experiences-container,
.experiences-container { width: 100% !important; position: relative; padding: 60px 0; margin: 0; }

.bhaya-site .experiences-title,
.experiences-title { text-align: center !important; color: var(--heading-primary, #333333) !important; font-size: 28px !important; font-family: 'KoPub Batang', serif !important; font-weight: 400 !important; line-height: 33.60px !important; word-wrap: break-word; margin-bottom: 67px !important; }

.experiences-slider-wrapper { width: 100%; position: relative; overflow-x: hidden; overflow-y: visible; padding: 0 40px; }
.experiences-slider { display: flex; gap: 36px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; -ms-overflow-style: none; scrollbar-width: none; padding: 20px; width: calc(100% + 36px); }
.experiences-slider::-webkit-scrollbar { display: none; }

.experience-item { width: calc((100% - 72px) / 3); min-width: 490px; flex-shrink: 0; scroll-snap-align: start; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 18px; display: inline-flex; transition: opacity 0.4s ease; }
.experience-image { width: 100%; height: 289px; overflow: hidden; }
.experience-image img { width: 100%; margin-bottom: 18px; height: 100%; object-fit: cover; }

.experience-content { width: 100%; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 18px; }
.experience-title { width: 440px; color: var(--heading-primary, #333333); margin-top:24px; font-size: 20px !important ; font-family: 'KoPub Batang', serif; font-weight: 400; line-height: 24px; word-wrap: break-word; margin: 0; }
.experience-description { width: 453px; color: var(--body-primary, #555555); font-size: 16px; font-family: 'Work Sans', sans-serif; font-weight: 300; line-height: 22.40px; word-wrap: break-word; margin: 0; }

.experience-link { padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--heading-primary, #333333); justify-content: flex-start; align-items: center; gap: 10px; display: inline-flex; }
.experience-link a { color: var(--heading-primary, #333333); font-size: 16px; font-family: 'Work Sans', sans-serif; font-weight: 500; word-wrap: break-word; text-decoration: none; transition: color 0.3s ease; }
.experience-link a:hover { color: #666666; }

.experiences-slider-controls { width: 500px; height: 14px; margin: 0 auto; margin-top: 50px; position: relative; display: flex; align-items: center; justify-content: center; gap: 20px; }
.slider-progress { width: 500px; height: 14px; position: relative; }
.progress-track { width: 100%; height: 0px; position: absolute; top: 14px; outline: 1px #B6B6B6 solid; outline-offset: -0.50px; }
.progress-fill { width: 218px; height: 0px; position: absolute; top: 14px; left: 0px; outline: 1px black solid; outline-offset: -0.50px; transition: width 0.3s ease; }

@media (max-width: 1200px) { .experience-item { min-width: 400px; } .experience-title { width: 100%; } .experience-description { width: 100%; } }
@media (max-width: 768px) { .experiences-container { padding: 0 10px; } .experiences-title { font-size: 24px; margin-bottom: 0px !important; } .experience-item { min-width: 300px; } .experience-image { height: 200px; } .experience-content { height: auto; gap: 15px; } .experiences-slider-controls { width: 100%; max-width: 300px; } .slider-progress { width: 100%; } }