* {
  box-sizing: border-box;
}
html,
body {
  overflow-x: hidden;
}
:root {
  --color-dark: #0d1b2a;
  --color-mid: #3a506b;
  --color-light: #f5f7fa;
  --color-accent: #ef476f;
  --color-graphite: #1a1a1a;
  --color-secondary: #eaeaea;
}

body {
  font-family: "Segoe UI", sans-serif;
  background-color: var(--color-dark);
  color: var(--color-light);
  line-height: 1.7;
  margin: 0;
}

h1,
h2,
h3,
h4,
h5 {
  font-weight: 700;
  color: var(--color-light);
}

a {
  color: var(--color-accent);
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: #fff;
}

.btn-danger {
  background-color: var(--color-accent);
  border: none;
  color: #fff;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  transition: background 0.3s ease;
}

.btn-danger:hover {
  background-color: #d5365f;
  color: #fff;
}

.btn-outline-danger {
  border: 2px solid var(--color-accent);
  color: var(--color-accent);
  background: transparent;
  transition: all 0.3s ease;
}

.btn-outline-danger:hover {
  background: var(--color-accent);
  color: #fff;
}
.custom-navbar {
  background-color: #000;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
}
.navbar-brand {
  color: #ef476f;
  font-size: 1.6rem;
  transition: color 0.3s ease;
}
.navbar-brand:hover {
  color: #fff;
}
.navbar-nav .nav-link {
  color: #f1f1f1;
  font-weight: 500;
  margin-left: 1rem;
  margin-right: 1rem;
  transition: color 0.3s ease;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  color: #ef476f;
}
.dropdown-menu-dark {
  background-color: #1b1b1b;
  border: 1px solid #333;
}
.dropdown-item {
  color: #e6e6e6;
  transition: all 0.3s ease;
}
.dropdown-item:hover {
  background-color: #ef476f;
  color: #121212;
}
.bg-dark {
  background-color: var(--color-dark) !important;
}

.bg-black {
  background-color: #000 !important;
}

.bg-secondary {
  background-color: var(--color-secondary) !important;
  color: #111;
}

.bg-white {
  background-color: #fff !important;
}

.text-black {
  color: #111 !important;
}

.text-danger {
  color: var(--color-accent) !important;
}

.shadow-sm {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

section {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

section h2 {
  margin-bottom: 2rem;
}

.hero-section h1 {
  font-size: 3rem;
}

.hero-section p {
  font-size: 1.25rem;
  opacity: 0.85;
}

footer {
  background-color: #000;
  font-size: 0.95rem;
  border-top: 1px solid #222;
}

footer a {
  color: var(--color-light);
}

footer a:hover {
  color: var(--color-accent);
}
