.bg-orange-key {
  background-color: #ff0000;
  color: white;
}

.bg-orange-theme:hover {
  background-color: #e60000;
}

.bg-grad-orange {
  background: linear-gradient(90deg, #ff6600 0%, #ff3300 100%);
  color: white;
}

.clr-grad-orange {
  background: linear-gradient(90deg, #ff3300 0%, #ff6600 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.clr-orange-key {
  color: #ff0000 !important;
  font-weight: 700;
}

.clr-orange-key-bold {
  color: #ff0000 !important;
  font-weight: 700;
}

.clr-orange-key-uppercase {
  color: #ff0000 !important;
  text-transform: uppercase;
}

.text-orange-custom {
  color: #ff6600 !important;
}

/* Solid color text */
.clr-sec-orange-key {
  color: #ff0000;
}

/* === Orange Brand Theme Overrides === */
:root {
  --orange-primary: #ff0000;
  --orange-light: #ff4d4d;
  --orange-dark: #cc0000;
}

/* Text Colors */
.clr-orange,
.text-orange {
  color: var(--orange-primary) !important;
}

.clr-orange:hover,
.text-orange:hover {
  color: var(--orange-dark) !important;
}

/* Backgrounds */
.bg-orange-key {
  background-color: var(--orange-primary) !important;
  color: #fff;
}

.bg-orange-key:hover {
  background-color: var(--orange-dark) !important;
}

/* Borders */
.border-orange-key {
  border-color: var(--orange-primary) !important;
}

.border-orange-key:hover {
  border-color: var(--orange-dark) !important;
}

/* Gradient Backgrounds */
.bg-grad-orange {
  background: linear-gradient(
    90deg,
    var(--orange-light) 0%,
    var(--orange-primary) 100%
  ) !important;
  color: white;
}

.bg-grad-orange:hover {
  background: linear-gradient(
    90deg,
    var(--orange-primary) 0%,
    var(--orange-dark) 100%
  ) !important;
}

/* Text Gradient */
.clr-grad-orange {
  background: linear-gradient(
    90deg,
    var(--orange-primary),
    var(--orange-light)
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

/* Buttons (general override) */
a.btn,
button,
.link {
  transition: all 0.3s ease;
}

a.btn.bg-orange-key:hover,
button.bg-orange-key:hover {
  background-color: var(--orange-dark) !important;
}

/* Menu Link Hover */
.menu-link:hover,
.menu-list:hover,
.menu-sub-link:hover {
  color: var(--orange-dark) !important;
}

/* Active Menu */
.menu-link.active,
.menu-list:active {
  color: var(--orange-primary) !important;
  font-weight: bold;
}

/* === Orange Brand Theme === */
:root {
  --orange-primary: #ff0000;
  --orange-light: #ff4d4d;
  --orange-dark: #cc0000;
}

/* Text Color Overrides */
.clr-orange,
.text-orange {
  color: var(--orange-primary) !important;
}

.clr-orange:hover,
.text-orange:hover {
  color: var(--orange-dark) !important;
}

/* Background Color Overrides */
.bg-orange-key {
  background-color: var(--orange-primary) !important;
  color: white !important;
}

.bg-orange-key:hover {
  background-color: var(--orange-dark) !important;
}

/* Border Color Overrides */
.border-orange-key {
  border-color: var(--orange-primary) !important;
}

.border-orange-key:hover {
  border-color: var(--orange-dark) !important;
}

/* Gradient Backgrounds */
.bg-grad-orange {
  background: linear-gradient(
    90deg,
    var(--orange-light),
    var(--orange-primary)
  ) !important;
  color: white !important;
}

.bg-grad-orange:hover {
  background: linear-gradient(
    90deg,
    var(--orange-primary),
    var(--orange-dark)
  ) !important;
}

/* Gradient Text */
.clr-grad-orange {
  background: linear-gradient(
    90deg,
    var(--orange-primary),
    var(--orange-light)
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

/* Buttons and Links - General */
a.btn,
button,
.link {
  transition: all 0.3s ease;
}

a.btn.bg-orange-key:hover,
button.bg-orange-key:hover {
  background-color: var(--orange-dark) !important;
}

.link:hover {
  opacity: 0.9;
}

/* Navigation Menu Hover & Active States */
.menu-link:hover,
.menu-list:hover,
.menu-sub-link:hover {
  color: var(--orange-dark) !important;
}

.menu-link.active,
.menu-list:active {
  color: var(--orange-primary) !important;
  font-weight: bold;
}

/* === Submenu Icon Backgrounds === */
.menu-item-icon {
  background-color: var(--orange-primary) !important;
  color: white !important;
  border-radius: 12px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}

.menu-item-icon i,
.menu-item-icon svg {
  color: white !important;
  fill: white !important;
}

/* === Force override of green hardcoded styles === */
svg path[fill="#00e676"],
svg path[fill="#28c76f"],
svg path[fill="#00c97b"] {
  fill: #ff0000 !important;
}

.clr-green,
.text-success {
  color: #ff0000 !important;
}

.bg-success,
.menu-sub-list:hover .menu-item-icon {
  background-color: #ff0000 !important;
}

.menu-sub-link i {
  color: white !important;
}

/* === Cookie banner or system notice fixes (if any) === */
.cookie-banner,
.alert,
.notification-bar {
  background-color: var(--orange-primary) !important;
  color: white !important;
}

/* Override Bootstrap green classes */
.bg-success,
.text-success,
.btn-success {
  background-color: #ff0000 !important;
  color: #fff !important;
  border-color: #cc0000 !important;
}

/* Optional: adjust hover states */
.btn-success:hover {
  background-color: #e60000 !important;
}

/* Update success variable if needed */
:root {
  --bs-success: #ff0000;
  --bs-success-rgb: 255, 0, 0;
}

/* === Orange Brand Theme Root Variables === */
:root {
  --primary-key: 0, 100%, 50%;
  /* HSL for #ff0000 */
  --primary-key-rgb: 255, 0, 0;
  --bs-success: #ff0000;
  --bs-success-rgb: 255, 0, 0;
}

/* === Cursor Customization to Orange === */
.custom-cursor div {
  border: 1px solid hsl(var(--primary-key)) !important;
}

.custom-cursor div:nth-child(2) {
  background-color: hsl(var(--primary-key)) !important;
}

/* === Gradient Text - Override clr-grad-4 Green Gradient === */
.clr-grad-4,
.clr-grad-green,
.text-gradient-green {
  background: linear-gradient(90deg, #ff3300 0%, #ff6600 100%) !important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

/* === Button Overrides === */
.btn-success,
.bg-success,
.text-success {
  background-color: #ff0000 !important;
  color: #fff !important;
  border-color: #cc0000 !important;
}

.btn-success:hover {
  background-color: #cc0000 !important;
}

/* === Menu Hover States & Active === */
.menu-link:hover,
.menu-sub-link:hover,
.menu-sub-link:active,
.menu-list:hover,
.menu-list:active,
.menu-link.active {
  color: #ff0000 !important;
}

/* === Submenu Icons to Orange === */
.menu-item-icon {
  background-color: #ff0000 !important;
  color: white !important;
  border-radius: 12px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}

.menu-item-icon i,
.menu-item-icon svg {
  color: white !important;
  fill: white !important;
}

/* === Force override green hardcoded colors from theme === */
svg path[fill="#00e676"],
svg path[fill="#28c76f"],
svg path[fill="#65fe50"],
svg path[fill="#00ffb2"] {
  fill: #ff0000 !important;
}

.clr-green,
.text-success {
  color: #ff0000 !important;
}

.bg-green,
.bg-success {
  background-color: #ff0000 !important;
}

/* === Optional: Cookie banners, alerts, notifications to orange === */
.cookie-banner,
.alert,
.notification-bar {
  background-color: #ff0000 !important;
  color: white !important;
}

/* === GLOBAL ORANGE THEME HOVER OVERRIDES === */

/* Links */
a:hover,
.link:hover {
  color: #ff0000 !important;
  text-decoration: none;
}

/* Buttons */
button:hover,
.btn:hover,
.btn:focus,
.btn-success:hover,
.btn-success:focus {
  background-color: #ff0000 !important;
  border-color: #cc0000 !important;
  color: white !important;
}

.text-break {
  word-break: break-word;
}

/* Active / hover menu links */
.menu-link:hover,
.menu-list:hover,
.menu-list:active,
.menu-list:hover,
.menu-list:active,
.menu-sub-link:hover,
.menu-link.active {
  color: #ff0000 !important;
}


.bi, span.bi {
  color: #000000 !important;
}

/* Icon hover overrides */
i:hover,
.bi:hover {
  /* color: #ff0000 !important; */
  text-shadow: 0 0 6px rgba(255, 0, 0, 0.2);
}

/* Badge and label hover overrides */
.badge:hover,
.label:hover {
  background-color: #ff0000 !important;
  color: white !important;
}

/* Custom cards or hoverable blocks */
.card:hover,
.feature-2-card:hover,
.hover-glow:hover {
  box-shadow: 0 0 10px rgba(255, 0, 0, 0.15) !important;
  border-color: #ffcccc !important;
}

/* Remove green background utilities if present */
.bg-success:hover,
.bg-success:focus {
  background-color: #ff0000 !important;
  color: white !important;
}

/* Optional - form validation hover */
input:focus,
textarea:focus,
select:focus {
  border-color: #ff0000 !important;
  box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.25) !important;
}

.use-case-breadcrumb-bottom-circle {
  background: linear-gradient(135deg, #ffc8c8 0%, #fff1f1 100%);
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-weight: bold;
}

.menu-nav {
  display: flex;
  position: absolute;
  inset-inline: 0;
  inset-block-start: calc(100% - 0.5rem);
  background-color: #ff0000;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  z-index: -1;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  max-height: calc(100vh - var(--navbar-height, 5rem) - 1rem);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding: 0.75rem;
  backdrop-filter: blur(12px);
  border: none !important;
}

.menu-nav a {
  color: white;
}

@media (min-width: 992px) {
  .menu-nav {
    background-color: transparent;
    position: relative;
    z-index: 1;
    visibility: visible;
    opacity: 1;
    pointer-events: unset;
    box-shadow: none;
    max-height: none;
    overflow: visible;
    padding: 0;
    backdrop-filter: none;
  }

  .menu-nav a {
    color: #ff0000;
  }
}

.letters {
  transition: opacity 0.5s ease-in-out;
}

.cursor {
  display: inline-block;
  font-weight: bold;
  color: #ff0000;
  animation: blink 0.1s;
}

@keyframes blink {
  0%,
  50%,
  100% {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.radar-logo-wrapper .radar .animated-text-wrapper .cd-headline {
  border-radius: 8px !important;
  background: #ff0000 !important;
  /* Bright orange override */
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: hsl(var(--neutral-30)) !important;
  padding-block: 0.25rem !important;
  padding-inline: 1rem !important;
}

/* === ORANGE THEME OVERRIDES === */
.radar-logo-wrapper .radar:before {
  background: linear-gradient(
    247deg,
    #ff0000 -20.02%,
    rgba(255, 51, 0, 0) 54.9%
  ) !important;
}

.radar-logo-wrapper .radar .animated-text-wrapper .cd-headline {
  background: rgba(255, 0, 0, 0.22) !important;
  color: #ff0000 !important;
}

.radar-logo-wrapper .logo-wrapper:before {
  background: #ff0000 !important;
}

.radar-logo-wrapper .logo-wrapper:after {
  background: linear-gradient(84deg, #fff3f3 4.85%, #ffe4e4 95.15%) !important;
}

.radar-logo-wrapper .logo-wrapper img {
  filter: brightness(0) saturate(100%) invert(23%) sepia(98%) saturate(7481%)
    hue-rotate(-2deg) brightness(103%) contrast(106%) !important;
}

/* Override background + border colors */
.use-case-breadcrumb-bottom-circle {
  background-color: #fff3f3 !important;
  border: 0.786px solid #ffb3b3 !important;
}

/* .use-case-breadcrumb-bottom-circle::before {
  background-color: #ffecec !important;
  border: 0.786px solid #ffb3b3 !important;
} */

/* Override the blurred glow effect */
.use-case-breadcrumb-bottom-circle::after {
  background: linear-gradient(
    180deg,
    #ff0000 0%,
    rgba(255, 230, 230, 0) 100%
  ) !important;
}

.ai-template-card:after {
  background: linear-gradient(135deg, #ff6600, #ff0000) !important;
  filter: blur(100px) !important;
  opacity: 0;
  transition: all 0.3s;
}

.ai-template-card:hover:after {
  opacity: 0.6 !important;
}



.feature-2-card:hover .feature-2-card-thumb i:after {
  background-color: #ff0000 !important;
}

.feature-2-card:hover .feature-2-card-content {
  background-color: rgba(255, 0, 0, 0.12) !important;
  /* matches previous alpha */
}

.pricing-5-card:hover {
  background-color: rgba(255, 0, 0, 0.12) !important;
  /* replaces #1aff7d1f */
}

.pricing-5-card:hover:before {
  opacity: 1 !important;
  /* unchanged */
}

/* Custom styles */
:root {
  --red: #ff0000;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  background-color: #ffffff;
  color: #333333;
}

.clr-red {
  color: var(--red);
}

.bg-red {
  background-color: var(--red);
}

.brand-button {
  border-radius: 8px;
  transition: transform 0.2s, box-shadow 0.2s;
}

.brand-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(255, 0, 0, 0.3);
}

/* Heading animations */
.heading_heading__Dl_kz {
  overflow: hidden;
}

.heading_floaty-msg-1__3Wj_i {
  top: 20%;
  left: 15%;
  animation: float 8s ease-in-out infinite;
}

.heading_floaty-msg-2__rO1ey {
  top: 25%;
  right: 15%;
  animation: float 10s ease-in-out infinite 1s;
}

.heading_floaty-msg-3__nCmTK {
  bottom: 25%;
  left: 20%;
  animation: float 9s ease-in-out infinite 0.5s;
}

.heading_floaty-msg-4__GIiI_ {
  bottom: 30%;
  right: 20%;
  animation: float 11s ease-in-out infinite 1.5s;
}

@keyframes float {
  0% {
    transform: translateY(0) rotate(0deg);
  }

  25% {
    transform: translateY(-10px) rotate(2deg);
  }

  50% {
    transform: translateY(0) rotate(0deg);
  }

  75% {
    transform: translateY(10px) rotate(-2deg);
  }

  100% {
    transform: translateY(0) rotate(0deg);
  }
}

/* Parallax animations */
.Plx {
  transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.8s ease;
}

.Plx--active {
  opacity: 1;
}

.Plx--in {
  transform: translateY(0) !important;
  opacity: 1 !important;
}

.Plx:not(.Plx--in) {
  opacity: 0;
  transform: translateY(40px);
}

/* Social icons animation */
#social-icons {
  position: relative;
}

#social-icons .Plx {
  transition: transform 1.2s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 1s ease;
  will-change: transform, opacity;
}

/* Social icon hover effect */
#social-icons .Plx:hover {
  transform: scale(1.2) !important;
  z-index: 10;
}

/* Platform icons hover effect */
.platform-icon {
  transition: transform 0.3s ease;
}

.platform-icon:hover {
  transform: translateY(-5px);
}

/* Force light mode */
.dark-mode-only {
  display: none !important;
}

.light-mode-only {
  display: block !important;
}

/* Modern scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: var(--red);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #cc0000;
}

#button-container {
  width: 305px;
  margin: 20px auto;
}
.use-case-breadcrumb-bottom {
  margin-bottom: 0.2rem;
}

#button-background {
  position: relative;
  width: 100%;
  height: 60px;
  background-color: rgba(124, 124, 124, 0.85);
  border-radius: 30px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

.slide-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 18px;
  font-weight: 500;
  z-index: 1;
  white-space: nowrap;
  letter-spacing: 0.5px;
  padding-left: 15px;
}

@media (max-width: 991px) {
  .slide-text {
    font-size: 14px;
    white-space: normal;
    width: 85%;
  }
}
#slider {
  position: absolute;
  left: 0;
  top: 0;
  width: 60px;
  height: 60px;
  background-color: white;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: left 0.3s ease;
}

#phone-icon {
  color: #ff0000;
  font-size: 24px;
  transition: transform 0.3s ease;
}

/* Animation for partial slide */
@keyframes partialSlide {
  0%,
  100% {
    left: 0;
  }

  30% {
    left: 60px;
  }

  40% {
    left: 70px;
  }

  70% {
    left: 0;
  }
}

/* Phone icon animation */
@keyframes phoneAnimation {
  0%,
  100% {
    transform: scale(1);
  }

  30%,
  40% {
    transform: scale(1.2);
  }
}

.animate-slider #slider {
  animation: partialSlide 1.5s ease-in-out infinite;
}

.animate-slider #phone-icon {
  animation: phoneAnimation 3s ease-in-out infinite;
}

.arrow-icon {
  margin-right: 8px;
  font-size: 20px;
}
/* Nuclear reset for footer */
.footer-protected,
.footer-protected * {
  all: revert !important;
  box-sizing: border-box !important;
  position: static !important;
  display: block !important;
}

/* Ensure footer container integrity */
.footer-protected {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  z-index: 9999 !important;
}

/* Neutralize parent containers */
.main-content-wrapper, 
#__next {
  display: block !important;
  min-height: auto !important;
  overflow: visible !important;
  position: static !important;
}

.menu-list a.menu-link,
.menu-list a.menu-link {
  color: #ff0000 !important;
}

