/* ===== FONTS ===== */
body,
p, li, span, a, td, input, textarea, select, button {
  font-family: 'Poppins', 'Inter', sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.section-title,
.hero-content h1,
.hero-content h2,
.hero-content h5,
.page-heading h1,
.widget-title {
  font-family: 'Nunito', 'Poppins', sans-serif !important;
  letter-spacing: -0.02em;
}

.hero-content h5,
h5 {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-family: 'Poppins', sans-serif !important;
}

/* ===== BREADCRUMB HEADER HEIGHT ===== */
/* Remove outer wrapper padding — page-heading controls spacing */
.breadcrumb-wrapper.section-padding {
  padding: 0 !important;
}
/* Inner page-heading: compact padding replacing the template's 140px/197px defaults */
.breadcrumb-wrapper .page-heading {
  padding: 40px 0 44px !important;
}
.breadcrumb-wrapper .page-heading h1 {
  font-size: 38px !important;
  line-height: 1.2 !important;
}
@media (max-width: 991px) {
  .breadcrumb-wrapper .page-heading {
    padding: 32px 0 36px !important;
  }
  .breadcrumb-wrapper .page-heading h1 {
    font-size: 32px !important;
  }
}
@media (max-width: 767px) {
  .breadcrumb-wrapper .page-heading {
    padding: 24px 0 28px !important;
  }
  .breadcrumb-wrapper .page-heading h1 {
    font-size: 26px !important;
  }
}

/* ===== MOBILE TOP BAR ===== */
@media (max-width: 767px) {
  .top-bar-hide-mobile {
    display: none !important;
  }
}

/* ===== HEADER ===== */
.nav-link-item {
  padding: 8px 16px;
  border-radius: 8px;
  font-weight: 500;
  font-size: 15px;
  color: #2d3748;
  text-decoration: none;
  transition: color 0.2s, background 0.2s;
  white-space: nowrap;
}
.nav-link-item:hover {
  color: #fe7028;
  background: #fff5f0;
}

.header-cta-btn {
  background: linear-gradient(135deg, #fe7028, #e85d10);
  color: #fff !important;
  padding: 10px 22px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 14px rgba(254,112,40,0.35);
  transition: transform 0.2s, box-shadow 0.2s;
  white-space: nowrap;
}
.header-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(254,112,40,0.45);
  color: #fff !important;
}

.top-bar-social a {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  text-decoration: none;
  transition: background 0.2s;
}
.top-bar-social a:hover {
  background: rgba(255,255,255,0.35);
}

.mobile-nav-link {
  display: block;
  padding: 10px 12px;
  color: #2d3748;
  text-decoration: none;
  font-weight: 500;
  font-size: 15px;
  border-radius: 8px;
  transition: background 0.2s;
}
.mobile-nav-link:hover {
  background: #fff5f0;
  color: #fe7028;
}

/* ===== FOOTER ===== */
.footer-social-link {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 13px;
  text-decoration: none;
  transition: transform 0.2s, opacity 0.2s;
}
.footer-social-link:hover {
  transform: translateY(-3px);
  opacity: 0.85;
  color: #fff;
}

.footer-nav-link {
  color: #94a3b8;
  text-decoration: none;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s;
}
.footer-nav-link:hover {
  color: #fe7028;
}

.footer-program-link {
  color: #94a3b8;
  text-decoration: none;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s;
}
.footer-program-link:hover {
  color: #1183cc;
}

.footer-contact-link {
  color: #94a3b8;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.6;
  transition: color 0.2s;
}
.footer-contact-link:hover {
  color: #cbd5e1;
}

.footer-wa-btn {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #25D366;
  color: #fff !important;
  padding: 10px 18px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(37,211,102,0.3);
  transition: transform 0.2s;
}
.footer-wa-btn:hover {
  transform: translateY(-2px);
  color: #fff !important;
}

/* ===== PROGRAM SECTION — remove box outline on hover ===== */
/*
 * custom-animations.css adds border-radius + box-shadow to .program-box-items
 * which creates a visible rectangular box on hover, conflicting with the SVG-mask
 * blob shapes. Override to keep only the lift animation, no box.
 */
.program-box-items {
  border-radius: 0 !important;
  background: transparent !important;
}
.program-box-items:hover {
  box-shadow: none !important;
}
/* The image mask already creates the blob shape — remove the rectangle clip */
.program-box-items .program-image {
  border-radius: 0 !important;
  overflow: visible !important;
}

/* ===== PROGRAM SECTION — sembunyikan shape dekoratif di mobile ===== */
@media (max-width: 991px) {
  .program-section .mask-shape,
  .program-section .mask-shape-2,
  .program-section .pencil-shape,
  .program-section .compass-shape {
    display: none;
  }
}

/* ===== HERO ===== */
/* bottom-shape (z-index:99) menutupi tombol hero; elemen dekoratif tidak perlu intercept klik */
.hero-1 .bottom-shape {
  pointer-events: none;
}

/* Foto hero dipotong jadi blob organik acak (pakai SVG mask, sama seperti
   section about-activities) — objek anak tetap utuh, bentuk tidak kaku/oval */
.hero-1 .hero-image img {
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 508 485"><path fill-rule="evenodd" clip-rule="evenodd" d="M273.307 22.3171C313.958 21.7364 354.018 -9.9391 392.233 3.1801C429.93 16.1214 448.114 56.8471 468.691 89.3925C487.204 118.672 501.176 150.33 506.594 184.055C511.646 215.497 501.66 246.444 499.018 278.149C496.315 310.595 504.839 344.713 490.737 374.404C476.393 404.605 448.022 426.759 419.387 445.812C390.95 464.733 359.473 482.18 324.811 484.809C290.921 487.38 261.165 463.161 227.293 460.384C188.086 457.169 146.979 481.781 110.746 467.257C75.3239 453.059 46.6799 419.717 37.6358 384.361C28.4117 348.301 68.3117 313.334 62.0057 276.717C55.164 236.989 -9.04387 211.189 1.08003 172.094C10.8117 134.513 77.5118 141.105 104.627 112.126C132.07 82.7954 119.879 25.7702 155.969 6.55486C190.772 -11.9748 233.369 22.8875 273.307 22.3171Z" /></svg>') center / 100% 100% no-repeat;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 508 485"><path fill-rule="evenodd" clip-rule="evenodd" d="M273.307 22.3171C313.958 21.7364 354.018 -9.9391 392.233 3.1801C429.93 16.1214 448.114 56.8471 468.691 89.3925C487.204 118.672 501.176 150.33 506.594 184.055C511.646 215.497 501.66 246.444 499.018 278.149C496.315 310.595 504.839 344.713 490.737 374.404C476.393 404.605 448.022 426.759 419.387 445.812C390.95 464.733 359.473 482.18 324.811 484.809C290.921 487.38 261.165 463.161 227.293 460.384C188.086 457.169 146.979 481.781 110.746 467.257C75.3239 453.059 46.6799 419.717 37.6358 384.361C28.4117 348.301 68.3117 313.334 62.0057 276.717C55.164 236.989 -9.04387 211.189 1.08003 172.094C10.8117 134.513 77.5118 141.105 104.627 112.126C132.07 82.7954 119.879 25.7702 155.969 6.55486C190.772 -11.9748 233.369 22.8875 273.307 22.3171Z" /></svg>') center / 100% 100% no-repeat;
  filter: drop-shadow(0 20px 38px rgba(17, 131, 204, 0.25));
  position: relative;
  z-index: 2;
}
/* blob lama dibuat untuk siluet cut-out — tidak cocok dengan foto persegi */
.hero-1 .hero-image .hero-shape {
  display: none;
}
/* aksen warna brand (blob sama) mengintip di belakang foto */
.hero-1 .hero-image::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translate(20px, 18px) rotate(-5deg) scale(0.96);
  background: linear-gradient(135deg, #fe7028, #fced31);
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 508 485"><path d="M273.307 22.3171C313.958 21.7364 354.018 -9.9391 392.233 3.1801C429.93 16.1214 448.114 56.8471 468.691 89.3925C487.204 118.672 501.176 150.33 506.594 184.055C511.646 215.497 501.66 246.444 499.018 278.149C496.315 310.595 504.839 344.713 490.737 374.404C476.393 404.605 448.022 426.759 419.387 445.812C390.95 464.733 359.473 482.18 324.811 484.809C290.921 487.38 261.165 463.161 227.293 460.384C188.086 457.169 146.979 481.781 110.746 467.257C75.3239 453.059 46.6799 419.717 37.6358 384.361C28.4117 348.301 68.3117 313.334 62.0057 276.717C55.164 236.989 -9.04387 211.189 1.08003 172.094C10.8117 134.513 77.5118 141.105 104.627 112.126C132.07 82.7954 119.879 25.7702 155.969 6.55486C190.772 -11.9748 233.369 22.8875 273.307 22.3171Z" /></svg>') center / 100% 100% no-repeat;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 508 485"><path d="M273.307 22.3171C313.958 21.7364 354.018 -9.9391 392.233 3.1801C429.93 16.1214 448.114 56.8471 468.691 89.3925C487.204 118.672 501.176 150.33 506.594 184.055C511.646 215.497 501.66 246.444 499.018 278.149C496.315 310.595 504.839 344.713 490.737 374.404C476.393 404.605 448.022 426.759 419.387 445.812C390.95 464.733 359.473 482.18 324.811 484.809C290.921 487.38 261.165 463.161 227.293 460.384C188.086 457.169 146.979 481.781 110.746 467.257C75.3239 453.059 46.6799 419.717 37.6358 384.361C28.4117 348.301 68.3117 313.334 62.0057 276.717C55.164 236.989 -9.04387 211.189 1.08003 172.094C10.8117 134.513 77.5118 141.105 104.627 112.126C132.07 82.7954 119.879 25.7702 155.969 6.55486C190.772 -11.9748 233.369 22.8875 273.307 22.3171Z" /></svg>') center / 100% 100% no-repeat;
  z-index: 1;
  opacity: 0.3;
}

/* ===== TEAM SECTION ===== */
.teacher-card {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  transition: transform 0.3s, box-shadow 0.3s;
  height: 100%;
}
.teacher-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.14);
}

.teacher-social-icon {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.3);
  transition: background 0.2s;
}
.teacher-social-icon:hover {
  background: rgba(254,112,40,0.8);
  color: #fff;
}

.team-cta-link {
  background: linear-gradient(135deg, #1183cc, #0d6fa8);
  color: #fff !important;
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.team-cta-link:hover {
  opacity: 0.88;
  color: #fff !important;
}