/* NGS Sample Order 3.0 — button, add-sample modal, fly-to-cart, toast, 3-step flow */
:root{--ngss-ink:#0a0a0a;--ngss-mut:#5b6466;--ngss-line:#e4e3df;--ngss-tint:#f4f5f3;--ngss-acc:#00b5bd;--ngss-accd:#00757c;--ngss-grad:linear-gradient(135deg,#00b5bd,#0076bd);--ngss-gradh:linear-gradient(135deg,#0ac6ce,#0086d6);--ngss-bad:#b91c1c;--ngss-head:Archivo,"Helvetica Neue",Arial,sans-serif;--ngss-body:Figtree,"Helvetica Neue",Arial,sans-serif}

/* ── Order sample button (product pages) ── */
.ngs-sample-btn-wrap{width:100%}
button.ngss-btn,.ngs-v3 .v3 button.ngss-btn{display:flex!important;align-items:center;justify-content:center;gap:10px;width:100%!important;max-width:100%;box-sizing:border-box;height:auto!important;min-height:0!important;margin:0!important;padding:16px 22px!important;border-radius:999px!important;border:2px solid var(--ngss-ink)!important;background:#fff!important;color:var(--ngss-ink)!important;font:800 16px/1.2 var(--ngss-body)!important;letter-spacing:.01em!important;text-transform:none!important;box-shadow:none!important;cursor:pointer;white-space:normal;transition:background .16s,color .16s,transform .12s}
button.ngss-btn:hover,button.ngss-btn:focus-visible{background:var(--ngss-ink)!important;color:#fff!important}
button.ngss-btn:active{transform:scale(.985)}
button.ngss-btn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:560px){button.ngss-btn{font-size:15px!important;padding:14px 16px!important}}
/* hide any legacy sample markup left inside other widgets */
.fbc-cta--sample #ngs-sample-modal,#ngs-sample-modal{display:none!important}

/* ── Modal ── */
html.ngss-lock,html.ngss-lock body{overflow:hidden}
.ngss-ov{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(10,12,13,0);transition:background .2s;font-family:var(--ngss-body);color:var(--ngss-ink)}
.ngss-ov[hidden]{display:none}
.ngss-ov.is-in{background:rgba(10,12,13,.55)}
.ngss-m{position:relative;width:100%;max-width:400px;background:#fff;border-radius:18px;padding:24px 24px 18px;box-shadow:0 24px 60px rgba(0,0,0,.28);opacity:0;transform:translateY(14px) scale(.98);transition:opacity .2s,transform .22s cubic-bezier(.2,.8,.3,1);box-sizing:border-box}
.ngss-m *{box-sizing:border-box}
.ngss-ov.is-in .ngss-m{opacity:1;transform:none}
.ngss-m .ngss-x{position:absolute;top:10px;right:10px;width:36px!important;height:36px!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:var(--ngss-tint)!important;color:var(--ngss-ink)!important;font:400 24px/36px var(--ngss-body)!important;text-align:center;cursor:pointer;box-shadow:none!important}
.ngss-m .ngss-x:hover{background:var(--ngss-line)!important}
.ngss-kick{display:block;margin:0 0 12px!important;font:800 12px/1.2 var(--ngss-body)!important;letter-spacing:.18em!important;text-transform:uppercase;color:var(--ngss-accd)!important}
.ngss-m__row{display:flex;align-items:center;gap:16px;margin:0 0 16px}
.ngss-m__img{width:96px!important;height:96px!important;max-width:none!important;flex:none;object-fit:cover;border-radius:10px;background:var(--ngss-tint);display:block}
.ngss-m__img[hidden]{display:none!important}
.ngss-m__name{margin:0 0 4px!important;font:800 20px/1.15 var(--ngss-body)!important;letter-spacing:-.01em;color:var(--ngss-ink)!important;text-transform:none!important}
.ngss-m__meta{margin:0!important;font-size:14px!important;line-height:1.4;color:var(--ngss-mut)!important}
.ngss-m__msg{margin:0 0 12px!important;padding:10px 12px;border-radius:10px;background:#eaf8f8;color:var(--ngss-accd);font-size:14px;font-weight:600;line-height:1.4}
.ngss-m__msg.is-bad{background:#fdecec;color:var(--ngss-bad)}
.ngss-m__msg[hidden]{display:none}
.ngss-m__act{display:flex;flex-direction:column;gap:8px}
.ngss-m .ngss-fine{margin:12px 0 0!important;text-align:center}

/* ── Buttons shared by modal + flow ── */
.ngss-cta,a.ngss-cta,button.ngss-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:10px;width:100%;box-sizing:border-box;height:auto!important;min-height:0!important;margin:0!important;padding:16px 22px!important;border-radius:999px!important;border:2px solid var(--ngss-ink)!important;background:#fff!important;color:var(--ngss-ink)!important;font:800 16px/1.2 var(--ngss-body)!important;letter-spacing:.01em!important;text-transform:none!important;text-decoration:none!important;box-shadow:none!important;cursor:pointer;transition:background .16s,color .16s,opacity .16s}
.ngss-cta:hover{background:var(--ngss-ink)!important;color:#fff!important}
.ngss-cta--go,a.ngss-cta--go,button.ngss-cta--go{border:0!important;background:var(--ngss-grad)!important;color:#fff!important;padding:18px 22px!important}
.ngss-cta--go:hover{background:var(--ngss-gradh)!important;color:#fff!important}
.ngss-cta:disabled{opacity:.55;cursor:default}
.ngss-cta.is-busy{position:relative;color:transparent!important;pointer-events:none}
.ngss-cta.is-busy::after{content:"";position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:ngss-spin .7s linear infinite}
.ngss-cta:not(.ngss-cta--go).is-busy::after{border-color:rgba(0,0,0,.2);border-top-color:var(--ngss-ink)}
.ngss-cta span[aria-hidden]{transition:transform .16s}
.ngss-cta:hover span[aria-hidden]{transform:translateX(3px)}
@keyframes ngss-spin{to{transform:rotate(360deg)}}

/* ── Fly-to-cart + badge bump ── */
.ngss-fly{position:fixed!important;z-index:100001;margin:0!important;max-width:none!important;object-fit:cover;border-radius:6px;pointer-events:none;box-shadow:0 10px 24px rgba(0,0,0,.3);will-change:transform,opacity}
.ngss-bump{animation:ngss-bump .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes ngss-bump{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}

/* ── Toast (also the landing cart when the header cart is off screen) ── */
.ngss-toast{position:fixed;left:50%;bottom:24px;z-index:100002;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);padding:8px 8px 8px 8px;border-radius:999px;background:#12181a;color:#fff;font:700 14.5px/1.3 var(--ngss-body);box-shadow:0 12px 32px rgba(0,0,0,.28);transform:translate(-50%,24px);opacity:0;pointer-events:none;transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.3,1),background .2s;box-sizing:border-box}
.ngss-toast.is-in{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.ngss-toast *{box-sizing:border-box}
.ngss-toast__cart{position:relative;flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff!important}
.ngss-toast__cart svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ngss-toast__n{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:linear-gradient(135deg,#00b5bd,#0076bd);color:#fff;font:800 11px/18px var(--ngss-body);text-align:center}
.ngss-toast__n[hidden]{display:none}
.ngss-toast__t{flex:1;min-width:0}
.ngss-toast em{font-style:normal;opacity:.7;font-weight:600;margin-left:4px;white-space:nowrap}
.ngss-toast__go{flex:none;padding:10px 16px;border-radius:999px;background:#fff;color:#12181a!important;font-weight:800;text-decoration:none!important;white-space:nowrap}
.ngss-toast__go:hover{background:#5ee6eb}
.ngss-toast.is-busy .ngss-toast__go{opacity:.5;pointer-events:none}
.ngss-toast.is-bad{background:#7f1d1d}
@media(max-width:560px){
  .ngss-toast{top:10px;bottom:auto;width:calc(100vw - 20px);max-width:none;border-radius:18px;font-size:13.5px;transform:translate(-50%,-24px)}
  .ngss-toast.is-in{transform:translate(-50%,0)}
}

/* ── Flow pages (cart / details / payment / done) ── */
.ngss{max-width:1280px;margin:0 auto;padding:28px 24px 72px;text-align:left;font-family:var(--ngss-body);color:var(--ngss-ink);box-sizing:border-box}
.ngss *{box-sizing:border-box}
.ngss-head{margin:0 0 28px}
.ngss-steps{display:flex;align-items:center;gap:0;margin:0 0 26px!important;padding:0!important;list-style:none!important;counter-reset:none}
.ngss-steps li{display:flex;align-items:center;margin:0!important;padding:0;list-style:none!important;font:700 14px/1 var(--ngss-body);color:var(--ngss-mut)}
.ngss-steps li+li::before{content:"";display:block;width:clamp(20px,6vw,56px);height:2px;margin:0 12px;background:var(--ngss-line)}
.ngss-steps li.is-done+li::before,.ngss-steps li.is-on::before{background:var(--ngss-acc)}
.ngss-steps a{display:flex;align-items:center;color:inherit!important;text-decoration:none!important}
.ngss-steps i{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-right:9px;border-radius:50%;border:2px solid var(--ngss-line);font:800 13px/1 var(--ngss-body);font-style:normal;color:var(--ngss-mut);background:#fff}
.ngss-steps li.is-on{color:var(--ngss-ink)}
.ngss-steps li.is-on i{border-color:transparent;background:var(--ngss-grad);color:#fff}
.ngss-steps li.is-done{color:var(--ngss-accd)}
.ngss-steps li.is-done i{border-color:var(--ngss-acc);color:var(--ngss-accd)}
.ngss-steps li.is-done a:hover span{text-decoration:underline}
.ngss-title{margin:0!important;text-align:left!important;font-family:var(--ngss-head)!important;font-stretch:125%;font-weight:900!important;font-size:clamp(28px,3.4vw,44px)!important;line-height:.98!important;letter-spacing:-.012em;text-transform:uppercase;color:var(--ngss-ink)!important}
.ngss-sub{margin:12px 0 0!important;max-width:62ch;font-size:16.5px;line-height:1.55;color:var(--ngss-mut)}
.ngss-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.95fr);gap:32px;align-items:start}
.ngss-grid>*{min-width:0}
.ngss-form,.ngss-review{display:flex;flex-direction:column;gap:18px;margin:0}
.ngss-box{margin:0!important;padding:22px 22px 20px!important;border:1.5px solid var(--ngss-line)!important;border-radius:16px;background:#fff;min-width:0}
fieldset.ngss-box{display:flex;flex-direction:column;gap:14px}
.ngss-box legend{float:left;width:100%;margin:0 0 2px!important;padding:0!important;font:800 17px/1.2 var(--ngss-body)!important;color:var(--ngss-ink);text-transform:none;letter-spacing:0;border:0}
.ngss-box legend+*{clear:both}
.ngss-box__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 12px}
.ngss-box__head b,.ngss-sum__head b{font-size:17px;font-weight:800}
.ngss-box__head a,.ngss-sum__head a{font-size:14px;font-weight:700;color:var(--ngss-accd)!important;text-decoration:none}
.ngss-box__head a:hover,.ngss-sum__head a:hover{text-decoration:underline}
.ngss-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ngss-3{display:grid;grid-template-columns:1.4fr 1fr .8fr;gap:14px}
.ngss-f{display:flex;flex-direction:column;gap:6px;margin:0!important;min-width:0;font-weight:400}
.ngss-f>span{font:700 13.5px/1.2 var(--ngss-body);color:var(--ngss-ink)}
.ngss-f>span em{font-style:normal;font-weight:500;color:var(--ngss-mut)}
.ngss-f input,.ngss-f select,.ngss-f textarea{width:100%!important;height:48px!important;margin:0!important;padding:0 14px!important;border:1.5px solid #d6d6d1!important;border-radius:10px!important;background:#fff!important;box-shadow:none!important;font:500 16px/1.2 var(--ngss-body)!important;color:var(--ngss-ink)!important;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.ngss-f select{padding-right:36px!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6466' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/16px!important}
.ngss-f textarea{height:96px!important;padding:12px 14px!important;resize:vertical}
.ngss-f input:focus,.ngss-f select:focus,.ngss-f textarea:focus{outline:0;border-color:var(--ngss-acc)!important;box-shadow:0 0 0 3px rgba(0,181,189,.18)!important}
.ngss-f.is-bad input,.ngss-f.is-bad select{border-color:var(--ngss-bad)!important;box-shadow:0 0 0 3px rgba(185,28,28,.12)!important}
.ngss-f.is-bad>span{color:var(--ngss-bad)}
.ngss-check{display:flex!important;align-items:center;gap:10px;margin:2px 0 0!important;font:600 15px/1.3 var(--ngss-body);cursor:pointer}
.ngss-check input{width:20px;height:20px;margin:0!important;accent-color:var(--ngss-accd);flex:none}
.ngss-bill{display:flex;flex-direction:column;gap:14px;padding-top:4px}
.ngss-bill[hidden]{display:none}
.ngss-err{padding:12px 14px;border-radius:10px;background:#fdecec;color:var(--ngss-bad);font-weight:600;font-size:14.5px;line-height:1.4}
.ngss-err[hidden]{display:none}
.ngss-fine{margin:0!important;font-size:13.5px;line-height:1.5;color:var(--ngss-mut)}
.ngss-fine a{color:var(--ngss-accd)!important;font-weight:700}
.ngss-note{max-width:640px;margin:40px auto!important;padding:18px 20px;border:1.5px solid var(--ngss-line);border-radius:14px;background:var(--ngss-tint);font-size:16px;line-height:1.5;text-align:center}
.ngss-note a{color:var(--ngss-accd)!important;font-weight:800}

/* summary column */
.ngss-sum{position:sticky;top:96px;display:flex;flex-direction:column;gap:14px;padding:22px!important;border:1.5px solid var(--ngss-line);border-radius:16px;background:#fff}
.ngss-sum__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ngss-lines{display:flex;flex-direction:column;gap:12px;margin:0!important;padding:0!important;list-style:none!important}
.ngss-lines li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:12px;margin:0!important;padding:0;list-style:none!important}
.ngss-lines li:not(:has(img)){grid-template-columns:minmax(0,1fr) auto}
.ngss-lines img{width:56px!important;height:56px!important;object-fit:cover;border-radius:8px;background:var(--ngss-tint);display:block}
.ngss-lines span{display:flex;flex-direction:column;gap:2px;min-width:0}
.ngss-lines b{font-size:15px;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.ngss-lines small{font-size:13px;color:var(--ngss-mut);line-height:1.3}
.ngss-lines em{font-style:normal;font-size:13px;font-weight:800;color:var(--ngss-accd)}
.ngss-tot{display:flex;flex-direction:column;gap:8px;padding-top:14px;border-top:1.5px solid var(--ngss-line)}
.ngss-tot>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:15px}
.ngss-tot small{color:var(--ngss-mut);font-size:13px;margin-left:4px}
.ngss-sum>.ngss-tot:first-child{border-top:0;padding-top:0}
.ngss-tot__t{padding-top:8px;font-size:18px!important}
.ngss-tot__t b{font-size:22px;font-weight:900}
.ngss-addr{font-style:normal;font-size:15.5px;line-height:1.55}
.ngss-addr>strong,.ngss-addr>span{display:block}
.ngss-addr__c{display:block;margin-top:4px;color:var(--ngss-mut);font-size:14.5px;overflow-wrap:anywhere}
.ngss-payform{display:flex;flex-direction:column;gap:14px;margin:0!important}
.ngss-cardfield{height:auto!important;min-height:50px;padding:15px 14px;border:1.5px solid #d6d6d1;border-radius:10px;background:#fff;transition:border-color .15s,box-shadow .15s}
.ngss-cardfield.StripeElement--focus{border-color:var(--ngss-acc);box-shadow:0 0 0 3px rgba(0,181,189,.18)}
.ngss-cardfield.StripeElement--invalid{border-color:var(--ngss-bad)}
.ngss-secure{display:flex;align-items:flex-start;gap:8px}
.ngss-secure svg{width:16px;height:16px;flex:none;margin-top:1px;fill:none;stroke:var(--ngss-mut);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* done */
.ngss-done{max-width:680px;text-align:center!important;padding-top:48px}
.ngss-done__icon{width:72px;height:72px;margin:0 auto 22px;border-radius:50%;background:var(--ngss-grad);display:flex;align-items:center;justify-content:center;animation:ngss-pop .45s cubic-bezier(.3,1.5,.5,1)}
.ngss-done__icon svg{width:36px;height:36px;fill:none;stroke:#fff;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.ngss-done .ngss-title{text-align:center!important}
.ngss-done .ngss-sub{margin-left:auto!important;margin-right:auto!important}
.ngss-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:28px 0!important;border:1.5px solid var(--ngss-line);border-radius:14px;overflow:hidden}
.ngss-facts>div{padding:16px 10px}
.ngss-facts>div+div{border-left:1.5px solid var(--ngss-line)}
.ngss-facts dt{margin:0 0 4px;font:800 11.5px/1.2 var(--ngss-body);letter-spacing:.14em;text-transform:uppercase;color:var(--ngss-mut)}
.ngss-facts dd{margin:0!important;font:900 20px/1.2 var(--ngss-body);color:var(--ngss-ink)}
.ngss-done>.ngss-fine{margin:0 0 20px!important}
.ngss-done>.ngss-cta{width:auto;padding-left:30px!important;padding-right:30px!important}
@keyframes ngss-pop{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}

@media(max-width:900px){
  .ngss-grid{grid-template-columns:1fr;gap:20px}
  .ngss-sum{position:static}
  .ngss-details .ngss-sum{order:-1}
  /* phones: ship-to, then the card, then the item list */
  .ngss-pay .ngss-review{display:contents}
  .ngss-pay .ngss-review>.ngss-box:first-child{order:1}
  .ngss-pay .ngss-sum{order:2}
  .ngss-pay .ngss-review>.ngss-box+.ngss-box{order:3}
}
/* sample cart page (v2 markup): keep the Free tag its natural width on phones */
@media(max-width:560px){.v2-cart .v2-crow__p{justify-self:start}}
@media(max-width:560px){
  .ngss{padding:18px 16px 56px}
  .ngss-head{margin-bottom:20px}
  .ngss-steps{margin-bottom:18px!important}
  .ngss-steps li{font-size:13px}
  .ngss-steps li+li::before{margin:0 8px}
  .ngss-steps i{width:24px;height:24px;margin-right:6px;font-size:12px}
  .ngss-box,.ngss-sum{padding:18px 16px!important;border-radius:14px}
  .ngss-2{grid-template-columns:1fr;gap:12px}
  .ngss-3{grid-template-columns:1fr 1fr;gap:12px}
  .ngss-3>:first-child{grid-column:1/-1}
  .ngss-m{padding:22px 18px 16px}
  .ngss-m__img{width:80px!important;height:80px!important}
  .ngss-m__name{font-size:18px!important}
}
@media(prefers-reduced-motion:reduce){.ngss-m,.ngss-ov,.ngss-toast,.ngss-done__icon,.ngss-bump{transition:none!important;animation:none!important}}

/* sample rows open their product page */
.v2-cart .v2-crow[data-url]{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.v2-cart .v2-crow[data-url]:hover{border-color:#bfc4c2;box-shadow:0 4px 14px rgba(0,0,0,.06)}
.v2-cart a.v2-crow__img{display:block;line-height:0}
.v2-cart .v2-crow__b b a,.ngss-lines b a{color:inherit!important;text-decoration:none!important}
.v2-cart .v2-crow__b b a:hover,.ngss-lines b a:hover{text-decoration:underline!important;text-underline-offset:3px}
.ngss-lines li>a{display:block;line-height:0}
