/* Nordic Design UF — free-shipping offer, responsive and accessibility-first. */
.nd-shipping-home,
.nd-shipping-toast {
  --nds-green: #293f32;
  --nds-ink: #263b2e;
  --nds-muted: #708172;
  --nds-accent: #7f9c82;
  --nds-light: #edf1e8;
  --nds-rule: #dce5d9;
  --nds-sans: 'DM Sans', system-ui, -apple-system, sans-serif;
  --nds-serif: 'Instrument Serif', Georgia, serif;
  box-sizing: border-box;
  font-family: var(--nds-sans);
  -webkit-font-smoothing: antialiased;
}
.nd-shipping-home *, .nd-shipping-home *::before, .nd-shipping-home *::after,
.nd-shipping-toast *, .nd-shipping-toast *::before, .nd-shipping-toast *::after {
  box-sizing: border-box;
}
.nd-shipping-home { display: none; background: #eaf0e7; color: var(--nds-ink); border-bottom: 1px solid #d9e3d7; }
.nd-shipping-home.is-mounted { display: block; }
.nd-shipping-home-inner {
  max-width: 1450px; margin-inline: auto; padding: 34px clamp(22px, 4.5vw, 70px);
  display: grid; grid-template-columns: 68px minmax(240px, 1.15fr) minmax(290px, .95fr);
  gap: clamp(18px, 2.6vw, 42px); align-items: center;
}
.nd-shipping-graphic {
  width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center;
  color: #385640; border: 1px solid #becfbd; background: #f3f6f0;
}
.nd-shipping-graphic svg { width: 32px; height: 32px; }
.nd-shipping-eyebrow { display: block; color: #6e8b72; font-weight: 800; font-size: 9px; letter-spacing: .17em; line-height: 1.55; margin-bottom: 9px; }
.nd-shipping-copy h2 { color: var(--nds-ink); font-size: clamp(26px, 2.65vw, 40px); line-height: 1.07; margin: 0 0 10px; letter-spacing: -.045em; font-weight: 500; }
.nd-shipping-copy h2 em { font-family: var(--nds-serif); font-weight: 400; letter-spacing: -.02em; }
.nd-shipping-copy p { font-size: 12px; line-height: 1.75; color: var(--nds-muted); margin: 0; max-width: 520px; }
.nd-shipping-progress-section { display: flex; flex-direction: column; gap: 11px; }
.nd-shipping-progress-top { display: flex; justify-content: space-between; gap: 14px; align-items: center; font-size: 11px; }
.nd-shipping-progress-top strong { font-weight: 750; color: #355240; }
.nd-shipping-progress-top span { color: #839484; font-size: 10px; font-weight: 700; }
.nd-shipping-progress-track { display: block; position: relative; width: 100%; height: 7px; border-radius: 30px; background: #cbdaca; overflow: hidden; }
.nd-shipping-progress-track [data-nd-shipping-fill] { display: block; width: 0; height: 100%; border-radius: inherit; background: #345b3f; transition: width .55s cubic-bezier(.22,.75,.2,1); }
.nd-shipping-dots { display: flex; justify-content: space-between; margin-top: -20px; height: 15px; padding: 0 1px 0 50%; pointer-events: none; }
.nd-shipping-dots span { z-index: 1; display: block; width: 11px; height: 11px; border-radius: 50%; background: #cbdaca; border: 2px solid #eaf0e7; transform: translateY(4px); transition: background .3s, transform .3s; }
.nd-shipping-dots span.is-complete { background: #345b3f; transform: translateY(4px) scale(1.12); }
.nd-shipping-shop-link { align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; color: #3c5f44 !important; font-weight: 800; letter-spacing: .045em; font-size: 10px; border-bottom: 1px solid #9cb49d; padding: 8px 0 6px; text-decoration: none !important; }
.nd-shipping-shop-link svg { transition: transform .3s ease; }
.nd-shipping-shop-link:hover svg { transform: translateX(3px); }
.nd-shipping-home[data-qualified="true"] .nd-shipping-progress-track [data-nd-shipping-fill] { background: #3f7449; }
.nd-shipping-home :focus-visible, .nd-shipping-toast :focus-visible { outline: 2px solid #4c8062; outline-offset: 3px; }
/* Non-blocking status popup, not a full-screen modal. */
.nd-shipping-toast {
  position: fixed; z-index: 999997; right: 25px; bottom: 25px;
  width: min(425px, calc(100vw - 36px)); background: #fbfaf7;
  border: 1px solid #dce5d9; box-shadow: 0 18px 70px rgba(18, 40, 26, .22);
  color: var(--nds-ink); border-radius: 3px; overflow: hidden;
  opacity: 0; transform: translate3d(0, 22px, 0) scale(.98);
  pointer-events: none; visibility: hidden;
  transition: opacity .38s ease, transform .48s cubic-bezier(.2,.75,.2,1), visibility 0s linear .48s;
}
.nd-shipping-toast.is-visible {
  opacity: 1; transform: translate3d(0,0,0) scale(1);
  pointer-events: auto; visibility: visible;
  transition: opacity .38s ease, transform .48s cubic-bezier(.2,.75,.2,1), visibility 0s linear;
}
.nd-shipping-toast-topline { height: 4px; background: #385e43; }
.nd-shipping-toast[data-step="2"] .nd-shipping-toast-topline { background: #80a584; }
.nd-shipping-toast-close {
  display: grid; place-items: center; width: 38px; height: 38px; position: absolute;
  right: 12px; top: 15px; border: 0; background: transparent; color: #7d8c80;
  cursor: pointer; border-radius: 50%;
}
.nd-shipping-toast-close:hover { background: #edf1e8; color: #2c4335; }
.nd-shipping-toast-body { display: flex; gap: 17px; padding: 30px 56px 23px 26px; align-items: flex-start; }
.nd-shipping-toast-icon { width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center; background: #e8eee4; border: 1px solid #d5e0d3; color: #3e6046; border-radius: 50%; }
.nd-shipping-toast-icon svg { width: 28px; height: 28px; }
.nd-shipping-toast-eyebrow { font-size: 9px; font-weight: 800; letter-spacing: .14em; color: #8da08d; }
.nd-shipping-toast-content h2 { font-size: 27px; font-weight: 500; letter-spacing: -.046em; line-height: 1.12; margin: 10px 0; color: #263e2e; }
.nd-shipping-toast-content p { font-size: 12px; line-height: 1.7; color: #738274; margin: 0; }
.nd-shipping-toast-progress { margin: 0 26px; height: 5px; background: #dce8d9; border-radius: 20px; overflow: hidden; }
.nd-shipping-toast-progress>span { display: block; width: 0; height: 100%; background: #4f7955; transition: width .45s ease; }
.nd-shipping-toast-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 19px 26px 24px; }
.nd-shipping-toast-actions>span { color: #849284; font-size: 10px; font-weight: 700; }
.nd-shipping-toast-actions>a { color: #2b4935 !important; font-size: 11px; font-weight: 800; display: inline-flex; align-items: center; gap: 10px; text-decoration: none !important; border-bottom: 1px solid #96b09b; padding: 7px 0; }
.nd-shipping-toast-actions>a svg { transition: transform .3s; }
.nd-shipping-toast-actions>a:hover svg { transform: translateX(3px); }
.nd-shipping-toast[data-step="2"] .nd-shipping-toast-icon { color: #f1f7ed; background: #355a3d; border-color: #355a3d; }
@media(max-width:940px) {
  .nd-shipping-home-inner { grid-template-columns: 54px minmax(0,1fr); gap: 15px 21px; }
  .nd-shipping-graphic { width: 54px; height: 54px; }
  .nd-shipping-progress-section { grid-column: 2; margin-top: 3px; }
}
@media(max-width:590px) {
  .nd-shipping-home-inner { grid-template-columns: 44px minmax(0,1fr); padding: 25px 21px 26px; gap: 12px 15px; }
  .nd-shipping-graphic { width: 44px; height: 44px; align-self: start; margin-top: 4px; }
  .nd-shipping-graphic svg { width: 25px; height: 25px; }
  .nd-shipping-eyebrow { font-size: 8px; }
  .nd-shipping-copy h2 { font-size: clamp(26px,7vw,35px); }
  .nd-shipping-copy p { font-size: 11px; }
  .nd-shipping-progress-section { grid-column: 1 / -1; margin-top: 9px; }
  .nd-shipping-toast { right: 12px; left: 12px; bottom: max(12px, env(safe-area-inset-bottom)); width: auto; }
  .nd-shipping-toast-body { padding: 25px 44px 21px 17px; gap: 13px; }
  .nd-shipping-toast-icon { width: 42px; height: 42px; flex-basis: 42px; }
  .nd-shipping-toast-icon svg { width: 23px; height: 23px; }
  .nd-shipping-toast-eyebrow { font-size: 8px; }
  .nd-shipping-toast-content h2 { font-size: 24px; }
  .nd-shipping-toast-content p { font-size: 11px; }
  .nd-shipping-toast-progress { margin-inline: 17px; }
  .nd-shipping-toast-actions { padding: 16px 17px 20px; }
}
@media(prefers-reduced-motion:reduce) {
  .nd-shipping-home *, .nd-shipping-toast * { transition: none !important; animation: none !important; }
}