body {
    background-color: hsl(0, 0%, 100%);
    /* light gray */
}

.nav-link {
    color: #5439d9 !important;
}

.nav-link {
    font-size: 16px;
}

.navbar .nav-link:hover {
    color: #f1f1f3 !important;
    background-color: transparent !important;
    transition: color 0.3s ease;
}

.poppins-thin {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: normal;
}

.poppins-extralight {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: normal;
}

.poppins-light {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.poppins-medium {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
}

.poppins-black {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.poppins-thin-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: italic;
}

.poppins-extralight-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: italic;
}

.poppins-light-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.poppins-regular-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.poppins-medium-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: italic;
}

.poppins-semibold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: italic;
}

.poppins-bold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: italic;
}

.poppins-extrabold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: italic;
}

.poppins-black-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: italic;
}

/* Box around navbar buttons */


/* Remove underline + unify look */
.nav-link-custom {
  text-decoration: none !important;
  color: #ee9609 !important;  /* Change color if needed */
  padding: 4px 6px;         /* Adjust button spacing */
}

/* Optional hover effect */
.nav-link-custom:hover {
  color: #007bff;           /* Change hover color */
}


.nav-link {
    color: #2953BD;
    /* blue text */
    text-decoration: none;
    /* remove underline */
    transition: 0.3s;
}
.navbar {
    background-color: #ee9609(255, 255, 255, 0.3); /* translucent */
    backdrop-filter: blur(8px); /* blurs what's behind the navbar */
    -webkit-backdrop-filter: blur(8px); /* for Safari */
}

/* Navbar styling */
.navbar {
    position: fixed;         /* keeps navbar at the top */
    top: 0;
    width: 100%;
    background-color: #ee9609(0, 0, 0, 0.6); /* semi-transparent dark background */
    backdrop-filter: blur(6px);          /* blurs the content behind */
    -webkit-backdrop-filter: blur(6px);  /* Safari support */
    z-index: 1030;                       /* stays above other content */
    transition: background-color 0.3s ease;
}

/* Navbar links */
.navbar a, 
.navbar .navbar-brand {
    color: #ee9609;        /* bright yellow text */
    text-decoration: none; /* remove underline */
    transition: color 0.3s ease;
}

/* Optional: hover effect */
.navbar a:hover {
    color: #ee9609; /* slightly brighter yellow on hover */
}


/* Each accordion section (fixes the stubborn white background) */
.accordion-item {
    background-color: #f7fcfc !important;
    /* overrides Bootstrap’s white */
    border-radius: 15px;
    border-width: 2px;
    /* remove inner borders */
}

/* Buttons (collapsed or not) */
.accordion-button {
    background-color: transparent;
    color: #ee9609;
    font-weight: 500;
    font-family: "Poppins", sans-serif;
    box-shadow: none;
    border-radius: 15px;
    border-width: 2px;
}

.accordion-button:not(.collapsed) {
    background-color: #f9f8f7;
    color: #ee9609;
}

/* The opened content area */
.accordion-body {
    background-color: #ee9609;
    color: #fff;
    font-family: "Poppins", sans-serif;
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
}

/* Hover effect for better feedback */
.accordion-button:hover {
    background-color: #ee9609;
    color: #ffffff;
    transition: background-color 0.3s ease;
}

.cv-button {
    text-align: center;
    /* aligns it like the rest of the content */
}

.cv-button .btn {
    border-radius: 15px;
    border-width: 2px;
    border-color: #ee9609;
    transition: 0.3s ease;
    color: #ee9609
}

.cv-button .btn:hover {
    background-color: #6080e9;
    /* Bootstrap blue */
    color: rgb(248, 248, 252);
}

.square-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;             /* Adjust size */
    height: 70px;
    background-color: #fff;
    border: 2px solid #000;
    border-radius: 15px;
    text-decoration: none;
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    color: #ee9609;
    font-weight: 600;
    transition: 0.3s;
}

.square-btn:hover {
    background-color: #ee9609;
    color: #fff;
}



.card-img-top {
  height: 250px;
  object-fit: cover;
}

.btn-primary {
  background-color: #ee9609;
  border: none;
  border-radius: 30px;
}

.btn-primary:hover {
  background-color: #2953BD;
}
.card {
  border: 1px solid #000;
  border-radius: 20px;
  overflow: hidden;
}
.card-body {
  background-color: #ee9609; /* dark blue background */
  color: #fff; /* white text */
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

/* Make cards smaller */
.card {
  max-width: 280px;   /* adjust card width */
  margin: 0 auto;     /* center each card */
  border-radius: 10px;
}

/* Make card images smaller & fit card */
.card img {
  height: 200px;      /* adjust image height */
  object-fit: cover;  /* prevent distortion */
  width: 100%;
}

/* Center titles above card sections */
.section-title {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 20px;
}

/* Yellow footer background */
.footer-contact {
    background-color: #ee9609; /* adjust shade if needed */
    padding-top: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

/* Card inside footer */
.footer-card {
    background-color: #F0EBE5;
    border: 2px solid #2953BD !important;
    border-radius: 15px;
}
.footer-contact h2 {
    color: #ee9609 !important; /* Same yellow as your footer, or change if needed */
}


.footer-bottom {
  text-align: center;
  margin-top: 80px;
  border-top: 1px solid #f9f6f6;
  padding-top: 10px;
  font-size: 14px;
  padding-bottom: 5px;
}

.footer-company,
.footer-links,
.footer-sosmed {
  width: 30%;
  min-width: 250px;
  margin-bottom: 20px;
}

footer {
  background: #1a1a1a;
  color: #fff;
  padding: 30px 0;
  font-family: Arial, sans-serif;
}

<style>
.zoom-container {
  overflow: hidden;       
  position: relative;
}


.zoom-target {
  transition: transform 0.3s ease;
  transform-origin: center center; 
}
</style>

/* Warna teks label Bahasa */
.navbar .language-label {
  color: #000; /* Hitam */
}

/* Warna teks di dalam dropdown */
#languageSelect {
  color: #ff7a00; /* Orange sesuai menu */
  font-weight: 500;
}

/* Warna ketika dropdown dibuka */
#languageSelect option {
  color: #ff7a00;
}

/* Hilangkan background putih yang mengganggu */
#languageSelect:focus {
  box-shadow: none;
  border-color: #ff7a00;
}
.navbar-toggler {
  border-color: #fefdfd !important;       /* warna border */
  background-color: #ff8800 !important;   /* warna background toggler */
}