/* ===============================
   HERO CONFIGURACIONES
=================================*/

.nlx-heroConfig{
    min-height: 90vh;
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #D3A029 0%, #008180 100%);
    padding: 80px 0;
    overflow: hidden;
  }
  
  .nlx-heroConfig__container{
    width: min(1200px, 90%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    align-items: center;
    gap: 40px;
  }
  
  /* Badge */
  
  .nlx-heroConfig__badge{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.25);
    backdrop-filter: blur(8px);
    padding: 10px 18px;
    border-radius: 50px;
    color: #fff;
    font-weight: 500;
    margin-bottom: 30px;
    font-size: 14px;
  }
  
  .nlx-heroConfig__badge i{
    font-size: 18px;
  }
  
  /* Title */
  
  .nlx-heroConfig__title{
    font-size: clamp(42px, 5vw, 70px);
    line-height: 1.05;
    color: #fff;
    font-weight: 300;
    margin-bottom: 20px;
  }
  
  .nlx-heroConfig__title strong{
    font-weight: 800;
  }
  
  /* Text */
  
  .nlx-heroConfig__text{
    font-size: 18px;
    color: rgba(255,255,255,0.92);
    max-width: 550px;
    line-height: 1.6;
    margin-bottom: 35px;
  }
  
  /* Buttons */
  
  .nlx-heroConfig__buttons{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
  }
  
  .nlx-btn{
    position: relative;
    padding: 14px 26px;
    border-radius: 14px;
    font-weight: 700;
    text-decoration: none;
    color: #fff;
    overflow: hidden;
    transition: transform .3s ease;
  }
  
  /* Shine effect */
  .nlx-btn::before{
    content:"";
    position:absolute;
    top:0;
    left:-75%;
    width:50%;
    height:100%;
    background: linear-gradient(
      120deg,
      transparent,
      rgba(255,255,255,0.6),
      transparent
    );
    transform: skewX(-25deg);
  }
  
  .nlx-btn:hover::before{
    animation: shine 0.8s ease forwards;
  }
  
  @keyframes shine{
    100%{
      left:125%;
    }
  }
  
  .nlx-btn:hover{
    transform: translateY(-3px);
  }
  
  /* Colores sólidos */
  
  .nlx-btn--orange{
    background:#E67E22;
  }
  
  .nlx-btn--teal{
    background:#00796B;
  }
  
  /* Imagen */
  
  .nlx-heroConfig__image{
    display:flex;
    justify-content:center;
  }
  
  .nlx-heroConfig__image img{
    width:100%;
    max-width:450px;
  }
  
  /* ===============================
     RESPONSIVE
  =================================*/
  
  @media (max-width: 768px){
  
    .nlx-heroConfig__container{
      grid-template-columns: 1fr;
      text-align:center;
    }
  
    .nlx-heroConfig__text{
      margin:0 auto 35px auto;
    }
  
    .nlx-heroConfig__buttons{
      justify-content:center;
    }
  
    .nlx-heroConfig__image{
      margin-top:40px;
    }
  }
  
  @media (max-width: 425px){
  
    .nlx-heroConfig{
      padding:60px 0;
    }
  
    .nlx-btn{
      width:100%;
      text-align:center;
    }
  
    .nlx-heroConfig__buttons{
      flex-direction:column;
      gap:15px;
    }
  }
  
  @media (max-width: 320px){
  
    .nlx-heroConfig__title{
      font-size:38px;
    }
  
    .nlx-heroConfig__text{
      font-size:15px;
    }
  }
  


  /* ===============================
   ENTRADAS (scroll reveal)
=================================*/

.nlx-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1);
    will-change: opacity, transform;
  }
  
  .nlx-reveal.is-in {
    opacity: 1;
    transform: translateY(0);
  }
  
  /* Variantes */
  .nlx-reveal--left { transform: translateX(-22px); }
  .nlx-reveal--right { transform: translateX(22px); }
  .nlx-reveal--float { transform: translateY(14px) scale(.98); }
  
  .nlx-reveal.is-in.nlx-reveal--left,
  .nlx-reveal.is-in.nlx-reveal--right,
  .nlx-reveal.is-in.nlx-reveal--float {
    transform: translate(0,0) scale(1);
  }



  
  /* FORZAR color verde Nomilinea al botón Descarga PDF */
.nlx-btn--teal{
    background-color: #008180 !important;
    border-color: #008180 !important;
    color: #ffffff !important;
  }
  
  /* Hover elegante verde */
  .nlx-btn--teal:hover{
    background-color: #006e6d !important;
    border-color: #006e6d !important;
    box-shadow: 0 0 25px rgba(0,129,128,0.5);
  }
  







  /* ==============  NOMILINEA A TU MEDIDA  ============== */
/* ==============  NOMILINEA A TU MEDIDA (MINIMAL SOLID)  ============== */
.nlx-fit2{
  position: relative;
  padding: 84px 0;
}

.nlx-fit2__wrap{
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

/* Head */
.nlx-fit2__head{
  text-align: center;
  max-width: 860px;
  margin: 0 auto 34px;
}

.nlx-fit2__kicker{
  display: inline-flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(0,129,128,.22);
  background: rgba(0,129,128,.08);
  color: #008180;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
}

.nlx-fit2__title{
  margin: 16px 0 10px;
  color: #008180;
  font-weight: 800;              /* más peso */
  letter-spacing: -0.02em;
  font-size: clamp(28px, 2.8vw, 44px);
  line-height: 1.08;
}

.nlx-fit2__text{
  margin: 0 auto;
  max-width: 740px;
  color: rgba(11,27,31,.74);
  font-size: 16px;
  line-height: 1.7;
}

/* Grid */
.nlx-fit2__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 26px;
}

/* Card (solid) */
.nlx-fit2Card{
  background: #008180;
  color: #fff;
  border-radius: 20px;
  padding: 26px 24px;
  min-height: 176px;

  box-shadow: 0 16px 40px rgba(0,0,0,.10);
  transform: translateZ(0);

  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.nlx-fit2Card__icon{
  width: 54px;
  height: 54px;
  border-radius: 16px;

  display: grid;
  place-items: center;

  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.18);
  margin-bottom: 16px;

  transition: transform .22s ease, background .22s ease, border-color .22s ease;
}

.nlx-fit2Card__icon i{
  font-size: 26px;
  color: #fff;
}

.nlx-fit2Card__title{
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.nlx-fit2Card__p{
  margin: 0;
  color: rgba(255,255,255,.88);
  line-height: 1.6;
  font-size: 15px;
}

/* Hover coqueto pero minimal */
.nlx-fit2Card:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 52px rgba(0,0,0,.16);
  filter: brightness(1.03);
}

.nlx-fit2Card:hover .nlx-fit2Card__icon{
  transform: translateY(-2px) scale(1.03);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.28);
}

/* ===== Responsive ===== */
@media (max-width: 768px){
  .nlx-fit2{
    padding: 64px 0;
  }

  .nlx-fit2__wrap{
    width: min(980px, calc(100% - 34px));
  }

  .nlx-fit2__grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .nlx-fit2Card{
    padding: 24px 22px;
    min-height: 164px;
  }
}

@media (max-width: 425px){
  .nlx-fit2__wrap{
    width: calc(100% - 26px);
  }

  .nlx-fit2__head{
    margin-bottom: 26px;
  }

  .nlx-fit2__text{
    font-size: 15.5px;
  }

  .nlx-fit2Card{
    border-radius: 18px;
    padding: 22px 18px;
  }

  .nlx-fit2Card__icon{
    width: 52px;
    height: 52px;
    border-radius: 15px;
  }
}

@media (max-width: 320px){
  .nlx-fit2__wrap{
    width: calc(100% - 22px);
  }

  .nlx-fit2__title{
    font-size: 26px; /* clamp ya ayuda, pero aquí lo amarras */
  }

  .nlx-fit2Card{
    padding: 20px 16px;
  }

  .nlx-fit2Card__title{
    font-size: 17px;
  }

  .nlx-fit2Card__p{
    font-size: 14.6px;
  }
}









/* ==============  6 CONFIGURACIONES (MEDIA + PILLS + DETAIL)  ============== */
/* ==============  6 CONFIGURACIONES (LEFT FRAME: IMAGE + TEXT)  ============== */
.nlx-cfg6{
  padding: 88px 0;
}

.nlx-cfg6__wrap{
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

/* Head */
.nlx-cfg6__head{
  text-align: center;
  max-width: 900px;
  margin: 0 auto 34px;
}

.nlx-cfg6__kicker{
  display: inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,129,128,.08);
  border: 1px solid rgba(0,129,128,.22);
  color: #008180;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
}

.nlx-cfg6__title{
  margin: 16px 0 10px;
  color: #008180;
  font-weight: 850;
  letter-spacing: -0.02em;
  font-size: clamp(28px, 2.8vw, 44px);
  line-height: 1.08;
}

.nlx-cfg6__intro{
  margin: 0 auto;
  max-width: 740px;
  color: rgba(11,27,31,.74);
  font-size: 16px;
  line-height: 1.7;
}

/* Layout */
.nlx-cfg6__showcase{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items: start;
}

/* LEFT wrapper */
.nlx-cfg6__left{
  position: relative;
}

/* Frame = one single block containing image area + detail area */
.nlx-cfg6__frame{
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
  box-shadow: 0 18px 48px rgba(0,0,0,.08);
  overflow: hidden;

  /* Make space for image + text without overlap */
  display: grid;
  grid-template-rows: 360px auto; /* image area / detail area */
}

/* Media area */
.nlx-cfg6__media{
  position: relative;
  background: #fff;
  overflow: hidden;
  text-align: center;
}

/* Images: fill media area only */
/* Images: centered inside media */
.nlx-cfg6__img{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 250px;          /* ajusta si quieres */
  height: auto;
  max-width: calc(100% - 32px);
  max-height: calc(100% - 32px);
  object-fit: contain;
  display: block;

  opacity: 0;
  transform: translate(-50%, -50%) translateY(10px) scale(.985);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
}

.nlx-cfg6__img.is-active{
  opacity: 1;
  transform: translate(-50%, -50%) translateY(0) scale(1);
}

/* Media nav pinned inside media area */
.nlx-cfg6__mediaNav{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 14px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 0 14px;
}

.nlx-cfg6__navBtn{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(0,129,128,.25);
  background: #fff;
  color: #008180;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.nlx-cfg6__navBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(0,129,128,.4);
  background: rgba(0,129,128,.06);
}

.nlx-cfg6__dots{
  display: inline-flex;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;
}

.nlx-cfg6__dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  border: 0;
  background: rgba(0,129,128,.25);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease;
}

.nlx-cfg6__dot.is-active{
  background: #008180;
  transform: scale(1.15);
}

/* Detail area (below image, same column, no overlap) */
.nlx-cfg6__detail{
  padding: 18px 18px 20px;
  border-top: 1px solid rgba(0,0,0,.06);
}

.nlx-cfg6__detailTitle{
  margin: 0 0 8px;
  font-weight: 900;
  letter-spacing: -0.01em;
  color: #008180;
  font-size: 18px;
}

.nlx-cfg6__detailText{
  margin: 0;
  color: rgba(11,27,31,.74);
  line-height: 1.65;
  font-size: 15px;
}

/* RIGHT pills */
.nlx-cfg6__rail{
  display: grid;
  gap: 10px;
  align-content: start;
}

.nlx-cfg6__pill{
  width: 100%;
  text-align: left;
  border-radius: 999px;
  padding: 14px 16px;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
  cursor: pointer;

  font-weight: 850;
  letter-spacing: -0.01em;
  color: #0b1b1f;

  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

.nlx-cfg6__pill:hover{
  transform: translateY(-1px);
  border-color: rgba(0,129,128,.22);
  box-shadow: 0 14px 34px rgba(0,0,0,.06);
  background: rgba(0,129,128,.05);
}

.nlx-cfg6__pill.is-active{
  border-color: rgba(0,129,128,.35);
  background: #008180;
  color: #fff;
  box-shadow: 0 18px 44px rgba(0,0,0,.10);
}

/* Strip bottom */
.nlx-cfg6__strip{
  margin-top: 18px;
  border-radius: 20px;
  background: #d87625;
  color: #fff;
  padding: 22px 22px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.nlx-cfg6__stripTitle{
  margin: 0 0 6px;
  font-weight: 900;
  letter-spacing: -0.01em;
  font-size: 18px;
}

.nlx-cfg6__stripText{
  margin: 0;
  opacity: .92;
  line-height: 1.55;
}

.nlx-cfg6__stripBtn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 999px;
  background: #fff;
  color: #d87625;
  font-weight: 850;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.65);
  transition: transform .2s ease, filter .2s ease;
  white-space: nowrap;
}

.nlx-cfg6__stripBtn:hover{
  transform: translateY(-1px);
  filter: brightness(0.98);
}

/* Reveal */
.nlx-rvl{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}

.nlx-rvl.is-in{
  opacity: 1;
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 768px){
  .nlx-cfg6{
    padding: 66px 0;
  }

  .nlx-cfg6__wrap{
    width: min(980px, calc(100% - 34px));
  }

  .nlx-cfg6__showcase{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .nlx-cfg6__frame{
    grid-template-rows: 320px auto;
    border-radius: 18px;
  }

  .nlx-cfg6__detail{
    padding: 16px 14px 18px;
  }
}

@media (max-width: 425px){
  .nlx-cfg6__wrap{
    width: calc(100% - 26px);
  }

  .nlx-cfg6__frame{
    grid-template-rows: 280px auto;
  }

  .nlx-cfg6__pill{
    padding: 13px 14px;
  }

  .nlx-cfg6__strip{
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    padding: 18px 16px;
  }

  .nlx-cfg6__stripBtn{
    width: 100%;
  }
}

@media (max-width: 320px){
  .nlx-cfg6__wrap{
    width: calc(100% - 22px);
  }

  .nlx-cfg6__frame{
    grid-template-rows: 250px auto;
  }

  .nlx-cfg6__detailText{
    font-size: 14.6px;
  }
}

/* ===== Pills pro en mobile: chips horizontales (425 / 320) ===== */
@media (max-width: 425px){
  .nlx-cfg6__rail{
    display: flex;
    gap: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 6px 2px 10px;
    margin-bottom: 6px;

    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .nlx-cfg6__rail::-webkit-scrollbar{
    height: 6px;
  }
  .nlx-cfg6__rail::-webkit-scrollbar-thumb{
    background: rgba(0,0,0,.12);
    border-radius: 999px;
  }

  .nlx-cfg6__pill{
    flex: 0 0 auto;
    white-space: nowrap;

    padding: 12px 14px;
    border-radius: 999px;

    scroll-snap-align: start;
  }
}

@media (max-width: 320px){
  .nlx-cfg6__rail{
    gap: 8px;
    padding-bottom: 10px;
  }

  .nlx-cfg6__pill{
    padding: 11px 13px;
    font-size: 14px;
  }
}




























/* ==============  CÓMO LO ACTIVAMOS (STEPS)  ============== */
.nlx-steps{
  margin-top: 88px;
  margin-bottom: 150px;
}

.nlx-steps__wrap{
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

/* Head */
.nlx-steps__head{
  text-align: center;
  max-width: 900px;
  margin: 0 auto 34px;
}

.nlx-steps__kicker{
  display: inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,129,128,.08);
  border: 1px solid rgba(0,129,128,.22);
  color: #008180;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
}

.nlx-steps__title{
  margin: 16px 0 10px;
  color: #008180;
  font-weight: 900;
  letter-spacing: -0.02em;
  font-size: clamp(28px, 2.8vw, 44px);
  line-height: 1.08;
}

.nlx-steps__intro{
  margin: 0 auto;
  max-width: 760px;
  color: rgba(11,27,31,.74);
  font-size: 16px;
  line-height: 1.7;
}

/* Flow grid */
.nlx-steps__flow{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 18px;
  margin-top: 18px;
}

/* Step */
.nlx-step{
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 14px;
  align-items: stretch;
}

/* Left rail (dot + line) */
.nlx-step__rail{
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 6px;
}

.nlx-step__dot{
  width: 46px;
  height: 46px;
  border-radius: 16px;
  background: #008180;
  color: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 14px 30px rgba(0,0,0,.10);
  border: 1px solid rgba(0,0,0,.06);
  transition: transform .22s ease, background .22s ease;
}

.nlx-step__dot i{
  font-size: 24px;
}

.nlx-step__line{
  position: absolute;
  top: 58px;
  bottom: 8px;
  width: 2px;
  background: rgba(0,129,128,.20);
  border-radius: 999px;
}

.nlx-step__line.is-last{
  background: transparent; /* último sin linea larga */
}

/* Card */
.nlx-step__card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 20px;
  padding: 18px 18px;
  box-shadow: 0 16px 40px rgba(0,0,0,.06);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.nlx-step__top{
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 8px;
}

.nlx-step__num{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(216,118,37,.14);
  color: #d87625;
  font-weight: 900;
  letter-spacing: .06em;
  font-size: 12px;
}

.nlx-step__title{
  margin: 0;
  color: #0b1b1f;
  font-weight: 900;
  letter-spacing: -0.01em;
  font-size: 17px;
}

.nlx-step__text{
  margin: 0;
  color: rgba(11,27,31,.74);
  line-height: 1.6;
  font-size: 15px;
}

/* Hover coqueto (informativo, sin link) */
.nlx-step:hover .nlx-step__card{
  transform: translateY(-4px);
  box-shadow: 0 20px 52px rgba(0,0,0,.10);
  border-color: rgba(0,129,128,.22);
}

.nlx-step:hover .nlx-step__dot{
  transform: translateY(-2px) scale(1.03);
  background: #d87625;
}

/* Reveal */
.nlx-stpRv{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.nlx-stpRv.is-in{
  opacity: 1;
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 768px){
  .nlx-steps{ padding: 66px 0; }
  .nlx-steps__wrap{ width: min(980px, calc(100% - 34px)); }
  .nlx-steps__flow{ grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 425px){
  .nlx-steps__wrap{ width: calc(100% - 26px); }
  .nlx-step{ grid-template-columns: 52px 1fr; gap: 12px; }
  .nlx-step__card{ padding: 16px 14px; border-radius: 18px; }
  .nlx-step__dot{ width: 44px; height: 44px; border-radius: 15px; }
  .nlx-step__line{ top: 56px; }
}

@media (max-width: 320px){
  .nlx-steps__wrap{ width: calc(100% - 22px); }
  .nlx-step__title{ font-size: 16px; }
  .nlx-step__text{ font-size: 14.6px; }
}










/* ==============  CTA SPLIT (REFINED RESPONSIVE)  ============== */
.nlx-ctaSplit{
  padding: 88px 0;
  background-color: #00818146;
}

.nlx-ctaSplit__wrap{
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

/* Card layout */
.nlx-ctaSplit__grid{
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 24px;
  align-items: stretch;

  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 18px 48px rgba(0,0,0,.08);
  overflow: hidden;
}

/* Media */
.nlx-ctaSplit__media{
  background: rgba(0,129,128,.06);
  display: grid;
  align-items: center;
  padding: 18px;
}

/* Controls image ratio nicely across breakpoints */
.nlx-ctaSplit__mediaInner{
  width: 100%;
  height: 100%;
  min-height: 360px;     /* desktop image presence */
  display: grid;
  place-items: center;
}

.nlx-ctaSplit__img{
  width: min(520px, 100%);
  max-height: 360px;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Copy */
.nlx-ctaSplit__copy{
  padding: 28px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.nlx-ctaSplit__kicker{
  display: inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,129,128,.08);
  border: 1px solid rgba(0,129,128,.22);
  color: #008180;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
  width: fit-content;
}

.nlx-ctaSplit__title{
  margin: 16px 0 10px;
  color: #008180;
  font-weight: 900;
  letter-spacing: -0.02em;
  font-size: clamp(26px, 2.6vw, 42px);
  line-height: 1.08;
}

.nlx-ctaSplit__text{
  margin: 0;
  color: rgba(11,27,31,.74);
  font-size: 16px;
  line-height: 1.7;
  max-width: 560px;
}

/* Buttons */
.nlx-ctaSplit__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.nlx-ctaSplit__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 12px 16px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 850;

  border: 1px solid rgba(0,0,0,.10);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;

  white-space: nowrap;
}

.nlx-ctaSplit__btn i{ font-size: 20px; }

/* Primary */
.nlx-ctaSplit__btn--primary{
  background: #008180;
  color: #fff;
  border-color: rgba(0,129,128,.45);
  box-shadow: 0 16px 36px rgba(0,0,0,.10);
}
.nlx-ctaSplit__btn--primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 52px rgba(0,0,0,.14);
}

/* Ghost */
.nlx-ctaSplit__btn--ghost{
  background: #fff;
  color: #d87625;
  border-color: rgba(216,118,37,.35);
}
.nlx-ctaSplit__btn--ghost:hover{
  transform: translateY(-2px);
  background: rgba(216,118,37,.08);
  border-color: rgba(216,118,37,.55);
}

.nlx-ctaSplit__fine{
  margin: 12px 0 0;
  color: rgba(11,27,31,.58);
  font-size: 13.5px;
  line-height: 1.5;
}

/* Reveal */
.nlx-ctaRv{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.nlx-ctaRv.is-in{ opacity: 1; transform: translateY(0); }

/* ===================  Responsive 768  =================== */
@media (max-width: 768px){
  .nlx-ctaSplit{ padding: 66px 0; }
  .nlx-ctaSplit__wrap{ width: min(980px, calc(100% - 34px)); }

  .nlx-ctaSplit__grid{
    grid-template-columns: 1fr;   /* stack */
    gap: 0;
    border-radius: 20px;
  }

  .nlx-ctaSplit__media{
    padding: 16px 16px 8px;
  }

  .nlx-ctaSplit__mediaInner{
    min-height: 320px;
  }

  .nlx-ctaSplit__img{
    max-height: 320px;
    width: min(560px, 100%);
  }

  .nlx-ctaSplit__copy{
    padding: 18px 18px 22px;
  }

  .nlx-ctaSplit__text{
    max-width: 100%;
  }
}

/* ===================  Responsive 425  =================== */
@media (max-width: 425px){
  .nlx-ctaSplit__wrap{ width: calc(100% - 26px); }

  .nlx-ctaSplit__grid{
    border-radius: 18px;
  }

  .nlx-ctaSplit__media{
    padding: 14px 14px 6px;
  }

  .nlx-ctaSplit__mediaInner{
    min-height: 240px;
  }

  .nlx-ctaSplit__img{
    max-height: 240px;
  }

  .nlx-ctaSplit__copy{
    padding: 16px 14px 18px;
  }

  .nlx-ctaSplit__actions{
    flex-direction: column; /* full width buttons */
    gap: 10px;
  }

  .nlx-ctaSplit__btn{
    width: 100%;
    white-space: normal;
    text-align: center;
    padding: 12px 14px;
  }
}

/* ===================  Responsive 320  =================== */
@media (max-width: 320px){
  .nlx-ctaSplit__wrap{ width: calc(100% - 22px); }

  .nlx-ctaSplit__mediaInner{
    min-height: 210px;
  }

  .nlx-ctaSplit__img{
    max-height: 210px;
  }

  .nlx-ctaSplit__btn{
    font-size: 14px;
  }
}







/* ==============  FAQ (ACCORDION)  ============== */
.nlx-faq{
  padding: 88px 0;
}

.nlx-faq__wrap{
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

/* Head */
.nlx-faq__head{
  text-align: center;
  max-width: 900px;
  margin: 0 auto 28px;
}

.nlx-faq__kicker{
  display: inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,129,128,.08);
  border: 1px solid rgba(0,129,128,.22);
  color: #008180;
  font-weight: 750;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
}

.nlx-faq__title{
  margin: 16px 0 10px;
  color: #008180;
  font-weight: 900;
  letter-spacing: -0.02em;
  font-size: clamp(28px, 2.6vw, 44px);
  line-height: 1.08;
}

.nlx-faq__intro{
  margin: 0 auto;
  max-width: 740px;
  color: rgba(11,27,31,.74);
  font-size: 16px;
  line-height: 1.7;
}

/* List */
.nlx-faq__list{
  max-width: 920px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
}

/* Item */
.nlx-faqItem{
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 14px 36px rgba(0,0,0,.06);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.nlx-faqItem:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 48px rgba(0,0,0,.08);
  border-color: rgba(0,129,128,.18);
}

/* Question button */
.nlx-faqQ{
  width: 100%;
  background: transparent;
  border: 0;
  padding: 16px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  cursor: pointer;
  text-align: left;
}

.nlx-faqQ__text{
  color: #0b1b1f;
  font-weight: 900;
  letter-spacing: -0.01em;
  font-size: 16.5px;
  line-height: 1.35;
}

.nlx-faqQ__icon{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: grid;
  place-items: center;

  background: rgba(0,129,128,.10);
  border: 1px solid rgba(0,129,128,.18);
  color: #008180;
  font-weight: 900;
  font-size: 18px;

  transition: transform .22s ease, background .22s ease, color .22s ease, border-color .22s ease;
  flex: 0 0 auto;
}

/* Answer panel (animated height) */
.nlx-faqA{
  height: 0;
  overflow: hidden;
  transition: height .28s ease;
}

.nlx-faqA__inner{
  padding: 0 16px 16px;
  color: rgba(11,27,31,.74);
  line-height: 1.65;
  font-size: 15px;
}

/* Open state */
.nlx-faqItem.is-open{
  border-color: rgba(0,129,128,.28);
}

.nlx-faqItem.is-open .nlx-faqQ__icon{
  transform: rotate(45deg);
  background: rgba(216,118,37,.14);
  border-color: rgba(216,118,37,.26);
  color: #d87625;
}

/* Reveal */
.nlx-faqRv{
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
  will-change: opacity, transform;
}
.nlx-faqRv.is-in{
  opacity: 1;
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 768px){
  .nlx-faq{ padding: 66px 0; }
  .nlx-faq__wrap{ width: min(980px, calc(100% - 34px)); }
}

@media (max-width: 425px){
  .nlx-faq__wrap{ width: calc(100% - 26px); }

  .nlx-faqItem{
    border-radius: 16px;
  }

  .nlx-faqQ{
    padding: 14px 14px;
  }

  .nlx-faqA__inner{
    padding: 0 14px 14px;
    font-size: 14.8px;
  }

  .nlx-faqQ__icon{
    width: 36px;
    height: 36px;
  }
}

@media (max-width: 320px){
  .nlx-faq__wrap{ width: calc(100% - 22px); }
  .nlx-faqQ__text{ font-size: 16px; }
  .nlx-faqA__inner{ font-size: 14.6px; }
}
