.sna-academy,
.sna-academy * {
    box-sizing: border-box;
}
.sna-academy {
    font-family: "Sen", sans-serif;
    background: #FFF;
    color: #1e2a1c;
    line-height: normal;
}
.sna-academy .swiper-wrapper { height: auto; }
.sna-academy .modal-body a { color: #20662c; }
.sna-academy .main-container { max-width: 1300px; margin: 0 auto; padding: 2.5rem 2rem; }

/* Header */
.sna-academy .academy-header { text-align: center;padding-bottom: 1rem; }
.sna-academy .academy-header h1 {
    font-family: "Tangerine", cursive;
    font-size: 3rem;
    font-weight: 800;
    background: linear-gradient(135deg, #1c6e2f, #4f964b);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    letter-spacing: -0.3px;
    margin: 0 0 12px;
}
.sna-academy .academy-header p {
    color: #4f7350;
    margin-top: 0.5rem;
    border-bottom: 2px solid #cfebc2;
    display: inline-block;
    padding-bottom: 0.3rem;
    margin-bottom: 0;
    font-family: "Sen", sans-serif;
}
.sna-academy .academy-header p + p { display:block; width:max-content; max-width:100%; margin-left:auto; margin-right:auto; }
.sna-academy .academy-header .sub { border-bottom: 2px solid #cfebc2; display: inline-block; padding-bottom: 0.3rem; font-weight: 500; }

/* Optional filters */
.sna-academy .sna-filters input,
.sna-academy .sna-filters select { min-height:40px; border:1px solid #bcddae; background:#fff; color:#2b5e2e; padding:0 14px; font:inherit; border-radius: 6px;}
.sna-academy .sna-filter-search { min-width:230px; }
.sna-academy .timeline.sna-no-results::before { content:'No matching Academy items.'; display:block; text-align:center; color:#6a8e5e; padding:30px 0; }
.sna-academy .timeline.sna-no-results::after { display:none; }
.sna-academy .timeline-item[hidden] { display:none !important; }

/* Timeline */
.sna-academy .timeline { position: relative; margin: 2rem auto; }
.sna-academy .timeline::after {
    content: '';
    position: absolute;
    width: 3px;
    background: linear-gradient(to bottom, #bdd8ae, #6f9e64);
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 3px;
    z-index:0;
}
.sna-academy .timeline-item { position: relative; width: 50%; z-index:1; }
.sna-academy .timeline-item.left { left: 0; padding-right: 2rem; }
.sna-academy .timeline-item.right { left: 50%; padding-left: 2rem; }
.sna-academy .timeline-marker {
    position: absolute;
    width: 20px;
    height: 20px;
    background: #ffffff;
    border: 3px solid #388e3c;
    border-radius: 50%;
    top: 32px;
    z-index: 2;
    box-shadow: 0 0 0 4px #e9f3e3;
}
.sna-academy .left .timeline-marker { right: -10px; }
.sna-academy .right .timeline-marker { left: -10px; }
.sna-academy .timeline-card {
    background: white;
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 12px 24px -12px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease;
    border: 1px solid #e2efda;
}
.sna-academy .timeline-card:hover { transform: translateY(-4px); }
.sna-academy .card-image,
.sna-academy .summary-banner { width: 100%; height: 350px; object-fit: cover; display: block; }
.sna-academy .card-inner { padding: 1.5rem; }
.sna-academy .sna-card-top { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; margin-bottom:10px; gap:8px; }
.sna-academy .generation-badge {
    display: inline-flex;
    align-items:center;
    gap:6px;
    background: #eef5e9;
    color: #2e7d32;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    padding: 0.5rem 1rem;
    border-radius: 40px;
    border:0;
    cursor:pointer;
    font-family:inherit;
}
.sna-academy .card-title { font-size: 1.4rem; font-weight: 700; color: #1b4d23; margin-bottom: 0.6rem; }
.sna-academy .card-description { color: #3a5436; line-height: 1.5; font-size: 0.9rem; margin-bottom: 1.2rem; }
.sna-academy .card-description p { margin:0; }
.sna-academy .readmore-btn {
    font-family: inherit;
    line-height: 1.4;
    background: none;
    border: 1px solid #bcddae;
    padding: 0.5rem 1rem;
    border-radius: 40px;
    font-weight: 600;
    font-size: 0.8rem;
    color: #2a7334;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: 0.2s;
}
.sna-academy .sna-filter-reset{
    border-radius: 6px;
    line-height: 1.7;
}
.sna-academy .readmore-btn:hover { background: #eaf5e4; gap: 12px; }
.sna-academy .timeline-year-large {
    font-size: 2rem;
    font-weight: 800;
    background: linear-gradient(135deg, #2a6e2f, #559c4a);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.sna-academy .fulldetail { margin: auto; text-align: justify; }
.sna-academy .fulldetail p { margin:0 0 1em; }
.sna-academy .fulldetail ul, .sna-academy .fulldetail ol { padding-left:30px; margin:0 0 1em; }
.sna-academy .fulldetail img { max-width:100%; height:auto; }
.sna-academy .fa-quote-left { position: absolute; top: 0; }

/* Modal */
.sna-academy .modal-overlay {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: rgba(20, 30, 10, 0.9);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    opacity: 0;
    transition: 0.2s;
    pointer-events:none;
}
.sna-academy .modal-overlay.active { visibility: visible; opacity: 1; pointer-events:auto; }
.sna-academy .modal-container {
    background: #ffffff;
    width: 100%;
    max-height: 100vh;
    overflow-y: auto;
    box-shadow: 0 40px 50px rgba(0, 0, 0, 0.3);
    animation: snaFadeUp 0.25s ease;
}
@keyframes snaFadeUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.sna-academy .modal-header {
    position: sticky;
    top: 0;
    background: white;
    padding: 1rem 2rem;
    border-bottom: 2px solid #e2f0da;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap:20px;
    z-index: 10;
}
.sna-academy .modal-header h2 { font-size: 1.5rem; font-weight: 700; color: #20662c; margin:0; }
.sna-academy .close-modal { padding:0 ;background: none; border: none; font-size: 1.8rem; cursor: pointer; color: #7e9a72; transition: 0.2s; flex:0 0 auto; }
.sna-academy .close-modal:hover { color: #c73e3e; }
.sna-academy .modal-body { padding: 1rem; overflow-x: hidden; }
.sna-academy .detail-banner { width: 100%; max-height: 512px; object-fit: cover; border-radius: 1rem; margin-bottom: 1.5rem; display:block; }
.sna-academy .detail-full-text {
    position: relative;
    font-size: 1rem;
    line-height: 1.6;
    color: #2b4228;
    margin-bottom: 2rem;
    padding: 1rem 1.2rem;
    border-radius: 1rem;
    border-left: 5px solid #8bc47a;
}
.sna-academy .detail-full-text > .fa-quote-left { color:#7bbd63; margin-right:8px; }
.sna-academy .carousel-section { margin: 2rem 0; border-top: 1px solid #e1e1e1; padding-top: 20px; }
.sna-academy .carousel-section h3 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #2a6b35;
    margin:0 0 1rem;
    border-left: 5px solid #7bb461;
    padding-left: 0.8rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.sna-academy .swiper { padding: 0.5rem 0 2rem; overflow: visible; }
.sna-academy .modal-body > .swiper,
.sna-academy .carousel-section { overflow:hidden; }
.sna-academy .swiper-slide {
    height: auto;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid #e3f0db;
    transition: 0.2s;
}
.sna-academy .position-card-swiper { text-align: center; cursor: pointer; width:100%; }
.sna-academy .position-photo-swiper { width: 100%; height: 200px; object-fit: cover; background: #ddefcf; transition: 0.2s; display:block; }
.sna-academy .position-photo-swiper:hover { opacity: 0.9; transform: scale(1.01); }
.sna-academy .sna-position-meta { display:flex; justify-content:space-between; align-items:center; padding:10px; gap:8px; }
.sna-academy .position-title-swiper { font-weight: 700; font-size: 0.9rem; color: #2b5e2e; text-align:left; }
.sna-academy .position-title-swiper .fa-images { margin-left:6px; font-size:12px; }
.sna-academy .gallery-swiper-slide { cursor: pointer; border-radius: 1rem; overflow: hidden; }
.sna-academy .gallery-swiper-slide img { width: 100%; height: 250px; object-fit: cover; display: block; transition: 0.2s; }
.sna-academy .gallery-swiper-slide img:hover { transform: scale(1.02); }
.sna-academy .swiper-button-next,
.sna-academy .swiper-button-prev {
    top: 40%;
    color: #4f964b;
    background: rgba(255, 255, 255, 0.8);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    --swiper-navigation-size: 18px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.sna-academy .swiper-pagination-bullet-active { background: #4f964b; }
.sna-academy .footnote { font-size: 0.7rem; text-align: center; margin-top: 0.5rem; color: #7d9b70; }
.sna-academy hr { margin: 1rem 0; border:0; border-top:1px solid #dcf0d2; }
.sna-academy .role-badge { display: inline-flex; align-items:center; gap:4px; background: #eef1e6; font-size: 0.7rem; padding: 0.2rem 0.6rem; border-radius: 30px; white-space:nowrap; }
.sna-academy .image-caption { font-size: 0.75rem; text-align: center; padding: 0.4rem; color: #4a6741; background: #f9fdf6; border-top: 1px solid #e3f0db; font-weight: 500; }
.sna-academy .sna-photo-credit { font-size:0.75rem; color:#6a8e5e; text-align:center; margin-bottom:15px; }
.sna-academy .academy_item .swiper-slide { padding:8px; align-items:center; justify-content:center; border:0; }
.sna-academy .academy_item .readmore-btn { width:100%; }
.sna-academy .img-wrapper img { opacity:1; transition:opacity .25s ease; }
html.sna-modal-open, body.sna-modal-open { overflow:hidden !important; }
.fancybox__container { z-index: 200000 !important; }

@media (max-width: 768px) {
    .sna-academy .detail-full-text { padding: 0 0 0 .5rem !important; }
    .sna-academy .card-inner { padding: 1rem; }
    .sna-academy .main-container { padding: 1.2rem; }
    .sna-academy .timeline::after { left: 0; }
    .sna-academy .timeline-item { width: 100%; padding-left: 18px; left: 0 !important; }
    .sna-academy .timeline-item.right { padding-left: 1rem; }
    .sna-academy .left .timeline-marker,
    .sna-academy .right .timeline-marker { left: -10px; right: auto; }
    .sna-academy .timeline-year-large { font-size: 1.6rem; }
    .sna-academy .timeline-item.left { padding-right: 0; }
    .sna-academy .timeline-card { margin-bottom: 1rem; }
    .sna-academy .card-image,
    .sna-academy .summary-banner { height: 200px; }
    .sna-academy .fulldetail { max-width: 100%; margin: auto; text-align: justify; }
    .sna-academy .fa-quote-left { position: absolute; top: 0; }
    .sna-academy .academy-header { margin-bottom: 0; }
    .sna-academy .gallery-swiper-slide img { height: 200px; }
    .sna-academy .swiper-button-next,
    .sna-academy .swiper-button-prev { display: none; }
    .sna-academy .modal-header { padding:1rem; }
}
@media (max-width: 550px) {
    .sna-academy .modal-body { padding: 1rem; }
    .sna-academy .modal-header h2 { font-size: 1.2rem; }
    .sna-academy .sna-card-top { align-items:flex-start; }
    .sna-academy .sna-filters { align-items:stretch; }
    .sna-academy .sna-filters input,
    .sna-academy .sna-filters select,
    .sna-academy .sna-filters .readmore-btn { width:100%; }
}

.sna-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    padding: 1.5rem;
    background: #f8f9fa;
    border-radius: 8px;
    align-items: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Make search input wider */
.sna-filter-search {
    grid-column: span 2;
}

/* Input and Select Styles */
.sna-filter-search,
.sna-filter-year,
.sna-filter-category {
    padding: 0.75rem 1rem;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    font-size: 1rem;
    background: white;
    transition: border-color 0.3s ease;
    width: 100%;
    min-width: 0;
}

.sna-filter-search:focus,
.sna-filter-year:focus,
.sna-filter-category:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0,123,255,0.1);
}

.sna-filter-reset {
    padding: 0.75rem 1.5rem;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.3s ease;
    white-space: nowrap;
}

.sna-filter-reset:hover {
    background: #0056b3;
}

/* Tablet */
@media (max-width: 1024px) {
    .sna-filter-search {
        grid-column: span 1;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .sna-filters {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
        padding: 1rem;
    }
    
    .sna-filter-search {
        grid-column: 1 / -1;
    }
    
    .sna-filter-reset {
        grid-column: 1 / -1;
        width: 100%;
        text-align: center;
    }
}

/* Small Mobile */
@media (max-width: 480px) {
    .sna-filters {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        padding: 0.75rem;
    }
}


/* Download CV */
.sna-academy .sna-cv-download { display:flex; justify-content:center; margin:0 0 2rem; }
.sna-academy .sna-download-cv { text-decoration:none; }
.sna-academy .sna-download-cv .sna-cv-file-label { font-size:.72rem; font-weight:500; opacity:.72; margin-left:4px; max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width: 550px) {
    .sna-academy .sna-download-cv { width:100%; justify-content:center; }
    .sna-academy .sna-download-cv .sna-cv-file-label { max-width:150px; }
}
