.elementor-32 .elementor-element.elementor-element-6464622{--display:flex;--overlay-opacity:0.5;}.elementor-32 .elementor-element.elementor-element-6464622::before, .elementor-32 .elementor-element.elementor-element-6464622 > .elementor-background-video-container::before, .elementor-32 .elementor-element.elementor-element-6464622 > .e-con-inner > .elementor-background-video-container::before, .elementor-32 .elementor-element.elementor-element-6464622 > .elementor-background-slideshow::before, .elementor-32 .elementor-element.elementor-element-6464622 > .e-con-inner > .elementor-background-slideshow::before, .elementor-32 .elementor-element.elementor-element-6464622 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-widget-animated-headline .elementor-headline-plain-text{color:var( --e-global-color-secondary );}.elementor-widget-animated-headline .elementor-headline{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-animated-headline{--dynamic-text-color:var( --e-global-color-secondary );}.elementor-widget-animated-headline .elementor-headline-dynamic-text{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-animated-headline .elementor-headline-dynamic-wrapper path{stroke:var( --e-global-color-accent );}.elementor-32 .elementor-element.elementor-element-9cc0af1{--iteration-count:infinite;--animation-duration:1200ms;margin:75px 75px calc(var(--kit-widget-spacing, 0px) + 75px) 75px;--dynamic-text-color:#000000;}.elementor-32 .elementor-element.elementor-element-9cc0af1 .elementor-headline{text-align:center;}.elementor-32 .elementor-element.elementor-element-9cc0af1 .elementor-headline-plain-text{color:#00B3B7;}.elementor-32 .elementor-element.elementor-element-9cc0af1 .elementor-headline-dynamic-text{font-family:"Roboto", Sans-serif;font-weight:600;}.elementor-32 .elementor-element.elementor-element-9cc0af1 .elementor-headline-dynamic-wrapper path{stroke:#00B3B7;}.elementor-32 .elementor-element.elementor-element-c1d965f{--display:flex;}@media(max-width:767px){.elementor-32 .elementor-element.elementor-element-9cc0af1{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-32 .elementor-element.elementor-element-9cc0af1 .elementor-headline{text-align:center;}}/* Start custom CSS for html, class: .elementor-element-26d6a22 */@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&amp;display=swap');

body {
  font-family: 'Roboto', sans-serif;
  background: #f5f7fa;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* ===============================
   ACHIEVEMENT SECTION
================================= */

.achievement-section {
  max-width: 1000px;
  margin: 50px auto;
  text-align: center;
  background: #ffffff;
  padding: 30px 40px;
  border-radius: 12px;
  overflow: visible;
}

.achievement-section h2 {
  font-size: 32px;
  margin-bottom: 10px;
  font-weight: 700;
  color: #222;
}

.achievement-section p {
  color: #555;
  margin-bottom: 30px;
  font-weight: 400;
}

.achievement-slider-wrapper {
  position: relative;
  padding: 0;
  overflow: visible;
}

.achievement-slider {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 20px;
  scroll-snap-type: x mandatory;
  padding: 20px;
  animation: slideHint 1s ease-out forwards;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.achievement-slider::-webkit-scrollbar {
  display: none;
}

@keyframes slideHint {
  0%    { transform: translateX(0); }
  50%   { transform: translateX(30px); }
  100%  { transform: translateX(0); }
}

/* ===============================
   ACHIEVEMENT ITEM (TAHUN LAMA)
================================= */

.achievement-item {
  flex: 0 0 280px;
  border-radius: 14px;
  padding: 20px;
  scroll-snap-align: start;

  /* 🔵 Gradient lebih calm */
  background: linear-gradient(135deg, #00b3b7, #005c83);

  color: #fff;
  transition: transform 0.3s ease, box-shadow 0.3s ease;

  box-shadow: 
    0 10px 25px rgba(0,0,0,0.15),
    0 4px 10px rgba(0,0,0,0.08);
}

.achievement-item:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 12px 24px rgba(0, 92, 131, 0.35);
}

.achievement-item h3 {
  margin: 10px 0 10px;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
}

.achievement-item p {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: #f0f0f0;
}

/* ===============================
   ACHIEVEMENT TERBARU (LEBIH GLOW)
================================= */

.achievement-item.newest {
  background: linear-gradient(135deg, #00b3b7 0%, #5ec8e5 50%, #005c83 100%);
  position: relative;
  border: 2px solid #5ec8e5;

  /* glow effect biar beda */
  box-shadow: 
    0 15px 35px rgba(94, 200, 229, 0.45),
    0 8px 20px rgba(0, 179, 183, 0.35);
}

/* ===============================
   BADGE NEW
================================= */

.badge-new {
  position: absolute;
  top: 12px;
  right: 12px;
  background: #ffffff;
  color: #005c83;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 20px;
}/* End custom CSS */