/* Override kecil untuk template Ocorner. Jangan edit main.css langsung,
   kecuali warna aksen: #e43d4e (merah) sudah diganti #ECC523 (emas logo) di main.css. */

/* Gambar dari <Image> Astro membawa atribut width/height; jaga proporsi saat lebarnya mengikuti kolom. */
img[width][height] {
	height: auto;
}

/* Teks dan ikon di atas latar emas memakai navy logo (#10224A);
   putih di atas emas kontrasnya hanya ±1,7:1. */
::selection { color: #10224A; }
::-moz-selection { color: #10224A; }
.btn-maincolor,
.ds .btn-outline-maincolor:hover,
.ls .btn-outline-maincolor:hover,
[role="tablist"] .card-header a:not(.collapsed),
[role="tablist"] .card-header a:not(.collapsed) i,
[role="tablist"] .card-header a.collapsed:hover,
[role="tablist"] .card-header a.collapsed:hover i,
[class*="-item"] .links-wrap a.link-zoom:hover,
[class*="-item"] .links-wrap a.link-anchor:hover,
.programs .vertical-item .services-icon i,
.page-item.active > a,
.nav-links > span,
.page-links > span,
.nav-tabs .nav-link.active,
.ds .nav-tabs .nav-link:hover,
.cat-links a,
.cs {
	color: #10224A !important;
}
.btn-maincolor:hover {
	color: #ECC523 !important;
}
#toTop:after,
#toTop:hover:after {
	color: #10224A;
}
.toggle_menu.mobile-active:before,
.toggle_menu.mobile-active span {
	background-color: #10224A;
}

/* Preloader: logo dojang berdenyut, menggantikan GIF kepalan tangan template. */
.preloader_image {
	background: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 180px;
	height: 180px;
	margin: -90px 0 0 -90px;
}
.preloader_image img {
	max-width: 100%;
	max-height: 100%;
	animation: preloader-pulse 1.2s ease-in-out infinite;
}
@keyframes preloader-pulse {
	0%, 100% { transform: scale(0.9); opacity: 0.7; }
	50% { transform: scale(1.05); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.preloader_image img { animation: none; }
}

/* Logo lambang bundar + teks nama dojang di header. */
.page_header a.logo img {
	height: 64px;
	width: 64px;
}
.page_header a.logo .logo-text {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
	white-space: nowrap;
}
.page_header a.logo .logo-text small {
	display: block;
	font-size: 14px;
	letter-spacing: 0.25em;
}
@media (max-width: 991px) {
	.page_header a.logo img {
		height: 48px;
		width: 48px;
	}
	.page_header a.logo .logo-text {
		font-size: 15px;
	}
	.page_header a.logo .logo-text small {
		font-size: 12px;
	}
}
.page_footer a.logo img {
	max-height: 110px;
}

/* Bintang rating (hero, ringkasan, kartu ulasan) */
.stars i {
	color: #ECC523;
	margin-right: 2px;
}

/* Tagline di bawah judul hero: huruf biasa, bukan kapital semua seperti judulnya */
.page_slider .hero-tagline {
	color: #ECC523;
	display: block;
	font-size: 0.42em;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.3;
	margin-top: 10px;
	text-transform: none;
}

/* Badge rating Google di bawah tombol hero */
.hero-rating {
	display: block;
	margin-top: 18px;
	color: #fff;
	font-size: 14px;
}
.hero-rating:hover {
	color: #ECC523;
}
.hero-rating .stars {
	margin-right: 6px;
}

/* Nomor urut pilar (01–03) di lingkaran emas, menggantikan ikon */
.programs .services-icon.pillar-number {
	color: #10224A;
	font-family: 'Oswald', sans-serif;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.05em;
}
.programs .services-icon.pillar-number:hover {
	color: #10224A;
}
.programs .pillar .vertical-item {
	height: 100%;
}
/* Kartu pilar: jarak antar kartu saat bertumpuk di HP */
@media (max-width: 767px) {
	.programs .pillar {
		margin-bottom: 50px;
	}
}

/* Section "Tentang": template baru menghapus overlay gelap di >=1400px.
   Mulai 1200px teks sudah di kolom kanan, jadi foto di kiri tidak perlu ditutup. */
@media (min-width: 1200px) {
	.about-section.s-overlay.mobile-overlay:before {
		display: none;
	}
}
/* Di layar kecil teks menumpuk di atas foto: overlay tetap ada, foto digeser agar pelatih di tengah. */
@media (max-width: 1199px) {
	.about-section {
		background-position: 32% center;
	}
	.about-section.s-overlay.ds:before {
		opacity: 0.8;
	}
}

/* Link "profil sabeum" di section Tentang: jangan sampai judul tertutup header yang menempel */
#instruktur {
	scroll-margin-top: 80px;
}

/* Profil pelatih: foto lanskap di-crop jadi potret 4:5, fokus ke pelatih + target tendangan */
.coach-profile .item-media img {
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: 57% center;
	width: 100%;
}

/* Profil pelatih: beri jarak saat kolom bertumpuk di layar kecil */
@media (max-width: 767px) {
	.coach-profile .vertical-item {
		margin-bottom: 30px;
	}
}

/* Section ulasan Google */
.google-reviews .review-summary {
	color: #fff;
	font-size: 16px;
	margin-top: 10px;
}
.google-reviews .review-summary .stars {
	margin-right: 8px;
}
.review-card {
	text-align: left;
	background-color: #222739;
	border: none;
	border-top: 3px solid #ECC523;
	height: 100%;
	margin: 0;
	padding: 30px;
	display: flex;
	flex-direction: column;
}
.review-card p {
	color: #fff;
	flex: 1;
	font-size: 15px;
	font-style: italic;
	margin: 20px 0;
}
.review-head {
	align-items: center;
	display: flex;
	gap: 14px;
}
.review-head strong {
	color: #fff;
	display: block;
}
.review-head .stars i {
	font-size: 12px;
}
.review-initial {
	align-items: center;
	background-color: #ECC523;
	border-radius: 50%;
	color: #10224A;
	display: flex;
	flex-shrink: 0;
	font-size: 20px;
	font-weight: 700;
	height: 48px;
	justify-content: center;
	width: 48px;
}
.review-source {
	color: #a4a9b9;
	font-size: 12px;
}
.review-write {
	margin-top: 20px;
}

/* Tabel di isi artikel blog/event (Markdown). Template mewarnai th navy, tak terlihat di latar gelap. */
.entry-content table {
	border-collapse: collapse;
	margin: 20px 0 30px;
	width: 100%;
}
.entry-content th,
.entry-content td {
	border: 1px solid #3f4455;
	padding: 12px 16px;
	text-align: left;
}
.entry-content th {
	background-color: #222739;
	color: #ECC523;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.entry-content td:first-child {
	color: #fff;
}
@media (max-width: 575px) {
	.entry-content table {
		font-size: 13px;
		table-layout: fixed;
	}
	.entry-content th,
	.entry-content td {
		overflow-wrap: anywhere;
		padding: 8px 10px;
	}
}
.entry-content img {
	margin: 10px 0 25px;
}

/* Halaman Program: menu latihan bernomor */
.training-menu {
	counter-reset: menu;
	display: grid;
	gap: 12px 30px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	list-style: none;
	margin: 20px 0;
	padding: 0;
}
.training-menu li {
	align-items: center;
	background-color: #222739;
	border-left: 3px solid #3f4455;
	counter-increment: menu;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	padding: 14px 16px 14px 62px;
	position: relative;
}
.training-menu li::before {
	align-items: center;
	background-color: #ECC523;
	border-radius: 50%;
	color: #10224A;
	content: counter(menu);
	display: flex;
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	height: 32px;
	justify-content: center;
	left: 16px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 32px;
}
.training-menu li.themed {
	border-left-color: #ECC523;
}
.training-menu .menu-name {
	color: #fff;
	font-family: 'Oswald', sans-serif;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}
.training-menu .menu-term {
	color: #a4a9b9;
	font-style: italic;
}
.training-menu .menu-badge {
	border: 1px solid #ECC523;
	color: #ECC523;
	font-size: 11px;
	letter-spacing: 0.05em;
	margin-left: auto;
	padding: 2px 8px;
	text-transform: uppercase;
}
.training-note {
	font-size: 14px;
}
.program-cta {
	margin-top: 20px;
}
@media (max-width: 767px) {
	.training-menu {
		grid-template-columns: 1fr;
	}
}

/* Halaman Afiliasi */
.affiliation-logo {
	height: 130px;
	margin-bottom: 30px;
	width: 130px;
}
.affiliation-subtitle {
	font-family: 'Oswald', sans-serif;
	letter-spacing: 0.08em;
	margin-top: -10px;
	text-transform: uppercase;
}
.hq-facts {
	list-style: none;
	margin: 0;
	padding: 0;
}
.hq-facts li {
	border-bottom: 1px solid #3f4455;
	display: flex;
	gap: 20px;
	padding: 16px 0;
}
.hq-facts li span {
	color: #ECC523;
	flex: 0 0 90px;
	font-family: 'Oswald', sans-serif;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.hq-facts li strong {
	color: #fff;
	font-weight: 400;
}
.hq-source {
	font-size: 13px;
	margin-top: 15px;
}
.affiliation-photo {
	margin: 0;
}
.affiliation-photo figcaption {
	color: #a4a9b9;
	font-size: 13px;
	margin-top: 10px;
	text-align: center;
}
.affiliation-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}
@media (max-width: 767px) {
	.affiliation-photo {
		margin-bottom: 40px;
	}
}

/* Template menyembunyikan tombol CTA hero di layar HP; tampilkan karena
   tombol kelas trial adalah konversi utama. */
@media (min-width: 300px) and (max-width: 768px) {
	.page_slider .intro_layers_wrapper .intro_layer.button {
		display: block;
		margin-top: 10px;
	}
	/* Hero template di HP hanya ±185px; tinggikan supaya judul, tombol, dan rating muat. */
	.page_slider > img {
		height: 440px;
		object-fit: cover;
		object-position: 70% center;
	}
}
