.cydrop-theme {
  background-color: #f8fbff;
  background-image:
    radial-gradient(1100px 600px at -10% -20%, rgba(56, 189, 248, 0.16), transparent 58%),
    radial-gradient(900px 500px at 110% 120%, rgba(37, 99, 235, 0.12), transparent 55%);
  background-attachment: fixed;
}

.cydrop-theme .cydrop-header,
.cydrop-theme footer {
  background-color: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.cydrop-theme main {
  position: relative;
}

.cydrop-theme main::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0));
}

.cydrop-theme main > * {
  position: relative;
  z-index: 1;
}

/* Keep mobile drawer behavior predictable with existing JS toggles */
.cydrop-theme #mainNav {
  right: -100%;
  transform: none;
}

.cydrop-theme #mainNav.active {
  right: 0;
}

.cydrop-theme .mobile-menu-overlay {
  z-index: 9000;
  background-color: rgba(15, 23, 42, 0.3);
}

.cydrop-theme #mainNav.main-nav {
  z-index: 10001;
}

.cydrop-theme .menu-close-btn {
  color: #0f172a;
}

.cydrop-theme .prose {
  color: #334155;
}

.cydrop-theme .prose h1,
.cydrop-theme .prose h2,
.cydrop-theme .prose h3 {
  color: #0f172a !important;
}

.cydrop-theme .prose a {
  color: #1d4ed8 !important;
}

.cydrop-theme .prose a:hover {
  color: #1e40af !important;
}

/* Blog list/article/contact/legal: softer card look */
.cydrop-theme section article,
.cydrop-theme .prose table,
.cydrop-theme .max-w-4xl .prose,
.cydrop-theme .grid .rounded-2xl,
.cydrop-theme .grid .rounded-xl {
  border-color: #dbeafe !important;
  box-shadow: 0 16px 32px -28px rgba(30, 64, 175, 0.35);
}

.cydrop-theme input,
.cydrop-theme textarea,
.cydrop-theme select {
  border-color: #bfdbfe;
}

.cydrop-theme input:focus,
.cydrop-theme textarea:focus,
.cydrop-theme select:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* Footer separators should only appear from medium screens */
@media (max-width: 767px) {
  .cydrop-theme footer .md\:border-l {
    border-left-width: 0 !important;
  }
}