body {
    background: linear-gradient(#800000 10%, #ffd700 40%, #800000 100%);
    font-family: arial, sans-serif;
    margin: 0;
    padding: 0;
}
.nav .nav-link {
  display: block;               /* biar bisa jadi kotak */
  padding: 10px 20px;           /* ruang dalam (kotak) */
  margin: 5px;                  /* jarak antar kotak */
  background-color: #2196f3;       /* warna kotak */
  color: white !important;      /* warna teks */
  border-radius: 6px;           /* sudut melengkung */
  text-decoration: none;        /* hilangkan underline */
  transition: 0.3s;             /* animasi halus */
}

.nav .nav-link:hover {
  background-color: rgb(200, 162, 200);    /* warna hover */
  color: black !important;
}

/* khusus link active */
.nav .nav-link.active {
  background-color: #2196f3;    /* warna biru */
  color: white !important;
}
.nav .nav-link.active:hover {
    background-color:#c8a2c8;
    color: black !important;
}
.profile-logo {
  display: block;
  margin: 0 auto;
}
.comtainer {
  display: flex;
  justify-content: center;
  gap: 20 px;
}
.box {
  padding: 20px;
  border-radius: 15px;
  color: white;
  text-align: center;
  width: 1000px;
  height: auto;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
/* Style untuk section */
.direct-contact-section {
    padding: 50px 20px;
    text-align: center;
    background-color: #f8f9fa;
}

/* Container tombol */
.direct-contact {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
    max-width: 800px;
    margin: 0 auto;
}

/* Style tombol */
.cta-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background-color: #8b4513; /* Coklat */
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    transition: all 0.3s ease;
    min-width: 160px;
    justify-content: center;
}

/* Warna berbeda untuk setiap tombol */
.cta-button:nth-child(1) { background-color: #25d366; } /* WhatsApp - Hijau */
.cta-button:nth-child(2) { background-color: #128c7e; } /* Telepon - Hijau tua */
.cta-button:nth-child(3) { background-color: #e4405f; } /* Instagram - Pink */
.cta-button:nth-child(4) { background-color: #000000; } /* Tiktok - Hitam */

/* Efek hover */
.cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    opacity: 0.9;
}

/* Responsive untuk mobile */
@media (max-width: 768px) {
    .direct-contact {
        flex-direction: column;
        align-items: center;
    }
    
    .cta-button {
        width: 100%;
        max-width: 250px;
    }
}
@media (max-width: 768px) {
  .nav { flex-direction: column; }
  .container { flex-direction: column; }
  table, thead, tbody, th, td, tr { display: block; }
  .cta-button { width: 100%; margin: 5px 0; }
}