/* i Seller Easy — Nexux-inspired Landing */

.ise-nx {
   --nx-bg: #fafafa;
   --nx-white: #ffffff;
   --nx-dark: #0a0a0a;
   --nx-muted: #6b7280;
   --nx-border: #e8e8e8;
   --nx-accent: #111111;
   --nx-radius: 20px;
   --nx-radius-sm: 14px;
   --nx-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
   --nx-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
   font-family: 'Inter', 'Sarabun', sans-serif;
   color: var(--nx-dark);
   background: var(--nx-white);
   overflow-x: hidden;
}

.ise-nx-container {
   max-width: 1200px;
   padding-left: 20px;
   padding-right: 20px;
}

.ise-nx-section {
   padding: 100px 0;
}
.ise-nx-section--soft {
   background: var(--nx-bg);
}

/* Typography */
.ise-nx-label {
   display: inline-block;
   font-size: 13px;
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   color: var(--nx-muted);
   margin-bottom: 14px;
}
.ise-nx-heading {
   font-family: 'Kanit', 'Inter', sans-serif;
   font-size: clamp(1.85rem, 4vw, 2.75rem);
   font-weight: 700;
   line-height: 1.2;
   margin-bottom: 16px;
   color: var(--nx-dark);
}
.ise-nx-text {
   font-size: 1.05rem;
   line-height: 1.75;
   color: var(--nx-muted);
   margin-bottom: 24px;
   max-width: 560px;
}
.ise-nx-text--center {
   margin-left: auto;
   margin-right: auto;
}
.ise-nx-gradient {
   background: var(--nx-gradient);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
}

/* Buttons */
.ise-nx-btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   padding: 14px 28px;
   border-radius: 999px;
   font-weight: 600;
   font-size: 15px;
   border: none;
   cursor: pointer;
   transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
   text-decoration: none;
}
.ise-nx-btn:hover {
   transform: translateY(-2px);
   text-decoration: none;
}
.ise-nx-btn--dark {
   background: var(--nx-dark);
   color: #fff;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}
.ise-nx-btn--dark:hover { color: #fff; background: #222; }
.ise-nx-btn--outline {
   background: transparent;
   color: var(--nx-dark);
   border: 1.5px solid var(--nx-border);
}
.ise-nx-btn--outline:hover { border-color: var(--nx-dark); color: var(--nx-dark); }
.ise-nx-btn--white {
   background: #fff;
   color: var(--nx-dark);
}
.ise-nx-btn--white:hover { color: var(--nx-dark); }
.ise-nx-btn--ghost-white {
   background: rgba(255, 255, 255, 0.12);
   color: #fff;
   border: 1.5px solid rgba(255, 255, 255, 0.35);
}
.ise-nx-btn--ghost-white:hover { color: #fff; background: rgba(255, 255, 255, 0.2); }
.ise-nx-link {
   color: var(--nx-dark);
   font-weight: 600;
   text-decoration: none;
   display: inline-flex;
   align-items: center;
   gap: 8px;
}
.ise-nx-link:hover { color: #444; }

/* Pill badge */
.ise-nx-pill {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   padding: 8px 18px;
   border-radius: 999px;
   background: var(--nx-bg);
   border: 1px solid var(--nx-border);
   font-size: 14px;
   font-weight: 600;
   margin-bottom: 20px;
}
.ise-nx-pill__dot {
   width: 8px;
   height: 8px;
   border-radius: 50%;
   background: #22c55e;
   animation: nxPulse 2s ease infinite;
}
@keyframes nxPulse {
   0%, 100% { opacity: 1; transform: scale(1); }
   50% { opacity: 0.6; transform: scale(0.9); }
}

/* Hero */
.ise-nx-hero {
   position: relative;
   padding: 140px 0 80px;
   overflow: hidden;
   min-height: 92vh;
   display: flex;
   align-items: center;
}
.ise-nx-hero__video-wrap {
   position: absolute;
   inset: 0;
   z-index: 0;
   overflow: hidden;
}
.ise-nx-hero__video {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   transform: scale(1.02);
}
.ise-nx-hero__video-overlay {
   position: absolute;
   inset: 0;
   background:
      linear-gradient(105deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.9) 38%, rgba(250, 250, 250, 0.72) 58%, rgba(250, 250, 250, 0.35) 100%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, transparent 40%);
   pointer-events: none;
}
.ise-nx-hero__content {
   position: relative;
   z-index: 2;
}
.ise-nx-hero__mesh {
   position: absolute;
   inset: 0;
   z-index: 1;
   background:
      radial-gradient(ellipse 80% 60% at 20% 0%, rgba(102, 126, 234, 0.08), transparent 55%),
      radial-gradient(ellipse 60% 50% at 90% 20%, rgba(240, 147, 251, 0.06), transparent 50%);
   pointer-events: none;
}
.ise-nx-hero__title {
   font-family: 'Kanit', 'Inter', sans-serif;
   font-size: clamp(2.2rem, 5.5vw, 3.5rem);
   font-weight: 700;
   line-height: 1.12;
   margin-bottom: 20px;
}
.ise-nx-hero__sub {
   font-size: 1.1rem;
   color: var(--nx-muted);
   line-height: 1.75;
   margin-bottom: 28px;
   max-width: 520px;
}
.ise-nx-hero__form {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   max-width: 480px;
   margin-bottom: 12px;
}
.ise-nx-hero__input {
   flex: 1 1 200px;
   padding: 14px 20px;
   border-radius: 999px;
   border: 1.5px solid var(--nx-border);
   font-size: 15px;
   outline: none;
   transition: border-color 0.2s;
}
.ise-nx-hero__input:focus {
   border-color: #667eea;
}
.ise-nx-hero__note {
   font-size: 13px;
   color: var(--nx-muted);
   margin: 0;
}
.ise-nx-hero__visual {
   position: relative;
}
.ise-nx-hero__img-wrap {
   border-radius: var(--nx-radius);
   overflow: hidden;
   box-shadow: var(--nx-shadow);
   border: 1px solid var(--nx-border);
}
.ise-nx-hero__img-wrap img {
   width: 100%;
   height: auto;
   display: block;
   object-fit: cover;
}

/* Floating cards */
.ise-nx-float {
   position: absolute;
   display: flex;
   align-items: center;
   gap: 12px;
   background: var(--nx-white);
   padding: 14px 18px;
   border-radius: var(--nx-radius-sm);
   box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
   border: 1px solid var(--nx-border);
   animation: nxFloat 4s ease-in-out infinite;
   z-index: 2;
}
.ise-nx-float--tl { top: 8%; left: -4%; animation-delay: 0s; }
.ise-nx-float--br { bottom: 10%; right: -4%; animation-delay: 1.5s; }
.ise-nx-float i {
   width: 40px;
   height: 40px;
   border-radius: 10px;
   background: var(--nx-dark);
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
}
.ise-nx-float strong {
   display: block;
   font-size: 18px;
   line-height: 1.2;
}
.ise-nx-float span {
   font-size: 12px;
   color: var(--nx-muted);
}
@keyframes nxFloat {
   0%, 100% { transform: translateY(0); }
   50% { transform: translateY(-10px); }
}

/* Marquee */
.ise-nx-marquee {
   padding: 28px 0;
   border-top: 1px solid var(--nx-border);
   border-bottom: 1px solid var(--nx-border);
   overflow: hidden;
   background: var(--nx-bg);
}
.ise-nx-marquee__track {
   display: flex;
   width: max-content;
   animation: nxMarquee 35s linear infinite;
}
.ise-nx-marquee__group {
   display: flex;
   gap: 16px;
   padding-right: 16px;
}
.ise-nx-marquee__item {
   white-space: nowrap;
   padding: 10px 22px;
   border-radius: 999px;
   background: var(--nx-white);
   border: 1px solid var(--nx-border);
   font-size: 14px;
   font-weight: 500;
   color: var(--nx-dark);
}
@keyframes nxMarquee {
   0% { transform: translateX(0); }
   100% { transform: translateX(-50%); }
}

/* Image card */
.ise-nx-img-card {
   border-radius: var(--nx-radius);
   overflow: hidden;
   box-shadow: var(--nx-shadow);
}
.ise-nx-img-card img {
   width: 100%;
   height: auto;
   display: block;
   object-fit: cover;
}

/* Feature cards */
.ise-nx-card {
   background: var(--nx-white);
   border-radius: var(--nx-radius);
   overflow: hidden;
   border: 1px solid var(--nx-border);
   height: 100%;
   transition: transform 0.3s, box-shadow 0.3s;
}
.ise-nx-card:hover {
   transform: translateY(-6px);
   box-shadow: var(--nx-shadow);
}
.ise-nx-card__img {
   aspect-ratio: 16/10;
   overflow: hidden;
}
.ise-nx-card__img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.4s;
}
.ise-nx-card:hover .ise-nx-card__img img {
   transform: scale(1.04);
}
.ise-nx-card__body {
   padding: 28px 24px;
}
.ise-nx-card__icon {
   width: 44px;
   height: 44px;
   border-radius: 12px;
   background: var(--nx-dark);
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 16px;
   font-size: 18px;
}
.ise-nx-card h3 {
   font-family: 'Kanit', sans-serif;
   font-size: 1.15rem;
   margin-bottom: 10px;
}
.ise-nx-card p {
   font-size: 15px;
   color: var(--nx-muted);
   margin: 0;
   line-height: 1.65;
}

/* Built items */
.ise-nx-built {
   height: 100%;
}
.ise-nx-built__img {
   border-radius: var(--nx-radius);
   overflow: hidden;
   margin-bottom: 20px;
   aspect-ratio: 4/3;
}
.ise-nx-built__img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.4s;
}
.ise-nx-built:hover .ise-nx-built__img img {
   transform: scale(1.03);
}
.ise-nx-built h3 {
   font-family: 'Kanit', sans-serif;
   font-size: 1.2rem;
   margin-bottom: 8px;
}
.ise-nx-built p {
   color: var(--nx-muted);
   margin: 0;
   font-size: 15px;
   line-height: 1.65;
}

/* Benefits */
.ise-nx-benefits {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 24px;
}
.ise-nx-benefit {
   background: var(--nx-white);
   border: 1px solid var(--nx-border);
   border-radius: var(--nx-radius);
   padding: 32px 28px;
   transition: transform 0.3s, box-shadow 0.3s;
}
.ise-nx-benefit:hover {
   transform: translateY(-4px);
   box-shadow: 0 12px 36px rgba(0, 0, 0, 0.06);
}
.ise-nx-benefit__icon {
   width: 48px;
   height: 48px;
   border-radius: 12px;
   background: var(--nx-bg);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 20px;
   margin-bottom: 18px;
   color: var(--nx-dark);
}
.ise-nx-benefit h4 {
   font-family: 'Kanit', sans-serif;
   font-size: 1.05rem;
   margin-bottom: 10px;
}
.ise-nx-benefit p {
   font-size: 14px;
   color: var(--nx-muted);
   margin: 0;
   line-height: 1.65;
}

/* Stats */
.ise-nx-stats__grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 24px;
   margin-bottom: 56px;
}
.ise-nx-stat {
   text-align: center;
   padding: 32px 20px;
   background: var(--nx-white);
   border-radius: var(--nx-radius);
   border: 1px solid var(--nx-border);
}
.ise-nx-stat__num {
   font-family: 'Kanit', sans-serif;
   font-size: clamp(2rem, 4vw, 2.75rem);
   font-weight: 700;
   line-height: 1.1;
   margin-bottom: 10px;
}
.ise-nx-stat__num span {
   font-size: 0.55em;
   color: var(--nx-muted);
}
.ise-nx-stat p {
   font-size: 14px;
   color: var(--nx-muted);
   margin: 0;
}
.ise-nx-brands {
   text-align: center;
}
.ise-nx-brands > p {
   font-size: 14px;
   color: var(--nx-muted);
   margin-bottom: 20px;
}
.ise-nx-brands__row {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 12px 28px;
}
.ise-nx-brands__row span {
   font-size: 15px;
   font-weight: 600;
   color: #9ca3af;
   letter-spacing: 0.02em;
}

/* Platform orbit (Softec) */
#platforms {
   overflow: hidden;
}
#platforms .ise-orbit .tp-payment-method__wrapper {
   max-width: 100%;
}
#platforms .ise-orbit .tp-payment-method__main-circle {
   display: inline-block;
}
#platforms:not(.ise-sl-platforms) .ise-orbit .tp-payment-method__main-img {
   display: inline-block;
   line-height: 0;
}
#platforms .ise-orbit [class*="tp-payment-method__line-"] > span {
   display: inline-block;
   vertical-align: middle;
   line-height: 1.2;
   text-align: center;
}
#platforms:not(.ise-sl-platforms) .ise-orbit__center {
   width: 118px;
   height: 118px;
   border-radius: 50%;
   background: linear-gradient(135deg, #FF6B35, #FF8C42);
   display: flex;
   align-items: center;
   justify-content: center;
   color: #fff;
   font-size: 50px;
   box-shadow: 0 12px 40px rgba(255, 107, 53, 0.38);
   margin: 0 auto;
}
.ise-orbit__node {
   width: 62px;
   height: 62px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #fff;
   font-size: 26px;
   margin: 0 auto;
   box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14);
   flex-shrink: 0;
}
.ise-orbit__node--sm {
   width: 48px;
   height: 48px;
   font-size: 20px;
}
.ise-orbit__label {
   margin: 8px 0 0;
   padding: 0;
   font-size: 13px;
   font-weight: 600;
   color: var(--nx-dark);
   white-space: nowrap;
}
@media (min-width: 1200px) {
   #platforms:not(.ise-sl-platforms) .ise-orbit__center { width: 120px; height: 120px; }
   .ise-orbit__node { width: 64px; height: 64px; }
}
@media (max-width: 991px) {
   #platforms:not(.ise-sl-platforms) .ise-orbit__center { width: 96px; height: 96px; font-size: 40px; }
   .ise-orbit__node { width: 54px; height: 54px; font-size: 22px; }
   .ise-orbit__label { font-size: 12px; }
}

/* Mobile platform grid */
.ise-hub-grid {
   display: none;
   grid-template-columns: repeat(4, 1fr);
   gap: 16px 12px;
   max-width: 400px;
   margin: 0 auto;
   text-align: center;
}
.ise-hub-grid__item span {
   display: block;
   margin-top: 6px;
   font-size: 11px;
   font-weight: 600;
   color: var(--nx-dark);
}
@media (max-width: 767px) {
   .ise-hub-grid { display: grid; }
}

/* Testimonials */
.ise-nx-testimonials {
   position: relative;
   overflow: hidden;
}
.ise-nx-testimonials__track {
   display: flex;
   gap: 24px;
   transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
.ise-nx-testimonial {
   flex: 0 0 calc(33.333% - 16px);
   min-width: 280px;
   background: var(--nx-white);
   border: 1px solid var(--nx-border);
   border-radius: var(--nx-radius);
   padding: 32px 28px;
}
.ise-nx-testimonial__stars {
   color: #fbbf24;
   font-size: 14px;
   margin-bottom: 16px;
   display: flex;
   gap: 4px;
}
.ise-nx-testimonial__text {
   font-size: 15px;
   line-height: 1.75;
   color: var(--nx-dark);
   margin-bottom: 24px;
}
.ise-nx-testimonial__author {
   display: flex;
   align-items: center;
   gap: 14px;
}
.ise-nx-testimonial__author img {
   width: 48px;
   height: 48px;
   border-radius: 50%;
   object-fit: cover;
}
.ise-nx-testimonial__author strong {
   display: block;
   font-size: 15px;
}
.ise-nx-testimonial__author span {
   font-size: 13px;
   color: var(--nx-muted);
}
.ise-nx-testimonials__nav {
   display: flex;
   justify-content: center;
   gap: 12px;
   margin-top: 28px;
}
.ise-nx-testimonials__btn {
   width: 44px;
   height: 44px;
   border-radius: 50%;
   border: 1px solid var(--nx-border);
   background: var(--nx-white);
   cursor: pointer;
   transition: background 0.2s, border-color 0.2s;
}
.ise-nx-testimonials__btn:hover {
   background: var(--nx-dark);
   color: #fff;
   border-color: var(--nx-dark);
}

/* Steps */
.ise-nx-step {
   background: var(--nx-white);
   border: 1px solid var(--nx-border);
   border-radius: var(--nx-radius);
   padding: 36px 28px;
   height: 100%;
}
.ise-nx-step__num {
   display: block;
   font-size: 13px;
   font-weight: 700;
   color: var(--nx-muted);
   margin-bottom: 16px;
   letter-spacing: 0.05em;
}
.ise-nx-step h3 {
   font-family: 'Kanit', sans-serif;
   font-size: 1.2rem;
   margin-bottom: 12px;
}
.ise-nx-step p {
   font-size: 15px;
   color: var(--nx-muted);
   margin: 0;
   line-height: 1.65;
}

/* Pricing */
.ise-nx-pricing-toggle {
   display: inline-flex;
   background: var(--nx-bg);
   padding: 5px;
   border-radius: 999px;
   border: 1px solid var(--nx-border);
}
.ise-nx-pricing-toggle__btn {
   padding: 10px 24px;
   border-radius: 999px;
   border: none;
   background: transparent;
   font-weight: 600;
   font-size: 14px;
   cursor: pointer;
   color: var(--nx-muted);
   transition: background 0.2s, color 0.2s;
}
.ise-nx-pricing-toggle__btn.is-active {
   background: var(--nx-dark);
   color: #fff;
}
.ise-nx-pricing-toggle__btn em {
   font-style: normal;
   font-size: 12px;
   background: #fef3c7;
   color: #92400e;
   padding: 2px 8px;
   border-radius: 999px;
   margin-left: 6px;
}
.ise-nx-pricing {
   background: var(--nx-white);
   border: 1px solid var(--nx-border);
   border-radius: var(--nx-radius);
   padding: 36px 32px;
   height: 100%;
   position: relative;
   transition: transform 0.3s, box-shadow 0.3s;
}
.ise-nx-pricing:hover {
   transform: translateY(-4px);
   box-shadow: var(--nx-shadow);
}
.ise-nx-pricing--featured {
   border: 2px solid var(--nx-dark);
   box-shadow: var(--nx-shadow);
}
.ise-nx-pricing__badge {
   position: absolute;
   top: -12px;
   left: 50%;
   transform: translateX(-50%);
   background: var(--nx-dark);
   color: #fff;
   font-size: 12px;
   font-weight: 600;
   padding: 5px 16px;
   border-radius: 999px;
}
.ise-nx-pricing h3 {
   font-family: 'Kanit', sans-serif;
   font-size: 1.35rem;
   margin-bottom: 6px;
}
.ise-nx-pricing__desc {
   font-size: 14px;
   color: var(--nx-muted);
   margin-bottom: 20px;
}
.ise-nx-pricing__price {
   margin-bottom: 24px;
}
.ise-nx-pricing__price span:not([hidden]) {
   font-family: 'Kanit', sans-serif;
   font-size: 2.5rem;
   font-weight: 700;
}
.ise-nx-pricing__price small {
   font-size: 14px;
   color: var(--nx-muted);
}
.ise-nx-pricing ul {
   list-style: none;
   padding: 0;
   margin: 0 0 28px;
}
.ise-nx-pricing ul li {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 9px 0;
   font-size: 14px;
   color: var(--nx-muted);
}
.ise-nx-pricing ul li i {
   color: #22c55e;
   font-size: 13px;
}

/* CTA */
.ise-nx-cta {
   padding: 100px 0 120px;
}
.ise-nx-cta__box {
   background: var(--nx-dark);
   color: #fff;
   border-radius: 28px;
   padding: 72px 48px;
   text-align: center;
   position: relative;
   overflow: hidden;
}
.ise-nx-cta__box::before {
   content: '';
   position: absolute;
   width: 400px;
   height: 400px;
   background: radial-gradient(circle, rgba(102, 126, 234, 0.25), transparent 70%);
   top: -200px;
   right: -100px;
   pointer-events: none;
}
.ise-nx-cta__box h2 {
   font-family: 'Kanit', sans-serif;
   font-size: clamp(1.75rem, 4vw, 2.5rem);
   margin-bottom: 14px;
   position: relative;
}
.ise-nx-cta__box p {
   font-size: 1.05rem;
   color: rgba(255, 255, 255, 0.75);
   margin-bottom: 32px;
   position: relative;
}
.ise-nx-cta__actions {
   display: flex;
   flex-wrap: wrap;
   gap: 14px;
   justify-content: center;
   position: relative;
}

/* Scroll reveal */
.nx-reveal {
   opacity: 1;
   transform: translateY(0);
}
html.js .nx-reveal {
   opacity: 0;
   transform: translateY(28px);
   transition: opacity 0.65s ease, transform 0.65s ease;
}
html.js .nx-reveal.is-visible {
   opacity: 1;
   transform: translateY(0);
}
.ise-nx-hero .nx-reveal {
   opacity: 1;
   transform: translateY(0);
}
html.js .ise-nx-hero .nx-reveal {
   opacity: 0;
   transform: translateY(20px);
}
html.js .ise-nx-hero .nx-reveal.is-visible {
   opacity: 1;
   transform: translateY(0);
}

/* Landing body overrides */
body.ise-nx-body header {
   background: rgba(255, 255, 255, 0.85);
   backdrop-filter: blur(16px);
}
body.ise-nx-body .btn-register {
   background: #0a0a0a;
   box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
body.ise-nx-body footer {
   background: #0a0a0a;
}

/* Responsive */
@media (max-width: 991px) {
   .ise-nx-section { padding: 72px 0; }
   .ise-nx-hero {
      padding: 120px 0 64px;
      min-height: auto;
   }
   .ise-nx-hero__video-overlay {
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.88) 55%, rgba(250, 250, 250, 0.75) 100%);
   }
   .ise-nx-benefits { grid-template-columns: repeat(2, 1fr); }
   .ise-nx-stats__grid { grid-template-columns: repeat(2, 1fr); }
   .ise-nx-testimonial { flex: 0 0 calc(50% - 12px); }
   .ise-nx-float { display: none; }
}

@media (max-width: 767px) {
   .ise-nx-hero__form { flex-direction: column; }
   .ise-nx-hero__form .ise-nx-btn { width: 100%; }
   .ise-nx-benefits { grid-template-columns: 1fr; }
   .ise-nx-stats__grid { grid-template-columns: 1fr 1fr; gap: 16px; }
   .ise-nx-testimonial { flex: 0 0 100%; }
   .ise-nx-cta__box { padding: 48px 24px; }
   .ise-nx-cta__actions .ise-nx-btn { width: 100%; }
}

@media (max-width: 575px) {
   .ise-nx-stats__grid { grid-template-columns: 1fr; }
}
