.n-columns-2{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    font-weight:700;
  }
  .n-columns-2 a{ text-align:center; }

  .login,.register{
    color:#fff3ce;
    padding:13px 10px;
  }

  /* MERAH LACQUER & EMAS */
  .login,.login-button{
    background: linear-gradient(180deg, #5a0505 0%, #b9140e 52%, #6f0705 100%);
    border: 2px solid #d99a21;
    box-shadow: inset 0 1px 0 rgba(255,232,155,.45), 0 0 12px rgba(240,165,31,.28);
  }

  .register,.register-button{
    background: linear-gradient(180deg, #721008 0%, #d13b16 52%, #820b07 100%);
    border: 2px solid #f2bd4d;
    box-shadow: inset 0 1px 0 rgba(255,239,175,.5), 0 0 14px rgba(240,165,31,.34);
  }

  :root{
    --ann-bg: #590705;
    --ann-text: #fff3ce;
    --ann-badge-bg: rgba(27,6,3,.72);
    --ann-badge-border: rgba(242,189,77,.72);
  }

  /* BAR UTAMA */
  .announcement-bar{
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 999999;            /* pastikan di atas header lain */
    background: linear-gradient(90deg, #230603 0%, var(--ann-bg) 24%, #a3140c 52%, #590705 78%, #230603 100%);
    color: var(--ann-text);
    border-bottom: 1px solid rgba(242,189,77,.7);
    box-shadow: 0 5px 22px rgba(20,3,1,.42), inset 0 -1px 0 rgba(255,216,106,.18);
    height: 44px;
    display: flex;
    align-items: center;
  }

  /* KONTEN DALAM (biar rapi dan center) */
  .announcement-inner{
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 14px;
    display: flex;
    align-items: center;
    gap: 12px;
  }

  /* BADGE KIRI */
  .announcement-badge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border-radius: 6px;
    background: var(--ann-badge-bg);
    border: 1px solid var(--ann-badge-border);
    color: #ffd86a;
    box-shadow: inset 0 0 12px rgba(242,189,77,.1);
    font-weight: 800;
    letter-spacing: .3px;
    white-space: nowrap;
    font-size: 13px;
  }

  /* AREA TEKS */
  .announcement-text{
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff3ce;
    text-shadow: 0 1px 9px rgba(255,183,50,.35);
  }

  /* efek teks jalan (opsional) */
  .announcement-text span{
    display: inline-block;
    padding-left: 100%;
    animation: ann-marquee 18s linear infinite;
  }
  @keyframes ann-marquee{
    0%   { transform: translateX(0); }
    100% { transform: translateX(-100%); }
  }

  /* supaya konten website turun (jangan ketutup bar) */
  body{
    padding-top: 44px;
  }

  /* di layar kecil, kecilin tinggi */
  @media (max-width: 480px){
    .announcement-bar{ height: 40px; }
    body{ padding-top: 40px; }
    .announcement-text{ font-size: 12px; }
    .announcement-badge{ font-size: 12px; padding: 5px 8px; }
  }

  @media (prefers-reduced-motion: reduce){
    .announcement-text span{ animation: none; padding-left: 0; }
  }