@media only screen and (max-width: 7000px){
	.page-wrapper{
		overflow: hidden;
	}
}

@media only screen and (max-width: 1480px){
	.preloader .icon {
        background-size: 674px auto;
    }
    .preloader .other-icon {
        background-size: 277px auto;
        margin-left: 24px;
    }
}

@media only screen and (max-width: 1023px){
	/* 1. Perbaikan Marquee & Rectangle (Header Top) */
    .live-news {
        height: 40px !important; 
    }

    .live-news .auto-container {
        padding: 0 10px !important;
    }

    /* Rectangle Nama Kabinet di HP */
    .live-news .rectangle {
		top: -4px;
		left: -40px;
        display: flex !important;
        width: 275px !important;
		gap: 7px;
    }

    .live-news .rectangle .rectangle-img {
        display: block !important;
        left: -10px !important;
    }

	.live-news .rectangle .rectangle-shadow {
		left: -1px;
		/* top: -3px; */
	}

    .live-news .rectangle .kabinet-selaras {
        font-size: 12px !important; /* Teks lebih kecil */
        font-weight: 500;
        /* margin-left: 5px; */
		margin-top: 5px;
    }

    .live-news .rectangle .selaras {
        width: 30px;
    	height: 30px;
		margin: 10px -35px 0 0;
    }

    .live-news .marquee span {
        line-height: 40px !important;
        font-size: 13px !important; /* Teks marquee lebih kecil */
        /* padding-left: 170px !important; Sesuaikan dengan lebar rectangle baru */
    }

    /* 2. Perbaikan Header Upper (Logo & Hamburger) */
    .header-upper {
        height: 75px !important;
    }

    .main-header .nav-outer .main-menu,
	.sticky-header{
		display: none !important;
	}

    .main-header .nav-outer .logo-outer img {
        width: 180px !important;
        height: auto !important;
    }

    .main-header .nav-outer .logo-outer {
        /* top: -80% !important; */
        /* transform: translateY(-50%) !important; */
        margin-top: 0 !important;
		left: 30px !important;
    }

    /* 3. Perbaikan Tombol Hamburger */
    .nav-outer .mobile-nav-toggler {
        font-size: 28px !important;
        padding: 0 !important;
        top: 60% !important;
        transform: translateY(-50%) !important;
        right: 50px !important;
    }

	.preloader .icon {
        background-size: 572px auto;
    }
    .preloader .other-icon {
        background-size: 237px auto;
        margin-left: 21px;
    }
	
	.main-header .nav-outer .main-menu,
	.sticky-header{
		display: none !important;
	}

	.nav-outer .mobile-nav-toggler{
		display: block;
		margin: 0;
		padding: 24px 0;
	}
	
	.main-header .header-upper .nav-outer:before{
		display:none;	
	}

	.main-header .dropdown > a > i{
		display: none;
	}
	
	.main-header .nav-outer{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin-left: 10px;
		width:auto;
		float:none;	
	}
	
	.main-header .nav-outer .logo-outer{
		position:relative;
		left:0;
		top: 8px;
		
		width:auto;
		height:auto;
		margin:0;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);	
	}

	.main-header .nav-outer .logo-outer .logo-header {
		transform: translateY(-31%);
	} 

	.nav-outer .mobile-nav-toggler{
		position: absolute;
		right: 10px;
		/* top: 60%; */
		transform: translateY(-58%);
		line-height: 50px;
		display: block;
		margin: 0;
		padding: 24px 0;
	}

	/* =============== section Footer ================ */
    .footer-text{
        display: flex;
        position: relative;
        gap: 60px;
        padding: 20px 20px 0 20px;
    }
    .logo-section{
        margin-left: 0px;
    }
    .section-3{
        margin-top: -20px; 
    }
    .tentang-kami {
        display: flex; justify-content: start;
    }
    .authorized-brand {
		margin-top: -10px;
	}
    .logo-address-group {
		gap: 20px;
        margin-bottom: 10px;
	}
}

@media only screen and (max-width: 768px){
	/* 1. Perbaikan Marquee & Rectangle (Header Top) */
    .live-news {
        height: 35px !important; 
    }

    .live-news .auto-container {
        padding: 0 10px !important;
    }

    /* Rectangle Nama Kabinet di HP */
    .live-news .rectangle {
		top: -5.8px;
		left: -60px;
        display: flex !important;
        width: 240px !important;
		gap: 5px;
    }

    .live-news .rectangle .rectangle-img {
        display: block !important;
        left: -10px !important;
    }

	.live-news .rectangle .rectangle-shadow {
		left: -1px;
	}

    .live-news .rectangle .kabinet-selaras {
        font-size: 10px !important; /* Teks lebih kecil */
        font-weight: 500;
        /* margin-left: 5px; */
    }

    .live-news .rectangle .selaras {
        width: 30px;
    	height: 30px;
		margin: 5px -35px 0 0;
    }

    .live-news .marquee span {
        line-height: 35px !important;
        font-size: 12px !important; /* Teks marquee lebih kecil */
        /* padding-left: 170px !important; Sesuaikan dengan lebar rectangle baru */
    }

    /* 2. Perbaikan Header Upper (Logo & Hamburger) */
    .header-upper {
        height: 65px !important; /* Tinggi header bawah dikurangin drastis */
    }

    .main-header .nav-outer .logo-outer img {
        width: 130px !important; /* Logo dikecilin biar pas */
        height: auto !important;
    }

    .main-header .nav-outer .logo-outer {
        /* top: -50% !important; */
        /* transform: translateY(-50%) !important; */
        margin-top: 3px !important;
		left: -5px !important;
    }

    /* 3. Perbaikan Tombol Hamburger */
    .nav-outer .mobile-nav-toggler {
        font-size: 24px !important;
        padding: 0 !important;
        top: 66% !important;
        transform: translateY(-50%) !important;
        right: 10px !important;
    }

	.preloader .icon {
        background-size: 402px auto;
    }
    .preloader .other-icon {
        background-size: 164px auto;
        margin-left: 14px;
    }

	/* .live-news .rectangle .rectangle-img,
	.live-news .rectangle .sinergis,
	.live-news .rectangle .rectangle-shadow{
		display: none;
	} */

    .back-to-top {
        bottom: 40px; /* Lebih mepet ke bawah */
        right: 30px;  /* Lebih mepet ke kanan */
    }

    .button-back-to-top {
        width: 40px;  /* Kecilin dari 50px ke 40px */
        height: 40px;
        padding: 8px;
    }

    .button-back-to-top .svg {
        width: 18px;  /* Icon juga ikut mengecil biar proporsional */
        height: 18px;
    }

    /* Sembunyikan efek 'Top' di mobile biar nggak menuhi layar pas kena jempol */
    .button-back-to-top::after {
        display: none !important;
    }
}

@media only screen and (max-width: 599px){
	.main-header .header-top .top-left{
		display:none;	
	}
	.main-header .header-top .top-right{
		width:100%;
		text-align:center	
	}
}

/* ============================================================
    RESPONSIVE TEMPLATE (MOBILE-FIRST / min-width)
    Sesuai Standar Breakpoints Tailwind CSS
    ============================================================ */

/* SM Mode: (Tailwind sm: -> 640px) */
@media only screen and (min-width: 640px) {
    .margin-x-section {
        padding-left: 52px;
        padding-right: 52px;
    }

    /* START HERO SECTION */
    .hero-section .hero-btn-group {
        gap: 20px; /* sm:gap-5 (5 * 4 = 20px) */
        width: auto; /* sm:w-auto */
    }
    .btnhero-1 span,
    .btnhero-2 {
        font-size: 14px; /* sm:text-sm */
    }
    .hero-badge-title {
        font-size: 12px;
    }
    .hero-title {
        font-size: 30px;
    }
    .hero-description {
        font-size: 14px;
    }
    /* END HERO SECTION */

    /* START KALENDER SECTION */
    .section-container {
        width: min(100% - 48px, 1240px);
    }
    .section-heading--row {
        flex-direction: row;
        align-items: end;
        justify-content: space-between;
    }
    .upcoming-events {
        grid-auto-columns: minmax(45%, 1fr);
    }
    .carousel-button {
        display: inline-flex;
        position: absolute;
        top: 50%;
        z-index: 3;
        width: 36px;
        height: 36px;
        transform: translateY(-50%);
        align-items: center;
        justify-content: center;
        border: 1px solid var(--border);
        border-radius: 50%;
        background: #092e2a;
        color: var(--text);
        cursor: pointer;
        font-size: 18px;
        /* font-size: 20px; */
    }
    .carousel-button--previous {
        left: -24px;
    }
    .carousel-button--next {
        right: -24px;
        background: var(--color-mainGold);
        color: #082b28;
    }
    .calendar-toolbar {
        flex-direction: row;
        align-items: center;
        /* justify-content: space-between; */
        justify-content: flex-start;
    }
    .calendar-current-title {
        /* text-align: right;  */
        position:absolute;
        left:50%;
        transform:translateX(-50%);
        margin:0;
    }
    #calendar .fc-daygrid-day-frame {
        min-height: 70px;
    }
    .event-dialog__actions {
        flex-direction: row;
    }
    .event-dialog__header {
        padding: 26px 76px 22px 26px;
    }

    .event-dialog__content {
        padding: 28px 26px 30px;
    }

    .event-dialog__datetime,
    .event-dialog__location {
        font-size: 14px;
    }

    .event-dialog__custom-content {
        font-size: 14px;
    }
    /* END KALENDER SECTION */

    /* START PUBLIKASI SECTION */
    .publikasi-image-overlay {
        background: linear-gradient(
            to bottom,
            transparent 0%,
            rgba(30, 60, 57, 0.05) 50%,
            rgb(30, 60, 57) 100%
        );
    }
    .publikasi-pattern {
        top: -200px;
        width: 180px;
    }
    .publikasi-label {
        font-size: 12px;
    }
    .publikasi-title {
        font-size: 18px;
    }
    .publikasi-description {
        font-size: 12px;
    }
    .btn-publikasi {
        padding-top: 6px;
        padding-bottom: 6px;
        margin-top: 24px;
    }
    /* END PUBLIKASI SECTION */

    

    /* START FOOTER */
    .aplikasi-publik {
        display: flex; justify-content: start;
    }
    .media-hp-footer { display: flex; justify-content: center; }
    .align-center-lg { 
        display: flex; justify-content: end; 
    }
    .align-right-lg { 
        margin-left: 0px;
    }
    .site-footer { padding-left: 64px; padding-right: 64px; }
    .footer-logo { width: 260px; }
    .footer-links-grid { grid-template-columns: repeat(3, 1fr); }
    .group-title { font-size: 16px; }
    .group-list li a { font-size: 14px; }
    .copyright-text { font-size: 14px; font-weight: 500; }
    /* END FOOTER */
}

/* MD Mode: (Tailwind md: -> 768px) */
@media only screen and (min-width: 768px) {
    .margin-x-section {
        padding-left: 64px;
        padding-right: 64px;
    }

    /* START HEADER */
    .main-menu{
		width:90%;
	}
	.main-menu .navigation > li > ul,
	.main-menu .navigation > li > ul > li > ul{
		display:block !important;
		visibility:hidden;
		opacity:0;
	}
	.header-top .live-news{
		position: auto;	
	}
    /* END HEADER */

    /* START HERO SECTION */
    .hero-section {
        padding-top: 68px;
    }
    .hero-section .bg-mobile-swap {
        display: none;
    }
    .hero-title {
        max-width: 600px;
    }
    .hero-section .hero-btn-group {
        justify-content: flex-start;
        margin-top: 30px;
    }
    .hero-badge {
        gap: 8px;
    }
    .hero-description {
        margin-top: 28px;
    }
    .btnhero-1 {
        padding-left: 22px;
        padding-right: 22px;
    }
    .btnhero-2 {
        padding-left: 22px; /* lg:px-5.5 (5.5 * 4 = 22px) */
        padding-right: 22px;
    }
    .btnhero-1 svg {
        width: 17px;
        height: 17px;
    }
    /* END HERO SECTION */

    /* START KALENDER SECTION */
    .section-heading h2 {
        font-size: 28px;
    }
    .section-link-mobile {
        display: none;
    }
    .section-link {
        width: fit-content;
        color: var(--text);
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
        color: var(--color-mainGold);
        font-family: var(--font-montserrat);
        display: block;
    }

    .section-link:hover {
        color: var(--color-darkGold);
    }
    .section-link span {
        margin-right: 4px;
    }
    .section-eyebrow {
        font-size: 12px;
    }
    .upcoming-section,
    .calendar-section {
        padding-block: 80px;
    }
    .upcoming-events {
        /* grid-auto-flow: initial;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        padding-bottom: 4px; */

        /* grid-auto-flow: column; */
        grid-template-columns: none;
        grid-auto-columns: calc((100% - 13px) / 2);
        /* overflow-x: auto; */
        overflow-y: hidden;
        padding-bottom: 14px;
    }
    .upcoming-card {
        min-height: 270px;
    }
    .upcoming-card__time,
    .upcoming-card__location {
        margin: 0;
        color: var(--text-muted);
        font-size: 12px;
    }
    .upcoming-card__location {
        margin-bottom: 8px;
    }
    .upcoming-card h3 {
        margin: 4px 0 8px 0;
        font-size: 16px;
    }
    .date-badge {
        width: 42px;
        min-height: 42px;
    }
    .date-badge strong {
        font-size: 16px;
    }
    .date-badge span {
        margin-top: 2px;
        font-size: 10px;
        font-weight: 600;
    }
    .month-empty-state {
        font-size: 13px;
    }
    .calendar-current-title {
        font-size: 17px;
    }
    #calendar .fc-daygrid-day-events {
        display: block;
        min-height: 42px;
        margin: 0 5px 4px;
    }
    #calendar .fc-daygrid-day-frame {
        min-height: 100px;
    }
    #calendar .fc-daygrid-day-number {
        width: 31px;
        height: 31px;
        font-size: 12px;
    }
    .mobile-day-dots {
        display: none;
    }
    #calendar .fc-daygrid-event {
        margin-top: 3px;
        overflow: hidden;
        border: 0;
        border-radius: 7px;
        background: color-mix(in srgb, var(--event-color) 72%, #062b27);
        box-shadow: inset 3px 0 0 var(--event-color);
    }
    .fc-custom-event {
        display: grid;
        min-width: 0;
        /* gap: 1px; */
        gap: 0px;
        /* padding: 5px 6px; */
        padding: 1px 6px;
        color: #fff;
        cursor: pointer;
    }
    .fc-custom-event__title,
    .fc-custom-event__time {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .fc-custom-event__title {
        font-size: 9px;
        font-weight: 700;
    }
    .fc-custom-event__time {
        font-size: 8px;
        opacity: 0.8;
    }
    #calendar .fc-more-link {
        color: var(--gold-bright);
        font-size: 9px;
        font-weight: 700;
    }
    #calendar .fc-col-header-cell-cushion {
        font-size: 12px;
    }
    .category-legend {
        font-size: 13px;
        gap: 5px 20px;
    }
    .agenda-panel {
        padding: 24px;
    }
    .agenda-panel__heading {
        margin-bottom: 15px;
    }
    .agenda-panel h3 {
        font-size: 20px;
    }
    .event-dialog {
        width: min(calc(100% - 64px), 760px);
        max-height: min(calc(100dvh - 64px), 820px);
        margin: auto;
        border-radius: 15px;
    }
    .event-dialog__card {
        max-height: min(calc(100dvh - 64px), 820px);
    }
    .event-category-badge {
        padding: 6px 12px;
        font-size: 10px;
    }
    .event-dialog__category {
        gap: 8px;
    }
    .event-dialog__organizer {
        font-size: 13px;
    }
    .event-dialog__card {
        max-height: min(88dvh, 820px);
    }
    .event-dialog__header {
        padding: 22px 84px 20px 30px;
    }
    .event-dialog__content {
        padding: 32px 30px 34px;
    }
    .event-dialog__location {
        font-size: 14px;
    }
    .event-dialog__custom-content {
        font-size: 15px;
    }
    .primary-button,
    .secondary-button {
        font-size: 15px;
    }
    /* END KALENDER SECTION */

    /* START PUBLIKASI SECTION */
    .publikasi-pattern {
        top: -250px;
        width: 200px;
    }
    .publikasi-image-wrapper {
        min-height: 160px;
    }
    .publikasi-image-badge-icon {
        width: 32px;
        height: 32px;
    }
    .publikasi-label {
        font-size: 14px;
    }
    .btn-publikasi span {
        font-size: 14px; /* sm:text-sm */
    }
    /* END PUBLIKASI SECTION */

    /* START FOOTER */
    .align-center-lg { 
        display: flex; justify-content: end; 
    }
    .media-hp-footer { margin-left: 0px; }
    .aplikasi-publik { margin-left: 0px; }
    .group-title { font-size: 18px; font-weight: 600; margin-bottom: 20px; }
    .group-list li a { font-size: 14px; margin-bottom: 10px; }
    /* END FOOTER */
}

/* LG Mode: (Tailwind lg: -> 1024px) */
@media only screen and (min-width: 1024px) {
    .margin-x-section {
        padding-left: 80px;
        padding-right: 80px;
    }

    /* START HERO SECTION */
    .hero-title {
        max-width: 100%;
    }
    .btnhero-1 {
        padding-left: 22px;
        padding-right: 22px;
        padding-top: 10px; /* xl:py-2.5 (2.5 * 4 = 10px) */
        padding-bottom: 10px;
    }
    .btnhero-2 {
        padding-left: 22px; /* lg:px-5.5 (5.5 * 4 = 22px) */
        padding-right: 22px;
        padding-top: 10px; /* xl:py-2.5 (2.5 * 4 = 10px) */
        padding-bottom: 10px;
    }
    .hero-container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .hero-content {
        align-items: flex-start;
        text-align: left;
    }
    .hero-title {
        font-size: 36px;
    }
    .hero-description {
        width: 100%;
        font-size: 16px;
    }
    .hero-mobile-graphic-wrapper {
        display: none;
    }
    .hero-desktop-graphic-wrapper {
        display: flex;
        justify-content: flex-end;
    }
    .hero-desktop-graphic {
        width: 70%;
    }
    /* END HERO SECTION */

    /* START KALENDER SECTION */
    .carousel-button {
        width: 42px;
        height: 42px;
        font-size: 20px;
    }
    .carousel-button--previous {
        left: -25px;
    }
    .carousel-button--next {
        right: -25px;
    }
    .upcoming-events {
        /* grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px; */

        /* grid-auto-flow: column; */
        /* grid-template-columns: none; */
        grid-auto-columns: calc((100% - 40px) / 3);
        gap: 20px;
        /* overflow-x: auto; */
        overflow-y: hidden;
    }
    .calendar-toolbar {
        padding: 22px 26px;
    }
    .calendar-layout {
        grid-template-columns: minmax(0, 1.8fr) minmax(300px, 0.8fr);
    }
    .calendar-main-column {
        padding: 24px;
    }
    .agenda-panel {
        border-top: 0;
        border-left: 1px solid var(--border);
    }
    .agenda-panel__heading {
        margin-bottom: 20px;
    }
    .calendar-current-title {
        font-size: 20px;
    }
    #calendar .fc-daygrid-day-frame {
        min-height: 112px;
    }
    .agenda-item {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }
    .agenda-item > .event-category-badge {
        grid-column: auto;
    }
    .event-dialog h2 {
        font-size: 23px;
    }
    /* END KALENDER SECTION */
    
    /* START PUBLIKASI SECTION */
    .publikasi-pattern {
        top: -300px;
        width: 230px;
    }
    .publikasi-container {
        flex-direction: row;
    }
    .publikasi-image-wrapper {
        width: auto;
        flex: 4;
        min-height: 100%;
    }
    .publikasi-image-badge {
        top: 32px;
        right: 32px;
        left: auto;
        padding: 10px;
        border-radius: 16px;
    }
    .publikasi-image-overlay {
        background: linear-gradient(
            to right,
            transparent 0%,
            rgba(16, 42, 39, 0.2) 50%,
            rgb(16, 42, 39) 100%
        );
    }
    .publikasi-content {
        width: auto;
        flex: 6;
        padding-top: 36px;
        padding-bottom: 36px;
        padding-right: 48px;
    }
    .publikasi-label {
        font-size: 16px;
    }
    .publikasi-title {
        font-size: 24px;
    }
    .publikasi-description {
        margin-top: 20px;
        font-size: 14px;
    }
    .btn-publikasi {
        padding-left: 22px;
        padding-right: 22px;
        margin-top: 44px;
    }
    .btn-publikasi span {
        font-size: 14px;
    }
    /* END PUBLIKASI SECTION */

    /* START BACK TO TOP BUTTON */
    .back-to-top {
        bottom: 50px; 
        right: 40px; 
    }
    /* END BACK TO TOP BUTTON */

    /* START FOOTER */
    .site-footer { padding-top: 48px; padding-bottom: 44px; padding-left: 80px; padding-right: 80px; }
    .footer-main-row { flex-direction: row; justify-content: space-between; }
    
    .footer-brand-col { width: 33.33%; margin-top: 0; }
    .brand-content { align-items: flex-start; }
    .logo-address-group { align-items: flex-start; }
    .footer-address { text-align: left; }
    
    .footer-grid-col { width: 66.66%; }
    .footer-links-grid { grid-template-columns: repeat(4, 1fr); }
    
    .align-center-lg { display: flex; justify-content: center; }
    .align-right-lg { display: flex; justify-content: end; }
    .media-hp-footer { display: flex; justify-content: center; }
    
    .footer-bottom { padding-top: 32px; gap: 10px; }
    .mini-logo { width: 40px; height: 40px; }
    /* END FOOTER */
}

/* XL Mode: (Tailwind xl: -> 1280px) */
@media only screen and (min-width: 1280px) {
    .margin-x-section {
        padding-left: 92px;
        padding-right: 92px;
    }

    /* START HERO SECTION */
    .hero-title {
        max-width: 95%;
    }
    .hero-badge {
        padding-left: 16px;
        padding-right: 16px;
        padding-top: 7px;
        padding-bottom: 7px;
    }
    .hero-badge-icon {
        width: 16px;
        height: 16px;
    }
    .hero-title {
        font-size: 40px;
    }
    .hero-desktop-graphic-wrapper {
        justify-content: center;
    }
    .hero-desktop-graphic {
        width: 65%;
    }
    /* END HERO SECTION */

    /* START KALENDER SECTION */
    .section-heading h2 {
        font-size: 36px;
    }
    .section-eyebrow {
        font-size: 13px;
    }
    .upcoming-section,
    .calendar-section {
        padding-block: 96px;
    }
    .upcoming-card h3 {
        margin: 8px 0 8px 0;
        font-size: 18px;
    }
    .section-heading {
        margin-bottom: 34px;
    }
    .section-link {
        font-size: 17px;
    }
    .upcoming-card {
        min-height: 290px;
    }
    .calendar-main-column {
        padding: 30px;
    }
    .agenda-panel {
        padding: 30px 24px;
    }
    #calendar .fc-daygrid-day-frame {
        min-height: 124px;
    }
    .fc-custom-event__title {
        font-size: 10px;
    }
    .fc-custom-event__time {
        font-size: 9px;
    }
    /* END KALENDER SECTION */

    /* START PUBLIKASI SECTION */
    .publikasi-pattern {
        top: -320px;
        width: 250px;
    }
    .btn-publikasi {
        padding-top: 8px; /* xl:py-2.5 (2.5 * 4 = 8px) */
        padding-bottom: 8px;
    }
    /* END PUBLIKASI SECTION */
    
    /* START FOOTER */
    .site-footer { 
        padding-left: 92px;
        padding-right: 92px;
    }
    /* END FOOTER */
}

/* 2XL Mode: (Tailwind 2xl: -> 1536px) */
@media only screen and (min-width: 1536px) {
    .margin-x-section {
        padding-left: 180px;
        padding-right: 180px;
    }
    
    /* START HERO SECTION */
    .btnhero-1 {
        padding-top: 10px; /* xl:py-2.5 (2.5 * 4 = 10px) */
        padding-bottom: 10px;
    }
    .btnhero-1 span {
        font-size: 16px;
    }
    .btnhero-2 {
        padding-top: 10px; /* xl:py-2.5 (2.5 * 4 = 10px) */
        padding-bottom: 10px;
        font-size: 16px; /* lg:text-base */
    }
    .hero-title {
        font-size: 60px;
    }
    .hero-badge {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    .hero-badge-title {
        font-size: 14px;
    }
    .hero-badge-icon {
        width: 20px;
        height: 20px;
    }
    .hero-description {
        font-size: 18px;
    }
    .hero-desktop-graphic {
        width: 75%;
    }
    /* END HERO SECTION */

    /* START KALENDER SECTION */
    .section-container {
        width: min(100% - 64px, 1360px);
    }
    .upcoming-card {
        min-height: 310px;
    }
    .calendar-current-title {
        font-size: 23px;
    }
    #calendar .fc-daygrid-day-frame {
        min-height: 138px;
    }
    .section-eyebrow {
        font-size: 14px;
    }
    .event-dialog h2 {
        font-size: 26px;
    }
    .agenda-panel h3 {
        font-size: 22px;
    }
    /* END KALENDER SECTION */

    /* START PUBLIKASI SECTION */
    .publikasi-content {
        padding-top: 56px;
        padding-bottom: 56px;
    }
    .publikasi-pattern {
        top: -400px;
        width: 300px;
    }
    .publikasi-image-badge {
        top: 48px;
    }
    .publikasi-label {
        font-size: 18px;
        letter-spacing: 0em;
    }
    .publikasi-title {
        font-size: 32px;
    }
    .publikasi-description {
        margin-top: 20px;
        font-size: 16px;
    }
    .btn-publikasi span {
        font-size: 16px;
    }
    /* END PUBLIKASI SECTION */

    /* START FOOTER */
    .site-footer { 
        padding-left: 180px;
        padding-right: 180px;
    }
    /* END FOOTER */
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}