/* ============================================================
   NexCare — Bath Sponges  ·  Premium Design System
   Brand palette taken from the logo:
     Ocean Blue  #1B79C9 / deep navy #0E4C8B
     Fresh Green #43B649 / #2E8B3D
     Aqua/Cyan   #4FC3E8
     Sponge Gold #F5C13B
   ============================================================ */

:root{
    --blue:        #1B79C9;
    --blue-deep:   #0E4C8B;
    --green:       #43B649;
    --green-deep:  #2E8B3D;
    --aqua:        #4FC3E8;
    --gold:        #F5C13B;

    --ink:         #112233;
    --body:        #51606f;
    --muted:       #8a98a6;
    --line:        #e7eef4;
    --bg:          #ffffff;
    --bg-soft:     #f3f8fc;
    --bg-mint:     #eef9f1;

    --grad-brand:  linear-gradient(120deg, var(--blue-deep) 0%, var(--blue) 45%, var(--aqua) 100%);
    --grad-fresh:  linear-gradient(120deg, var(--blue) 0%, var(--green) 100%);
    --grad-soft:   linear-gradient(160deg, #f3f8fc 0%, #eef9f1 100%);

    --shadow-sm:   0 2px 10px rgba(14,76,139,.06);
    --shadow:      0 14px 40px rgba(14,76,139,.10);
    --shadow-lg:   0 30px 70px rgba(14,76,139,.16);
    --shadow-gold: 0 14px 30px rgba(245,193,59,.35);

    --r-sm: 12px;
    --r:    18px;
    --r-lg: 28px;
    --r-xl: 38px;

    --container: 1200px;
    --font: 'Manrope', system-ui, sans-serif;
    --display: 'Plus Jakarta Sans', system-ui, sans-serif;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
    font-family:var(--font);
    color:var(--body);
    background:var(--bg);
    line-height:1.65;
    font-size:16px;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
body.no-scroll{ overflow:hidden; }
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
input,select,textarea{ font-family:inherit; font-size:16px; }
h1,h2,h3,h4{ font-family:var(--display); color:var(--ink); line-height:1.15; font-weight:800; letter-spacing:-.02em; }

.nx-container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 24px; }

/* ---------- Section helpers ---------- */
.nx-section{ padding:96px 0; }
.nx-label{
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--font); font-weight:700; font-size:.78rem;
    letter-spacing:.16em; text-transform:uppercase;
    color:var(--blue);
    background:var(--bg-soft);
    padding:8px 16px; border-radius:999px;
    margin-bottom:18px;
}
.nx-label i{ color:var(--green); }
.nx-title{ font-size:clamp(1.9rem, 4vw, 2.9rem); margin-bottom:14px; }
.nx-title span{ background:var(--grad-fresh); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.nx-subtitle{ font-size:1.08rem; color:var(--muted); max-width:620px; }
.nx-head--center{ text-align:center; }
.nx-head--center .nx-subtitle{ margin:0 auto; }

/* ---------- Buttons ---------- */
.nx-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    font-family:var(--font); font-weight:700; font-size:.98rem;
    padding:15px 30px; border-radius:999px;
    transition:transform .25s, box-shadow .25s, background .25s, color .25s;
    white-space:nowrap; line-height:1;
}
.nx-btn i{ font-size:1.05em; }
.nx-btn--primary{ background:var(--grad-brand); color:#fff; box-shadow:0 14px 30px rgba(27,121,201,.35); }
.nx-btn--primary:hover{ transform:translateY(-3px); box-shadow:0 20px 40px rgba(27,121,201,.45); }
.nx-btn--wa{ background:#25D366; color:#fff; box-shadow:0 14px 30px rgba(37,211,102,.35); }
.nx-btn--wa:hover{ transform:translateY(-3px); box-shadow:0 20px 40px rgba(37,211,102,.45); }
.nx-btn--gold{ background:var(--gold); color:#5a4304; box-shadow:var(--shadow-gold); }
.nx-btn--gold:hover{ transform:translateY(-3px); }
.nx-btn--outline{ background:#fff; color:var(--blue-deep); border:1.5px solid var(--line); }
.nx-btn--outline:hover{ border-color:var(--blue); color:var(--blue); transform:translateY(-3px); }
.nx-btn--ghost{ background:rgba(255,255,255,.15); color:#fff; border:1.5px solid rgba(255,255,255,.4); backdrop-filter:blur(6px); }
.nx-btn--ghost:hover{ background:rgba(255,255,255,.28); transform:translateY(-3px); }
.nx-btn--full{ width:100%; }
.nx-btn--lg{ padding:18px 38px; font-size:1.05rem; }

/* ============================================================
   TOP BAR
   ============================================================ */
.nx-topbar{
    background:var(--grad-brand); color:#fff;
    font-size:.84rem; font-weight:600; text-align:center;
}
.nx-topbar p{ padding:9px 0; letter-spacing:.01em; }
.nx-topbar i{ margin-right:6px; color:var(--gold); }

/* ============================================================
   HEADER
   ============================================================ */
.nx-header{ position:sticky; top:0; z-index:100; background:rgba(255,255,255,.85); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); transition:box-shadow .3s, background .3s; }
.nx-header.scrolled{ box-shadow:var(--shadow-sm); background:rgba(255,255,255,.96); }
.nx-header__row{ display:flex; align-items:center; justify-content:space-between; gap:24px; height:78px; }
.nx-header__logo img{ height:52px; width:auto; }
.nx-header__nav{ display:flex; align-items:center; gap:6px; }
.nx-header__link{ position:relative; font-weight:600; font-size:.96rem; color:var(--ink); padding:10px 16px; border-radius:999px; transition:color .2s, background .2s; }
.nx-header__link::after{ content:''; position:absolute; left:16px; right:16px; bottom:4px; height:2px; background:var(--grad-fresh); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.nx-header__link:hover{ color:var(--blue); }
.nx-header__link:hover::after{ transform:scaleX(1); }
.nx-header__link.active{ color:var(--blue); }
.nx-header__link.active::after{ transform:scaleX(1); }

/* Highlighted "Value Deals" nav item — compact amber accent, looping animation */
.nx-header__link--deal{ color:#EE8A0C; font-weight:800; display:inline-block; animation:nxDealPulse 2.2s ease-in-out infinite; }
.nx-header__link--deal:hover{ color:#d97a05; animation:none; }
.nx-header__link--deal::after{ background:#EE8A0C; }
.nx-header__link--deal i{ margin-right:5px; font-size:.8rem; display:inline-block; transform-origin:center; animation:nxDealWiggle 2.2s ease-in-out infinite; }
.nx-mobile__link--deal{ color:#EE8A0C; }
.nx-mobile__link--deal i{ margin-right:8px; display:inline-block; transform-origin:center; animation:nxDealWiggle 2.2s ease-in-out infinite; }
@keyframes nxDealPulse{ 0%,45%,100%{ transform:scale(1); } 22%{ transform:scale(1.09); } }
@keyframes nxDealWiggle{ 0%,45%,100%{ transform:rotate(0deg); } 12%{ transform:rotate(-14deg); } 24%{ transform:rotate(12deg); } 34%{ transform:rotate(-6deg); } }
@media (prefers-reduced-motion: reduce){ .nx-header__link--deal, .nx-header__link--deal i, .nx-mobile__link--deal i{ animation:none; } }
.nx-header__right{ display:flex; align-items:center; gap:14px; }
.nx-header__cta{ display:inline-flex; align-items:center; gap:8px; background:var(--grad-brand); color:#fff; font-weight:700; font-size:.92rem; padding:12px 24px; border-radius:999px; box-shadow:0 10px 22px rgba(27,121,201,.30); transition:transform .25s, box-shadow .25s; }
.nx-header__cta:hover{ transform:translateY(-2px); box-shadow:0 16px 30px rgba(27,121,201,.42); }

/* Cart button */
.nx-cart-btn{ position:relative; width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:var(--bg-soft); color:var(--blue-deep); font-size:1.15rem; transition:background .2s, transform .2s; }
.nx-cart-btn:hover{ background:var(--aqua); color:#fff; transform:translateY(-2px); }
.nx-cart-btn__count{ position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; display:grid; place-items:center; background:var(--gold); color:#5a4304; font-size:.72rem; font-weight:800; border-radius:999px; border:2px solid #fff; }
.nx-cart-btn__count.pop{ animation:countPop .4s; }
@keyframes countPop{ 0%{ transform:scale(1);} 40%{ transform:scale(1.5);} 100%{ transform:scale(1);} }

/* Burger */
.nx-header__burger{ display:none; flex-direction:column; gap:5px; width:42px; height:42px; align-items:center; justify-content:center; border-radius:12px; background:var(--bg-soft); }
.nx-header__burger span{ width:20px; height:2px; background:var(--ink); border-radius:2px; transition:.3s; }
.nx-header__burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nx-header__burger.open span:nth-child(2){ opacity:0; }
.nx-header__burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Mobile menu */
.nx-mobile{ position:fixed; inset:0; width:100%; height:100%; background:#fff; transform:translateX(100%); transition:transform .35s cubic-bezier(.5,0,.2,1); z-index:1000; display:flex; flex-direction:column; padding:26px 28px 40px; gap:6px; overflow-y:auto; }
.nx-mobile.open{ transform:translateX(0); }
.nx-mobile__close{ position:absolute; top:22px; right:22px; width:44px; height:44px; border-radius:50%; background:var(--bg-soft); color:var(--ink); display:grid; place-items:center; font-size:1.4rem; border:none; cursor:pointer; }
.nx-mobile__close:hover{ background:var(--blue); color:#fff; }
.nx-mobile__brand{ margin:0 0 22px; }
.nx-mobile__brand img{ height:46px; width:auto; }
.nx-mobile__link{ font-family:var(--display); font-weight:700; font-size:1.2rem; color:var(--ink); padding:14px 4px; border-bottom:1px solid var(--line); }
.nx-mobile__link.active{ color:var(--blue); }
.nx-mobile__cta{ margin-top:18px; text-align:center; background:var(--grad-brand); color:#fff; font-weight:700; padding:15px; border-radius:999px; }

/* ============================================================
   HERO
   ============================================================ */
.nx-hero{ position:relative; background:var(--grad-soft); overflow:hidden; padding:70px 0 90px; }
.nx-hero__bubbles{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.nx-hero__bubbles span{ position:absolute; bottom:-60px; border-radius:50%; background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(79,195,232,.25)); box-shadow:inset 0 0 12px rgba(255,255,255,.6); animation:rise linear infinite; }
.nx-hero__bubbles span:nth-child(1){ left:8%;  width:26px; height:26px; animation-duration:14s; }
.nx-hero__bubbles span:nth-child(2){ left:20%; width:46px; height:46px; animation-duration:19s; animation-delay:3s; }
.nx-hero__bubbles span:nth-child(3){ left:38%; width:18px; height:18px; animation-duration:12s; animation-delay:1s; }
.nx-hero__bubbles span:nth-child(4){ left:62%; width:58px; height:58px; animation-duration:22s; animation-delay:5s; }
.nx-hero__bubbles span:nth-child(5){ left:78%; width:30px; height:30px; animation-duration:16s; animation-delay:2s; }
.nx-hero__bubbles span:nth-child(6){ left:90%; width:40px; height:40px; animation-duration:20s; animation-delay:6s; }
@keyframes rise{ to{ transform:translateY(-115vh) translateX(30px); opacity:.2; } }

.nx-hero__grid{ position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.nx-hero__badge{ display:inline-flex; align-items:center; gap:9px; background:#fff; color:var(--blue-deep); font-weight:700; font-size:.85rem; padding:9px 18px; border-radius:999px; box-shadow:var(--shadow-sm); margin-bottom:22px; }
.nx-hero__badge i{ color:var(--gold); }
.nx-hero__title{ font-size:clamp(2.4rem, 5.2vw, 4rem); line-height:1.06; margin-bottom:20px; }
.nx-hero__title span{ position:relative; background:var(--grad-fresh); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.nx-hero__text{ font-size:1.14rem; color:var(--body); max-width:520px; margin-bottom:32px; }
.nx-hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:40px; }
.nx-hero__stats{ display:flex; align-items:center; gap:28px; }
.nx-hero__stat-num{ display:block; font-family:var(--display); font-weight:800; font-size:1.9rem; color:var(--blue-deep); line-height:1; }
.nx-hero__stat-label{ font-size:.82rem; color:var(--muted); font-weight:600; }
.nx-hero__stat-sep{ width:1px; height:40px; background:var(--line); }

/* Hero visual */
.nx-hero__visual{ position:relative; }
.nx-hero__visual::before{ content:''; position:absolute; inset:-7% -5%; border:2px dashed rgba(27,121,201,.16); border-radius:50%; z-index:1; animation:heroSpin 38s linear infinite; }
.nx-hero__disc{ position:absolute; inset:-6% -4%; background:radial-gradient(circle at 50% 45%, rgba(79,195,232,.30), rgba(67,182,73,.12) 60%, transparent 72%); border-radius:50%; animation:heroPulse 7s ease-in-out infinite; }
.nx-hero__collage{ position:relative; z-index:2; display:grid; grid-template-columns:1.45fr 1fr; grid-template-rows:1fr 1fr; gap:16px; aspect-ratio:1/1; }
.nx-hero__ph{ position:relative; border-radius:var(--r-lg); overflow:hidden; background:#fff; box-shadow:var(--shadow); transition:transform .35s, box-shadow .35s; }
.nx-hero__ph::after{ content:''; position:absolute; inset:0; border-radius:var(--r-lg); box-shadow:inset 0 0 0 3px #fff; pointer-events:none; }
.nx-hero__ph img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.8,.2,1); }
.nx-hero__ph:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); z-index:4; }
.nx-hero__ph:hover img{ transform:scale(1.08); }
.nx-hero__ph--main{ grid-row:1 / span 2; animation:heroFloat 6.5s ease-in-out infinite; }
.nx-hero__ph--a{ animation:heroFloat 5.5s ease-in-out infinite .4s; }
.nx-hero__ph--b{ animation:heroFloat 6s ease-in-out infinite .8s; }
.nx-hero__card{ position:absolute; z-index:3; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.65); border-radius:var(--r); padding:14px 18px; box-shadow:var(--shadow); display:flex; align-items:center; gap:12px; }
.nx-hero__card--top{ top:18px; left:-26px; animation:heroBob 4.6s ease-in-out infinite; }
.nx-hero__card--bottom{ bottom:24px; right:-22px; animation:heroBob 5.6s ease-in-out infinite .6s; }
.nx-hero__card-ic{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center; color:#fff; font-size:1.1rem; }
.nx-hero__card--top .nx-hero__card-ic{ background:var(--grad-fresh); }
.nx-hero__card--bottom .nx-hero__card-ic{ background:var(--gold); color:#5a4304; }
.nx-hero__card strong{ display:block; font-family:var(--display); font-size:.96rem; color:var(--ink); }
.nx-hero__card small{ color:var(--muted); font-size:.78rem; }
@keyframes heroFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }
@keyframes heroBob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-9px);} }
@keyframes heroPulse{ 0%,100%{ transform:scale(1); opacity:1;} 50%{ transform:scale(1.04); opacity:.82;} }
@keyframes heroSpin{ to{ transform:rotate(360deg);} }
@media (prefers-reduced-motion: reduce){
    .nx-hero__visual::before,.nx-hero__disc,.nx-hero__ph,.nx-hero__card{ animation:none; }
}

/* ============================================================
   TRUST STRIP
   ============================================================ */
.nx-trust{ margin-top:-44px; position:relative; z-index:5; }
.nx-trust__grid{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow); display:grid; grid-template-columns:repeat(4,1fr); }
.nx-trust__item{ display:flex; align-items:center; gap:14px; padding:24px 26px; }
.nx-trust__item + .nx-trust__item{ border-left:1px solid var(--line); }
.nx-trust__ic{ flex:none; width:50px; height:50px; border-radius:14px; display:grid; place-items:center; font-size:1.25rem; color:#fff; background:var(--grad-brand); }
.nx-trust__item:nth-child(2) .nx-trust__ic{ background:var(--grad-fresh); }
.nx-trust__item:nth-child(3) .nx-trust__ic{ background:linear-gradient(120deg,var(--aqua),var(--blue)); }
.nx-trust__item:nth-child(4) .nx-trust__ic{ background:#25D366; }
.nx-trust__item strong{ display:block; font-family:var(--display); font-size:.98rem; color:var(--ink); }
.nx-trust__item span{ font-size:.82rem; color:var(--muted); }

/* ============================================================
   PRODUCT CARDS
   ============================================================ */
.nx-products{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.nx-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s; display:flex; flex-direction:column; }
.nx-card:hover{ transform:translateY(-10px); box-shadow:0 36px 70px rgba(14,76,139,.18); border-color:transparent; }
.nx-card__media{ position:relative; aspect-ratio:1/1; background:radial-gradient(120% 120% at 50% 16%, #ffffff 0%, var(--bg-soft) 68%, #e6f1fa 100%); overflow:hidden; }
.nx-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.8,.2,1); }
.nx-card:hover .nx-card__media img{ transform:scale(1.08); }
.nx-card__badges{ position:absolute; top:14px; left:14px; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.nx-card__badge{ display:inline-flex; align-items:center; gap:6px; font-size:.74rem; font-weight:800; letter-spacing:.03em; padding:6px 12px; border-radius:999px; box-shadow:0 6px 16px rgba(14,76,139,.16); }
.nx-card__badge--sale{ background:linear-gradient(120deg,#F5C13B,#f7d272); color:#5a4304; }
.nx-card__badge--save{ background:#fff; color:var(--green-deep); }
.nx-card__badge--save i{ font-size:.85em; }
.nx-card__badge--out{ background:rgba(17,34,51,.78); color:#fff; text-transform:uppercase; }
.nx-card__quick{ position:absolute; top:14px; right:14px; display:flex; flex-direction:column; gap:10px; opacity:0; transform:translateY(-6px); transition:opacity .3s, transform .3s; }
.nx-card:hover .nx-card__quick{ opacity:1; transform:none; }
.nx-card__view{ flex:none; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.96); color:var(--blue-deep); display:grid; place-items:center; box-shadow:var(--shadow); transition:background .2s,color .2s,transform .2s; }
.nx-card__view:hover{ background:var(--blue); color:#fff; transform:scale(1.08); }
.nx-card__body{ padding:20px 20px 22px; display:flex; flex-direction:column; flex:1; }
.nx-card__cat{ font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--aqua); margin-bottom:7px; }
.nx-card__name{ font-family:var(--display); font-size:1.14rem; color:var(--ink); margin-bottom:7px; line-height:1.3; }
.nx-card__name a:hover{ color:var(--blue); }
.nx-card__desc{ font-size:.88rem; color:var(--muted); margin-bottom:18px; flex:1; }
.nx-card__foot{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.nx-price{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.nx-price__now{ font-family:var(--display); font-weight:800; font-size:1.35rem; color:var(--blue-deep); }
.nx-price__old{ font-size:.92rem; color:var(--muted); text-decoration:line-through; }
.nx-card__add{ flex:none; width:46px; height:46px; border-radius:14px; background:var(--grad-brand); color:#fff; display:grid; place-items:center; font-size:1.05rem; transition:transform .2s, box-shadow .2s; box-shadow:0 8px 18px rgba(27,121,201,.30); }
.nx-card__add:hover{ transform:translateY(-2px) scale(1.05); box-shadow:0 12px 24px rgba(27,121,201,.42); }
.nx-card__add[disabled]{ background:#cbd6df; box-shadow:none; cursor:not-allowed; }
.nx-card.is-out .nx-card__media img{ filter:grayscale(.4) opacity(.7); }

.nx-stars{ color:var(--gold); font-size:.82rem; letter-spacing:1px; }

/* ============================================================
   ABOUT
   ============================================================ */
.nx-about{ background:#fff; }
.nx-about__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:center; }
.nx-about__media{ position:relative; }
.nx-about__media-main{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:1/1; }
.nx-about__media-main img{ width:100%; height:100%; object-fit:cover; }
.nx-about__media-mini{ position:absolute; bottom:-28px; right:-22px; width:44%; border-radius:var(--r-lg); overflow:hidden; border:6px solid #fff; box-shadow:var(--shadow); aspect-ratio:1/1; }
.nx-about__media-mini img{ width:100%; height:100%; object-fit:cover; }
.nx-about__blob{ position:absolute; top:-30px; left:-30px; width:130px; height:130px; background:var(--grad-fresh); border-radius:42% 58% 60% 40%/45% 45% 55% 55%; opacity:.14; z-index:-1; }
.nx-about p{ margin-bottom:16px; }
.nx-about__quote{ font-family:var(--display); font-style:italic; font-weight:600; font-size:1.18rem; color:var(--blue-deep); border-left:4px solid var(--green); padding-left:18px; margin-top:24px; }
.nx-about__mini-stats{ display:flex; gap:30px; margin-top:28px; }
.nx-about__mini-stats b{ font-family:var(--display); font-size:1.7rem; color:var(--green-deep); display:block; line-height:1; }
.nx-about__mini-stats span{ font-size:.84rem; color:var(--muted); }

/* ============================================================
   WHY  (feature cards)
   ============================================================ */
.nx-why{ background:var(--grad-soft); position:relative; overflow:hidden; }
.nx-why__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.nx-why__card{ background:#fff; border-radius:var(--r-lg); padding:34px 26px; box-shadow:var(--shadow-sm); transition:transform .3s, box-shadow .3s; text-align:center; }
.nx-why__card:hover{ transform:translateY(-8px); box-shadow:var(--shadow); }
.nx-why__ic{ width:66px; height:66px; margin:0 auto 20px; border-radius:20px; display:grid; place-items:center; font-size:1.6rem; color:#fff; background:var(--grad-brand); box-shadow:0 12px 24px rgba(27,121,201,.30); }
.nx-why__card:nth-child(2) .nx-why__ic{ background:var(--grad-fresh); box-shadow:0 12px 24px rgba(67,182,73,.30); }
.nx-why__card:nth-child(3) .nx-why__ic{ background:linear-gradient(120deg,var(--aqua),var(--blue)); }
.nx-why__card:nth-child(4) .nx-why__ic{ background:var(--gold); color:#5a4304; box-shadow:var(--shadow-gold); }
.nx-why__card h3{ font-size:1.16rem; margin-bottom:10px; }
.nx-why__card p{ font-size:.92rem; color:var(--muted); }

/* ============================================================
   CTA BAND
   ============================================================ */
.nx-cta{ padding:56px 0; }
.nx-cta__inner{ position:relative; background:var(--grad-brand); border-radius:var(--r-xl); padding:64px 56px; text-align:center; overflow:hidden; color:#fff; box-shadow:var(--shadow-lg); }
.nx-cta__inner::before,.nx-cta__inner::after{ content:''; position:absolute; border-radius:50%; background:rgba(255,255,255,.10); }
.nx-cta__inner::before{ width:280px; height:280px; top:-120px; left:-60px; }
.nx-cta__inner::after{ width:220px; height:220px; bottom:-110px; right:-40px; }
.nx-cta__inner h2{ color:#fff; font-size:clamp(1.8rem,3.6vw,2.6rem); margin-bottom:14px; position:relative; }
.nx-cta__inner p{ color:rgba(255,255,255,.9); max-width:560px; margin:0 auto 30px; position:relative; }
.nx-cta__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; position:relative; }

/* ============================================================
   REVIEWS
   ============================================================ */
.nx-reviews{ background:#fff; }
.nx-reviews__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.nx-review{ background:var(--bg-soft); border-radius:var(--r-lg); padding:32px 28px; position:relative; }
.nx-review__quote{ font-size:2.4rem; color:var(--aqua); line-height:1; font-family:var(--display); margin-bottom:6px; }
.nx-review__text{ color:var(--ink); font-size:1.02rem; margin-bottom:20px; }
.nx-review__who{ display:flex; align-items:center; gap:12px; }
.nx-review__av{ width:44px; height:44px; border-radius:50%; background:var(--grad-fresh); color:#fff; display:grid; place-items:center; font-weight:800; font-family:var(--display); }
.nx-review__who b{ font-family:var(--display); color:var(--ink); display:block; font-size:.96rem; }
.nx-review__who span{ font-size:.82rem; color:var(--muted); }
.nx-review .nx-stars{ font-size:.95rem; margin-bottom:14px; }

/* ============================================================
   CONTACT
   ============================================================ */
.nx-contact{ background:var(--grad-soft); }
.nx-contact__grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:start; }
.nx-contact__info{ display:flex; flex-direction:column; justify-content:center; }
.nx-contact__details{ margin-top:24px; display:flex; flex-direction:column; gap:14px; }
.nx-contact__details a,.nx-contact__details span{ display:flex; align-items:center; gap:14px; font-weight:600; color:var(--ink); }
.nx-contact__details i{ width:44px; height:44px; flex:none; border-radius:14px; background:#fff; color:var(--blue); display:grid; place-items:center; box-shadow:var(--shadow-sm); }
.nx-contact__form{ background:#fff; border-radius:var(--r-lg); padding:36px; box-shadow:var(--shadow); }
.nx-field{ margin-bottom:16px; }
.nx-field label{ display:block; font-weight:600; font-size:.88rem; color:var(--ink); margin-bottom:7px; }
.nx-input{ width:100%; padding:14px 16px; border:1.5px solid var(--line); border-radius:var(--r-sm); background:#fbfdff; color:var(--ink); transition:border-color .2s, box-shadow .2s; }
.nx-input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 4px rgba(27,121,201,.12); background:#fff; }
textarea.nx-input{ resize:vertical; min-height:120px; }
.nx-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* ============================================================
   FOOTER
   ============================================================ */
.nx-footer{ background:var(--bg-soft); color:var(--body); padding:64px 0 0; border-top:1px solid var(--line); }
.nx-footer__top{ display:grid; grid-template-columns:1.7fr 1fr 1fr 1.3fr; gap:40px; padding-bottom:48px; }
.nx-footer__logo{ height:54px; margin-bottom:18px; }
.nx-footer__tagline{ font-size:.95rem; max-width:300px; margin-bottom:20px; color:var(--body); }
.nx-footer__social{ display:flex; gap:10px; }
.nx-footer__social a{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:#fff; color:var(--blue-deep); border:1px solid var(--line); transition:background .2s, color .2s, transform .2s; }
.nx-footer__social a:hover{ background:var(--grad-fresh); color:#fff; border-color:transparent; transform:translateY(-3px); }
.nx-footer__col h4{ color:var(--ink); font-size:1rem; margin-bottom:18px; }
.nx-footer__col a,.nx-footer__col span{ display:flex; align-items:center; gap:10px; color:var(--body); padding:7px 0; font-size:.92rem; transition:color .2s; }
.nx-footer__col a:hover{ color:var(--blue); }
.nx-footer__col i{ color:var(--blue); width:16px; }
.nx-footer__bottom{ border-top:1px solid var(--line); }
.nx-footer__bottom-row{ display:flex; justify-content:space-between; align-items:center; padding:20px 24px; flex-wrap:wrap; gap:8px; }
.nx-footer__bottom p{ font-size:.85rem; }
.nx-footer__made{ color:var(--muted); }

/* ---------- Floating WhatsApp + ToTop ---------- */
.nx-wa-float{ position:fixed; bottom:26px; left:26px; z-index:80; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; font-size:1.7rem; box-shadow:0 12px 30px rgba(37,211,102,.5); animation:wapulse 2.4s infinite; }
@keyframes wapulse{ 0%,100%{ box-shadow:0 12px 30px rgba(37,211,102,.5);} 50%{ box-shadow:0 12px 30px rgba(37,211,102,.5), 0 0 0 12px rgba(37,211,102,0);} }
.nx-totop{ position:fixed; bottom:26px; right:26px; z-index:80; width:50px; height:50px; border-radius:14px; background:var(--blue-deep); color:#fff; display:grid; place-items:center; font-size:1.1rem; opacity:0; visibility:hidden; transform:translateY(14px); transition:.3s; box-shadow:var(--shadow); }
.nx-totop.show{ opacity:1; visibility:visible; transform:translateY(0); }

/* ============================================================
   PAGE HEADER (inner pages)
   ============================================================ */
.nx-pagehead{ background:var(--grad-soft); padding:54px 0; text-align:center; border-bottom:1px solid var(--line); }
.nx-pagehead h1{ font-size:clamp(2rem,4vw,3rem); margin-bottom:10px; }
.nx-breadcrumb{ display:flex; gap:8px; justify-content:center; font-size:.9rem; color:var(--muted); }
.nx-breadcrumb a:hover{ color:var(--blue); }
.nx-breadcrumb span{ color:var(--green); }

/* ============================================================
   SHOP TOOLBAR
   ============================================================ */
.nx-shopbar{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:30px; flex-wrap:wrap; }
.nx-shopbar__count{ color:var(--muted); font-size:.95rem; }
.nx-search{ display:flex; align-items:center; gap:8px; background:#fff; border:1.5px solid var(--line); border-radius:999px; padding:8px 8px 8px 18px; }
.nx-search input{ border:none; outline:none; background:none; width:200px; }
.nx-search button{ width:38px; height:38px; border-radius:50%; background:var(--grad-brand); color:#fff; display:grid; place-items:center; }

/* ============================================================
   PRODUCT DETAIL
   ============================================================ */
.nx-pd{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:start; }
.nx-pd__media-wrap{ position:sticky; top:100px; align-self:start; }
.nx-pd__media{ position:relative; border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); background:var(--bg-soft); aspect-ratio:1/1; }
.nx-pd__media img{ width:100%; height:100%; object-fit:cover; }
.nx-pd__badge{ position:absolute; top:18px; left:18px; font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; padding:7px 14px; border-radius:999px; background:var(--gold); color:#5a4304; }
.nx-pd__cat{ font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--aqua); margin-bottom:10px; }
.nx-pd h1{ font-size:clamp(1.8rem,3.4vw,2.6rem); margin-bottom:14px; }
.nx-pd__price{ display:flex; align-items:baseline; gap:12px; margin-bottom:8px; }
.nx-pd__price .nx-price__now{ font-size:2rem; }
.nx-pd__price .nx-price__old{ font-size:1.15rem; }
.nx-pd__save{ display:inline-block; background:var(--bg-mint); color:var(--green-deep); font-weight:700; font-size:.84rem; padding:5px 12px; border-radius:999px; margin-bottom:20px; }
.nx-pd__desc{ font-size:1.04rem; margin-bottom:26px; }
.nx-pd__stock{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.92rem; margin-bottom:24px; }
.nx-pd__stock.in{ color:var(--green-deep); }
.nx-pd__stock.out{ color:#c0392b; }
.nx-pd__buy{ display:flex; gap:14px; align-items:stretch; flex-wrap:wrap; margin-bottom:24px; }
.nx-qty{ display:flex; align-items:center; border:1.5px solid var(--line); border-radius:999px; overflow:hidden; }
.nx-qty button{ width:48px; height:52px; font-size:1.1rem; color:var(--blue-deep); transition:background .2s; }
.nx-qty button:hover{ background:var(--bg-soft); }
.nx-qty input{ width:48px; text-align:center; border:none; outline:none; font-weight:700; font-size:1.05rem; color:var(--ink); }
.nx-pd__features{ display:flex; flex-direction:column; gap:12px; border-top:1px solid var(--line); padding-top:24px; }
.nx-pd__features li{ display:flex; align-items:center; gap:12px; font-weight:600; color:var(--ink); }
.nx-pd__features i{ width:36px; height:36px; flex:none; border-radius:10px; background:var(--bg-mint); color:var(--green-deep); display:grid; place-items:center; }

/* ============================================================
   CART
   ============================================================ */
.nx-cartgrid{ display:grid; grid-template-columns:1.6fr .9fr; gap:32px; align-items:start; }
.nx-cartlist{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.nx-cartrow{ display:grid; grid-template-columns:90px 1fr auto auto; gap:18px; align-items:center; padding:20px; border-bottom:1px solid var(--line); }
.nx-cartrow:last-child{ border-bottom:none; }
.nx-cartrow__img{ width:90px; height:90px; border-radius:var(--r-sm); overflow:hidden; background:var(--bg-soft); }
.nx-cartrow__img img{ width:100%; height:100%; object-fit:cover; }
.nx-cartrow__name{ font-family:var(--display); font-weight:700; color:var(--ink); margin-bottom:4px; }
.nx-cartrow__price{ color:var(--muted); font-size:.9rem; }
.nx-cartrow__remove{ color:var(--muted); font-size:.92rem; transition:color .2s; }
.nx-cartrow__remove:hover{ color:#c0392b; }
.nx-cartrow__total{ font-family:var(--display); font-weight:800; color:var(--blue-deep); min-width:90px; text-align:right; }
.nx-qty--sm button{ width:38px; height:40px; }
.nx-qty--sm input{ width:40px; }

.nx-summary{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; position:sticky; top:100px; box-shadow:var(--shadow-sm); }
.nx-summary h3{ font-size:1.3rem; margin-bottom:20px; }
.nx-summary__row{ display:flex; justify-content:space-between; padding:11px 0; color:var(--body); }
.nx-summary__row--total{ border-top:2px solid var(--line); margin-top:8px; padding-top:18px; font-family:var(--display); font-weight:800; font-size:1.3rem; color:var(--ink); }
.nx-summary__free{ color:var(--green-deep); font-weight:700; }
.nx-summary .nx-btn{ margin-top:18px; }
.nx-summary__note{ text-align:center; font-size:.84rem; color:var(--muted); margin-top:14px; }

.nx-empty{ text-align:center; padding:80px 20px; }
.nx-empty i{ font-size:3.4rem; color:var(--line); margin-bottom:18px; }
.nx-empty h2{ margin-bottom:10px; }
.nx-empty p{ color:var(--muted); margin-bottom:24px; }

/* ============================================================
   CHECKOUT
   ============================================================ */
.nx-checkout{ display:grid; grid-template-columns:1.3fr .9fr; gap:32px; align-items:start; }
.nx-panel{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:32px; box-shadow:var(--shadow-sm); }
.nx-panel h3{ font-size:1.25rem; margin-bottom:6px; }
.nx-panel__sub{ color:var(--muted); font-size:.92rem; margin-bottom:22px; }
.nx-pay{ display:flex; gap:14px; margin-top:8px; }
.nx-pay__opt{ flex:1; border:1.5px solid var(--line); border-radius:var(--r); padding:18px; display:flex; gap:12px; align-items:center; cursor:pointer; transition:border-color .2s, background .2s; }
.nx-pay__opt.active{ border-color:var(--green); background:var(--bg-mint); }
.nx-pay__opt i{ font-size:1.4rem; color:var(--green-deep); }
.nx-pay__opt strong{ display:block; color:var(--ink); font-family:var(--display); }
.nx-pay__opt small{ color:var(--muted); }

.nx-mini-item{ display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.nx-mini-item:last-of-type{ border-bottom:none; }
.nx-mini-item img{ width:54px; height:54px; border-radius:10px; object-fit:cover; background:var(--bg-soft); }
.nx-mini-item__name{ font-weight:600; color:var(--ink); font-size:.92rem; }
.nx-mini-item__qty{ color:var(--muted); font-size:.84rem; }
.nx-mini-item__price{ margin-left:auto; font-weight:700; color:var(--blue-deep); }

/* ---------- Order success ---------- */
.nx-success{ max-width:640px; margin:0 auto; text-align:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:54px 40px; box-shadow:var(--shadow); }
.nx-success__check{ width:84px; height:84px; margin:0 auto 24px; border-radius:50%; background:var(--bg-mint); color:var(--green-deep); display:grid; place-items:center; font-size:2.4rem; }
.nx-success h1{ margin-bottom:10px; }
.nx-success__num{ display:inline-block; background:var(--bg-soft); color:var(--blue-deep); font-family:var(--display); font-weight:800; padding:8px 20px; border-radius:999px; margin:14px 0 22px; letter-spacing:.04em; }
.nx-success__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:24px; }

/* ---------- Flash ---------- */
.nx-flash-wrap{ position:fixed; top:90px; right:24px; z-index:120; display:flex; flex-direction:column; gap:10px; max-width:340px; }
.nx-flash{ background:#fff; border-left:4px solid var(--green); border-radius:var(--r-sm); padding:14px 18px; box-shadow:var(--shadow); font-weight:600; color:var(--ink); animation:slideIn .3s; }
.nx-flash--error{ border-left-color:#c0392b; }
@keyframes slideIn{ from{ transform:translateX(30px); opacity:0; } }

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity .7s, transform .7s; }
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
    .nx-products{ grid-template-columns:repeat(3,1fr); }
    .nx-why__grid{ grid-template-columns:repeat(2,1fr); }
    .nx-trust__grid{ grid-template-columns:repeat(2,1fr); }
    .nx-trust__item:nth-child(3){ border-left:none; }
    .nx-trust__item:nth-child(odd){ border-left:none; }
    .nx-footer__top{ grid-template-columns:1fr 1fr; }
}
@media (max-width:900px){
    .nx-header__nav{ display:none; }
    .nx-header__cta{ display:none; }
    .nx-header__burger{ display:flex; }
    .nx-hero__grid{ grid-template-columns:1fr; gap:48px; }
    .nx-hero__visual{ max-width:460px; margin:0 auto; width:100%; }
    .nx-about__grid{ grid-template-columns:1fr; gap:60px; }
    .nx-contact__grid{ grid-template-columns:1fr; }
    .nx-pd{ grid-template-columns:1fr; gap:32px; }
    .nx-pd__media-wrap{ position:static; }
    .nx-cartgrid{ grid-template-columns:1fr; }
    .nx-checkout{ grid-template-columns:1fr; }
    .nx-reviews__grid{ grid-template-columns:1fr; }
}
@media (max-width:640px){
    .nx-section{ padding:64px 0; }
    .nx-products{ grid-template-columns:repeat(2,1fr); gap:16px; }
    .nx-why__grid{ grid-template-columns:1fr; }
    .nx-trust__grid{ grid-template-columns:1fr; }
    .nx-trust__item:nth-child(even){ border-left:none; }
    .nx-footer__top{ grid-template-columns:1fr; gap:30px; }
    .nx-hero__card--top{ left:0; }
    .nx-hero__card--bottom{ right:0; }
    .nx-cartrow{ grid-template-columns:70px 1fr; grid-template-areas:'img name' 'img qty' 'total total'; row-gap:10px; }
    .nx-cartrow__img{ grid-area:img; width:70px; height:70px; }
    .nx-card__body{ padding:14px; }
    .nx-card__desc{ display:none; }
    .nx-about__media-mini{ display:none; }
    .nx-row{ grid-template-columns:1fr; }
}
@media (max-width:380px){
    .nx-products{ grid-template-columns:1fr; }
}

/* ============================================================
   Side cart drawer
   ============================================================ */
.nx-drawer__overlay{
    position:fixed; inset:0; z-index:200;
    background:rgba(14,76,139,.32); backdrop-filter:blur(2px);
    opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s;
}
.nx-drawer__overlay.open{ opacity:1; visibility:visible; }

.nx-drawer{
    position:fixed; top:0; right:0; z-index:210;
    width:min(420px, 92vw); height:100%;
    background:var(--bg); box-shadow:var(--shadow-lg);
    display:flex; flex-direction:column;
    transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1);
    will-change:transform;
}
.nx-drawer.open{ transform:translateX(0); }
.nx-drawer.busy{ pointer-events:none; opacity:.7; }

.nx-drawer__head{
    flex:0 0 auto; display:flex; align-items:center; justify-content:space-between;
    padding:20px 22px; border-bottom:1px solid var(--line);
}
.nx-drawer__head h3{
    font-family:var(--display); font-size:1.18rem; color:var(--ink);
    display:flex; align-items:center; gap:10px; margin:0;
}
.nx-drawer__head h3 i{ color:var(--blue); }
.nx-drawer__close{
    width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
    font-size:1.15rem; color:var(--body); background:var(--bg-soft); transition:background .2s, color .2s;
}
.nx-drawer__close:hover{ background:var(--blue); color:#fff; }

.nx-drawer__body{ flex:1 1 auto; display:flex; flex-direction:column; min-height:0; }
.nx-drawer__loading{ flex:1; display:grid; place-items:center; font-size:1.6rem; color:var(--muted); }

.nx-drawer__empty{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; gap:14px; padding:30px 26px;
}
.nx-drawer__empty i{ font-size:2.4rem; color:var(--aqua); }
.nx-drawer__empty p{ color:var(--body); font-weight:600; }

.nx-drawer__items{ flex:1 1 auto; overflow-y:auto; padding:8px 22px; }

.nx-dcart-row{
    display:grid; grid-template-columns:64px 1fr auto; gap:14px; align-items:start;
    padding:16px 0; border-bottom:1px solid var(--line);
}
.nx-dcart-row__img{ width:64px; height:64px; border-radius:var(--r-sm); overflow:hidden; background:var(--bg-soft); }
.nx-dcart-row__img img{ width:100%; height:100%; object-fit:cover; }
.nx-dcart-row__name{ font-weight:700; color:var(--ink); font-size:.95rem; line-height:1.3; display:block; }
.nx-dcart-row__name:hover{ color:var(--blue); }
.nx-dcart-row__price{ color:var(--muted); font-size:.82rem; margin:2px 0 10px; }
.nx-dcart-row__end{ display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.nx-dcart-row__total{ font-weight:800; color:var(--ink); font-size:.95rem; }
.nx-dcart-row__remove{ color:var(--muted); font-size:.95rem; transition:color .2s; }
.nx-dcart-row__remove:hover{ color:#c0392b; }

.nx-drawer__foot{
    flex:0 0 auto; padding:18px 22px 22px; border-top:1px solid var(--line);
    background:var(--bg-soft);
}
.nx-drawer__ship{
    text-align:center; font-size:.82rem; color:var(--green-deep);
    background:var(--bg-mint); border-radius:var(--r-sm); padding:8px 12px; margin-bottom:12px;
}
.nx-drawer__row{ display:flex; justify-content:space-between; padding:5px 0; color:var(--body); font-size:.92rem; }
.nx-drawer__row--total{
    margin-top:6px; padding-top:12px; border-top:1px dashed var(--line);
    color:var(--ink); font-weight:800; font-size:1.08rem;
}
.nx-drawer__foot .nx-btn{ margin-top:14px; }

@media (max-width:560px){
    .nx-drawer{ width:100vw; }
}

/* ============================================================
   Product gallery thumbnails
   ============================================================ */
.nx-pd__thumbs{ display:flex; gap:12px; margin-top:14px; flex-wrap:wrap; }
.nx-pd__thumb{
    width:74px; height:74px; border-radius:var(--r-sm); overflow:hidden;
    border:2px solid var(--line); background:var(--bg-soft); cursor:pointer;
    transition:border-color .2s, transform .2s; padding:0;
}
.nx-pd__thumb img{ width:100%; height:100%; object-fit:cover; }
.nx-pd__thumb:hover{ transform:translateY(-2px); }
.nx-pd__thumb.active{ border-color:var(--blue); }

/* ============================================================
   Product colour selector (variant swatches)
   ============================================================ */
.nx-pd__colors{ margin:2px 0 26px; }
.nx-pd__colors-head{ display:block; font-weight:700; font-size:.9rem; color:var(--ink); margin-bottom:12px; }
.nx-pd__colors-head strong{ color:var(--blue-deep); }
.nx-pd__swatches{ display:flex; flex-wrap:wrap; gap:12px; }
.nx-pd__swatch{
    width:38px; height:38px; border-radius:50%; padding:0; cursor:pointer;
    background:var(--sw, #ccc); border:2px solid #fff;
    box-shadow:0 0 0 1.5px var(--line); transition:transform .15s, box-shadow .15s;
}
.nx-pd__swatch:hover{ transform:translateY(-2px); box-shadow:0 0 0 1.5px var(--blue); }
.nx-pd__swatch.active{ box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--blue); }

/* ============================================================
   Product page — pack-size selector
   ============================================================ */
.nx-pd__packs{ margin:2px 0 22px; }
.nx-pd__packopts{ display:flex; flex-wrap:wrap; gap:12px; }
.nx-packopt{
    cursor:pointer; text-align:center; min-width:112px; padding:13px 16px;
    border:2px solid var(--line); border-radius:var(--r-sm); background:#fff;
    display:flex; flex-direction:column; gap:3px;
    transition:border-color .2s, box-shadow .2s, transform .2s;
}
.nx-packopt:hover{ transform:translateY(-2px); border-color:var(--aqua); }
.nx-packopt.active{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(27,121,201,.12); }
.nx-packopt__label{ font-family:var(--display); font-weight:800; color:var(--ink); font-size:.98rem; }
.nx-packopt__price{ font-family:var(--display); font-weight:800; color:var(--blue-deep); font-size:1.06rem; }
.nx-packopt__per{ font-size:.75rem; color:var(--aqua); font-weight:700; }
.nx-packopt__save{ font-size:.72rem; font-weight:800; color:var(--green-deep); background:var(--bg-mint); border-radius:999px; padding:2px 8px; margin-top:1px; }
.nx-pd__note{ font-size:.85rem; color:#7a8ba0; margin-top:6px; }
.nx-pd__note i{ color:var(--aqua); margin-right:5px; }

/* ============================================================
   Value Packs showcase (homepage)
   ============================================================ */
.nx-label--gold{ color:#9a7400; }
.nx-label--gold i{ color:var(--gold); }
.nx-packsec{ position:relative; background:linear-gradient(180deg,#f2f9ff 0%,#eaf4ff 100%); overflow:hidden; }
.nx-packsec__bubbles{ position:absolute; inset:0; pointer-events:none; z-index:0; }
.nx-packsec__bubbles span{ position:absolute; border-radius:50%; }
.nx-packsec__bubbles span:nth-child(1){ width:240px; height:240px; top:-60px; left:-40px; background:radial-gradient(circle at 30% 30%, rgba(79,195,232,.25), rgba(79,195,232,0) 70%); }
.nx-packsec__bubbles span:nth-child(2){ width:180px; height:180px; bottom:-40px; right:8%; background:radial-gradient(circle at 30% 30%, rgba(245,193,59,.22), rgba(245,193,59,0) 70%); }
.nx-packsec__bubbles span:nth-child(3){ width:120px; height:120px; top:18%; right:-30px; background:radial-gradient(circle at 30% 30%, rgba(79,195,232,.20), rgba(79,195,232,0) 70%); }
.nx-packsec__bubbles span:nth-child(4){ width:90px; height:90px; bottom:22%; left:6%; background:radial-gradient(circle at 30% 30%, rgba(67,182,73,.18), rgba(67,182,73,0) 70%); }

.nx-packgrid{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.nx-pack{ display:grid; grid-template-columns:232px 1fr; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .3s, box-shadow .3s; }
.nx-pack:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.nx-pack__media{ position:relative; display:block; aspect-ratio:1/1; background:var(--bg-soft); }
.nx-pack__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.nx-pack__ribbon{ position:absolute; top:10px; left:10px; z-index:2; background:var(--gold); color:#5a4304; font-weight:800; font-size:.64rem; letter-spacing:.03em; text-transform:uppercase; padding:4px 9px; border-radius:999px; box-shadow:var(--shadow-sm); }
.nx-pack__body{ padding:15px 17px 16px; display:flex; flex-direction:column; }
.nx-pack__name{ font-family:var(--display); font-size:1.04rem; line-height:1.25; margin-bottom:9px; }
.nx-pack__name a{ color:var(--ink); }
.nx-pack__name a:hover{ color:var(--blue); }
.nx-pack__pricerow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:13px; }
.nx-pack__now{ font-family:var(--display); font-weight:800; font-size:1.42rem; color:var(--blue-deep); line-height:1; }
.nx-pack__was{ font-size:.9rem; color:#9aa7b4; text-decoration:line-through; }
.nx-pack__savepill{ display:inline-flex; align-items:center; background:var(--bg-mint); color:var(--green-deep); font-weight:800; font-size:.7rem; padding:3px 9px; border-radius:999px; }
.nx-pack__opts{ display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.nx-pack__opt{ cursor:pointer; min-width:50px; padding:6px 9px 5px; border:2px solid var(--line); border-radius:10px; background:#fff; display:flex; flex-direction:column; align-items:center; line-height:1.05; transition:border-color .2s, box-shadow .2s; }
.nx-pack__opt:hover{ border-color:var(--aqua); }
.nx-pack__opt.active{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(27,121,201,.12); }
.nx-pack__opt b{ font-family:var(--display); font-size:1.15rem; color:var(--blue-deep); }
.nx-pack__opt span{ font-size:.58rem; font-weight:700; color:#7a8ba0; text-transform:uppercase; letter-spacing:.05em; }
.nx-pack__add{ margin-top:auto; }

@media (max-width:980px){ .nx-packgrid{ grid-template-columns:1fr; max-width:640px; margin:0 auto; } }
@media (max-width:520px){ .nx-pack{ grid-template-columns:150px 1fr; } .nx-pack__body{ padding:13px 14px; } }

/* ============================================================
   Content / legal document pages (privacy, terms, returns)
   ============================================================ */
.nx-doc{ max-width:820px; }
.nx-doc__updated{ display:inline-block; font-size:.82rem; font-weight:700; color:var(--green-deep); background:var(--bg-mint); padding:6px 14px; border-radius:999px; margin-bottom:26px; }
.nx-doc p{ color:var(--body); line-height:1.75; margin-bottom:16px; }
.nx-doc h2{ font-family:var(--display); font-size:1.35rem; color:var(--ink); margin:34px 0 12px; }
.nx-doc ul, .nx-doc ol{ margin:0 0 18px 22px; color:var(--body); line-height:1.7; }
.nx-doc ul{ list-style:disc; }
.nx-doc ol{ list-style:decimal; }
.nx-doc li{ margin-bottom:8px; padding-left:4px; }
.nx-doc li::marker{ color:var(--blue); }
.nx-doc a{ color:var(--blue); font-weight:600; }
.nx-doc a:hover{ color:var(--blue-deep); text-decoration:underline; }
.nx-doc strong{ color:var(--ink); }
.nx-doc__links{ margin-top:36px; padding-top:22px; border-top:1px solid var(--line); font-weight:600; }

/* ============================================================
   Image lightbox (product big view)
   ============================================================ */
.nx-lightbox{ position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:40px; background:rgba(8,28,48,.9); backdrop-filter:blur(3px); }
.nx-lightbox.open{ display:flex; }
.nx-lightbox__img{ max-width:90vw; max-height:88vh; object-fit:contain; border-radius:12px; box-shadow:0 30px 80px rgba(0,0,0,.5); animation:lbIn .25s ease; }
@keyframes lbIn{ from{ opacity:0; transform:scale(.96); } to{ opacity:1; transform:none; } }
.nx-lightbox__close{ position:absolute; top:22px; right:26px; width:48px; height:48px; border:none; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-size:1.9rem; line-height:1; display:grid; place-items:center; cursor:pointer; transition:background .2s; }
.nx-lightbox__close:hover{ background:rgba(255,255,255,.28); }
.nx-lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border:none; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-size:1.3rem; display:grid; place-items:center; cursor:pointer; transition:background .2s; }
.nx-lightbox__nav:hover{ background:rgba(255,255,255,.28); }
.nx-lightbox__nav--prev{ left:24px; }
.nx-lightbox__nav--next{ right:24px; }
@media (max-width:560px){
    .nx-lightbox{ padding:16px; }
    .nx-lightbox__nav{ width:44px; height:44px; font-size:1.1rem; }
    .nx-lightbox__nav--prev{ left:10px; }
    .nx-lightbox__nav--next{ right:10px; }
    .nx-lightbox__close{ top:12px; right:12px; width:42px; height:42px; }
}

/* ============================================================
   How it works — 3 steps engagement section
   ============================================================ */
.nx-steps{ background:var(--grad-soft); }
.nx-steps__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; position:relative; }
.nx-step{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:40px 28px 30px; text-align:center; box-shadow:var(--shadow-sm); transition:transform .3s, box-shadow .3s; }
.nx-step:hover{ transform:translateY(-8px); box-shadow:var(--shadow); }
.nx-step__num{ position:absolute; top:-19px; left:50%; transform:translateX(-50%); width:40px; height:40px; border-radius:50%; background:var(--grad-brand); color:#fff; font-family:var(--display); font-weight:800; display:grid; place-items:center; box-shadow:0 8px 18px rgba(27,121,201,.32); border:3px solid #fff; }
.nx-step__ic{ width:74px; height:74px; margin:14px auto 18px; border-radius:22px; background:var(--bg-mint); color:var(--green-deep); display:grid; place-items:center; font-size:1.7rem; transition:transform .3s; }
.nx-step:hover .nx-step__ic{ transform:scale(1.08) rotate(-4deg); }
.nx-step:nth-child(2) .nx-step__ic{ background:#e6f3fb; color:var(--blue); }
.nx-step h3{ font-size:1.2rem; margin-bottom:10px; }
.nx-step p{ font-size:.94rem; color:var(--muted); }
@media (max-width:760px){
    .nx-steps__grid{ grid-template-columns:1fr; gap:38px; }
}

/* Side-cart quantity stepper — compact & tidy */
.nx-dcart-row .nx-qty{ width:fit-content; border:1.5px solid var(--line); border-radius:10px; }
.nx-dcart-row .nx-qty--sm button{ width:32px; height:32px; font-size:1.05rem; color:var(--blue-deep); }
.nx-dcart-row .nx-qty--sm button:hover{ background:var(--bg-soft); color:var(--blue); }
.nx-dcart-row .nx-qty--sm input{ width:34px; font-size:.95rem; }

/* ============================================================
   Order tracking
   ============================================================ */
.nx-track{ max-width:720px; }
.nx-track__form{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:26px; box-shadow:var(--shadow-sm); margin-bottom:28px; }
.nx-track__fields{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:18px; }
.nx-track__form .nx-input{ width:100%; padding:13px 16px; border:1.5px solid var(--line); border-radius:var(--r-sm); background:#fbfdff; color:var(--ink); }
.nx-track__form .nx-input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 4px rgba(27,121,201,.12); }
.nx-track__form .nx-field label{ display:block; font-weight:600; font-size:.88rem; color:var(--ink); margin-bottom:7px; }
.nx-track__error{ background:#fdecea; border:1px solid #f5c6c2; color:#a3382f; border-radius:14px; padding:14px 18px; font-weight:600; margin-bottom:24px; }
.nx-track__hint{ color:var(--muted); text-align:center; font-size:.95rem; }
.nx-track__hint i,.nx-track__error i{ margin-right:6px; }

.nx-track__result{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:28px; box-shadow:var(--shadow-sm); }
.nx-track__head{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; padding-bottom:20px; border-bottom:1px solid var(--line); margin-bottom:26px; }
.nx-track__num{ display:block; font-family:var(--display); font-weight:800; font-size:1.2rem; color:var(--ink); }
.nx-track__date{ font-size:.86rem; color:var(--muted); }
.nx-track__status{ font-size:.8rem; font-weight:800; padding:7px 14px; border-radius:999px; text-transform:uppercase; letter-spacing:.04em; }
.nx-track__status--new{ background:#e8f1fb; color:var(--blue-deep); }
.nx-track__status--confirmed{ background:#fff4d6; color:#9a7400; }
.nx-track__status--shipped{ background:#e6f0ff; color:#2b5fb3; }
.nx-track__status--delivered{ background:var(--bg-mint); color:var(--green-deep); }
.nx-track__status--cancelled{ background:#fdecea; color:#c0392b; }

.nx-track__timeline{ display:flex; flex-direction:column; gap:0; margin-bottom:28px; }
.nx-track__step{ display:flex; align-items:flex-start; gap:16px; position:relative; padding-bottom:26px; }
.nx-track__step:not(:last-child)::before{ content:''; position:absolute; left:23px; top:46px; bottom:0; width:2px; background:var(--line); }
.nx-track__step--done:not(:last-child)::before,.nx-track__step--active:not(:last-child)::before{ background:var(--green); }
.nx-track__dot{ flex:none; width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-size:1.1rem; background:var(--bg-soft); color:var(--muted); border:2px solid var(--line); z-index:1; }
.nx-track__step--done .nx-track__dot{ background:var(--green); color:#fff; border-color:var(--green); }
.nx-track__step--active .nx-track__dot{ background:var(--grad-brand); color:#fff; border-color:transparent; box-shadow:0 8px 18px rgba(27,121,201,.32); animation:trackPulse 1.8s ease-in-out infinite; }
@keyframes trackPulse{ 0%,100%{ box-shadow:0 8px 18px rgba(27,121,201,.32);} 50%{ box-shadow:0 8px 26px rgba(27,121,201,.55);} }
.nx-track__info{ padding-top:4px; }
.nx-track__info strong{ display:block; font-family:var(--display); color:var(--ink); font-size:1.02rem; }
.nx-track__info span{ font-size:.86rem; color:var(--muted); }
.nx-track__step--todo .nx-track__info strong{ color:var(--muted); }

.nx-track__cancelled{ background:#fdecea; color:#c0392b; border-radius:14px; padding:16px 20px; font-weight:600; margin-bottom:24px; }
.nx-track__items h3{ font-size:1.05rem; margin-bottom:14px; }
.nx-track__item{ display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-size:.94rem; }
.nx-track__item--total{ border-bottom:none; font-weight:800; color:var(--ink); font-size:1.05rem; padding-top:14px; }
.nx-track__result .nx-btn--full{ margin-top:20px; }

@media (max-width:560px){
    .nx-track__fields{ grid-template-columns:1fr; }
}

/* Store closed banner */
.nx-closed-banner{ background:#fff4d6; color:#8a6d00; text-align:center; font-weight:600; font-size:.9rem; padding:10px 16px; border-bottom:1px solid #f0d98a; }
.nx-closed-banner i{ margin-right:6px; }

/* ============================================================
   Shop filters sidebar
   ============================================================ */
.nx-shoplayout{ display:grid; grid-template-columns:262px 1fr; gap:30px; align-items:start; }
.nx-shopmain{ min-width:0; }
.nx-shopmain .nx-products{ grid-template-columns:repeat(auto-fill, minmax(215px, 1fr)); }

.nx-filters{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:22px; box-shadow:var(--shadow-sm); position:sticky; top:100px; }
.nx-filters__head{ display:flex; align-items:center; justify-content:space-between; }
.nx-filters__head h3{ font-size:1.1rem; display:flex; align-items:center; gap:9px; }
.nx-filters__head h3 i{ color:var(--blue); }
.nx-filters__close{ display:none; width:38px; height:38px; border-radius:50%; background:var(--bg-soft); color:var(--ink); place-items:center; font-size:1.2rem; border:none; cursor:pointer; }
.nx-filtergroup{ padding:18px 0; border-top:1px solid var(--line); margin-top:16px; }
.nx-filtergroup:first-of-type{ margin-top:16px; }
.nx-filtergroup h4{ font-family:var(--font); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:12px; }
.nx-check{ display:flex; align-items:center; gap:10px; padding:7px 0; cursor:pointer; font-size:.94rem; color:var(--ink); font-weight:500; }
.nx-check input{ width:18px; height:18px; accent-color:var(--blue); flex:none; }
.nx-check em{ margin-left:auto; font-style:normal; font-size:.76rem; color:var(--muted); background:var(--bg-soft); padding:2px 9px; border-radius:999px; }
.nx-pricerow{ display:flex; align-items:center; gap:8px; }
.nx-pricerow input{ width:100%; padding:10px 12px; border:1.5px solid var(--line); border-radius:10px; background:#fbfdff; color:var(--ink); font-weight:600; }
.nx-pricerow input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(27,121,201,.12); }
.nx-pricerow span{ color:var(--muted); }

/* Dual-handle price range slider */
.nx-range{ position:relative; height:24px; margin:12px 2px 6px; }
.nx-range__track{ position:absolute; top:9px; left:0; right:0; height:6px; border-radius:999px; background:var(--line); }
.nx-range__fill{ position:absolute; top:0; height:100%; border-radius:999px; background:var(--grad-fresh); }
.nx-range input[type="range"]{ position:absolute; top:0; left:0; width:100%; height:24px; margin:0; background:transparent; pointer-events:none; -webkit-appearance:none; appearance:none; }
.nx-range input[type="range"]:focus{ outline:none; }
.nx-range input[type="range"]::-webkit-slider-runnable-track{ -webkit-appearance:none; height:24px; background:transparent; border:none; }
.nx-range input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; pointer-events:auto; width:18px; height:18px; margin-top:3px; border-radius:50%; background:#fff; border:2.5px solid var(--blue); box-shadow:0 2px 5px rgba(14,76,139,.3); cursor:pointer; transition:transform .12s; }
.nx-range input[type="range"]::-webkit-slider-thumb:hover{ transform:scale(1.12); }
.nx-range input[type="range"]::-moz-range-track{ height:24px; background:transparent; border:none; }
.nx-range input[type="range"]::-moz-range-thumb{ pointer-events:auto; width:18px; height:18px; border:2.5px solid var(--blue); border-radius:50%; background:#fff; box-shadow:0 2px 5px rgba(14,76,139,.3); cursor:pointer; }
.nx-filters__hint{ font-size:.78rem; color:var(--muted); margin-top:8px; }
.nx-filters__hint span{ font-weight:800; color:var(--blue-deep); }
.nx-filters .nx-btn{ margin-top:6px; }
.nx-filters__reset{ display:block; text-align:center; margin-top:12px; font-size:.88rem; color:var(--muted); }
.nx-filters__reset:hover{ color:var(--blue); }

/* Shopbar controls */
.nx-shopbar__right{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.nx-sortselect{ padding:10px 16px; border:1.5px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font-weight:600; font-size:.9rem; cursor:pointer; }
.nx-sortselect:focus{ outline:none; border-color:var(--blue); }
.nx-filters__toggle{ display:none; align-items:center; gap:8px; padding:10px 18px; border-radius:999px; background:var(--blue-deep); color:#fff; font-weight:700; font-size:.9rem; border:none; cursor:pointer; }
.nx-filters__badge{ background:#fff; color:var(--blue-deep); border-radius:999px; padding:1px 8px; font-size:.75rem; font-weight:800; }
.nx-filters__overlay{ position:fixed; inset:0; background:rgba(14,76,139,.32); backdrop-filter:blur(2px); z-index:150; opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; }
.nx-filters__overlay.open{ opacity:1; visibility:visible; }

@media (max-width:900px){
    .nx-shoplayout{ grid-template-columns:1fr; gap:0; }
    .nx-filters{ position:fixed; top:0; left:0; height:100%; width:min(330px,86vw); border-radius:0; border:none; box-shadow:var(--shadow-lg); z-index:160; transform:translateX(-100%); transition:transform .3s cubic-bezier(.4,0,.2,1); overflow-y:auto; }
    .nx-filters.open{ transform:translateX(0); }
    .nx-filters__close{ display:grid; }
    .nx-filters__toggle{ display:inline-flex; }
    .nx-shopbar{ margin-bottom:22px; }
}