.elementor-2228 .elementor-element.elementor-element-b3cd79e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;--overlay-opacity:0.6;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2228 .elementor-element.elementor-element-b3cd79e::before, .elementor-2228 .elementor-element.elementor-element-b3cd79e > .elementor-background-video-container::before, .elementor-2228 .elementor-element.elementor-element-b3cd79e > .e-con-inner > .elementor-background-video-container::before, .elementor-2228 .elementor-element.elementor-element-b3cd79e > .elementor-background-slideshow::before, .elementor-2228 .elementor-element.elementor-element-b3cd79e > .e-con-inner > .elementor-background-slideshow::before, .elementor-2228 .elementor-element.elementor-element-b3cd79e > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';background-image:url("https://peacocky.club/wp-content/uploads/2025/08/66aa99f5992013d8ae77d6cb_texture-p-500.webp");}.elementor-2228 .elementor-element.elementor-element-747dd7a{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-2228 .elementor-element.elementor-element-590a0f3{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2228 .elementor-element.elementor-element-590a0f3.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-2228 .elementor-element.elementor-element-c2e531d img{width:75%;}.elementor-2228 .elementor-element.elementor-element-179ca11{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2228 .elementor-element.elementor-element-179ca11.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-menu-toggle{margin-left:auto;background-color:#00FFE7;}.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu .elementor-item{font-family:"text", Sans-serif;font-size:15px;font-weight:500;}.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item{color:#FFFFFF;fill:#FFFFFF;}.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item:focus{color:#00CDDA;fill:#00CDDA;}.elementor-2228 .elementor-element.elementor-element-ce741c3 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#00CDDA;}.elementor-2228 .elementor-element.elementor-element-ce741c3 div.elementor-menu-toggle{color:#000000;}.elementor-2228 .elementor-element.elementor-element-ce741c3 div.elementor-menu-toggle svg{fill:#000000;}.elementor-2228 .elementor-element.elementor-element-f5849c5{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--background-transition:0.3s;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2228 .elementor-element.elementor-element-aa968f2 .elementor-button{font-family:"text", Sans-serif;font-size:22px;font-weight:700;background-color:#0D8A9E;border-style:none;border-radius:28px 28px 28px 28px;padding:13px 35px 13px 35px;}.elementor-2228 .elementor-element.elementor-element-aa968f2{width:var( --container-widget-width, 86% );max-width:86%;--container-widget-width:86%;--container-widget-flex-grow:0;}.elementor-2228 .elementor-element.elementor-element-52c6679{--display:flex;--min-height:80vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--background-transition:0.3s;--overlay-opacity:0.81;}.elementor-2228 .elementor-element.elementor-element-52c6679::before, .elementor-2228 .elementor-element.elementor-element-52c6679 > .elementor-background-video-container::before, .elementor-2228 .elementor-element.elementor-element-52c6679 > .e-con-inner > .elementor-background-video-container::before, .elementor-2228 .elementor-element.elementor-element-52c6679 > .elementor-background-slideshow::before, .elementor-2228 .elementor-element.elementor-element-52c6679 > .e-con-inner > .elementor-background-slideshow::before, .elementor-2228 .elementor-element.elementor-element-52c6679 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';background-image:url("https://peacocky.club/wp-content/uploads/2025/08/66aa99f5992013d8ae77d6cb_texture-p-500.webp");}.elementor-2228 .elementor-element.elementor-element-75ea57d{--display:flex;--background-transition:0.3s;}.elementor-2228 .elementor-element.elementor-element-d0ecc75{--display:flex;--background-transition:0.3s;}.elementor-2228 .elementor-element.elementor-element-798947b{text-align:center;}.elementor-2228 .elementor-element.elementor-element-798947b .elementor-heading-title{color:#FFFFFF;font-family:"yourmate", Sans-serif;font-size:46px;font-weight:600;}.elementor-2228 .elementor-element.elementor-element-c0b166d{--display:flex;--background-transition:0.3s;}.elementor-2228 .elementor-element.elementor-element-6f71d7a > .elementor-widget-container{padding:7px 0px 0px 0px;}body.elementor-page-2228:not(.elementor-motion-effects-element-type-background), body.elementor-page-2228 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0A0F2C;}@media(max-width:767px){.elementor-2228 .elementor-element.elementor-element-747dd7a{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:15px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-2228 .elementor-element.elementor-element-590a0f3{--width:50%;}.elementor-2228 .elementor-element.elementor-element-179ca11{--width:40%;}.elementor-2228 .elementor-element.elementor-element-ce741c3{--nav-menu-icon-size:26px;}.elementor-2228 .elementor-element.elementor-element-aa968f2{--container-widget-width:285px;--container-widget-flex-grow:0;width:var( --container-widget-width, 285px );max-width:285px;}.elementor-2228 .elementor-element.elementor-element-75ea57d{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2228 .elementor-element.elementor-element-d0ecc75{--margin-top:20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-2228 .elementor-element.elementor-element-798947b .elementor-heading-title{font-size:30px;}}@media(min-width:768px){.elementor-2228 .elementor-element.elementor-element-b3cd79e{--content-width:1300px;}.elementor-2228 .elementor-element.elementor-element-590a0f3{--width:15.625%;}.elementor-2228 .elementor-element.elementor-element-179ca11{--width:63.525%;}.elementor-2228 .elementor-element.elementor-element-52c6679{--content-width:1300px;}}/* Start custom CSS for button, class: .elementor-element-aa968f2 */.elementor-2228 .elementor-element.elementor-element-aa968f2 {
  border: 2px solid #ffffff; /* white border by default */
  border-radius: 50px;       /* optional: rounded button */
  transition: all 0.3s ease;
}

.elementor-2228 .elementor-element.elementor-element-aa968f2:hover {
  transform: translateY(-6px);
  border-color: #00ffe7; /* glowing teal border on hover */
  box-shadow: 0 10px 25px rgba(0, 255, 231, 0.25);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6f71d7a *//* Fonts (optional, futuristic) */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@600&display=swap');

.roadmap-section {
  position: relative;
  padding: 10px 30px;
  
  color: #ffffff;
  font-family: text;
  text-align: left;
  overflow: hidden;
}

.roadmap-heading {
  font-size: 3.5rem;
  font-family: yourmate;
  text-align: center;
  margin-bottom: 60px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #ffffff;
}

.roadmap-phase {
  background: rgba(13, 138, 158, 0.1);
  border: 2px solid #ffffff;
  border-radius: 20px;
  padding: 30px 25px;
  margin-bottom: 40px;
  backdrop-filter: blur(12px);
  transition: all 0.3s ease;
}

.roadmap-phase h3 {
  font-size: 2rem;
  color: #FF9A33;
  margin-bottom: 15px;
}

.roadmap-phase p {
  font-size: 1rem;
  color: #fffff;
  margin-bottom: 20px;
}

.roadmap-phase ul {
  list-style: none;
  padding-left: 0;
}

.roadmap-phase li {
  margin-bottom: 20px;
  font-size: 1rem;
}

.roadmap-phase li strong {
  color: #00ffe7;
}

.roadmap-phase li span {
  display: block;
  color: #fff;
  margin-top: 5px;
}

.roadmap-phase.future {
  border: 2px dashed #00ffe7;
}

.peak-line {
  text-align: center;
  margin-top: 60px;
}

.peak-line h3 {
  font-size: 2rem;
  color: #FF9A33;
  margin-bottom: 10px;
}

.peak-line p {
  font-size: 1.1rem;
  color: #fff;
}

.x-bubble {
  position: absolute;
  top: -20px; /* adjust so it doesn't overlap */
  right: 20px;
  background: #00ffe7;
  color: #000;
  font-weight: bold;
  padding: 8px 16px;
  border-radius: 50px;
  font-size: 0.9rem;
  box-shadow: 0 0 20px rgba(0, 255, 231, 0.6);
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.1); opacity: 0.85; }
  100% { transform: scale(1); opacity: 1; }
}

/* Responsive */
@media (max-width: 768px) {
  .roadmap-section {
    padding: 0px 10px;
  }

  .roadmap-heading {
    font-size: 2rem;
  }

  
}

.roadmap-phase.future {
  position: relative;
  border: 2px dashed #00ffe7;
}

/* Beautiful 'Coming Soon' tag on top-left corner */
.roadmap-phase.future::before {
  content: '🚧 Coming Soon';
  position: absolute;
  top: -12px;
  left: 20px;
  background: #00ffe7;
  color: #000;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 30px;
  box-shadow: 0 0 10px rgba(0, 255, 231, 0.4);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  z-index: 10;
}



.elementor-2228 .elementor-element.elementor-element-6f71d7a .peak-line {
  position: relative;
  text-align: center;
  margin-top: 60px;
}

/* 1. Two columns on desktop */
@media (min-width: 769px) {
  .roadmap-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
  }

  .roadmap-phase {
    flex: 1 1 calc(50% - 30px); /* Two equal columns with gap */
    max-width: calc(50% - 30px);
    margin-bottom: 0; /* remove extra bottom space */
  }
}

@media (max-width: 768px) {
  .x-bubble {
    position: relative !important; /* remove absolute positioning */
    top: auto !important;
    right: auto !important;
    display: inline-block;
    margin: 10px auto 15px auto;
  }

  .peak-line {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

/* Fix x-bubble overlap on desktop without affecting layout */
@media (min-width: 769px) {
  .x-bubble {
    top: -40px; /* move it higher so it clears the heading */
    right: 40%; /* center horizontally above heading */
    transform: translateX(120%); /* adjust from center to the right */
  }
}/* End custom CSS */