.elementor-633 .elementor-element.elementor-element-25938e5 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-633 .elementor-element.elementor-element-06a4bc4 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-06a4bc4{text-align:right;}.elementor-633 .elementor-element.elementor-element-06a4bc4 img{opacity:0.3;}.elementor-633 .elementor-element.elementor-element-18d34ae{text-align:left;}.elementor-633 .elementor-element.elementor-element-18d34ae img{opacity:0.35;}.elementor-633 .elementor-element.elementor-element-b660814 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-4e2aef1 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-4e2aef1{text-align:right;}.elementor-633 .elementor-element.elementor-element-4e2aef1 img{opacity:0.3;}.elementor-633 .elementor-element.elementor-element-d67fae9 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-d67fae9{text-align:left;}.elementor-633 .elementor-element.elementor-element-d67fae9 img{opacity:0.3;}.elementor-633 .elementor-element.elementor-element-20fa04e{margin-top:-365px;margin-bottom:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-633 .elementor-element.elementor-element-8bad2dc > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-8bad2dc{text-align:right;}.elementor-633 .elementor-element.elementor-element-8bad2dc .elementor-heading-title{font-family:"neue-montreal-light", Sans-serif;font-size:80px;font-weight:normal;text-transform:none;line-height:114px;letter-spacing:-1.2px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-8bad2dc .elementor-heading-title a{transition-duration:0s;}.elementor-633 .elementor-element.elementor-element-4aabc66 > .elementor-widget-container{margin:32px 0px 32px 0px;padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-4aabc66{text-align:center;}.elementor-633 .elementor-element.elementor-element-9b8df30{text-align:left;}.elementor-633 .elementor-element.elementor-element-9b8df30 .elementor-heading-title{font-family:"neue-montreal-light", Sans-serif;font-size:80px;font-weight:normal;text-transform:none;font-style:normal;line-height:114px;letter-spacing:-1.2px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-9b8df30 .elementor-heading-title a{transition-duration:0s;}.elementor-633 .elementor-element.elementor-element-a719d21{margin-top:175px;margin-bottom:175px;}.elementor-633 .elementor-element.elementor-element-2947fdf > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-2947fdf{text-align:center;}.elementor-633 .elementor-element.elementor-element-2947fdf .elementor-heading-title{font-family:"neue-montreal-light", Sans-serif;font-size:21px;font-weight:300;text-transform:none;font-style:normal;line-height:120px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-633 .elementor-element.elementor-element-92f8c5a .elementor-button-content-wrapper{flex-direction:row;}.elementor-633 .elementor-element.elementor-element-92f8c5a .elementor-button .elementor-button-content-wrapper{gap:20px;}.elementor-633 .elementor-element.elementor-element-92f8c5a .elementor-button{font-family:"neue-montreal-light", Sans-serif;font-weight:200;text-transform:none;letter-spacing:0px;border-style:solid;border-color:#323232;}.elementor-633 .elementor-element.elementor-element-f0bcb38{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-633 .elementor-element.elementor-element-f0bcb38 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-633 .elementor-element.elementor-element-c9db3e8{width:100%;max-width:100%;}.elementor-633 .elementor-element.elementor-element-c9db3e8 > .elementor-widget-container{margin:-85px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-ecb7698 > .elementor-widget-container{margin:-942px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-ecb7698{text-align:center;}.elementor-633 .elementor-element.elementor-element-ecb7698 .elementor-heading-title{font-family:"neue-montreal-light", Sans-serif;font-size:60px;font-weight:300;text-transform:none;line-height:140px;letter-spacing:0px;color:#EFEEEC;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-633 .elementor-element.elementor-element-1c87600 > .elementor-widget-container{margin:-900px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-1c87600{text-align:center;font-family:"neue-montreal-light", Sans-serif;font-size:94px;font-weight:300;text-transform:none;font-style:normal;line-height:30px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-8d27f2f > .elementor-widget-container{margin:-840px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-8d27f2f{text-align:center;font-family:"neue-montreal-light", Sans-serif;font-size:94px;font-weight:300;line-height:140px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-707c9eb > .elementor-widget-container{margin:-595px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-707c9eb{text-align:center;font-family:"neue-montreal-light", Sans-serif;font-size:94px;font-weight:300;line-height:140px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-cda0cdb{font-family:"Roboto Mono", Sans-serif;font-size:14px;font-weight:400;line-height:12.8px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-4f31774{text-align:center;}.elementor-633 .elementor-element.elementor-element-a4e875e .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:60px;font-weight:400;text-transform:none;line-height:60px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-be195b3{--spacer-size:118px;}.elementor-633 .elementor-element.elementor-element-d961c6e .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:36px;font-weight:400;text-transform:none;line-height:140px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-2ffa7c6 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:20px;font-weight:400;text-transform:none;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-03adece .elementor-button .elementor-button-content-wrapper{gap:20px;}.elementor-633 .elementor-element.elementor-element-03adece .elementor-button{font-family:"neue-montreal-light", Sans-serif;font-size:19px;font-weight:300;line-height:50px;letter-spacing:0px;fill:var( --e-global-color-text );color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-9376767{font-family:"Roboto Mono", Sans-serif;font-size:14px;font-weight:400;line-height:12.8px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-3c62c36{text-align:center;}.elementor-633 .elementor-element.elementor-element-eec70ab .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:60px;font-weight:400;text-transform:none;line-height:60px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-b5494da{--spacer-size:41px;}.elementor-633 .elementor-element.elementor-element-3f681ac .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:36px;font-weight:400;text-transform:none;line-height:140px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-34cd677 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:20px;font-weight:400;text-transform:none;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-45e9f18 .elementor-button .elementor-button-content-wrapper{gap:20px;}.elementor-633 .elementor-element.elementor-element-45e9f18 .elementor-button{font-family:"neue-montreal-light", Sans-serif;font-size:19px;font-weight:300;line-height:50px;letter-spacing:0px;fill:var( --e-global-color-text );color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-dec1adf{font-family:"Roboto Mono", Sans-serif;font-size:14px;font-weight:400;line-height:12.8px;letter-spacing:0px;color:#EFEEEC;}.elementor-633 .elementor-element.elementor-element-ba2b49b{text-align:center;}.elementor-633 .elementor-element.elementor-element-dace546 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:60px;font-weight:400;text-transform:none;line-height:60px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-6175d7d{--spacer-size:59px;}.elementor-633 .elementor-element.elementor-element-82bf567 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:36px;font-weight:400;text-transform:none;line-height:140px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-e67bd80 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:20px;font-weight:400;text-transform:none;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-ce6c972 .elementor-button .elementor-button-content-wrapper{gap:20px;}.elementor-633 .elementor-element.elementor-element-ce6c972 .elementor-button{font-family:"neue-montreal-light", Sans-serif;font-size:19px;font-weight:300;line-height:50px;letter-spacing:0px;fill:var( --e-global-color-text );color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-a1a4262{--spacer-size:215px;}.elementor-633 .elementor-element.elementor-element-8158461{text-align:center;}.elementor-633 .elementor-element.elementor-element-8158461 .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:60px;font-weight:400;text-transform:none;line-height:140px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-03c1b3c{text-align:center;}.elementor-633 .elementor-element.elementor-element-03c1b3c .elementor-heading-title{font-family:"neue-montreal", Sans-serif;font-size:36px;font-weight:400;text-transform:none;line-height:60px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-5a85c01{width:var( --container-widget-width, 103.929% );max-width:103.929%;--container-widget-width:103.929%;--container-widget-flex-grow:0;text-align:center;}.elementor-633 .elementor-element.elementor-element-5a85c01 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-633 .elementor-element.elementor-element-5a85c01 .elementor-heading-title{font-family:"neue-montreal-light", Sans-serif;font-size:20px;font-weight:200;text-transform:none;line-height:35px;letter-spacing:0px;color:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-ed9f459{--e-image-carousel-slides-to-show:3;}.elementor-633 .elementor-element.elementor-element-ed9f459 .elementor-swiper-button.elementor-swiper-button-prev, .elementor-633 .elementor-element.elementor-element-ed9f459 .elementor-swiper-button.elementor-swiper-button-next{font-size:30px;color:var( --e-global-color-primary );}.elementor-633 .elementor-element.elementor-element-ed9f459 .elementor-swiper-button.elementor-swiper-button-prev svg, .elementor-633 .elementor-element.elementor-element-ed9f459 .elementor-swiper-button.elementor-swiper-button-next svg{fill:var( --e-global-color-primary );}.elementor-633 .elementor-element.elementor-element-ed9f459 .swiper-pagination-bullet:not(.swiper-pagination-bullet-active){background:var( --e-global-color-primary );opacity:var( --e-global-color-primary );}.elementor-633 .elementor-element.elementor-element-ed9f459 .swiper-pagination-bullet{background:var( --e-global-color-text );}.elementor-633 .elementor-element.elementor-element-3247103 .elementor-button{background-color:#000000;font-family:"neue-montreal-light", Sans-serif;font-size:20px;font-weight:200;line-height:20px;letter-spacing:0px;fill:#EFEEEC;color:#EFEEEC;border-style:solid;border-color:#323232;}.elementor-633 .elementor-element.elementor-element-3247103 .elementor-button-content-wrapper{flex-direction:row;}.elementor-633 .elementor-element.elementor-element-3247103 .elementor-button .elementor-button-content-wrapper{gap:20px;}.elementor-633 .elementor-element.elementor-element-0231e11{--spacer-size:215px;}@media(min-width:768px){.elementor-633 .elementor-element.elementor-element-69ff922{width:44.995%;}.elementor-633 .elementor-element.elementor-element-5c5f9d3{width:9.631%;}.elementor-633 .elementor-element.elementor-element-3c6fcff{width:44.996%;}.elementor-633 .elementor-element.elementor-element-05e90db{width:50%;}.elementor-633 .elementor-element.elementor-element-30cccb2{width:49.932%;}.elementor-633 .elementor-element.elementor-element-1eaf3a2{width:50%;}.elementor-633 .elementor-element.elementor-element-8b16ae4{width:49.932%;}.elementor-633 .elementor-element.elementor-element-bcd087e{width:50%;}.elementor-633 .elementor-element.elementor-element-5785546{width:49.932%;}}






























.bubbles-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 600px;
  overflow: visible;
  z-index: 1;
}

.bubble {
  position: absolute;
  top: -800px; /* Your adjusted starting height */
  left: 41%;
  transform: translateX(-50%) translateY(-300px) rotate(0deg); /* Increased initial offset */
  opacity: 0;
  padding: 1rem 2rem;
  border-radius: 50px;
  font-family: 'Roboto Mono', monospace;
  font-weight: 300;
  font-size: 20px;
  letter-spacing: 0px;
  line-height: 100%;
  text-align: center;
  min-width: 200px;
  animation: dropAndBounce 2s cubic-bezier(0.5, 0, 0.7, 0.2) forwards; /* Stronger gravity easing */
  animation-fill-mode: both;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4); /* Deeper shadow for weight */
}

/* Stagger animations and per-bubble variables with adjusted spacing and assignments */
.orange {
  animation-delay: 0s;
  --final-x: 95%; /* Your adjusted position for top */
  --final-y: 240px; /* Top position */
  --final-rot: 0deg; /* Your adjusted angle */
  z-index: 1;
}
.purple {
  animation-delay: 0.3s;
  --final-x: 0%; /* Your adjusted position for middle */
  --final-y: 220px; /* Middle position */
  --final-rot: -15deg; /* Your adjusted angle */
  z-index: 2;
}
.blue {
  animation-delay: 0.6s;
  --final-x: 90%; /* Your adjusted position for bottom */
  --final-y: 165px; /* Bottom position */
  --final-rot: 16deg; /* Your adjusted angle */
  z-index: 3;
}

/* Gradients matching your design */
.blue {
  background: linear-gradient(to right, #003BFF 0%, #3766FF 100%);
  color: white;
}
.purple {
  background: linear-gradient(to right, #8400FF 0%, #BF57FF 100%);
  color: white;
}
.orange {
  background: linear-gradient(to right, #F56D00 0%, #FFA100 100%);
  color: white;
}

@keyframes dropAndBounce {
  0% {
    transform: translateX(-50%) translateY(-300px) rotate(0deg);
    opacity: 0;
  }
  20% {
    opacity: 1;
    transform: translateX(calc(var(--final-x, -50%) - 50%)) translateY(calc(var(--final-y, 220px) * 0.1)) rotate(var(--final-rot, 0deg));
  }
  50% {
    transform: translateX(calc(var(--final-x, -50%) - 50% + 15px)) translateY(calc(var(--final-y, 220px) * 0.9 + 30px)) rotate(calc(var(--final-rot, 0deg) * 1.5)); /* Reduced overshoot */
  }
  80% {
    transform: translateX(calc(var(--final-x, -50%) - 50% - 10px)) translateY(calc(var(--final-y, 220px) - 10px)) rotate(var(--final-rot, 0deg)); /* Shallower bounce */
  }
  100% {
    transform: translateX(calc(var(--final-x, -50%) - 50%)) translateY(var(--final-y, 220px)) rotate(var(--final-rot, 0deg));
    opacity: 1;
  }
}













.features-tabs-container {
  position: relative;
  height: 300vh; /* 3 sections × 100vh */
  overflow: hidden;
}

/* Base styling for each feature section */
#songwriting-ai, #social-network, #marketplace {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
  padding: 2rem;
  box-sizing: border-box;
}

/* Active section styling */
#songwriting-ai.active, #social-network.active, #marketplace.active {
  opacity: 1;
  visibility: visible;
}

/* Position each section vertically */
#songwriting-ai {
  background: linear-gradient(135deg, #003BFF 0%, #3766FF 100%);
  z-index: 3;
  top: 0vh;
}

#social-network {
  background: linear-gradient(135deg, #8400FF 0%, #BF57FF 100%);
  z-index: 2;
  top: 100vh;
}

#marketplace {
  background: linear-gradient(135deg, #F56D00 0%, #FFA100 100%);
  z-index: 1;
  top: 200vh;
}

/* Section content styling */
.feature-title {
  font-size: 3rem;
  font-weight: bold;
  color: white;
  margin: 1rem 0;
  text-align: center;
}

.feature-subtitle {
  font-size: 1.5rem;
  color: white;
  margin-bottom: 2rem;
  text-align: center;
}

.feature-description {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  margin-bottom: 2rem;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.learn-more-btn {
  background: #FF6600;
  color: white;
  border: none;
  padding: 1rem 2rem;
  border-radius: 50px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.3s ease;
  margin: 0 auto;
  display: block;
}

.learn-more-btn:hover {
  background: #E55A00;
}

/* Features sidebar */
.features-sidebar {
  position: absolute;
  left: 2rem;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 500;
  z-index: 10;
}

/* Circular graphics positioning */
.feature-graphic {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  opacity: 0.3;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  #songwriting-ai, #social-network, #marketplace {
    height: 80vh;
    padding: 1rem;
  }
  
  .features-tabs-container {
    height: 240vh; /* 3 × 80vh */
  }
  
  #social-network {
    top: 80vh;
  }
  
  #marketplace {
    top: 160vh;
  }
  
  .feature-title {
    font-size: 2rem;
  }
  
  .features-sidebar {
    left: 1rem;
    font-size: 0.8rem;
  }
}











.features-tabs-container {
  position: relative;
  height: 300vh; /* 3 sections × 100vh */
  overflow: hidden;
}

/* Base styling for each feature section */
#songwriting-ai, #social-network, #marketplace {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
  padding: 2rem;
  box-sizing: border-box;
}

/* Active section styling */
#songwriting-ai.active, #social-network.active, #marketplace.active {
  opacity: 1;
  visibility: visible;
}

/* Position each section vertically */
#songwriting-ai {
  background: linear-gradient(135deg, #003BFF 0%, #3766FF 100%);
  z-index: 3;
  top: 0vh;
}

#social-network {
  background: linear-gradient(135deg, #8400FF 0%, #BF57FF 100%);
  z-index: 2;
  top: 100vh;
}

#marketplace {
  background: linear-gradient(135deg, #F56D00 0%, #FFA100 100%);
  z-index: 1;
  top: 200vh;
}

/* Section content styling */
.feature-title {
  font-size: 3rem;
  font-weight: bold;
  color: white;
  margin: 1rem 0;
  text-align: center;
}

.feature-subtitle {
  font-size: 1.5rem;
  color: white;
  margin-bottom: 2rem;
  text-align: center;
}

.feature-description {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  margin-bottom: 2rem;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.learn-more-btn {
  background: #FF6600;
  color: white;
  border: none;
  padding: 1rem 2rem;
  border-radius: 50px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.3s ease;
  margin: 0 auto;
  display: block;
}

.learn-more-btn:hover {
  background: #E55A00;
}

/* Features sidebar */
.features-sidebar {
  position: absolute;
  left: 2rem;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 500;
  z-index: 10;
}

/* Circular graphics positioning */
.feature-graphic {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  opacity: 0.3;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  #songwriting-ai, #social-network, #marketplace {
    height: 80vh;
    padding: 1rem;
  }
  
  .features-tabs-container {
    height: 240vh; /* 3 × 80vh */
  }
  
  #social-network {
    top: 80vh;
  }
  
  #marketplace {
    top: 160vh;
  }
  
  .feature-title {
    font-size: 2rem;
  }
  
  .features-sidebar {
    left: 1rem;
    font-size: 0.8rem;
  }
}











.features-tabs-container {
  position: relative;
  height: 300vh; /* 3 sections × 100vh */
  overflow: hidden;
}

/* Base styling for each feature section */
#songwriting-ai, #social-network, #marketplace {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
  padding: 2rem;
  box-sizing: border-box;
}

/* Active section styling */
#songwriting-ai.active, #social-network.active, #marketplace.active {
  opacity: 1;
  visibility: visible;
}

/* Position each section vertically */
#songwriting-ai {
  background: linear-gradient(135deg, #003BFF 0%, #3766FF 100%);
  z-index: 3;
  top: 0vh;
}

#social-network {
  background: linear-gradient(135deg, #8400FF 0%, #BF57FF 100%);
  z-index: 2;
  top: 100vh;
}

#marketplace {
  background: linear-gradient(135deg, #F56D00 0%, #FFA100 100%);
  z-index: 1;
  top: 200vh;
}

/* Section content styling */
.feature-title {
  font-size: 3rem;
  font-weight: bold;
  color: white;
  margin: 1rem 0;
  text-align: center;
}

.feature-subtitle {
  font-size: 1.5rem;
  color: white;
  margin-bottom: 2rem;
  text-align: center;
}

.feature-description {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  margin-bottom: 2rem;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.learn-more-btn {
  background: #FF6600;
  color: white;
  border: none;
  padding: 1rem 2rem;
  border-radius: 50px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.3s ease;
  margin: 0 auto;
  display: block;
}

.learn-more-btn:hover {
  background: #E55A00;
}

/* Features sidebar */
.features-sidebar {
  position: absolute;
  left: 2rem;
  top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 500;
  z-index: 10;
}

/* Circular graphics positioning */
.feature-graphic {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  opacity: 0.3;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  #songwriting-ai, #social-network, #marketplace {
    height: 80vh;
    padding: 1rem;
  }
  
  .features-tabs-container {
    height: 240vh; /* 3 × 80vh */
  }
  
  #social-network {
    top: 80vh;
  }
  
  #marketplace {
    top: 160vh;
  }
  
  .feature-title {
    font-size: 2rem;
  }
  
  .features-sidebar {
    left: 1rem;
    font-size: 0.8rem;
  }
}







.hide-section {
  display: none;
}


.hide-section {display: none;}