#get-started-section .get-started-section {position: relative; min-height: 600px; height: 50vh; max-height: 700px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 80px 0 60px 0; background: linear-gradient(to bottom, #213A3C00 0%, #213A3C80 60%, #151515 100%), url('../img/backdrop.svg') center center no-repeat; background-size: 50% auto;}
#get-started-section .get-started-content {position: relative; z-index: 2; text-align: center;}
#get-started-section .get-started-title {font-size: 2.5rem; font-weight: 800; margin: 0 12px;}
#get-started-section .get-started-subtitle {font-size: 1.5rem; font-weight: 500; &:last-child { margin-bottom: 32px;}}
@media (max-width: 767.98px){#get-started-section .get-started-section {background-size: 125% auto; min-height: 400px; height: 50vh; max-height: 500px;}}
@media (max-width: 726.98px){
  #get-started-section .get-started-title {font-size: 2rem;}
  #get-started-section .get-started-subtitle {font-size: 1.2rem;}
}
@media (max-width: 588.98px){
  #get-started-section .get-started-title {font-size: 1.5rem;}
  #get-started-section .get-started-subtitle {font-size: 1rem;}
}

#flip-card .price-section-bg {min-height: 100vh; overflow: hidden; position: relative;}
#flip-card .price-vector {position: absolute; z-index: 0; pointer-events: none;}
#flip-card .price-vector.top-right {top: 0; right: 0; width: 350px;}
#flip-card .price-vector.top-left {top: 0; left: 0; width: 350px;}
#flip-card .price-vector.bottom-left {bottom: 0; left: 0; width: 350px;}
#flip-card .price-title {font-size: 2.5rem; font-weight: bold; color: #fff; margin-bottom: 0.5rem;}
#flip-card .price-desc {color: #bfc9d1; max-width: 600px; margin: 0 auto 2rem auto;}
#flip-card .price-row {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 2rem; z-index: 1; position: relative; width: 100%;}
#flip-card .card {background: none; border: none; box-shadow: none; min-width: 260px; max-width: 260px; min-height: 420px; max-height: 480px; perspective: 1000px; margin: 0 auto; width: 260px; height: 420px;}
#flip-card .card-inner {position: relative; width: 100%; height: 100%; transition: transform 0.8s cubic-bezier(0.4,0.2,0.2,1); transform-style: preserve-3d;}
#flip-card .card.flipped .card-inner {transform: rotateY(180deg);}
#flip-card .card-front,
#flip-card .card-back {position: absolute; width: 100%; height: 100%; backface-visibility: hidden; border-radius: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.25); display: flex; flex-direction: column; align-items: center; padding: 2rem 1.5rem; background: rgba(0,0,0,0.1); z-index: 1;}
#flip-card .card-front::before,
#flip-card .card-back::before {content: ''; position: absolute; inset: -2px; border-radius: 26px; z-index: -1; background: linear-gradient(120deg, #3C6E71, #72D1D7 80%); padding: 1px; pointer-events: none; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
#flip-card .card-front {/*opacity: 0; */ z-index: 2;}
#flip-card .card-back {transform: rotateY(180deg); z-index: 1; transition: opacity 0.3s;}
#flip-card .price-card img {height: 85px; margin-bottom: 0.5rem;}
#flip-card .price-card h4 {color: #fff; font-weight: bold; font-size: 1.35rem; margin-bottom: 0.5rem;}
#flip-card .price-card .display-4 {color: #5ee6e6; font-size: 2.8rem; font-weight: 700; line-height: 1;}
#flip-card .price-card .text-white-50 {color: #bfc9d1 !important;}
#flip-card .price-card .btn {border-radius: 8px; font-weight: 600; font-size: 1rem; margin-top: 1.5rem; padding: 0.75rem 0;}
#flip-card .price-card .btn-info {background: linear-gradient(90deg, #5ee6e6 0%, #3a8dde 100%); border: none;}
#flip-card .price-card .btn-outline-light {border: 1.5px solid #5ee6e6; color: #5ee6e6; background: transparent;}
#flip-card .price-card .btn-outline-light:hover {background: #5ee6e6; color: #111518;}
#flip-card .price-card .btn-info:hover {background: #3a8dde; color: #fff;}
#flip-card .price-card .flex-grow-1 {flex-grow: 1 !important;}
#flip-card .price-card {display: flex; flex-direction: column; align-items: center; height: 100%;}
#flip-card .price-amount-wrapper {flex-grow: 1; display: flex; flex-direction: column; justify-content: center; position: relative; width: 100%; height: 100%; min-width: 0; margin-bottom: 0.5rem;}
#flip-card .price-currency {position: absolute; top: 0px; right: 0; font-size: 1.1rem; color: #fff; font-weight: 400; letter-spacing: 1px; z-index: 2; line-height: 1;}
#flip-card .price-amount {display: block; font-size: 4.5rem; font-weight: 700; color: #5ee6e6; line-height: 1; letter-spacing: -2px; z-index: 1; text-align: center; position: relative;}
  @media screen and (max-width: 1399.98px){#flip-card .price-row {display: grid; grid-template-columns: repeat(2, 300px); row-gap: 3.5rem; column-gap: 1rem; width: 100%;}}
  @media screen and  (max-width: 991px){
    #flip-card .cards-container {max-width: 100vw;}
    #flip-card .card {margin: 0 auto;}
    #flip-card .price-vector.top-right {width: 250px;}
    #flip-card .price-vector.top-left {width: 250px;}
    #flip-card .price-vector.bottom-left {width: 250px;}
  }
  @media screen and  (max-width: 767px){
    #flip-card .cards-container {flex-direction: column; align-items: center;}
    #flip-card .price-row {grid-template-columns: repeat(2, 300px);}
    #flip-card .price-vector.top-right {display: none !important;}
    #flip-card .price-vector.top-left {display: none !important;}
    #flip-card .price-vector.bottom-left {display: none !important;}
  }
  @media screen and (max-width: 645px){#flip-card .price-row {grid-template-columns: repeat(1, 300px);}}
#flip-card .center-wrapper {display: flex; justify-content: center; align-items: center; width: 100%; min-height: 70vh; margin: 0 auto;}
#flip-card .cards-container {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; width: 100%; max-width: 1200px; margin: 0 auto;}

#contact  .contact-main-bg {min-height: 100vh; background: linear-gradient(to bottom, #213A3C00 0%, #213A3C80 60%, #151515 100%); position: relative;}
#contact  .contact-hero-section {background: url('assets/img/backdrop.svg') center top no-repeat; background-size: cover; padding-top: 3rem; padding-bottom: 3rem; border-radius: 24px;}
#contact  .contact-header-img {max-width: 600px; width: 100%; border-radius: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.18); margin-bottom: 2rem;}
#contact  .contact-info .contact-icon {width: 50px; height: auto; object-fit: contain; margin-right: 0.5rem;}
#contact  .contact-info a {font-weight: 500; font-size: 1.1rem;}
#contact  .btn-outline-light {border-radius: 8px; font-weight: 500; border-width: 2px; transition: background 0.2s, color 0.2s;}
#contact  .btn-outline-light:hover {background: #fff; color: #161c22;}
#contact  .btn-outline-secondary {border-radius: 8px; font-weight: 500; border-width: 2px; color: #fff; border-color: #4e5d6c; background: transparent; transition: background 0.2s, color 0.2s;}
#contact  .btn-outline-secondary:hover {background: #4e5d6c; color: #fff;}
#contact  .contact-divider {position: absolute; left: 50%; top: -35px; bottom: -20px; transform: translateX(-50%); width: 3px; background: linear-gradient(to bottom, #3C6E71 0%, #72D1D7 100%); border-radius: 2px; display: none;}
@media (min-width: 992px) {
  #contact  .contact-details-buttons-row {display: flex; gap: 0; position: relative;}
  #contact  .contact-details-col,
  #contact  .contact-buttons-col {flex: 1 1 0; max-width: 50%;}
  #contact  .contact-divider {display: block;}
}
@media (max-width: 991.98px) {
  #contact  .contact-details-buttons-row {display: block;}
  #contact  .contact-details-col,
  #contact  .contact-buttons-col {max-width: 100%;}
  #contact  .contact-buttons-col {margin-top: 2rem;}
  #contact  .contact-divider {display: none;}
}
@media (max-width: 400.98px) {
  #contact  .contact-info .contact-icon {width: 30px;}
}

#about .mission-section {position: relative; background: var(--background-color); padding: 80px 0; overflow: hidden;}
#about .mission-section .mission-vector {position: absolute; z-index: 1; pointer-events: none;}
#about .mission-section .top-right {top: 0; right: 0; width: 300px; height: auto;}
#about .mission-section .center-left {top: 50%; left: 0; transform: translateY(-50%); width: 250px; height: auto;}
#about .mission-section .container {position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 60px;}
#about .mission-section .left {flex: 1; max-width: 500px;}
#about .mission-section .left h1 {font-size: 3rem; font-weight: 700; margin-bottom: 24px; color: var(--text-color-w);}
#about .mission-section .left p {font-size: 1.2rem; line-height: 1.6; color: rgba(255, 255, 255, 0.8);}
#about .mission-section .right {flex: 1; text-align: center;}
#about .mission-section .right img {max-width: 100%; height: auto; filter: drop-shadow(0 10px 30px rgba(114, 209, 215, 0.3));}
#about .who-we-are-section {position: relative; background: url('assets/img/who-we-are-section-bg.svg') center/cover no-repeat; padding: 80px 0; overflow: hidden;}
#about .who-we-are-section .wire-decoration {position: absolute; top: 20px; right: 20px; width: 700px; height: auto; z-index: 1;}
#about .who-we-are-section .container {position: relative; z-index: 2; text-align: center; max-width: 900px;}
#about .who-we-are-section .business-image {width: 100%; max-width: 600px; height: auto; border-radius: 20px; margin-bottom: 40px; filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.5));}
#about .who-we-are-section h2 {font-size: 2.5rem; font-weight: 700; margin-bottom: 24px; color: var(--text-color-w);}
#about .who-we-are-section p {font-size: 1.1rem; line-height: 1.7; color: rgba(255, 255, 255, 0.85); max-width: 700px; margin: 0 auto;}
#about .who-we-are-section span {color: var(--secondary-color); font-weight: 600;}
#about .vision-leadership-section {position: relative; background: var(--background-color); padding: 80px 0; overflow: hidden;}
#about .vision-leadership-section .vector-decoration {position: absolute; top: 0; right: 0; width: 550px; height: auto; z-index: 1;}
#about .vision-leadership-section .container {position: relative; z-index: 2; max-width: 1000px;}
#about .vision-card,
#about .leadership-card {display: flex; align-items: center; gap: 40px; margin-bottom: 60px;}
#about .leadership-card {flex-direction: row-reverse;}
#about .vision-card .icon-container,
#about .leadership-card .icon-container {position: relative; flex-shrink: 0; width: 350px; height: 350px; display: flex; align-items: center; justify-content: center;}
#about .vision-card .icon-container .back-circle,
#about .leadership-card .icon-container .back-circle {position: absolute; width: 100%; height: 100%; z-index: 1;}
#about .vision-card .icon-container .main-icon,
#about .leadership-card .icon-container .main-icon {position: relative; z-index: 2;}
#about .vision-card .icon-container .main-icon.vision {width: 200px; height: 200px;}
#about .leadership-card .icon-container .main-icon.leadership {width: 170px; height: 170px;}
#about .vision-card .content,
#about .leadership-card .content {flex: 1;}
#about .vision-card .content-header,
#about .leadership-card .content-header {display: flex; align-items: flex-start; gap: 12px;}
#about .vision-card .content-header .content-icon,
#about .leadership-card .content-header .content-icon {width: 30px; height: 30px; flex-shrink: 0; margin-top: 4px;}
#about .vision-card .content h2,
#about .leadership-card .content h2 {font-size: 2rem; font-weight: 700; margin: 0; color: var(--text-color-w);}
#about .vision-card .content p,
#about .leadership-card .content p {font-size: 1.1rem; line-height: 1.6; color: rgba(255, 255, 255, 0.8); margin: 0;}
#about .team-button {display: block; margin: 40px auto 0; padding: 12px 32px; font-size: 1.1rem; font-weight: 600;}
#about .careers-section {position: relative; background: var(--background-color); padding: 80px 0; overflow: hidden;}
#about .careers-section .wire-decoration {position: absolute; top: 00px; left: 20px; height: 90%; z-index: 1;}
#about .careers-section .container {position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 60px;}
#about .careers-section .left {flex: 1; text-align: center;}
#about .careers-section .left img {max-width: 100%; height: auto; border-radius: 20px; filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.5));}
#about .careers-section .right {flex: 1; text-align: center;}
#about .careers-section .text-container {position: relative; margin-bottom: 40px;}
#about .careers-section .text-container img {width: 100%; height: auto;}
#about .careers-section .text-overlay {position: absolute; padding: 20px; top: 4px; right: 138px;}
#about .careers-section .text-overlay h2 {font-size: 2.5rem; font-weight: 700; color: var(--text-color-w); margin: 0;}
#about .careers-section .cta-button {padding: 16px 32px; font-size: 1.1rem; font-weight: 600;}
#about .careers-section h2 {font-size: 2.5rem; font-weight: 700; margin-bottom: 24px; color: var(--text-color-w);}
#about #careers-section-mobile {display: none;}
@media screen and (max-width: 1399.98px) {
  #about .careers-section .text-overlay {top: 0px; right: 110px;}
}
@media screen and (max-width: 1199.98px) {
  #about .careers-section .text-overlay {top: 0px; right: 85px; padding: 10px;}
}
@media screen and (max-width: 991.98px) {
  #about .careers-section .text-overlay {top: 0px; right: 54px; padding: 7px;}
  #about .careers-section .text-overlay h2 {font-size: 2rem;}
}
@media (max-width: 768.98px) {
  #about .mission-section .container,
  #about .careers-section .container {flex-direction: column; gap: 40px;}
  #about .mission-section .left h1 {font-size: 2rem;}
  #about .vision-card .icon-container,
  #about .leadership-card .icon-container {width: 200px; height: 200px;}
  #about .vision-card .icon-container .main-icon.vision {width: 100px; height: 100px;}
  #about .leadership-card .icon-container .main-icon.leadership {width: 90px; height: 90px;}
  #about .mission-section .top-right,
  #about .mission-section .center-left,
  #about .vision-leadership-section .vector-decoration {display: none;}
  #about .who-we-are-section .wire-decoration,
  #about .careers-section .wire-decoration {display: none !important;}
  #about #careers-section-mobile {display: flex;}
  #about #careers-section-desktop {display: none;}
}
@media (max-width: 591.98px) {
  #about .vision-card,
  #about .leadership-card {flex-direction: column; gap: 20px; padding: 20px;}
  #about .leadership-card {flex-direction: column;}
}

#features .feature-circle {position: relative; margin-bottom: 0.5rem; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 220px; height: 220px;}
#features .feature-circle .coin-frame-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0;}
#features .feature-circle .feature-content {z-index: 1; position: relative; height: 70%; width: 70%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
#features .feature-circle .feature-icon {width: 70px; height: 70px; margin-bottom: 22px;}
#features .feature-circle .feature-label {width: 90%; text-align: center; color: #fff;}
#features .capsule-border {padding: 2px; display: block; width: 100%;}
#features .card.capsule-content {background: rgba(0,0,0,0.1); border-radius: 50px; padding: 1.5rem 2.2rem; width: 100%; min-height: 80px; border: none; box-shadow: none; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 1.5rem; position: relative; overflow: hidden;}
#features .card.capsule-content::before {content: ''; position: absolute; inset: 0; padding: 2px; border-radius: 50px; z-index: -1; background: linear-gradient(120deg, #3C6E71, #72D1D7 80%); pointer-events: none; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
#features .capsule-label {color: #fff; font-size: 1.25rem; font-weight: 400; letter-spacing: 0.01em; line-height: 1.3;}
#features .capsule-icon {width: 48px; height: 48px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;}
  @media (max-width: 700px){
    #features .card.capsule-content {padding: 1.1rem 1.2rem;}
    #features .capsule-label {font-size: 1.1rem;}
  }
#features .ai-hero-container {position: relative; width: 100%; max-width: 650px; margin: 0 auto; margin-top: -150px;}
  @media (max-width: 700px){#features .ai-hero-container {margin-top: -100px;}}
#features .ai-chip-img {width: 100%; display: block;}
#features .ai-hero-text {position: absolute; bottom: 0%; left: 50%; transform: translate(-50%, -50%); width: 100%; color: #fff; z-index: 2; pointer-events: none;}
#features .market-visualization {position: relative; width: 100%; min-height: 600px; /* aspect-ratio: 16/9; */ background: url('assets/img/back-circle.svg') center center/contain no-repeat; z-index: 0; display: flex; align-items: center; justify-content: center;}
  @media (max-width: 991.98px){
    #features .market-visualization img,
    #features .custom-img-group img {display: none !important;}
    #features .market-visualization,
    #features .custom-img-group {display: none !important;}
    #features .cloud-fade {display: none !important;}
  }
#features .custom-img-group {position: relative; height: 500px; width: 100%;}
#features .custom-img-group img {position: absolute; width: 100%;}

#industries .industries-section-1 {position: relative; background: #151515; padding: 60px 0 0 0; overflow: hidden;}
#industries .section1-top-left-img {position: absolute; top: 0; left: 0; width: 220px; z-index: 1;}
#industries .section1-main-img {display: block; margin: 0 auto 32px auto; /* border-radius: 32px; */ max-width: 600px; width: 100%; z-index: 2; position: relative;}
#industries .section1-heading {text-align: center; font-weight: 700; margin-bottom: 36px; z-index: 2; position: relative;}
#industries .sector-cards {display: flex; flex-wrap: wrap; justify-content: center; /* gap: 24px; */ margin-bottom: 60px; z-index: 2; position: relative;}
#industries .sector-card-border {background: linear-gradient(to left, #3C6E7140, #72D1D7); border-radius: 1.5rem; padding: 2px; /* border thickness */ display: inline-block;}
#industries .card.sector-card {background: rgba(0,0,0,0.1); border: none; border-radius: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.25); position: relative; padding: 24px 32px; width: 100%; color: #fff; font-size: 1.1rem; overflow: hidden;}
#industries .card.sector-card::before {content: ''; position: absolute; inset: 2px; border-radius: 26px; z-index: -1; background: linear-gradient(120deg, #3C6E71, #72D1D7 80%); padding: 2px; pointer-events: none; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
#industries .section1-bottom-wire {position: absolute; left: 0; bottom: 0; width: 820px; z-index: 1;}
#industries .section2-backdrop {position: absolute; top: 0; left: 0; width: auto; height: 75%; object-fit: cover; z-index: 0; opacity: 0.7;}
  @media (max-width: 900px){
    #industries .sector-cards {flex-direction: column; align-items: center;}
    #industries .section1-main-img {max-width: 95vw;}
    #industries .section1-top-left-img,
    #industries .section1-bottom-wire {width: 400px; bottom: 200px;}
  }

#home .hero-section {/*min-height: 800px;*/ background: var(--background-color); overflow: hidden;}
#home .hero-content h2 {font-size: 1.8rem; font-weight: 400; color: var(--text-color-w);}
#home .hero-content h1 {font-size: 3.5rem; font-weight: 700; background: linear-gradient(135deg, #fff 0%, #e0e0e0 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1.2;}
#home .hero-images {width: 100%; height: 100%; min-width: 500px; min-height: 500px;}
#home .hero-img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; transition: all 0.3s ease; filter: drop-shadow(0 4px 8px rgba(60, 110, 113, 0.3));}
#home .brands-section {background: var(--background-color); min-height: 80vh;}
#home .industry-shuffler {height: 600px;}
#home .shuffler-container {position: relative; height: 100%; overflow: hidden;}
#home .industry-img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transform: translateX(-30px); transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);}
#home .industry-img.active {opacity: 1; transform: translateX(0);}
#home .text-container {position: relative; height: 200px; overflow: hidden;}
#home .industry-text {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transform: translateY(20px); transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);}
#home .industry-text.active {opacity: 1; transform: translateY(0);}
#home .industry-radio-buttons {margin-top: 2rem;}
#home .industry-radio {display: none;}
#home .industry-radio-label {display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgba(114, 209, 215, 0.3); border: 2px solid rgba(114, 209, 215, 0.5); cursor: pointer; transition: all 0.3s ease; opacity: 0; transform: scale(0);}
#home .industry-radio-label.animate {animation: popInRadio 0.5s ease-out forwards;}
#home .industry-radio-label.animate:nth-child(2) {animation-delay: 0.1s;}
#home .industry-radio-label.animate:nth-child(4) {animation-delay: 0.2s;}
#home .industry-radio-label.animate:nth-child(6) {animation-delay: 0.3s;}
#home .industry-radio-label.animate:nth-child(8) {animation-delay: 0.4s;}
  @keyframes popInRadio{
    from {opacity: 0; transform: scale(0);}
    to {opacity: 1; transform: scale(1);}
  }
#home .industry-radio:checked + .industry-radio-label {background: var(--secondary-color); border-color: var(--secondary-color); box-shadow: 0 0 10px rgba(114, 209, 215, 0.6);}
#home .industry-radio-label:hover {background: rgba(114, 209, 215, 0.5); border-color: var(--secondary-color);}
#home .brand-loop-container {height: 60px; mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent); -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);}
#home .brand-scroll {animation: scrollBrands 20s linear infinite; white-space: nowrap; min-width: 200%;}
#home .brand-item {background: rgba(114, 209, 215, 0.1); border: 1px solid rgba(114, 209, 215, 0.3); border-radius: 20px; color: var(--text-color-w); font-weight: 500; white-space: nowrap; transition: all 0.3s ease;}
#home .brand-item:hover {background: rgba(114, 209, 215, 0.2); border-color: var(--secondary-color); color: var(--secondary-color); transform: scale(0.95);}
  @keyframes scrollBrands{
    0% {transform: translateX(0);}
    100% {transform: translateX(-50%);}
  }
#home .stat-badge {text-align: center; padding: 1rem; background: rgba(60, 110, 113, 0.1); border-radius: 12px; border: 1px solid rgba(114, 209, 215, 0.2); min-width: 120px;}
#home .stat-badge h3 {font-size: 2rem; font-weight: 700;}
#home .different-section {/* min-height: 100vh; */ background-attachment: fixed; background-size: cover; background-position: center;}
#home .custom-accordion-wrapper {position: relative; height: 400px; /* Fixed height to prevent layout shift */;}
#home .custom-accordion {max-width: 600px; position: absolute; top: 0; left: 0; width: 100%;}
#home .accordion-item-custom {margin-bottom: 1rem; border-radius: 12px; /* background: rgba(60, 110, 113, 0.1); border: 1px solid rgba(114, 209, 215, 0.2); */ overflow: hidden; transition: all 0.3s ease; opacity: 0; transform: translateX(-30px);}
#home .accordion-item-custom.animate {animation: slideInAccordion 0.8s ease-out forwards;}
#home .accordion-item-custom.animate:nth-child(1) {animation-delay: 0.1s;}
#home .accordion-item-custom.animate:nth-child(2) {animation-delay: 0.25s;}
#home .accordion-item-custom.animate:nth-child(3) {animation-delay: 0.4s;}
#home .accordion-item-custom.animate:nth-child(4) {animation-delay: 0.55s;}
  @keyframes slideInAccordion{
    from {opacity: 0; transform: translateX(-30px);}
    to {opacity: 1; transform: translateX(0);}
  }
#home .accordion-header {padding: 1.5rem; cursor: pointer; transition: all 0.3s ease; user-select: none; -webkit-user-select: none;}
#home .accordion-header:hover {background: rgba(114, 209, 215, 0.1);}
#home .accordion-header h3 {font-size: 1.2rem; font-weight: 600; color: var(--text-color-w); transition: color 0.3s ease;}
#home .accordion-item-custom.active .accordion-header h3 {color: var(--secondary-color);}
#home .accordion-content {max-height: 0; overflow: hidden; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); padding: 0 1.5rem; opacity: 0; transform: translateY(-10px); position: relative;}
#home .accordion-content p {padding-left: calc(1.5rem + 32px);}
#home .accordion-item-custom.active .accordion-content {padding: 0 1.5rem 1.5rem 1.5rem; max-height: 200px; opacity: 1; transform: translateY(0);}
#home .accordion-content p {margin: 0; color: #bfc9d1; line-height: 1.6;}
#home #flip-card .wire-decoration {position: absolute; top: -10%; left: 0px; height: 130%; z-index: 1;}
#home #flip-card .vector-decoration {position: absolute; top: -5%; right: 0;}
#home .different-images {position: relative; height: 500px; min-height: 500px;}
#home .different-images img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; transition: all 0.3s ease; filter: drop-shadow(0 4px 8px rgba(60, 110, 113, 0.3));}
#home .featured-section {background: var(--background-color); min-height: 80vh;}
#home .featured-images {position: relative; height: 500px; min-height: 500px;}
#home .featured-images img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; transition: all 0.3s ease; filter: drop-shadow(0 4px 8px rgba(60, 110, 113, 0.3));}
#home .featured-content h2 {background: linear-gradient(135deg, #fff 0%, #e0e0e0 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}
#home .featured-section .gradient-text {background-size: 200% 200%; transition: background-position 0.5s cubic-bezier(.4,0,.2,1), color 0.3s; position: relative; display: inline-block; padding-right: 28px; /* space for arrow movement */ overflow: visible; transition: transform 0.4s cubic-bezier(.4,0,.2,1), filter 0.3s;}
#home .featured-section .gradient-text:hover {background-position: 100% 0; color: #fff; text-shadow: 0 0 8px var(--secondary-color), 0 0 16px var(--secondary-color); transform: translateX(16px);}
#home .featured-section .gradient-text .footer-arrow {display: inline-block; transition: transform 0.4s cubic-bezier(.4,0,.2,1), filter 0.3s; vertical-align: middle;}
#home .featured-section .gradient-text:hover .footer-arrow {transform: translateX(16px); filter: drop-shadow(0 0 10px var(--secondary-color));}

@media screen and (max-width: 1399.98px) {
  #home .hero-content h1 {font-size: 2.8rem;}
  #home #flip-card .wire-decoration {display: none;}
  #home #flip-card .vector-decoration {top: -10%; right: 0; width: 50%;}
  #home .featured-section .wire-decoration {width: 40%;}
}
@media screen and (max-width: 991px) {
  #home .hero-content h1 {font-size: 2.4rem;}
  #home .different-images {height: 400px; min-height: 400px;}
  #home .featured-images {height: 350px; min-height: 350px;}
  #home .hero-images {opacity: 0.5;}
  #home .brand-section-vector,
  #home .different-section-vector,
  #home .mission-vector,
  #home .wire-decoration,
  #home #flip-card .vector-decoration {display: none !important;}
}
@media screen and (max-width: 768.98px) {
  #home .hero-content h1 {font-size: 2rem;}
  #home .hero-content h2 {font-size: 1.5rem;}
  #home .industry-shuffler {height: 300px;}
  #home .different-images {height: 300px; min-height: 300px;}
  #home .featured-images {height: 300px; min-height: 300px;}
}
@media screen and (max-width: 645px) {
  #home .hero-content h1 {font-size: 1.8rem;}
  #home .hero-content h2 {font-size: 1.3rem;}
  #home .stat-badge {min-width: 100px; padding: 0.8rem;}
  #home .stat-badge h3 {font-size: 1.5rem;}
}
