.dropdown {
       width: 650px;
       margin-bottom: 20px;
       background: #fff;
       border-radius: 12px;
       box-shadow: 0 4px 12px rgba(0,0,0,0.1);
       overflow: hidden;
       transition: all 0.3s ease;
     }

     .dropdown-button {
       background: #1e88e5;
       color: #fff;
       padding: 16px 20px;
       width: 100%;
       text-align: left;
       border: none;
       font-size: 18px;
       font-weight: bold;
       cursor: pointer;
       position: relative;
     }

     .dropdown-button::after {
       content: "▼";
       position: absolute;
       right: 20px;
       top: 50%;
       transform: translateY(-50%);
       font-size: 14px;
       transition: transform 0.3s ease;
     }

     .dropdown.open .dropdown-button::after {
       transform: translateY(-50%) rotate(180deg);
     }

     .dropdown-content {
       max-height: 0;
       overflow: hidden;
       padding: 0 20px;
       transition: max-height 0.4s ease, padding 0.3s ease;
     }

     .dropdown.open .dropdown-content {
       max-height: 800px;
       padding: 20px;
     }

     .dropdown-content ul {
       columns: 2;
       column-gap: 40px;
       padding: 0;
       margin: 0;
     }

     .dropdown-content li {
       list-style: disc;
       margin: 6px 0;
       font-size: 15px;
       color: #333;
     }