/* Desert Drank – lightweight theme over Bootstrap 5 */

/* Brand palette */
:root {
  --dd-bg: #07090b;
  --dd-ink: #e9eef2;
  --dd-muted: rgba(233, 238, 242, 0.75);
  --dd-teal: #19e6d6;
  --dd-teal-soft: rgba(25, 230, 214, 0.18);
  --dd-pink: #ee0979; /* keep template accent if you like */
}

/* Base */
html { scroll-padding-top: 76px; }
body {
  background: var(--dd-bg);
  color: var(--dd-ink);
  font-family: "Lato", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
a { color: var(--dd-teal); }
a:hover { color: #7ff3ea; }

/* Nav */
.navbar-custom {
  padding-top: 0.9rem;
  padding-bottom: 0.9rem;
  background-color: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.navbar-custom .navbar-brand {
  text-transform: uppercase;
  letter-spacing: 0.14rem;
  font-weight: 800;
  font-size: 0.95rem;
}
.navbar-custom .navbar-nav .nav-link {
  text-transform: uppercase;
  letter-spacing: 0.12rem;
  font-weight: 700;
  font-size: 0.78rem;
  color: rgba(233, 238, 242, 0.75);
}
.navbar-custom .navbar-nav .nav-link:hover {
  color: rgba(233, 238, 242, 0.95);
}

/* Buttons */
.btn-xl {
  text-transform: uppercase;
  padding: 1.15rem 2.4rem;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.12rem;
}
.btn-primary {
  background: linear-gradient(135deg, #10cfc1, #19e6d6);
  border: none;
  color: #041012;
}

.btn-primary:hover {
  filter: brightness(1.05);
  color: #041012;
}
.btn-outline-light:hover {
  background: rgba(233, 238, 242, 0.10);
  border-color: rgba(233, 238, 242, 0.75);
  color: rgba(233, 238, 242, 1);
}

/* HERO / Masthead */
/* HERO / Masthead */
header.masthead {
  position: relative;
  overflow: hidden;
  padding-top: calc(4.25rem + 72px);
  padding-bottom: 4rem;
  background: #07090b; /* fallback */
}

/* Optional blurred photo texture (keep if you want it) */
header.masthead::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../assets/img/hero-bg.jpg") center/cover no-repeat;
  filter: blur(14px) saturate(0.55) brightness(0.35);
  transform: scale(1.08);
  opacity: 0.70; /* lower this to reveal more orange */
  z-index: 0;
}

/* Overlay: put ORANGE + TEAL here so it shows */
header.masthead::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 60% 22%, rgba(210, 110, 40, 0.26), rgba(0, 0, 0, 0) 48%),
    radial-gradient(circle at 50% 45%, rgba(25, 230, 214, 0.16), rgba(0, 0, 0, 0) 58%),
    linear-gradient(180deg, rgba(0,0,0,0.50), rgba(0,0,0,0.78));
  z-index: 1;
}

/* Ensure your hero content sits above overlays */
header.masthead .masthead-content {
  position: relative;
  z-index: 2;
}

/* HERO – consolidated (spacing + glow + can shadow) */
header.masthead {
  padding-top: calc(4.25rem + 72px);
  padding-bottom: 4rem;
}

.hero-can {
  position: relative;
  margin-top: 0.75rem !important;
  margin-bottom: 1.25rem !important;
  display: flex;
  justify-content: center;
}

.hero-can::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%);
  width: 440px;
  height: 440px;
  background: radial-gradient(circle, rgba(25, 230, 214, 0.18), rgba(0, 0, 0, 0) 65%);
  filter: blur(2px);
  z-index: 0;
}

.hero-can img {
  position: relative;
  z-index: 1;
  max-height: 520px;
  width: auto;
  filter: drop-shadow(0 36px 80px rgba(0, 0, 0, 0.75));
}