@media (max-width: 1024px) {
    .conteiner {
        max-width: calc(100% - 60px);
    }
    .current-agenda-item {
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }
    .agenda-date-wrap {
        width: 100%;
        min-width: 100%;
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .current-agenda-item-detail {
        gap: 0;
        flex-wrap: wrap;
        width: 100%;
        min-width: 100%;
        flex-direction: column-reverse;
    }
    .current-agenda-detail-text {
        flex: auto;
        width: 100%;
    }
    .current-agenda-image {
        width: 100%;
    }
    .current-agenda-image > img {
        width: 100%;
        min-width: 100%;
        height: 450px;
    }
    .agenda-date, .agenda-time {
        font-size: 50px;
    }
    .archive-agenda-item {
        flex-wrap: wrap;
    }
    .agenda-archive-gallery,
    .archive-agendda-detail {
        width: 100%;
    }
    .agenda-archive-gallery > img {
        height: 450px;
    }
    .agenda-experience-wrap {
        margin-top: 100px;
        margin-bottom: 100px;
    }
    .agenda-loop-title {
        font-size: 80px;
        margin-bottom: 20px;
    }
    .agenda-loop-title::before {
        height: 15px;
    }
    .current-agenda-detail-text > p {
        max-width: 100%;
    }
    .current-agenda-loop,
    .archive-agenda-loop {
        margin-top: 50px;
    }
    .agenda-filter-list-wrap {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .archive-agendda-detail {
        flex-wrap: wrap;
        column-gap: 0;
        row-gap: 20px;
    }
    .archive-agenda-text-wrap,
    .archive-agenda-date-wrap {
        flex: 100%;
        width: 100%;
        min-width: 100%;
    }
    .archive-agenda-date-wrap {
        display: flex;
        align-items: center;
        gap: 10px;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
    .current-agenda-detail-text > h3,
    .archive-agenda-text-wrap h3 {
        font-size: 60px;
        line-height: 1;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .current-agenda-detail-text > p,
    .archive-agenda-text-wrap p {
        font-size: 16px;
        line-height: 1.5;
    }
    .agenda-date, .agenda-time,
    .archive-agenda-date-wrap > h3 {
        font-size: 40px;
    }
    .agenda-archive-gallery {
        row-gap: 16px;
    }
    .agenda-experience-text-wrap h3 {
        font-size: 60px;
        line-height: 1;
    }
    .agenda-experience-text-wrap p {
        font-size: 16px;
        line-height: 1.5;
    }
    .agenda-filter-wrap .filter-btn {
        width: 160px;
        font-size: 40px;
    }
    .agenda-filter-wrap .filter-btn svg {
        width: 25px;
    }
    .agenda-loop-title {
        font-size: 50px;
    }
    .agenda-loop-title::before {
        height: 7px;
    }
    .agenda-date-wrap {
        margin-top: 15px;
    }
    .current-agenda-loop-wrap,
    .archive-agenda-loop {
        max-width: 70%;
    }

    .current-agenda-image > img {
        height: 350px;
        border-radius: 20px;
    }
    /* .agenda-archive-gallery > img {
        height: 190px;
    } */
    .spektrum-agenda-page-template {
        margin-top: 50px;
    }
    .agenda-date-wrap {
        order: 10;
        justify-content: space-between;
        margin-top: 0;
        margin-bottom: 15px;
        align-items: flex-end;
    }
    .agenda-time {
        font-size: 25px;
        font-weight: 300;
    }
    .archive-agenda-text-wrap {
        order: 10;
    }
    .archive-agenda-text-wrap h3 {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .archive-agenda-date-wrap > h3 {
        font-weight: 300;
        font-size: 16px;
        line-height: 21px;
    }
    .archive-agendda-detail {
        row-gap: 0;
    }
    .archive-agenda-date-wrap {
        margin-top: 15px;
    }
    .agenda-archive-gallery > img {
        width: 100%;
        border-radius: 20px;
        padding-right: 0;
    }
    .agenda-archive-gallery > img:not(:first-child) {
        display: none;
    }
    .single-agenda__content-area {
        flex-wrap: wrap;
    }
    .single-agenda__left {
        width: 100%;
        padding-right: 0;
        padding-bottom: 50px;
    }
    .single-agenda__right {
        width: 100%;
    }
    .registre-row {
        flex-wrap: wrap;
    }
    .registre-field {
        flex: unset;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .agenda-experience-wrap {
        flex-wrap: wrap;
        row-gap: 20px;
    }
    /* .agenda-archive-gallery > img {
        height: 350px;
    } */
    .agenda-filter-list-wrap {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        column-gap: 0;
        row-gap: 20px;
    }
    .agenda-detail-btn {
        display: none;
    }
    .single-agenda__title {
        font-size: 60px;
    }
    .single-agenda__recent-item img {
        width: 116px;
        min-width: 116px;
        height: 100px;
    }
    .single-agenda__recent-info a {
        font-size: 35px;
    }
    .share-icons a > svg {
        width: 33px;
    }
    .single-agenda__content-area {
        margin: 20px auto;
        padding: 0 20px;
    }
    .single-agenda__meta .meta-title {
        font-size: 12px;
    }
    .single-agenda__meta .meta-value {
        font-size: 16px;
    }
    .single-agenda__meta {
        gap: 40px;
    }
}

@media (max-width: 767px) {
    .current-agenda-loop-wrap,
    .archive-agenda-loop {
        max-width: 100%;
    }
    .single-agenda__hero {
        height: 155px;
    }
    .single-agenda__date {
        font-size: 18px;
        line-height: 1.6;
    }
    .single-agenda__text p {
        font-size: 16px;
        line-height: 1.5;
    }
    .share-section {
        gap: 14px;
    }
    .single-agenda__right-title {
        font-size: 40px;
    }
    .single-agenda__recent-date-row {
        margin-bottom: 5px;
    }
    .single-agenda__recent-date, 
    .single-agenda__recent-time {
        font-size: 16px;
    }
    .single-agenda__promo .promo-box h2 {
        font-size: 40px;
    }
    .single-agenda__promo .promo-box p {
        font-size: 16px;
        line-height: 1.5;
    }
}

@media (max-width: 425px) {
    .agenda-loop-title {
        font-size: 38px !important;        
        margin-bottom: 0 !important;
    }
    .agenda-filter-wrap .filter-btn {
        height: unset;
        width: 125px !important;
        font-size: 30px !important;
        margin: 50px 0 !important;
    }
    .agenda-filter-list-wrap {
        row-gap: 30px !important;
    }
    .agenda-date {
        font-size: 35px !important;
    }
    .agenda-time,
    .archive-agenda-date-wrap {
        font-size: 16px !important;
    }
    .agenda-detail-btn {
        margin-top: 20px !important;
    }
    .archive-agenda-item:not(:last-child) {
        margin-bottom: 80px !important;
    }
    .agenda-experience-icon {
        position: relative;
        /* overflow: hidden; */
        width: 100%;
        height: 377px;
    }
    .agenda-experience-icon img {
        position: absolute;
        top: 0;
        right: -78px;
    }
    .spektrum-agenda-page-template .container {
        overflow: hidden;
    }
    .single-agenda__recent-date-row {
        width: 100%;
    }

  .single-agenda__hero {
    height: auto !important;
    overflow: visible;
  }

  .single-agenda__hero img {
    display: block;
    width: calc(100% - 40px); /* 20px kiri + 20px kanan */
    height: 155px;
    margin: 40px 20px 20px 20px; /* atas kanan bawah kiri */
    object-fit: cover;
    object-position: center;
  }

}