* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  }

body {

font-family: 'Poppins', sans-serif;

min-height: 100vh;

background:
linear-gradient(
rgba(0,0,0,0.55),
rgba(0,0,0,0.65)
),
url("../images/ghana-christians.jpg");

background-size: cover;
background-position: center;
background-repeat: no-repeat;

display: flex;
justify-content: center;
align-items: center;

padding: 20px;
}

/* MAIN CONTAINER */

.container {
width: 100%;
max-width: 500px;
}

/* GLASS CARD */

.glass-card {

background: rgba(255,255,255,0.12);

backdrop-filter: blur(12px);

border: 1px solid rgba(255,255,255,0.15);

border-radius: 24px;

padding: 30px;

color: white;

text-align: center;

box-shadow:
0 8px 32px rgba(0,0,0,0.2);
}

/* LOGO */

.logo {

font-size: 24px;

font-weight: 700;

margin-bottom: 20px;
}

/* HEADINGS */

h1 {

font-size: 32px;

line-height: 1.2;

margin-bottom: 10px;
}

h3 {

font-size: 18px;

font-weight: 500;

color: #facc15;

margin-bottom: 20px;
}

.subtitle {

font-size: 15px;

line-height: 1.6;

margin-bottom: 30px;

color: rgba(255,255,255,0.9);
}

/* BUTTONS */

.button-group {

display: flex;

flex-direction: column;

gap: 15px;
}

.main-btn,
.secondary-btn,
.submit-btn {

width: 100%;

padding: 18px;

border-radius: 16px;

border: none;

text-decoration: none;

font-size: 16px;

font-weight: 600;

cursor: pointer;

transition: all .3s ease;
}

.main-btn,
.submit-btn {

background: #2563eb;

color: white;
}

.secondary-btn {

background: #facc15;

color: #111827;
}

.main-btn:hover,
.secondary-btn:hover,
.submit-btn:hover {

transform: translateY(-2px);
}

/* FORMS */

.form-card {

text-align: left;
}

.form-card h1,
.form-card .subtitle {

text-align: center;
}

.form-group {

margin-bottom: 18px;
}

input,
select,
textarea {

width: 100%;

padding: 16px;

border-radius: 14px;

border: 1px solid rgba(255,255,255,0.2);

background: rgba(255,255,255,0.12);

color: white;

font-size: 16px;

outline: none;
}

input::placeholder,
textarea::placeholder {

color: rgba(255,255,255,0.75);
}

select option {

color: black;
}

textarea {

resize: vertical;

min-height: 120px;
}

/* SUCCESS PAGE */

.success-icon {

font-size: 70px;

margin-bottom: 20px;
}

/* NAVIGATION */

.navbar {

position: fixed;

top: 20px;

right: 20px;

z-index: 9999;
}

.dropdown {

position: relative;
}

.menu-btn {

background: rgba(255,255,255,0.15);

backdrop-filter: blur(10px);

border: 1px solid rgba(255,255,255,0.2);

color: white;

padding: 12px 18px;

border-radius: 12px;

font-size: 16px;

font-weight: 600;

cursor: pointer;
}

.dropdown-content {

display: none;

position: absolute;

top: 60px;

right: 0;

width: 280px;

background: white;

border-radius: 16px;

overflow: hidden;

box-shadow:
0 10px 30px rgba(0,0,0,.15);
}

.dropdown-content.show {

display: block;
}

.dropdown-content a {

display: block;

padding: 16px 20px;

text-decoration: none;

color: #111827;

border-bottom: 1px solid #f3f4f6;
}

.dropdown-content a:last-child {

border-bottom: none;
}

.dropdown-content a:hover {

background: #f9fafb;
}

/* MOBILE */

@media (max-width: 768px) {

body {

```
padding: 15px;
```

}

.glass-card {

```
padding: 24px;
```

}

h1 {

```
font-size: 28px;
```

}

.dropdown-content {

```
width: 260px;

max-width: calc(100vw - 30px);
```

}
}
/* BACK BUTTON */

.back-btn {

  display: inline-block;

  margin-bottom: 20px;

  padding: 12px 18px;

  background: linear-gradient(
    135deg,
    #facc15,
    #fde047
  );

  border-radius: 12px;

  color: #111827;

  text-decoration: none;

  font-size: 14px;

  font-weight: 700;

  box-shadow:
    0 4px 15px rgba(250, 204, 21, 0.35);

  transition: all 0.3s ease;
}

.back-btn:hover {

  transform: translateX(-3px) translateY(-2px);

  box-shadow:
    0 8px 20px rgba(250, 204, 21, 0.5);
}
.outline-btn {

  width: 100%;

  padding: 18px;

  border-radius: 16px;

  text-decoration: none;

  text-align: center;

  background: rgba(255,255,255,0.15);

  color: white;

  border: 1px solid rgba(255,255,255,0.2);

  font-weight: 600;

  transition: all .3s ease;
}

.outline-btn:hover {

  background: rgba(255,255,255,0.25);

  transform: translateY(-2px);
}