/* KiposTech Design System - Brand Color Palette */

/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800;900&display=swap');

:root {
  /* KiposTech Brand Colors */
  --kipos-light-color: #ffffff;
  --kipos-primary-start: #2D0C8C;
  --kipos-primary-middle: #0f158f;
  --kipos-dark-blue-hover: #102eb0;
  --kipos-primary-end: #AE33DB;
  --kipos-secondary: #932DB9;
  --kipos-accent: #6C52B7;
  --kipos-support-1: #8C50C7;
  --kipos-support-2: #8E51C7;
  --kipos-darkblue-text: #02025e;
  --kipos-dark-heading: #1e293b;
  --background: 0 0% 100%;
  --tw-gradient-from-position: ;
  --tw-gradient-to-position: ;
  --tw-gradient-from: calc(255, 255, 255, 100%);
  --tw-gradient-to: ;



  /* Brand gradients */
  --gradient-primary: linear-gradient(90deg, var(--kipos-primary-start), var(--kipos-primary-end));
  --gradient-primary-diagonal: linear-gradient(135deg, var(--kipos-primary-start), var(--kipos-primary-end));
  --gradient-subtle: linear-gradient(135deg, rgba(45, 12, 140, 0.1), rgba(174, 51, 219, 0.1));
  --gradient-hero: linear-gradient(135deg, var(--kipos-primary-middle), var(--kipos-primary-end));

  /* Brand shadows */
  --shadow-brand: 0 0 50px rgba(174, 51, 219, 0.3);
  --shadow-glow: 0 0 30px rgba(147, 45, 185, 0.2);
  --shadow-elegant: 0 25px 40px -10px rgba(45, 12, 140, 0.15);

  /* KiposTech Brand Colors */
  --kipos-primary-start: 237 81% 31%;
  /* #2D0C8C */
  --kipos-primary-end: 284 78% 52%;
  /* #AE33DB */
  --kipos-secondary: 283 79% 45%;
  /* #932DB9 */
  --kipos-accent: 252 44% 52%;
  /* #6C52B7 */
  --kipos-support-1: 271 56% 55%;
  /* #8C50C7 */
  --kipos-support-2: 271 56% 55%;
  /* #8E51C7 */

  /* Brand gradients */
  --gradient-primary: linear-gradient(90deg, hsl(var(--kipos-primary-start)), hsl(var(--kipos-primary-end)));
  --gradient-primary-diagonal: linear-gradient(135deg, hsl(var(--kipos-primary-start)), hsl(var(--kipos-primary-end)));
  --gradient-subtle: linear-gradient(135deg, hsl(var(--kipos-primary-start) / 0.1), hsl(var(--kipos-primary-end) / 0.1));
  --gradient-hero: linear-gradient(135deg, hsl(var(--kipos-primary-start)), hsl(var(--kipos-primary-end)));

  /* Semantic colors */
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --background-dark: 260 40% 8%;

  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;

  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;

  --primary: 237 81% 31%;
  --primary-foreground: 0 0% 100%;

  --secondary: 283 79% 45%;
  --secondary-foreground: 0 0% 100%;

  --muted: 220 15% 96%;
  --muted-foreground: 240 95% 19%;
  /* Dark blue #010160 */

  --accent: 252 44% 52%;
  --accent-foreground: 0 0% 100%;

  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;

  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 237 81% 31%;

  --radius: 0.75rem;

  /* Brand shadows */
  --shadow-brand: 0 0 50px hsl(var(--kipos-primary-end) / 0.3);
  --shadow-glow: 0 0 30px hsl(var(--kipos-secondary) / 0.2);
  --shadow-elegant: 0 20px 40px -10px hsl(var(--kipos-primary-start) / 0.15);

  --sidebar-background: 0 0% 98%;

  --sidebar-foreground: 240 5.3% 26.1%;

  --sidebar-primary: 240 5.9% 10%;

  --sidebar-primary-foreground: 0 0% 98%;

  --sidebar-accent: 240 4.8% 95.9%;

  --sidebar-accent-foreground: 240 5.9% 10%;

  --sidebar-border: 220 13% 91%;

  --sidebar-ring: 217.2 91.2% 59.8%;
}


}



/* Typography Classes */
.heading-1 {
  font-size: 80px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  font-weight: 900;
  text-align: center;
}

.heading-3 {
  font-size: 48px;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
}

.heading-4 {
  font-size: 30px;
  line-height: 1.5;
  font-weight: 600;
  text-align: center;
}

.text-muted-foreground {
  color: var(--kipos-darkblue-text);
}

.montserrat-font {
  font-family: Montserrat, Inter, sans-serif;
}

.inter-font {
  font-family: Inter, sans-serif;
}

.bg-primary {
  background-color: hsl(var(--primary));
}

.dark-heading-text {
  color: var(--kipos-dark-heading);
}

.brand {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.red {
  color: #e52c00 !important;
}
.green {
   color: #1c851c !important;
}
.maroon {
  color: #9b18cd !important;
}
.blue {
   color: #0f18c5 !important;
}
.brown {
   color: #bf6506 !important;
}

.heading-hero {
  font-size: clamp(3.5rem, 10vw, 7rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  font-weight: 900;
  font-family: 'Montserrat', 'Inter', sans-serif;
}

@media (max-width: 1300px) {
  .heading-hero {
    font-size: 103px;
  }
}

@media (max-width: 1200px) {
  .heading-hero {
    font-size: 78px;
  }
}

@media (max-width: 768px) {
  .heading-hero {
    font-size: 43px;
  }
}



.heading-impact {
  font-size: clamp(2.8rem, 7vw, 5rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 900;
  font-family: 'Montserrat', 'Inter', sans-serif;
}

.metric-large {
  font-size: clamp(3rem, 6vw, 5rem);
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 900;
  font-family: 'Montserrat', 'Inter', sans-serif;
}

.text-primary {
  color: hsl(var(--primary));
}

.text-secondary {
  color: hsl(var(--secondary));
}

.bg-card {
  background-color: var(--card);
}

.from-primary {
  --tw-gradient-from: hsl(var(--primary) / .05) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

ul.productWishlist {
  display: flex;
  flex-direction: column;
  grid-gap: 12px;
  margin: 0;
  list-style: none;
}

ul.productWishlist li {
  color: #010160;
  font-size: 16px;
  position: relative;
  font-weight: 400;
  font-family: Inter, sans-serif;
}

ul.productWishlist li span {
  font-weight: 500;
  padding-right: 6px;
  color: #02081e;
}

ul.productWishlist li:before {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 30px;
  left: 0px;
  top: 8px;
}

ul.productWishlist li:nth-child(1):before {
  background-color: #0f158f;
}

ul.productWishlist li:nth-child(2):before {
  background-color: #9a18cd;
}

ul.productWishlist li:nth-child(3):before {
  background-color: #644fba;
}

.to-secondary {
  --tw-gradient-to: hsl(var(--secondary) / .05) var(--tw-gradient-to-position);
}

.bg-muted {
  background-color: hsl(var(--muted) / .5);
}

.border-primary {
  border-color: hsl(var(--primary) / .2);
}

.brand-text {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.brand-gradient {
  background: var(--gradient-primary);
}

/* Button Styles */
.cta-primary {
  background: var(--gradient-primary);
  font-family: "Inter", Sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  border: none;
  border-radius: 12px;
  padding: 17px 48px;
  font-weight: bold;
  transition: all 0.3s ease;
  box-shadow: var(--shadow-elegant);
}

@media (max-width: 767px) {
  .cta-primary {
    font-size: 16px;
    padding: 17px 40px;
  }
}

.cta-primary:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-brand);
}

.plasma-glow {
  background: var(--gradient-primary);
  border: none;
  border-radius: 12px;
  padding: 12px 24px;
  font-weight: 600;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.plasma-glow::before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: var(--gradient-primary);
  border-radius: 14px;
  z-index: -1;
  filter: blur(8px);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.plasma-glow:hover::before {
  opacity: 0.7;
}

.brand-glow {
  box-shadow: var(--shadow-brand);
}

/* Background Classes */
.hero-bg {
  background: var(--gradient-hero);
  position: relative;
}

.hero-bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--gradient-subtle);
  opacity: 0.8;
}

/* Recognition logo effects */
.recognition-logo {
  transition: all 0.3s ease;
  border: 2px solid transparent;
  background: linear-gradient(white, white) padding-box, var(--gradient-primary) border-box;
  border-radius: 12px;
  padding: 16px;
}

.recognition-logo:hover {
  box-shadow: var(--shadow-glow);
  transform: translateY(-2px);
}

/* Navigation */
.nav-fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 50;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.from-background {
  --tw-gradient-from: hsl(var(--background)) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(var(--background) / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.b

/* Animations */
.float {
  animation: float 6s ease-in-out infinite;
}

.pulse-brand {
  animation: pulse-brand 2s ease-in-out infinite;
}

.fade-in-up {
  animation: fade-in-up 0.6s ease-out forwards;
  opacity: 0;
  transform: translateY(30px);
}

/* Mobile menu */
.mobile-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: white;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.mobile-menu.active {
  display: block;
}

/* Utility Classes */
.text-shadow-glow {
  text-shadow: 0 0 20px rgba(147, 45, 185, 0.5);
}

/* Responsive Grid */
.grid-responsive {
  display: grid;
  gap: 2rem;
}

/*   contact page   */
.contactForm label {
  color: #020817;
  font-size: 14px;
  font-weight: 500;
  font-family: "Inter", Sans-serif;
  margin-bottom: 20px;
  display: block;
}

.contactForm label .wpcf7-form-control-wrap {
  display: block;
  margin-top: 4px;
}

.contactForm input,
.contactForm select {
  border: 1px solid #e2e8f0;
  box-shadow: none;
  border-radius: 8px;
  padding: 10px 15px !important;
  height: auto;
  color: #02083c;
  font-family: "Inter", Sans-serif;
  width: 100%;
}

.contactForm textarea {
  border: 1px solid #e2e8f0;
  box-shadow: none;
  border-radius: 8px;
  padding: 10px 15px !important;
  resize: none;
  height: 200px;
  color: #02083c;
  font-family: "Inter", Sans-serif;
  width: 100%;
}

.contactForm input[type='submit'] {
  background: var(--kipos-primary-middle);
  color: var(--kipos-light-color);
  border-radius: 8px;
  width: 100%;
  max-width: 100%;
  border: none;
  font-size: 20px;
  font-weight: 500;
  font-family: "Inter", Sans-serif;
  cursor: pointer;
}

.contactForm input[type='submit']:hover,
button.bg-primary:hover {
  background: var(--kipos-dark-blue-hover);
  color: var(--kipos-light-color);
}

/* news */
/* .press-release-section {
  background-image: linear-gradient(90deg, #0F158F0D 0%, #9A18CD0D 100%);
} */

.press-release-section .bg-card {
  background-color: var(--kipos-light-color);
}

.press-release-section .bg-card .aspect-video {
  background-image: linear-gradient(230deg, #9A18CD1A 0%, #0F158F1A 100%);
  padding: 10px 20px;
}

.press-release-section .bg-card .aspect-video img {
  max-height: 150px;
}

.press-release-section .bg-card .badge.badge-secondary {
  font-family: "Inter", Sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  background-color: #9A18CD;
  margin: 0px 0px 20px 0px;
  padding: 2px 10px 2px 10px;
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  border-color: #0F158F33;
  border-radius: 9999px 9999px 9999px 9999px;
  color: #fff;
  display: inline-block;
}

.press-release-section .bg-card a {
  background-color: #61CE7000;
  font-family: "Inter", Sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: var(--e-global-color-astglobalcolor2);
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  border-color: #E2E8F0;
  border-radius: 8px 8px 8px 8px;
  padding: 8px 12px 8px 12px;
}

@media (min-width: 768px) {
  .grid-responsive.md-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .grid-responsive.lg-2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .grid-responsive.lg-3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Keyframes */
@keyframes float {

  0%,
  100% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-10px);
  }
}

@keyframes pulse-brand {

  0%,
  100% {
    box-shadow: 0 0 20px rgba(174, 51, 219, 0.3);
  }

  50% {
    box-shadow: 0 0 40px rgba(174, 51, 219, 0.6);
  }
}

@keyframes fade-in-up {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ul list technology */

.bg-secondary {
  background-color: #9a18cd;
}

.bg-accent {
  background-color: #644fba;
}

/* ul list technology */