*,
::after,
::before {
  box-sizing: border-box;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}

body {
  margin: 0;
  font-size: 1rem;
  font-weight: var(--font-weight-normal);
  line-height: var(--lh-body);
  background-color: var(--bg);
  font-family: var(--body-font-family);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  color: var(--white-color);
  overflow-x: hidden;
}

canvas {
  display: block;
}

#three-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: var(--z-bg);
  display: block;
}

.message-container {
  position: relative;
  z-index: var(--z-ui);
  margin-top: var(--gap-sm);
}

.success { color: var(--success-text-color); }
.warning { color: var(--warning-text-color); }
.error   { color: var(--error-text-color); }

.custom-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gold);
  border: var(--border-width) solid transparent;
  color: var(--bg);
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-bold);
  line-height: var(--lh-normal);
  padding: var(--padding-btn-cta);
  letter-spacing: var(--tracking-wide);
}

.custom-btn:hover {
  background: var(--green);
  color: var(--bg);
}

.site-header {
  position: fixed;
  z-index: var(--z-ui);
  top: 0;
  right: 0;
  left: 0;
  padding: var(--gap-base) var(--space-inner) 0;
}

.site-header-text {
  color: var(--gold);
  font-size: var(--btn-font-size);
  font-weight: var(--font-weight-extrabold);
  letter-spacing: var(--tracking-logo);
  display: inline-block;
}

.site-header-text:hover {
  opacity: 0.8;
}

.site-header-nav {
  gap: var(--gap-nav);
}

.site-header-nav a {
  color: var(--gold);
  font-size: var(--font-size-nav);
  font-weight: var(--font-weight-medium);
  opacity: 0.7;
  transition: opacity var(--transition-fast);
}

.site-header-nav a:hover {
  opacity: 1;
}

.glass-panel {
  background: var(--glass-bg);
  border: var(--border-width) solid var(--line-strong);
  border-radius: var(--radius-card);
  backdrop-filter: var(--blur-glass);
  -webkit-backdrop-filter: var(--blur-glass);
  box-shadow: var(--shadow-glass);
}

/* Only override what differs from the base .form-control in input.css */
.custom-form .form-control {
  margin-bottom: var(--gap-field);
  padding: var(--padding-input-compact);
  box-shadow: none;
  outline: none;
}

.custom-form .form-control:focus,
.custom-form .form-control:hover {
  border-color: var(--gold);
  background-color: var(--surface-8);
}

.custom-form button[type="submit"] {
  display: block;
  width: 100%;
  background: var(--gold);
  border: none;
  color: var(--bg);
  font-family: var(--heading-font-family);
  font-size: var(--p-font-size);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0;
  padding: var(--padding-submit);
  letter-spacing: var(--tracking-normal);
}

.custom-form button[type="submit"]:hover,
.custom-form button[type="submit"]:focus {
  background: var(--green-bright);
  color: var(--bg);
}


@media screen and (max-width: 991px) {
  .site-header {
    padding: var(--gap-md) var(--gap-base) 0;
  }
}