/* ═══════════════════════════════════════════════════════════
   HERO SLIDER
   ═══════════════════════════════════════════════════════════ */
.davv-hero-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--davv-slate-100);
  user-select: none;
}

@media (min-width: 640px) {
  .davv-hero-slider {
    height: 380px;
  }
}
@media (min-width: 768px) {
  .davv-hero-slider {
    height: 500px;
    border-bottom-left-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem;
  }
}
@media (min-width: 1024px) {
  .davv-hero-slider {
    height: 600px;
  }
}

.davv-hero-slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.davv-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
  z-index: 0;
}

.davv-hero-slide:first-child {
  position: relative;
}
.davv-hero-slide.active {
  opacity: 1;
  z-index: 10;
}

.davv-hero-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  background: var(--davv-white);
}

@media (min-width: 768px) {
  .davv-hero-img {
    object-fit: cover;
  }
}

/* ── Arrows ─────────────────────────────────────────────── */
.davv-hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 25;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--davv-white-80);
  border: 1px solid var(--davv-slate-300-50);
  color: var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--davv-transition-fast);
  font-size: 1rem;
}

@media (min-width: 768px) {
  .davv-hero-arrow {
    width: 3rem;
    height: 3rem;
    font-size: 1.25rem;
  }
}

.davv-hero-arrow:hover {
  background: var(--davv-white);
  transform: translateY(-50%) scale(1.05);
}
.davv-hero-arrow:active {
  transform: translateY(-50%) scale(0.95);
}

.davv-hero-arrow--prev {
  left: 0.5rem;
}
.davv-hero-arrow--next {
  right: 0.5rem;
}

@media (min-width: 768px) {
  .davv-hero-arrow--prev {
    left: 1.5rem;
  }
  .davv-hero-arrow--next {
    right: 1.5rem;
  }
}

/* ── Dots ───────────────────────────────────────────────── */
.davv-hero-dots {
  position: absolute;
  bottom: 0.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 25;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  background: var(--davv-white-80);
  backdrop-filter: blur(8px);
  padding: 0.25rem 0.5rem;
  border-radius: var(--davv-radius-full);
  border: 1px solid var(--davv-slate-300-50);
  box-shadow: var(--davv-shadow-md);
}

@media (min-width: 768px) {
  .davv-hero-dots {
    bottom: 4.5rem;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
  }
}

.davv-hero-dot {
  height: 0.25rem;
  width: 0.25rem;
  border-radius: var(--davv-radius-full);
  border: none;
  background: var(--davv-navy-30);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
}

@media (min-width: 768px) {
  .davv-hero-dot {
    height: 0.375rem;
    width: 0.375rem;
  }
}

.davv-hero-dot.active {
  width: 0.5rem;
  background: var(--davv-gold);
}

@media (min-width: 768px) {
  .davv-hero-dot.active {
    width: 1rem;
  }
}

.davv-hero-dot:hover:not(.active) {
  background: var(--davv-navy-50);
}

/* ═══════════════════════════════════════════════════════════
   QUICK LINKS
   ═══════════════════════════════════════════════════════════ */
.davv-quick-links-section {
  padding: 0 0 0.5rem;
  user-select: none;
}

.davv-quick-links-card {
  background: var(--davv-white);
  border: 1px solid var(--davv-slate-200);
  border-radius: var(--davv-radius-md);
  box-shadow: var(--davv-shadow-sm);
  overflow: hidden;
}

.davv-quick-links-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--davv-slate-100);
  border-left: 1px solid var(--davv-slate-100);
}

@media (min-width: 1024px) {
  .davv-quick-links-grid {
    grid-template-columns: repeat(8, 1fr);
  }
}

.davv-quick-link-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.75rem 0.5rem;
  border-right: 1px solid var(--davv-slate-100);
  border-bottom: 1px solid var(--davv-slate-100);
  text-decoration: none;
  transition: var(--davv-transition);
  overflow: hidden;
}

@media (min-width: 640px) {
  .davv-quick-link-item {
    padding: 1.125rem 0.75rem;
  }
}

@media (min-width: 1024px) {
  .davv-quick-link-item {
    padding: 1.75rem 0.75rem;
  }
}

@media (min-width: 1280px) {
  .davv-quick-link-item {
    padding: 2rem 1rem;
  }
}

.davv-quick-link-gradient {
  position: absolute;
  inset: 0;
  transform: translateY(100%);
  transition: transform 0.5s ease-out;
  pointer-events: none;
}

.davv-quick-link-item:hover .davv-quick-link-gradient {
  transform: translateY(0);
}

/* Gradient colors per index */
.davv-quick-link-item[data-gradient-index="0"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(37, 99, 235, 0) 0%,
    var(--davv-blue-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="1"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(16, 185, 129, 0) 0%,
    var(--davv-emerald-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="2"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(147, 51, 234, 0) 0%,
    var(--davv-purple-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="3"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(217, 119, 6, 0) 0%,
    var(--davv-amber-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="4"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(225, 29, 72, 0) 0%,
    var(--davv-rose-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="5"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(6, 182, 212, 0) 0%,
    var(--davv-cyan-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="6"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(249, 115, 22, 0) 0%,
    var(--davv-orange-30) 100%
  );
}
.davv-quick-link-item[data-gradient-index="7"] .davv-quick-link-gradient {
  background: linear-gradient(
    180deg,
    rgba(236, 72, 153, 0) 0%,
    var(--davv-pink-30) 100%
  );
}

.davv-quick-link-icon {
  position: relative;
  width: 2rem;
  height: 2rem;
  border-radius: var(--davv-radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
  font-size: 1rem;
}

@media (min-width: 640px) {
  .davv-quick-link-icon {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.25rem;
  }
}

@media (min-width: 1024px) {
  .davv-quick-link-icon {
    width: 3rem;
    height: 3rem;
    font-size: 1.5rem;
  }
}
.davv-quick-link-item:hover .davv-quick-link-icon {
  transform: scale(1.1);
}

/* Color classes */
.ql-blue {
  background: var(--davv-blue-5);
  color: var(--davv-blue);
}
.ql-emerald {
  background: var(--davv-emerald-5);
  color: var(--davv-emerald);
}
.ql-purple {
  background: var(--davv-purple-5);
  color: var(--davv-purple);
}
.ql-amber {
  background: var(--davv-amber-5);
  color: var(--davv-amber);
}
.ql-rose {
  background: var(--davv-rose-5);
  color: var(--davv-rose);
}
.ql-cyan {
  background: var(--davv-cyan-5);
  color: var(--davv-cyan);
}
.ql-orange {
  background: var(--davv-orange-5);
  color: var(--davv-orange);
}
.ql-pink {
  background: var(--davv-pink-5);
  color: var(--davv-pink);
}

.davv-quick-link-label {
  position: relative;
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--davv-navy);
  margin-top: 0.375rem;
  transition: color 0.15s ease;
  letter-spacing: 0.025em;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (min-width: 640px) {
  .davv-quick-link-label {
    font-size: 0.8125rem;
    margin-top: 0.75rem;
    letter-spacing: 0.025em;
  }
}

@media (min-width: 1024px) {
  .davv-quick-link-label {
    font-size: 0.8125rem;
    font-weight: 700;
    margin-top: 1rem;
    letter-spacing: 0.025em;
  }
}
.davv-quick-link-item:hover .davv-quick-link-label {
  color: var(--davv-blue);
}