@media (min-width: 1025px) {
	.navbar {
		padding: 16px 80px;
	}

	.section {
		padding: 100px 40px;
	}

	#hero h1 {
		font-size: 4.5rem;
	}

	#hero h2 {
		font-size: 2.2rem;
	}

	.section-title {
		font-size: 3.5rem;
	}

	#quote .quote-block h2 {
		font-size: 3rem;
	}

	#quote blockquote {
		font-size: 2.2rem;
	}
}

@media (max-width: 1024px) {
	.grid-4,
	.stats-grid,
	.series-activity-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.fondasi-cards {
		grid-template-columns: repeat(2, 1fr);
	}

	#quote .visi-photos {
		grid-template-columns: repeat(2, 1fr);
	}

	#quote .visi-misi p {
		text-align: justify;
	}
}

@media (max-width: 768px) {
	html,
	body {
		overflow-x: hidden;
		width: 100%;
		max-width: 100vw;
	}

	.container {
		padding: 0 16px;
	}

	.navbar {
		padding: 14px 20px;
	}

	.nav-links {
		display: none;
	}

	.hamburger {
		display: flex;
	}

	.section-title {
		font-size: 1.8rem;
	}

	#hero {
		min-height: auto;
		padding: 100px 20px 60px;
	}

	#hero h1 {
		font-size: 2.2rem;
	}

	#hero h2 {
		font-size: 1.2rem;
	}

	.hero-cards {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}

	.hero-card {
		min-width: auto;
		width: 100%;
		max-width: 320px;
	}

	.grid-2,
	.grid-3,
	.grid-4,
	.collab-grid,
	.series-activity-grid,
	.fondasi-cards,
	.partner-grid {
		grid-template-columns: 1fr;
	}

	.stats-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.stat-card {
		padding: 16px;
	}

	.stats-grid-single .stat-card {
		min-width: 100% !important;
	}

	#wfby .grid-2,
	#sanghadana-1 .grid-2 {
		grid-template-columns: repeat(2, 1fr);
	}

	.masonry-gallery {
		flex-direction: column;
	}

	.masonry-item .main-img {
		min-height: 250px;
	}

	#quote .visi-misi {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	#quote .visi-misi p {
		text-align: justify;
	}

	#quote .visi-photos {
		grid-template-columns: repeat(2, 1fr);
	}

	#quote blockquote {
		font-size: 1.2rem;
	}

	.timeline::before {
		left: 20px;
	}

	.timeline-item:nth-child(odd),
	.timeline-item:nth-child(even) {
		flex-direction: row;
		padding-right: 0;
		padding-left: 60px;
	}

	.timeline-item::before {
		left: 20px;
		transform: translateX(-50%);
	}

	.waisak-card {
		grid-template-columns: 1fr;
	}

	.latar-header .section-title,
	.sanghadana-header .section-title {
		font-size: 2rem !important;
	}

	.latar-layout,
	.sanghadana-layout {
		gap: 24px;
	}

	#vesak-theme .tema-row,
	#vesak-theme .tema-row.reverse {
		grid-template-columns: 1fr;
		direction: ltr;
	}

	#vesak-time-place .venue-cards {
		grid-template-columns: 1fr;
	}

	/* Diorama mobile */
	.diorama-overview {
		grid-template-columns: 1fr 1fr;
	}

	.diorama-row {
		grid-template-columns: 1fr;
	}

	.diorama-row-2 {
		grid-template-columns: 1fr;
	}

	.diorama-img-wrap.wide {
		aspect-ratio: 16/9;
	}

	.placeholder-img img {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover;
	}

	.series-activity-card .placeholder-img img {
		object-fit: contain;
	}

	.text-justify,
	.latar-layout .latar-text p,
	.sanghadana-layout .sanghadana-text p,
	.tema-content p, .highlight-box
	.diorama-block p {
		text-align: justify;
	}

	.series-activity-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.activity-detail-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}

	.overview-row-split,
	.overview-card-split {
		grid-template-columns: 1fr;
	}

	.ag-sub-row {
		grid-template-columns: 1fr;
	}

	.activity-gallery-2x2 {
		grid-template-columns: 1fr;
	}

	.ag-main .placeholder-img {
		aspect-ratio: 16/9;
	}

	.partner-card-wide {
		flex-direction: column;
	}

	.mcw-content {
		padding: 24px;
	}

	.mcw-image {
		min-height: 200px;
	}

	.table-scroll {
		width: 100%;
		overflow-x: auto;
	}

	.footer-content {
		grid-template-columns: 1fr;
		text-align: center;
		gap: 20px;
		padding: 30px 20px 40px;
	}

	.footer-brand {
		justify-content: center;
	}

	.footer-social {
		justify-content: center;
	}

	/* --- SANGHADANA MOBILE FIX --- */
	.ruler-layout {
		flex-direction: row; /* Forces them side-by-side */
		justify-content: center; /* Centers the whole block */
		align-items: center;
		gap: 35px; /* Adjusts spacing between image and text */
		width: 100%;
	}

	.buddha-jubah-group {
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.img-jubah {
        width: 270px;
        left: 50%;
		transform: translate(-60%, 45%);
		z-index: 10;
    }

	.sanghadana-img-wrap {
        margin-top: 20px;
        align-self: center;
        display: flex;
        flex-direction: row; /* Forces Buddha and text to sit side-by-side */
        justify-content: center; /* Centers the entire group horizontally */
        gap: 35px;
        width: 100%;
        align-items: center;
	}

	.ruler-vertical {
		right: -28px;
	}
	
	.packages-grid {
        grid-template-columns: 1fr;
        justify-items: center; /* Centers the package columns */
	}
	
	.package-col {
        width: 100%;
        max-width: 500px; /* Prevents cards from stretching awkwardly, keeping them centered */
    }

	.sanghadana-title-wrap h2 {
		font-size: 2.8rem;
	}

	.sanghadana-subtitle {
		font-size: 1.2rem !important;
	}

	.promo-gelang-inner {
		grid-template-columns: 1fr 1fr;
		text-align: center;
		padding: 24px;
	}

	.promo-text p {
		font-size: 0.9rem;
	}

	.sanghadana-footer-text {
		flex-direction: column;
		gap: 10px;
		text-align: center;
	}

	.buddha-spec {
        text-align: left; /* Keeps text aligned left for readability */
        margin-bottom: 0;
        margin-left: 0;
	}
	
	.buddha-with-ruler {
        width: 220px; /* Scaled down slightly to fit next to the text on mobile */
        height: 296px;
    }

	.sanghadana-header-area {
		flex-direction: column;
		text-align: center;
		align-items: center;
	}

	.pkg-card h4 {
        font-size: 1.05rem;
        white-space: normal; /* Allows long text to wrap naturally */
        flex-wrap: wrap; /* Allows the price to drop to the next line if needed */
        gap: 8px;
        line-height: 1.4;
    }

    .package-col {
        width: 100%;
        max-width: 100%;
        min-width: 0; /* Crucial: Prevents the column from forcing a horizontal screen overflow */
    }

    .pkg-card {
        padding: 20px 16px; /* Slightly tighter inner padding on mobile to give text more breathing room */
    }

    .pkg-card h4 span {
        font-size: 1.15rem;         /* Scale down the price accordingly */
	}
	
	.diorama-portrait-pair {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .collab-grid, .stats-grid, #sanghadana-1 .grid-2, #wfby .grid-2 {
        grid-template-columns: 1fr;
	}

	.collab-item-1,.collab-item-2,.collab-item-3,.collab-item-4 {
		grid-column: 1;
	}

	#vesak-theme .highlight-box {
		text-align: justify;
	}

	.diorama-portrait-pair {
		gap:48px;
	}

	.promo-gelang-inner {
		grid-template-columns: 1fr;
		padding: 24px;
	}

	.promo-text p {
		font-size: 0.9rem;
	}

	.btn--sanghadana {
		font-size: 1rem;
		padding: 16px 30px;
	}

	.footer-content .footer-links {
		flex-wrap: wrap;
	}

	.buddha-with-ruler {
        width: 160px;
        height: 215px;
    }

    .buddha-spec {
        font-size: 0.85rem;
    }

    .buddha-spec strong {
        font-size: 1.05rem;
    }
}