:root {
      --accent: #d97706;
      --accent-dark: #c45a00;
      --text: #4a320a;
    }

    body {
      margin: 0;
      font-family: "Poppins", Arial, sans-serif;
      color: var(--text);
      background: url("../images/bg.png") no-repeat center center;
      background-size: cover;
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      
      overflow: auto;
    }

    .survey-container {
      background: #ffffff7a;
      width: 90%;
      max-width: 720px;
      border-radius: 20px;
      padding: 0px;
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .survey-container p{
        color: #0d003d;
            font-size: 21px;
    font-weight: 300;
    padding: 13px 25px;
    }

    h1 {
      color: var(--accent-dark);
      margin-bottom: 20px;
      font-size: 28px;
    }

    .slide {
      display: none;
      animation: fade 0.6s ease-in-out;
    }

    .active {
      display: block;
      padding: 0px;
    }

    @keyframes fade {
      from { opacity: 0; transform: translateY(15px); }
      to { opacity: 1; transform: translateY(0); }
    }

    label {
      display: block;
      margin: 0px auto;
      padding: 12px;
      /* background: rgba(255, 248, 225, 0.8);
      border-radius: 10px;
      border: 1px solid #f3c45a; */
      cursor: pointer;
      width: 90%;
      transition: 0.2s;
      text-align: left;
      font-size: 14px;
    }

    label:hover {
      color: #d97706;
      /* transform: translateY(-2px); */
    }

    input[type="radio"],
    input[type="checkbox"] {
      margin-right: 10px;
    }

    .btn {
      background: linear-gradient(180deg, var(--accent), var(--accent-dark));
      color: #fff;
      border: none;
      padding: 10px 22px;
      border-radius: 8px;
      font-size: 16px;
      cursor: pointer;
      margin: 10px 6px;
      transition: 0.3s;
    }

    .btn:hover {
      background: var(--accent-dark);
    }

    .btn:disabled {
      background: #cccccc;
      cursor: not-allowed;
      opacity: 0.6;
    }

    .btn:disabled:hover {
      background: #cccccc;
    }

    .input-field {
      width: 80%;
      padding: 10px;
      border: 1px solid #e6b34d;
      border-radius: 8px;
      margin: 8px 0;
      background: transparent;
    padding: 16px;
    }

    .thankyou {
      font-size: 22px;
      color: #2e7d32;
      font-weight: bold;
    }

    .bee {
      font-size: 40px;
    }