/* ==========================================================================
   TNA WELCOME — the celebration + "how membership works" modal shown after
   sign-up and after a member submits their profile. Loads on the app pages
   (dashboard / profile) after tna-platform.css.
   ========================================================================== */
.tw-scrim{position:fixed;inset:0;z-index:200;background:rgba(14,27,45,.55);opacity:0;transition:opacity .35s ease}
.tw-scrim[hidden]{display:none}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.tw-scrim{background:rgba(14,27,45,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
body.tw-open .tw-scrim{opacity:1}
body.tw-open{overflow:hidden}

.tw-wrap{position:fixed;inset:0;z-index:201;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto;-webkit-overflow-scrolling:touch}
.tw-wrap[hidden]{display:none}
.tw-modal{position:relative;width:min(860px,100%);margin:auto;border-radius:26px;background:var(--cream,#FBF9F6);border:1px solid var(--border,rgba(14,27,45,.1));
  box-shadow:0 50px 90px -40px rgba(14,27,45,.6);overflow:hidden;font-family:var(--font-ui,Inter,sans-serif);
  opacity:0;transform:translateY(18px) scale(.97);transition:opacity .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1)}
body.tw-open .tw-modal{opacity:1;transform:none}
.tw-x{position:absolute;top:14px;right:14px;z-index:3;appearance:none;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.14);color:#F7F5F2;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tw-x:hover{background:rgba(255,255,255,.26)}

/* ---- header: navy, confetti, animated tick ---- */
.tw-head{position:relative;padding:34px 30px 30px;text-align:center;color:#F7F5F2;overflow:hidden;
  background:radial-gradient(120% 120% at 50% -20%,#1E3049 0%,#0E1B2D 60%)}
.tw-kicker{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft,#DCCDBA);margin:0 0 10px}
.tw-head h2{font-family:'Anton','Inter',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.012em;line-height:1;
  font-size:clamp(28px,5.2vw,40px);margin:0;color:#fff}
.tw-lead{margin:14px auto 0;max-width:46ch;font-size:15px;line-height:1.6;color:rgba(247,245,242,.82)}
.tw-check{position:relative;width:74px;height:74px;margin:0 auto 18px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 32% 28%,rgba(220,205,186,.92),rgba(182,139,94,.72));border:1px solid rgba(220,205,186,.65);box-shadow:0 14px 34px -14px rgba(182,139,94,.8)}
.tw-check::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(220,205,186,.45);animation:twRing 2.4s cubic-bezier(.22,.61,.36,1) infinite}
.tw-check svg{width:36px;height:36px;fill:none;stroke:#0E1B2D;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:32;stroke-dashoffset:32;animation:twDraw .7s .25s cubic-bezier(.22,.61,.36,1) forwards}
@keyframes twDraw{to{stroke-dashoffset:0}}
@keyframes twRing{0%{transform:scale(.9);opacity:.9}70%{transform:scale(1.25);opacity:0}100%{transform:scale(1.25);opacity:0}}
.tw-burst{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.tw-burst i{position:absolute;top:-14px;width:8px;height:14px;border-radius:2px;opacity:0;animation:twFall 2.6s cubic-bezier(.3,.7,.4,1) forwards}
@keyframes twFall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}10%{opacity:1}100%{opacity:0;transform:translate3d(var(--dx,0),320px,0) rotate(var(--rot,540deg))}}

/* ---- body ---- */
.tw-body{padding:26px 30px 4px;display:grid;grid-template-columns:1.02fr .98fr;gap:0 28px;align-items:start}
.tw-col{min-width:0}
.tw-h3{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted,#7C7266);margin:0 0 14px}
.tw-steps{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:12px;counter-reset:tw}
.tw-steps li{display:flex;gap:14px;align-items:flex-start;padding:13px 15px;border-radius:14px;background:var(--beige,#F5F1EA);border:1px solid var(--border,rgba(14,27,45,.08))}
.tw-steps li b{flex:none;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid var(--border,rgba(14,27,45,.12));
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink,#141B24)}
.tw-steps li strong{display:block;font-size:14.5px;font-weight:700;color:var(--ink,#141B24);letter-spacing:-.01em}
.tw-steps li span{display:block;margin-top:3px;font-size:13px;line-height:1.5;color:var(--muted,#7C7266)}
.tw-steps li.done{background:rgba(47,107,79,.07);border-color:rgba(47,107,79,.25)}
.tw-steps li.done b{background:#2F6B4F;border-color:#2F6B4F;color:#fff}
.tw-steps li.now{background:#fff;border-color:rgba(182,139,94,.5);box-shadow:0 10px 26px -18px rgba(14,27,45,.5)}
.tw-steps li.now b{background:var(--gold-deep,#9C7A4E);border-color:var(--gold-deep,#9C7A4E);color:#fff}
.tw-steps li.now strong::after{content:"You are here";margin-left:8px;padding:2px 8px;border-radius:999px;background:rgba(182,139,94,.16);
  color:var(--gold-deep,#9C7A4E);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;vertical-align:middle}
.tw-perks{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:9px}
.tw-perks li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--ink,#141B24)}
.tw-perks li svg{flex:none;width:17px;height:17px;margin-top:2px;fill:none;stroke:var(--gold-deep,#9C7A4E);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.tw-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;padding:15px 17px;border-radius:14px;background:var(--green-950,#0E1B2D);color:#F7F5F2;margin:0 0 14px}
.tw-price b{font-size:19px;font-weight:700;letter-spacing:-.01em}
.tw-price span{font-size:12.5px;color:rgba(247,245,242,.7)}
.tw-note{margin:0 0 20px;padding:13px 15px;border-radius:14px;border:1px dashed rgba(14,27,45,.18);font-size:13px;line-height:1.55;color:var(--muted,#7C7266)}
.tw-note b{color:var(--ink,#141B24)}

/* ---- footer ---- */
.tw-foot{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:10px;padding:18px 30px calc(22px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(251,249,246,0),var(--cream,#FBF9F6) 26%)}
.tw-foot .btn{flex:1 1 200px;justify-content:center;padding:13px 20px;font-size:11.5px}
.tw-help{flex-basis:100%;margin:2px 0 0;text-align:center;font-size:12.5px;color:var(--muted,#7C7266)}
.tw-help a{color:var(--gold-deep,#9C7A4E);font-weight:600;text-decoration:underline;text-underline-offset:2px}

@media (max-width:820px){
  .tw-body{grid-template-columns:1fr;gap:0}
}
@media (max-width:620px){
  .tw-wrap{padding:0}
  .tw-modal{border-radius:20px 20px 0 0;margin:auto 0 0;min-height:88svh}
  .tw-head{padding:28px 20px 24px}
  .tw-body{padding:22px 20px 4px}
  .tw-foot{padding:14px 20px calc(18px + env(safe-area-inset-bottom))}
  .tw-foot .btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){
  .tw-modal,.tw-scrim{transition:none}
  .tw-burst{display:none}
  .tw-check::after{animation:none}
  .tw-check svg{animation:none;stroke-dashoffset:0}
}

/* ---- compact variant (apply / activate prompts from tna-scholar.js) ---- */
.tw-modal.tw-narrow{width:min(560px,100%)}
.tw-head.sm{padding:30px 28px 24px;text-align:left}
.tw-head.sm h2{font-size:clamp(26px,4.4vw,34px)}
.tw-head.sm .tw-lead{margin-left:0;max-width:none}
.tw-head.sm .tw-lead b{color:#fff}
.tw-body.one{grid-template-columns:1fr}
.tw-pick{margin:0 0 20px;padding:13px 15px;border-radius:14px;background:var(--beige,#F5F1EA);border:1px solid var(--border,rgba(14,27,45,.08))}
.tw-pick b{display:block;font-size:14.5px;color:var(--ink,#141B24)}
.tw-pick span{display:block;margin-top:3px;font-size:12.5px;color:var(--muted,#7C7266)}
.tw-fine{margin:0 0 6px;font-size:12.5px;line-height:1.5;color:var(--muted,#7C7266)}
.tw-toast{position:fixed;left:50%;bottom:calc(26px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:210;max-width:calc(100% - 32px);
  padding:13px 18px;border-radius:14px;background:#0E1B2D;color:#F7F5F2;font-family:var(--font-ui,Inter,sans-serif);font-size:13.5px;line-height:1.45;box-shadow:0 20px 50px -20px rgba(14,27,45,.6)}
.tw-toast[hidden]{display:none}
.tw-toast a{color:#DCCDBA;font-weight:600}
/* testimonial form */
.tw-form{display:grid;gap:14px}
.tw-form label{display:grid;gap:6px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted,#7C7266)}
.tw-form textarea,.tw-form input,.tw-form select{font:15px var(--font-ui,Inter,sans-serif);color:var(--ink,#141B24);padding:12px 14px;border-radius:12px;border:1px solid var(--border,rgba(14,27,45,.14));background:#fff;text-transform:none;letter-spacing:0}
.tw-form textarea{min-height:120px;resize:vertical}
.tw-stars{display:flex;gap:6px}
.tw-stars button{appearance:none;border:0;background:none;padding:2px;font-size:26px;line-height:1;color:#D9D2C6;cursor:pointer}
.tw-stars button.on{color:#B68B5E}
.tw-consent{display:flex!important;grid-auto-flow:column;align-items:flex-start;gap:10px!important;text-transform:none!important;letter-spacing:0!important;font-weight:500!important;font-size:13px!important;color:var(--ink,#141B24)!important}
.tw-consent input{margin-top:3px;width:17px;height:17px;flex:none}