/* Welcome Offer popup — colours and fonts come from #woRoot custom properties (plugin settings) */
.wo{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;padding:16px;box-sizing:border-box}
.wo[hidden]{display:none}
.wo *,.wo *::before,.wo *::after{box-sizing:border-box}
html.wo-lock{overflow:hidden}
.wo__overlay{position:absolute;inset:0;background:rgba(20,18,16,.46);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity var(--modal-close-dur) var(--modal-ease)}
.wo.is-open .wo__overlay{opacity:1;transition-duration:var(--modal-open-dur)}
.wo__modal{position:relative;width:100%;max-width:440px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;background:var(--wo-bg);color:var(--wo-ink);font-family:var(--wo-font-b);border-radius:24px;padding:44px 32px 26px;text-align:center;box-shadow:0 40px 90px -30px rgba(0,0,0,.5),0 2px 10px rgba(0,0,0,.06)}
.wo__x{position:absolute;top:12px;right:12px;width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--wo-muted);cursor:pointer;padding:0}
.wo__x:hover{background:rgba(0,0,0,.05);color:var(--wo-ink)}
.wo__badge{width:58px;height:58px;margin:0 auto 20px;border-radius:50%}
.wo__badge--glow{background:radial-gradient(circle at 50% 50%,#fff 0 22%,transparent 23%),radial-gradient(circle,var(--wo-hi) 0 45%,transparent 72%);box-shadow:0 0 50px 10px color-mix(in srgb,var(--wo-hi) 28%,transparent)}
.wo__badge--ice{background:radial-gradient(circle at 34% 30%,#fff 0 15%,#e7edf0 40%,#b6c3ca 100%);box-shadow:inset 0 -4px 8px rgba(20,18,16,.16),0 12px 26px -10px rgba(20,18,16,.45)}
.wo__kicker{margin:0 0 10px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--wo-hi)}
.wo__title{margin:0 0 12px;font-family:var(--wo-font-h);font-weight:400;font-size:clamp(26px,6.5vw,32px);line-height:1.12;letter-spacing:-.01em;color:var(--wo-ink)}
.wo__body{margin:0 auto 22px;max-width:34ch;font-size:15px;line-height:1.55;color:var(--wo-muted)}
.wo__form{margin:0}
.wo__sr,.wo__hp{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;padding:0!important;margin:-1px!important}
.wo__input{display:block;width:100%;height:52px;margin:0 0 12px;padding:0 18px;font:inherit;font-size:16px;color:var(--wo-ink);background:var(--wo-field);border:1px solid color-mix(in srgb,var(--wo-ink) 14%,transparent);border-radius:14px;outline:0;transition:border-color .15s,box-shadow .15s}
.wo__input:focus{border-color:var(--wo-ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--wo-hi) 30%,transparent)}
.wo__input.is-invalid{border-color:#B3261E}
.wo__input.t-input{transition:border-color 150ms ease-out,box-shadow 150ms ease-out}
.wo__input.t-input.is-error{border-color:#B3261E}
.wo__error{margin:-4px 0 12px;font-size:13px;color:#B3261E;text-align:left}
.wo__error:empty{display:none}
.wo__btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:0 24px;border:0;border-radius:999px;background:linear-gradient(100deg,var(--wo-accent),var(--wo-accent-2,var(--wo-accent)));color:var(--wo-accent-text)!important;font:inherit;font-size:15px;font-weight:600;letter-spacing:.02em;text-decoration:none!important;cursor:pointer;box-shadow:0 12px 24px -14px rgba(0,0,0,.6);transition:transform .15s ease,filter .15s ease}
.wo__btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.wo__btn:disabled{opacity:.7;cursor:progress;transform:none}
.wo__fine{margin:14px auto 0;max-width:36ch;font-size:12px;line-height:1.5;color:var(--wo-muted)}
.wo__fine a{color:inherit;text-underline-offset:2px}
.wo__nothanks{margin:10px 0 0;padding:8px 12px;border:0;background:transparent;font:inherit;font-size:13px;color:var(--wo-muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.wo__code{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 16px;padding:10px 10px 10px 18px;border:1.5px dashed color-mix(in srgb,var(--wo-ink) 30%,transparent);border-radius:14px;background:var(--wo-field)}
.wo__code [data-wo-code]{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:20px;font-weight:700;letter-spacing:.08em;color:var(--wo-ink)}
.wo__copy{flex:none;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:var(--wo-ink);color:var(--wo-bg);font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background-color 150ms ease-out,color 150ms ease-out}
.wo__copy.is-done{background:#2E7D32;color:#fff}
@media (max-width:480px){.wo{padding:12px}.wo__modal{padding:40px 22px 22px;border-radius:22px}}
@media (prefers-reduced-motion:reduce){.wo__overlay,.wo__btn,.wo__copy{transition:none}}

/* ===== v1.3.0 motion (transitions-dev): modal open/close, error shake, text swap, success check, texts reveal ===== */
:root {
  --modal-open-dur: 250ms;
  --modal-close-dur: 150ms;
  --modal-scale: 0.96;
  --modal-scale-close: 0.96;
  --modal-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --shake-distance: 6px;
  --shake-overshoot: 4px;
  --shake-dur-a: 80ms;
  --shake-dur-b: 60ms;
  --shake-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --revert-hold: 3000ms;
  --revert-dur: 280ms;
  --text-swap-dur: 150ms;
  --text-swap-translate-y: 4px;
  --text-swap-blur: 2px;
  --text-swap-ease: ease-in-out;
  --check-opacity-dur: 500ms;
  --check-rotate-dur: 500ms;
  --check-rotate-from: 80deg;
  --check-bob-dur: 500ms;
  --check-y-amount: 40px;
  --check-blur-dur: 500ms;
  --check-blur-from: 10px;
  --check-path-dur: 500ms;
  --check-path-delay: 80ms;
  --check-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-opacity: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-rotate: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-bob: cubic-bezier(0.34, 1.35, 0.64, 1);
  --check-ease-path: cubic-bezier(0.22, 1, 0.36, 1);
  --stagger-dur: 500ms;
  --stagger-distance: 12px;
  --stagger-stagger: 40ms;
  --stagger-blur: 3px;
  --stagger-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Modal open / close */
.t-modal {
  transform-origin: center;
  transform: scale(var(--modal-scale));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-open-dur) var(--modal-ease),
    opacity   var(--modal-open-dur) var(--modal-ease);
  will-change: transform, opacity;
}
.t-modal.is-open {
  transform: scale(1);
  opacity: 1;
  pointer-events: auto;
}
.t-modal.is-closing {
  transform: scale(var(--modal-scale-close));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-close-dur) var(--modal-ease),
    opacity   var(--modal-close-dur) var(--modal-ease);
}
@media (prefers-reduced-motion: reduce) {
  .t-modal { transition: none !important; }
}

/* Error state shake (email field) */
.t-input {
  transition: border-color 150ms ease-out;
  will-change: transform;
}
.t-input.is-error {
  transition: border-color var(--revert-dur, 280ms) ease-out;
}
.t-error-msg {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity    var(--revert-dur, 280ms) ease-out,
    visibility 0s linear var(--revert-dur, 280ms);
}
.t-input-wrap.is-error .t-error-msg {
  opacity: 1;
  visibility: visible;
  transition:
    opacity    var(--revert-dur, 280ms) ease-out,
    visibility 0s linear 0s;
}
.t-input.is-shaking {
  animation: t-input-shake calc(
      var(--shake-dur-a) * 2 + var(--shake-dur-b) * 2
    ) linear;
}
@keyframes t-input-shake {
  0%      { transform: translateX(0);                                 animation-timing-function: var(--shake-ease); }
  28.57%  { transform: translateX(var(--shake-distance));             animation-timing-function: var(--shake-ease); }
  57.14%  { transform: translateX(calc(var(--shake-distance) * -1)); animation-timing-function: var(--shake-ease); }
  78.57%  { transform: translateX(var(--shake-overshoot));            animation-timing-function: var(--shake-ease); }
  100%    { transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce) {
  .t-input { animation: none !important; transform: none !important; }
}
/* keep the focus-ring tween alongside the border tween */
.wo__input.t-input.is-error{transition:border-color var(--revert-dur, 280ms) ease-out,box-shadow 150ms ease-out}

/* Text states swap (submit + copy labels) */
.t-text-swap {
  display: inline-block;
  transform: translateY(0);
  filter: blur(0);
  opacity: 1;
  transition:
    transform var(--text-swap-dur) var(--text-swap-ease),
    filter    var(--text-swap-dur) var(--text-swap-ease),
    opacity   var(--text-swap-dur) var(--text-swap-ease);
  will-change: transform, filter, opacity;
}
.t-text-swap.is-exit {
  transform: translateY(calc(var(--text-swap-translate-y) * -1));
  filter: blur(var(--text-swap-blur));
  opacity: 0;
}
.t-text-swap.is-enter-start {
  transform: translateY(var(--text-swap-translate-y));
  filter: blur(var(--text-swap-blur));
  opacity: 0;
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  .t-text-swap { transition: none !important; }
}

/* Success check (takes the badge's place once the code is ready) */
.t-success-check {
  display: inline-block;
  transform-origin: center;
  opacity: 0;
  will-change: transform, opacity, filter;
}
.t-success-check svg { display: block; overflow: visible; }
/* 27 = ceil(path.getTotalLength()) for the check path (26.2) */
.t-success-check svg path {
  stroke-dasharray: 27;
  stroke-dashoffset: 27;
}
.t-success-check[data-state="in"] {
  animation:
    t-check-fade   var(--check-opacity-dur) var(--check-ease-opacity) forwards,
    t-check-rotate var(--check-rotate-dur)  var(--check-ease-rotate)  forwards,
    t-check-blur   var(--check-blur-dur)    var(--check-ease-out)     forwards,
    t-check-bob    var(--check-bob-dur)     var(--check-ease-bob)     forwards;
}
.t-success-check[data-state="in"] svg path {
  animation: t-check-draw var(--check-path-dur) var(--check-ease-path) var(--check-path-delay, 0ms) forwards;
}
@keyframes t-check-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes t-check-rotate {
  from { transform: rotate(var(--check-rotate-from)); }
  to   { transform: rotate(0deg); }
}
@keyframes t-check-blur {
  from { filter: blur(var(--check-blur-from)); }
  to   { filter: blur(0); }
}
@keyframes t-check-bob {
  from { translate: 0 var(--check-y-amount); }
  to   { translate: 0 0; }
}
@keyframes t-check-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) {
  .t-success-check { animation: none !important; opacity: 1; }
  .t-success-check svg path { animation: none !important; stroke-dashoffset: 0 !important; }
}
.wo__check{display:block;width:58px;height:58px;margin:0 auto 20px;border-radius:50%;background:var(--wo-accent);color:var(--wo-accent-text)}

/* Texts reveal (success pane lines) */
.t-stagger-line {
  display: block;
  opacity: 0;
  transform: translateY(var(--stagger-distance));
  filter: blur(var(--stagger-blur));
  transition:
    opacity   var(--stagger-dur) var(--stagger-ease),
    transform var(--stagger-dur) var(--stagger-ease),
    filter    var(--stagger-dur) var(--stagger-ease);
  will-change: transform, opacity, filter;
}
.t-stagger-line--2 { transition-delay: var(--stagger-stagger); }
.t-stagger-line--3 { transition-delay: calc(var(--stagger-stagger) * 2); }
.t-stagger-line--4 { transition-delay: calc(var(--stagger-stagger) * 3); }
.t-stagger-line--5 { transition-delay: calc(var(--stagger-stagger) * 4); }
.t-stagger.is-shown .t-stagger-line {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}
.t-stagger.is-hiding .t-stagger-line {
  opacity: 0;
  transform: translateY(0);
  filter: blur(0);
  transition:
    opacity 200ms ease,
    transform 0s linear,
    filter 0s linear;
  transition-delay: 0s;
}
@media (prefers-reduced-motion: reduce) {
  .t-stagger-line { transition: none !important; }
}
.wo .wo__code.t-stagger-line,.wo .wo__btn.t-stagger-line{display:flex}