.elementor-851 .elementor-element.elementor-element-6992475{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:-20px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-6e58642 */:root {
  --syera-primary: #0D2167;
  --syera-primary-hover: rgba(13, 33, 103, 0.9);
  --syera-foreground: #111827;
  --syera-border: #E5E7EB;
  --syera-background: #ffffff;
}

/* ============================= */
/* HEADER BASE */
/* ============================= */

.syera-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: transparent;
  border-bottom: 1px solid transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: all 0.3s ease;
  overflow: visible !important;
}

.syera-header *,
.syera-header *::before,
.syera-header *::after {
  box-sizing: border-box;
}

.syera-navbar {
  max-width: 1280px;
  height: 64px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  overflow: visible !important;
}

/* ============================= */
/* LOGO */
/* ============================= */

.syera-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}

.syera-logo img {
  height: 28px;
  width: auto;
  display: block;
  transition: all 0.3s ease;
  filter: none !important;
  opacity: 1 !important;
}

.syera-header.scrolled .syera-logo img {
  filter: none !important;
  opacity: 1 !important;
}

/* ============================= */
/* DESKTOP MENU */
/* ============================= */

.syera-menu {
  display: flex;
  align-items: center;
  gap: 2px;
}

.syera-menu a {
  padding: 8px 16px;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
  text-decoration: none;
  border-radius: 6px;
  color: rgba(255, 255, 255, 0.8);
  transition: all 0.2s ease;
  white-space: nowrap;
}

.syera-menu a:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.syera-menu a.active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.15);
  font-weight: 500;
}

/* ============================= */
/* RIGHT ACTIONS */
/* ============================= */

.syera-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: visible !important;
  flex-shrink: 0;
}

/* ============================= */
/* DRACULA DARK MODE TOGGLE */
/* ============================= */

.syera-dark-toggle {
  width: 42px;
  height: 42px;
  min-width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
  visibility: visible !important;
  position: relative;
}

.syera-dark-toggle,
.syera-dark-toggle *,
.syera-dark-toggle *::before,
.syera-dark-toggle *::after {
  opacity: 1 !important;
}

.syera-dark-toggle button,
.syera-dark-toggle a,
.syera-dark-toggle [role="button"],
.syera-dark-toggle input + label,
.syera-dark-toggle label,
.syera-dark-toggle .dracula-toggle,
.syera-dark-toggle .dracula-toggle-wrapper,
.syera-dark-toggle .dracula-toggle-btn,
.syera-dark-toggle .dracula-switch,
.syera-dark-toggle [class*="dracula"],
.syera-dark-toggle [class*="toggle"] {
  opacity: 1 !important;
  visibility: visible !important;
}

.syera-dark-toggle button,
.syera-dark-toggle a,
.syera-dark-toggle [role="button"],
.syera-dark-toggle label,
.syera-dark-toggle .dracula-toggle,
.syera-dark-toggle .dracula-toggle-btn,
.syera-dark-toggle .dracula-switch {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;

  border-radius: 999px !important;
  border: 1px solid rgba(13, 33, 103, 0.14) !important;
  background: #ffffff !important;
  color: var(--syera-primary) !important;

  box-shadow: 0 4px 12px rgba(13, 33, 103, 0.16) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
}

.syera-dark-toggle svg,
.syera-dark-toggle i {
  width: 16px !important;
  height: 16px !important;
  color: var(--syera-primary) !important;
  fill: none;
  stroke: currentColor;
  opacity: 1 !important;
}

.syera-dark-toggle span {
  color: var(--syera-primary) !important;
  opacity: 1 !important;
}

.syera-dark-toggle button:hover,
.syera-dark-toggle a:hover,
.syera-dark-toggle [role="button"]:hover,
.syera-dark-toggle label:hover,
.syera-dark-toggle .dracula-toggle:hover,
.syera-dark-toggle .dracula-toggle-btn:hover,
.syera-dark-toggle .dracula-switch:hover {
  background: #E2E9F5 !important;
  color: var(--syera-primary) !important;
  transform: translateY(-1px);
}

.syera-header.scrolled .syera-dark-toggle button,
.syera-header.scrolled .syera-dark-toggle a,
.syera-header.scrolled .syera-dark-toggle [role="button"],
.syera-header.scrolled .syera-dark-toggle label,
.syera-header.scrolled .syera-dark-toggle .dracula-toggle,
.syera-header.scrolled .syera-dark-toggle .dracula-toggle-btn,
.syera-header.scrolled .syera-dark-toggle .dracula-switch {
  background: #ffffff !important;
  color: var(--syera-primary) !important;
  border-color: rgba(13, 33, 103, 0.14) !important;
  box-shadow: 0 4px 12px rgba(13, 33, 103, 0.14) !important;
}

/* ============================= */
/* CTA BUTTON */
/* ============================= */

.syera-cta {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
  color: var(--syera-primary);
  background: #ffffff;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transition: all 0.25s ease;
  white-space: nowrap;
}

.syera-cta:hover {
  background: #E2E9F5;
}

.syera-cta svg {
  width: 14px;
  height: 14px;
  transition: transform 0.25s ease;
}

.syera-cta:hover svg {
  transform: translateX(2px);
}

/* ========================================================= */
/* FIX TRANSLATEPRESS LANGUAGE SWITCHER - SYERATECH HEADER */
/* Desktop, Tablet, Mobile */
/* ========================================================= */

/* Wrapper utama language switcher */
.syera-language {
  position: relative !important;
  width: 166px !important;
  min-width: 166px !important;
  height: 38px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  z-index: 999999 !important;
  overflow: visible !important;
}

/* Wrapper bawaan TranslatePress */
.syera-language .trp-shortcode-switcher__wrapper {
  position: relative !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  display: block !important;
  overflow: visible !important;
  z-index: 999999 !important;

  --bg: #ffffff !important;
  --bg-hover: #E2E9F5 !important;
  --text: #0D2167 !important;
  --text-hover: #0D2167 !important;
  --border: 1px solid rgba(13, 33, 103, 0.14) !important;
  --border-width: 1px !important;
  --border-color: rgba(13, 33, 103, 0.14) !important;
  --border-radius: 8px !important;
  --flag-radius: 2px !important;
  --flag-size: 22px !important;
  --font-size: 13px !important;
}

/* Anchor bawaan TranslatePress hanya untuk ukuran, jangan ditampilkan */
.syera-language .trp-shortcode-anchor {
  position: relative !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

/* Overlay TranslatePress yang aktif */
.syera-language .trp-shortcode-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: auto !important;
  width: 100% !important;
  min-width: 100% !important;
  height: auto !important;
  overflow: visible !important;
  z-index: 999999 !important;
}

/* Box current language */
.syera-language .trp-current-language-item__wrapper {
  position: relative !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  background: #ffffff !important;
  border: 1px solid rgba(13, 33, 103, 0.14) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(13, 33, 103, 0.12) !important;
  overflow: hidden !important;
}

/* Current language item */
.syera-language .trp-language-item {
  width: 100% !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 40px 0 12px !important;

  display: flex !important;
  align-items: center !important;
  gap: 8px !important;

  font-family: "Inter", sans-serif !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 500 !important;

  color: #0D2167 !important;
  background: #ffffff !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

/* Hover item */
.syera-language .trp-language-item:hover {
  background: #E2E9F5 !important;
  color: #0D2167 !important;
}

/* Flag */
.syera-language .trp-flag-image {
  width: 22px !important;
  min-width: 22px !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  border-radius: 2px !important;
  flex-shrink: 0 !important;
}

/* Nama bahasa */
.syera-language .trp-language-item-name {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: inherit !important;
}

/* Arrow bawaan TranslatePress */
.syera-language .trp-shortcode-arrow {
  position: absolute !important;
  right: 11px !important;
  top: 50% !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  pointer-events: none !important;
  color: #0D2167 !important;
  z-index: 3 !important;
}

/* Warna arrow */
.syera-language .trp-shortcode-arrow path {
  stroke: #0D2167 !important;
}

/* Dropdown list */
.syera-language .trp-switcher-dropdown-list {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: auto !important;
  width: 100% !important;
  min-width: 100% !important;

  padding: 4px !important;
  margin: 0 !important;

  background: #ffffff !important;
  border: 1px solid rgba(13, 33, 103, 0.14) !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 36px rgba(13, 33, 103, 0.22) !important;

  overflow: hidden !important;
  z-index: 999999 !important;
}

/* Item dalam dropdown */
.syera-language .trp-switcher-dropdown-list .trp-language-item {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 10px !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

/* Hide saat hidden */
.syera-language .trp-switcher-dropdown-list[hidden] {
  display: none !important;
}

/* Pastikan parent tidak motong dropdown */
.syera-header,
.syera-navbar,
.syera-actions,
.syera-mobile-menu {
  overflow: visible !important;
}

/* ========================================================= */
/* DESKTOP SPECIFIC */
/* ========================================================= */

@media (min-width: 1101px) {
  .syera-language-desktop {
    display: flex !important;
  }

  .syera-language-mobile {
    display: none !important;
  }
}

/* ========================================================= */
/* TABLET + MOBILE SPECIFIC */
/* ========================================================= */

@media (max-width: 1100px) {
  .syera-language-desktop {
    display: none !important;
  }

  .syera-language-mobile {
    width: 100% !important;
    min-width: 100% !important;
    height: auto !important;
    min-height: 38px !important;
    margin: 12px 0 10px !important;
    display: flex !important;
  }

  .syera-language-mobile .trp-shortcode-switcher__wrapper {
    width: 100% !important;
    height: auto !important;
    min-height: 38px !important;
  }

  .syera-language-mobile .trp-shortcode-anchor {
    display: none !important;
  }

  .syera-language-mobile .trp-shortcode-overlay {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
  }

  .syera-language-mobile .trp-current-language-item__wrapper {
    width: 100% !important;
    height: 40px !important;
    min-height: 40px !important;
  }

  .syera-language-mobile .trp-language-item {
    height: 40px !important;
    min-height: 40px !important;
    font-size: 14px !important;
    padding: 0 42px 0 14px !important;
  }

  .syera-language-mobile .trp-switcher-dropdown-list {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 100% !important;
    margin-top: 8px !important;
  }

  .syera-language-mobile .trp-switcher-dropdown-list .trp-language-item {
    height: 40px !important;
    min-height: 40px !important;
  }
}

/* ========================================================= */
/* MOBILE KECIL */
/* ========================================================= */

@media (max-width: 480px) {
  .syera-language-mobile {
    margin-top: 10px !important;
  }

  .syera-language-mobile .trp-language-item {
    font-size: 14px !important;
  }

  .syera-language-mobile .trp-flag-image {
    width: 22px !important;
    min-width: 22px !important;
  }
}


/* ========================================================= */
/* REMOVE DOUBLE LAYER / EXTRA BG TRANSLATEPRESS */
/* ========================================================= */

.syera-language {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Hilangkan background section bawaan TranslatePress */
.syera-language .trp-shortcode-switcher__wrapper {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Anchor dummy TranslatePress jangan ikut tampil sebagai layer */
.syera-language .trp-shortcode-anchor {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Hapus layer/background dari wrapper language switcher */
.syera-language .trp-language-switcher {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Yang tetap punya background hanya box current language */
.syera-language .trp-current-language-item__wrapper {
  background: #ffffff !important;
  border: 1px solid rgba(13, 33, 103, 0.14) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(13, 33, 103, 0.12) !important;
}

/* Desktop: pastikan tinggi pas, tidak ada padding atas */
.syera-language-desktop,
.syera-language-desktop .trp-shortcode-switcher__wrapper,
.syera-language-desktop .trp-shortcode-overlay {
  height: 38px !important;
  min-height: 38px !important;
}


/* ============================= */
/* MOBILE TOGGLE */
/* ============================= */

.syera-mobile-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  padding: 8px;
  color: rgba(255, 255, 255, 0.85);
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.syera-mobile-toggle:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.syera-mobile-toggle svg {
  display: block;
}

/* ============================= */
/* MOBILE MENU */
/* ============================= */

.syera-mobile-menu {
  display: none;
  padding: 12px 24px 20px;
  background: rgba(13, 33, 103, 0.98);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  overflow: visible !important;
}

.syera-mobile-menu a {
  display: block;
  padding: 12px 14px;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.syera-mobile-menu a:hover,
.syera-mobile-menu a.active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
}

.syera-mobile-menu.active {
  display: block;
}

/* Mobile language .elementor-851 .elementor-element.elementor-element-6e58642 */
.syera-language-mobile {
  width: 100%;
  min-width: 100%;
  margin: 12px 0 10px;
}

.syera-language-mobile .trp-ls-shortcode-language {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  margin-top: 8px !important;
}

/* Mobile CTA */
.syera-mobile-cta {
  margin-top: 8px;
  text-align: center;
  background: #ffffff !important;
  color: var(--syera-primary) !important;
  font-weight: 600 !important;
}

/* ============================= */
/* HEADER AFTER SCROLL */
/* ============================= */

.syera-header.scrolled {
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--syera-border);
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.08);
}

.syera-header.scrolled .syera-menu a {
  color: rgba(17, 24, 39, 0.65);
}

.syera-header.scrolled .syera-menu a:hover {
  color: var(--syera-foreground);
  background: rgba(17, 24, 39, 0.05);
}

.syera-header.scrolled .syera-menu a.active {
  color: var(--syera-primary);
  background: rgba(13, 33, 103, 0.08);
  font-weight: 500;
}

.syera-header.scrolled .syera-cta {
  background: var(--syera-primary);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(13, 33, 103, 0.2);
}

.syera-header.scrolled .syera-cta:hover {
  background: var(--syera-primary-hover);
}

.syera-header.scrolled .syera-mobile-toggle {
  color: rgba(17, 24, 39, 0.6);
}

.syera-header.scrolled .syera-mobile-toggle:hover {
  color: var(--syera-foreground);
  background: rgba(17, 24, 39, 0.05);
}

.syera-header.scrolled .syera-mobile-menu {
  background: rgba(255, 255, 255, 0.98);
  border-top: 1px solid var(--syera-border);
}

.syera-header.scrolled .syera-mobile-menu a {
  color: rgba(17, 24, 39, 0.7);
}

.syera-header.scrolled .syera-mobile-menu a:hover,
.syera-header.scrolled .syera-mobile-menu a.active {
  color: var(--syera-primary);
  background: rgba(13, 33, 103, 0.08);
}

.syera-header.scrolled .syera-mobile-cta {
  background: var(--syera-primary) !important;
  color: #ffffff !important;
}

/* ============================= */
/* TABLET */
/* ============================= */

@media (min-width: 768px) and (max-width: 1100px) {
  .syera-navbar {
    height: 64px;
    padding: 0 22px;
  }

  .syera-menu,
  .syera-cta,
  .syera-language-desktop {
    display: none !important;
  }

  .syera-mobile-toggle {
    display: flex;
  }

  .syera-mobile-menu {
    padding: 14px 22px 22px;
  }

  .syera-language-mobile {
    display: flex !important;
  }
}

/* ============================= */
/* MOBILE */
/* ============================= */

@media (max-width: 767px) {
  .syera-navbar {
    height: 64px;
    padding: 0 16px;
  }

  .syera-logo img {
    height: 26px;
  }

  .syera-menu,
  .syera-cta,
  .syera-language-desktop {
    display: none !important;
  }

  .syera-mobile-toggle {
    display: flex;
  }

  .syera-dark-toggle {
    width: 38px;
    height: 38px;
    min-width: 38px;
  }

  .syera-dark-toggle button,
  .syera-dark-toggle a,
  .syera-dark-toggle [role="button"],
  .syera-dark-toggle label,
  .syera-dark-toggle .dracula-toggle,
  .syera-dark-toggle .dracula-toggle-btn,
  .syera-dark-toggle .dracula-switch {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    max-width: 34px !important;
    max-height: 34px !important;
  }

  .syera-mobile-menu {
    padding: 10px 16px 18px;
  }

  .syera-language-mobile {
    display: flex !important;
  }
}

@media (max-width: 480px) {
  .syera-navbar {
    padding: 0 14px;
  }

  .syera-mobile-menu {
    padding: 10px 14px 16px;
  }
}


/* ========================================================= */
/* MOBILE / TABLET TRANSLATEPRESS FIX - STABLE CLICK VERSION */
/* ========================================================= */

@media (max-width: 1100px) {
  /* Jarak dari Contact ke Language Switcher */
  .syera-mobile-menu .syera-language-mobile {
    margin-top: 26px !important;
    padding-top: 0 !important;
  }

  /* Matikan anchor dummy bawaan TranslatePress */
  .syera-language-mobile .trp-shortcode-anchor {
    display: none !important;
  }

  /* Overlay aktif dibuat normal flow */
  .syera-language-mobile .trp-shortcode-overlay {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 100% !important;
    overflow: visible !important;
  }

  .syera-language-mobile .trp-current-language-item__wrapper {
    cursor: pointer !important;
  }

  /* Dropdown default tertutup */
  .syera-language-mobile .trp-switcher-dropdown-list {
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 100% !important;

    max-height: 0 !important;
    opacity: 0 !important;
    transform: translateY(-5px) !important;
    pointer-events: none !important;

    margin-top: 0 !important;
    padding: 0 4px !important;
    border-width: 0 !important;

    background: #ffffff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 14px 35px rgba(13, 33, 103, 0.18) !important;

    transition:
      max-height 0.24s ease,
      opacity 0.2s ease,
      transform 0.2s ease,
      margin-top 0.2s ease,
      padding 0.2s ease !important;
  }

  /* Override hidden bawaan TranslatePress */
  .syera-language-mobile .trp-switcher-dropdown-list[hidden] {
    display: block !important;
  }

  /* Dropdown terbuka */
  .syera-language-mobile.syera-lang-open .trp-switcher-dropdown-list {
    max-height: 180px !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;

    margin-top: 10px !important;
    padding: 4px !important;
    border: 1px solid rgba(13, 33, 103, 0.14) !important;
  }

  .syera-language-mobile .trp-switcher-dropdown-list .trp-language-item {
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 12px !important;
    border-radius: 6px !important;
  }

  .syera-language-mobile .trp-shortcode-arrow {
    transition: transform 0.2s ease !important;
  }

  .syera-language-mobile.syera-lang-open .trp-shortcode-arrow {
    transform: translateY(-50%) rotate(180deg) !important;
  }
}/* End custom CSS */