/* ==========================================================================
   Gaya seluruh situs: header, mode landing page, dan tombol WhatsApp.
   ========================================================================== */

/* Navbar bergaya Alchemist: putih, logo dan menu gelap, garis tipis di
   bawahnya, dan tetap menempel di atas saat di-scroll (bar pengumuman di
   atasnya ikut tergulung).

   Bawaan template: logo dan menu putih dengan latar transparan, supaya
   pas menimpa foto hero di beranda. Di halaman berlatar putih itu membuat
   navbar tidak terlihat sampai di-scroll.

   - Beranda: transparan di atas foto hero, putih setelah di-scroll
     (Elementor menambahkan kelas .elementor-sticky--effects saat itu).
   - Halaman lain: putih sejak awal. */
body:not(.home) .elementor-location-header .sticky-menu,
.elementor-location-header .sticky-menu.elementor-sticky--effects {
	background-color: #fff !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
	box-shadow: none !important;
}

/* Saat di-scroll, navbar Alchemist berubah jadi putih agak tembus pandang
   dengan blur, sehingga warna foto di belakangnya samar terlihat. Aturan ini
   ditulis setelah aturan di atas dengan spesifisitas yang sama supaya
   menang di semua halaman. */
body .elementor-location-header .sticky-menu.elementor-sticky--effects {
	background-color: rgba(255, 255, 255, 0.82) !important;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

/* Logo di template berwarna putih. Dibalik jadi hitam saat latarnya putih. */
body:not(.home) .elementor-location-header .elementor-element-7e43780c img,
.elementor-location-header .sticky-menu.elementor-sticky--effects .elementor-element-7e43780c img {
	filter: invert(1);
}

/* Menu utama (desktop) dan tombol menu (HP) menjadi gelap. Menu dropdown di
   HP punya latar sendiri, jadi sengaja tidak diubah. */
body:not(.home) .elementor-location-header .elementor-nav-menu--main .elementor-item,
.elementor-location-header .sticky-menu.elementor-sticky--effects .elementor-nav-menu--main .elementor-item {
	color: #111 !important;
}

body:not(.home) .elementor-location-header .elementor-menu-toggle,
.elementor-location-header .sticky-menu.elementor-sticky--effects .elementor-menu-toggle {
	color: #111 !important;
}

body:not(.home) .elementor-location-header .elementor-menu-toggle svg,
.elementor-location-header .sticky-menu.elementor-sticky--effects .elementor-menu-toggle svg {
	fill: #111 !important;
}

/* Mode landing page: sembunyikan ikon keranjang dan akun di header.
   Widget ini ada di template Header Elementor, dan dikenali lewat ID-nya.
   Kalau mode dimatikan di Pengaturan, ikon tampil lagi. */
body.ewu-no-commerce .elementor-location-header .elementor-element-ba8e919,
body.ewu-no-commerce .elementor-location-header .elementor-element-6d979662 {
	display: none !important;
}

/* Logo di footer menggantikan tulisan "EndWithUs". */
.ewu-footer-logo {
	display: inline-block;
	line-height: 0;
}

.ewu-footer-logo img {
	display: block;
	width: 210px;
	max-width: 100%;
	height: auto;
}

/* Template footer memberi padding atas 96px, padahal isinya cuma sekitar
   160px, jadi footer terlihat terlalu tinggi dan banyak ruang kosong.
   Kontainer isinya juga digeser naik 64px dengan margin negatif (diimbangi
   padding itu), jadi margin ini dinolkan supaya isi tidak terpotong. */
.elementor-location-footer > .elementor-section {
	padding-top: 40px !important;
	padding-bottom: 20px !important;
}

.elementor-location-footer .e-con {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

@media (max-width: 767px) {
	.elementor-location-footer > .elementor-section {
		padding-top: 32px !important;
		padding-bottom: 16px !important;
	}
}

/* Tulisan footer yang dijadikan tautan mengikuti warna teksnya. */
.elementor-location-footer .ewu-footer-link {
	color: inherit;
	text-decoration: none;
}

.elementor-location-footer .ewu-footer-link:hover,
.elementor-location-footer .ewu-footer-link:focus-visible {
	text-decoration: underline;
}

/* Cadangan: kalau masih ada tombol keranjang bawaan yang lolos di mode
   landing page, sembunyikan. */
body.ewu-no-commerce .add_to_cart_button,
body.ewu-no-commerce .ajax_add_to_cart,
body.ewu-no-commerce .single_add_to_cart_button {
	display: none !important;
}

/* Tombol WhatsApp melayang: putih bersih dengan ikon hijau, satu bahasa dengan
   tombol marketplace. Di HP hanya ikon hijau. */
.ewu-wa {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9990;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px 8px 8px;
	border: 1px solid #d6d2ca;
	border-radius: 12px;
	background: #fff;
	color: #111;
	text-decoration: none;
	box-shadow: 0 10px 26px -12px rgba(0, 0, 0, 0.35);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.ewu-wa:hover,
.ewu-wa:focus-visible {
	transform: translateY(-2px);
	border-color: #25d366;
	background: #25d366;
	box-shadow: 0 14px 28px -12px rgba(37, 211, 102, 0.6);
	text-decoration: none;
}

/* Tema memberi warna abu pada semua tautan, jadi warna dikunci dengan !important. */
.ewu-wa,
.ewu-wa:visited,
.ewu-wa .ewu-wa__label {
	color: #111 !important;
}

.ewu-wa:hover,
.ewu-wa:hover .ewu-wa__label,
.ewu-wa:focus-visible,
.ewu-wa:focus-visible .ewu-wa__label {
	color: #fff !important;
}

/* Ikon di kotak kecil hijau, seperti ubin logo di tombol marketplace. */
.ewu-wa__icon {
	display: block;
	flex: none;
	width: 32px;
	height: 32px;
	padding: 6px;
	border-radius: 8px;
	background: #25d366;
	box-sizing: border-box;
	color: #fff !important;
	transition: background-color 0.2s ease;
}

.ewu-wa:hover .ewu-wa__icon,
.ewu-wa:focus-visible .ewu-wa__icon {
	background: rgba(255, 255, 255, 0.22);
}

/* Label hanya muncul di layar lebar, supaya tidak menutupi konten di HP. */
.ewu-wa__label {
	display: none;
	font-family: "Poppins", system-ui, sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-transform: none;
	white-space: nowrap;
}

@media (min-width: 1025px) {
	.ewu-wa__label {
		display: inline;
	}
}

/* HP: hanya ikon, jadi tombol berupa kotak hijau kecil. */
@media (max-width: 1024px) {
	.ewu-wa {
		padding: 10px;
		border-color: #25d366;
		background: #25d366;
		border-radius: 14px;
	}

	.ewu-wa__icon {
		width: 28px;
		height: 28px;
		padding: 0;
		background: transparent;
	}
}

@media (max-width: 480px) {
	.ewu-wa {
		right: 14px;
		bottom: 14px;
	}
}

@media print {
	.ewu-wa {
		display: none;
	}
}

/* Navbar menempel di atas konten (tidak punya tinggi sendiri), jadi judul
   halaman arsip/kategori produk tertutup. Beri ruang di atasnya. */
body.archive.woocommerce .woocommerce-products-header,
body.post-type-archive-product .woocommerce-products-header {
	padding-top: 90px;
}

/* Banner beranda: foto portrait ditaruh utuh di sisi kanan (tidak dipotong),
   sedangkan teks dan tombol berada di kiri di atas latar gelap. */
.elementor-widget-slides .elementor-slides .swiper-slide-bg {
	background-repeat: no-repeat;
	background-position: right center !important;
}

/* Efek zoom (Ken Burns) dimatikan supaya foto tidak membesar dan terpotong. */
.elementor-widget-slides .elementor-ken-burns--active {
	transform: none !important;
	transition: none !important;
}

/* Slide "Second Wind", "After You", dan "Sempat Hadir Sejenak" memakai foto landscape penuh (bukan portrait di kanan). */
.elementor-widget-slides .elementor-slides .elementor-repeater-item-0087e6c .swiper-slide-bg,
.elementor-widget-slides .elementor-slides .elementor-repeater-item-07f57bb .swiper-slide-bg,
.elementor-widget-slides .elementor-slides .elementor-repeater-item-51b6cdf .swiper-slide-bg {
	background-size: cover !important;
	background-position: center center !important;
}

@media (max-width: 767px) {
	/* Di HP, foto memenuhi banner (seperti desktop); lapisan gelap di bawah agar teks terbaca. */
	.elementor-widget-slides .swiper-slide-inner::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(to top, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.55) 45%, rgba(0, 0, 0, 0) 80%);
		pointer-events: none;
	}
}

/* Logo navbar di HP: bawaannya selebar ~146px sehingga terlalu besar untuk
   bar setinggi 54px. Diperkecil agar proporsional seperti navbar Alchemist. */
@media (max-width: 767px) {
	.elementor-location-header .elementor-element-7e43780c img {
		width: 104px !important;
		height: auto !important;
	}

	/* Logo rata kiri sejajar dengan margin halaman (bawaan template menggesernya ke tengah). */
	.elementor-location-header .elementor-element-3ce69c14 {
		padding-left: 0 !important;
	}

	.elementor-location-header .elementor-element-bad26e9 {
		align-items: flex-start !important;
	}
}

/* ==========================================================================
   Halaman "Find Us" (event offline, spot display, dan beli online)
   Tata letak ala editorial: hero dua kolom, lalu tiap bagian dibagi dua
   (label di kiri, isi di kanan).
   ========================================================================== */

/* Judul halaman sudah ada di dalam konten, jadi judul bawaan tema disembunyikan. */
body.page-id-1338 .page-header {
	display: none;
}

.ewu-find {
	max-width: 1180px;
	margin: 0 auto;
	padding: 130px 32px 90px;
	color: #111;
}

.ewu-find a {
	color: inherit;
}

/* --- Hero --- */
.ewu-find__hero {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 64px;
	align-items: center;
	margin-bottom: 96px;
}

.ewu-find__eyebrow {
	margin: 0 0 18px;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	opacity: 0.55;
}

body .ewu-find .ewu-find__title {
	margin: 0 0 20px;
	font-size: clamp(52px, 8vw, 96px);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.01em;
}

.ewu-find__lead {
	margin: 0 0 32px;
	max-width: 440px;
	font-size: 18px;
	line-height: 1.65;
	opacity: 0.75;
}

.ewu-find__hero-img {
	margin: 0;
}

.ewu-find__hero-img img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	max-height: 560px;
	object-fit: cover;
	object-position: 50% 30%;
	border-radius: 2px;
}

/* --- Bagian: label kiri, isi kanan --- */
.ewu-find__section {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 48px;
	padding: 44px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.14);
}

body .ewu-find .ewu-find__section h2 {
	margin: 4px 0 0;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.ewu-find__body > :first-child {
	margin-top: 0;
}

.ewu-find__text {
	margin: 0 0 22px;
	max-width: 560px;
	font-size: 17px;
	line-height: 1.7;
}

.ewu-find__empty {
	padding: 26px 28px;
	background: #f4f3f0;
	border-radius: 2px;
}

.ewu-find__empty p {
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	opacity: 0.8;
}

.ewu-find__text + .ewu-find__empty {
	margin-top: 4px;
}

/* --- Kartu event / spot --- */
.ewu-find__cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
}

.ewu-find__card {
	padding: 24px 26px;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: 2px;
}

.ewu-find__card h3 {
	margin: 6px 0 8px;
	font-size: 19px;
	font-weight: 500;
}

.ewu-find__card p {
	margin: 0 0 12px;
	font-size: 15px;
}

.ewu-find__date {
	margin: 0;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	opacity: 0.6;
}

/* Teks dua bahasa untuk tanggal dan nama tempat di kartu event, supaya
   tidak bergantung pada kamus otomatis. Bahasa dipilih dari <html data-ewu-lang>. */
.ewu-bi__en {
	display: none;
}

html[data-ewu-lang="en"] .ewu-bi__en {
	display: inline;
}

html[data-ewu-lang="en"] .ewu-bi__id {
	display: none;
}

/* --- Galeri --- */
.ewu-find__gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.ewu-find__gallery figure {
	margin: 0;
}

.ewu-find__gallery img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 2px;
}

/* --- Tombol --- */
.ewu-find__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.ewu-find .ewu-find__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 160px;
	min-height: 50px;
	padding: 12px 26px;
	border: 1px solid #111;
	border-radius: 10px;
	font-family: var(--ewu-sans, "Poppins", sans-serif);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-transform: none;
	text-decoration: none;
	color: #111;
	background: transparent;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.ewu-find .ewu-find__btn:hover,
.ewu-find .ewu-find__btn:focus-visible,
.ewu-find .ewu-find__btn--solid {
	background: #111;
	color: #fff;
	text-decoration: none;
}

.ewu-find .ewu-find__btn--solid:hover,
.ewu-find .ewu-find__btn--solid:focus-visible {
	background: #000;
}

/* --- Tablet dan HP --- */
@media (max-width: 900px) {
	.ewu-find {
		padding: 104px 20px 64px;
	}

	.ewu-find__hero {
		grid-template-columns: 1fr;
		gap: 36px;
		margin-bottom: 64px;
	}

	.ewu-find__hero-img img {
		aspect-ratio: 4 / 3;
		max-height: none;
		object-position: 50% 35%;
	}

	.ewu-find__section {
		grid-template-columns: 1fr;
		gap: 18px;
		padding: 34px 0;
	}
}

@media (max-width: 767px) {
	.ewu-find .ewu-find__btn {
		flex: 1 1 100%;
	}

	.ewu-find__gallery {
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}
}

/* Beranda, bagian "Explore More": tiga kartu foto. Link dipasang di judul
   (widget Icon Box), lalu diregangkan sampai menutupi seluruh kartu supaya
   seluruh kartu bisa diklik. Widget dibuat position: static agar ::after
   mengacu ke kartunya (container, yang sudah position: relative). */
.elementor-element-9cff34d .elementor-widget-icon-box,
.elementor-element-ec0ac09 .elementor-widget-icon-box,
.elementor-element-ac9c3f4 .elementor-widget-icon-box,
.elementor-element-9cff34d .elementor-widget-icon-box .elementor-widget-container,
.elementor-element-ec0ac09 .elementor-widget-icon-box .elementor-widget-container,
.elementor-element-ac9c3f4 .elementor-widget-icon-box .elementor-widget-container {
	position: static;
}

.elementor-element-9cff34d .elementor-icon-box-title a::after,
.elementor-element-ec0ac09 .elementor-icon-box-title a::after,
.elementor-element-ac9c3f4 .elementor-icon-box-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
}

/* Tulisan judul tetap putih dan tidak bergaris bawah saat disorot. */
.elementor-element-9cff34d .elementor-icon-box-title a,
.elementor-element-ec0ac09 .elementor-icon-box-title a,
.elementor-element-ac9c3f4 .elementor-icon-box-title a {
	color: inherit;
	text-decoration: none;
}

/* Widget teks di kartu tadi dibuat static, jadi lapisan gelap (overlay) foto
   yang position: absolute akan menutupi teks. Overlay diturunkan ke belakang
   teks (z-index negatif di dalam container yang dibuat stacking context). */
.elementor-element-9cff34d,
.elementor-element-ec0ac09,
.elementor-element-ac9c3f4 {
	isolation: isolate;
}

.elementor-element-9cff34d::before,
.elementor-element-ec0ac09::before,
.elementor-element-ac9c3f4::before {
	z-index: -1 !important;
}

/* Logo WhatsApp di dalam tombol Find Us (mengikuti warna tulisan tombol). */
.ewu-find .ewu-find__btn .ewu-find__btn-icon {
	flex: none;
	width: 20px;
	height: 20px;
	margin-right: 10px;
}