:root{--navy:#071b37;--blue:#286fe0;--ink:#17304e;--muted:#77879a;--line:#e2e9f0;--soft:#f5f8fc;--teal:#27b79d}*{box-sizing:border-box}body{margin:0;font-family:Vazirmatn,Tahoma,sans-serif;color:var(--ink);background:#f5f8fc;font-size:13px}.flow-body{min-height:100vh;background:radial-gradient(circle at 5% 95%,#d8effd,transparent 25%),#f6f9fd}.flow-header{height:76px;background:#fff;border-bottom:1px solid #e8edf3;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,45px)}.flow-brand{display:flex;gap:8px;align-items:center;text-decoration:none;color:#142f55;font-size:20px;font-weight:800}.flow-brand>span:last-child>span{color:#2974e5}.brand-mark{width:26px;height:26px;display:flex;align-items:flex-end;gap:3px;direction:ltr}.brand-mark i{display:block;width:7px;background:linear-gradient(#3484f6,#1552bc);border-radius:2px}.brand-mark i:nth-child(1){height:13px}.brand-mark i:nth-child(2){height:20px}.brand-mark i:nth-child(3){height:26px}.secure-note{display:flex;gap:7px;align-items:center;color:#678098;font-size:10px}.secure-note span{height:18px;width:18px;border-radius:50%;display:grid;place-items:center;color:#fff;background:#25ae95;font-size:9px}.back-link{color:#2b6fdc;text-decoration:none;font-size:11px;font-weight:700}.flow-main{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;padding:67px 30px}.flow-aside{padding-top:16px}.flow-eyebrow{font-size:10px;color:#9bc2f1;font-weight:700}.flow-eyebrow.blue{color:#286fdf}.flow-aside h1{font-size:30px;line-height:1.6;letter-spacing:-1.2px;margin:9px 0 10px}.flow-aside>p{color:var(--muted);font-size:12px;line-height:1.9;max-width:320px}.steps{margin-top:34px;display:flex;flex-direction:column;gap:4px}.steps>div{display:flex;align-items:center;gap:10px;padding:9px;border-radius:9px;color:#8190a3;position:relative}.steps>div:not(:last-child):after{content:"";position:absolute;right:20px;top:39px;height:20px;border-right:1px dashed #cad6e5}.steps>div>span{height:25px;width:25px;border-radius:50%;border:1px solid #ced9e6;display:grid;place-items:center;background:#fff;font-size:10px;font-weight:800}.steps p{margin:0;display:flex;flex-direction:column;line-height:1.45}.steps b{font-size:10px}.steps small{font-size:8px}.steps .active{background:#edf5ff;color:#2167d4}.steps .active>span{background:#286fdf;color:#fff;border-color:#286fdf}.flow-tip{display:flex;gap:9px;background:#fff;border:1px solid #e1eaf3;padding:12px;border-radius:11px;margin-top:35px;box-shadow:0 7px 22px rgba(40,82,129,.05)}.flow-tip>span{height:26px;width:26px;background:#fff0d8;color:#df9a23;border-radius:8px;display:grid;place-items:center}.flow-tip p{margin:0;font-size:9px;color:#728397;line-height:1.8}.flow-tip b{color:#425d7c}.flow-card,.join-form-card{background:#fff;border:1px solid #e5ebf2;border-radius:17px;padding:32px;box-shadow:0 17px 40px rgba(38,74,119,.08)}.form-top{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #ecf0f4;padding-bottom:18px}.form-top h2,.join-form-card h2{font-size:20px;margin:5px 0 3px;letter-spacing:-.7px}.form-top p,.join-form-card>p{font-size:10px;color:#7e8c9d;margin:0}.step-count{height:38px;min-width:38px;border-radius:9px;background:#eaf2ff;color:#286fdf;font-size:10px;font-weight:800;display:grid;place-items:center}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.type-choice{position:relative;border:1px solid #e1e7ee;border-radius:10px;padding:13px;min-height:103px;cursor:pointer;transition:.2s}.type-choice input{opacity:0;position:absolute}.type-choice.selected{background:#f3f8ff;border-color:#72a8f3;box-shadow:0 0 0 3px rgba(65,132,232,.09)}.type-choice>span{height:30px;width:30px;border-radius:8px;display:grid;place-items:center;background:#eff4fa;color:#43729e;font-size:17px}.type-choice.selected>span{background:#dceafe;color:#286fdf}.type-choice b,.type-choice small{display:block}.type-choice b{font-size:11px;margin-top:8px}.type-choice small{font-size:9px;color:#7a8a9b;margin-top:2px}.type-choice:after{content:'✓';position:absolute;left:10px;top:10px;height:17px;width:17px;border:1px solid #dbe4ef;border-radius:50%;display:grid;place-items:center;color:transparent;font-size:9px}.type-choice.selected:after{background:#286fdf;border-color:#286fdf;color:#fff}.split-line{border-top:1px solid #edf0f4;margin:24px 0}.flow-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.flow-fields label{display:flex;flex-direction:column;gap:5px;font-size:10px;font-weight:700;color:#46607d}.flow-fields input,.flow-fields select{min-height:40px;border:1px solid #dce4ed;border-radius:7px;padding:9px;font-family:inherit;color:#45607a;font-size:10px;outline-color:#2e78e6;background:#fff}.flow-actions{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf0f4;margin-top:28px;padding-top:19px}.flow-actions a{color:#718398;text-decoration:none;font-size:10px}.flow-actions button,.wide-button{border:0;background:linear-gradient(135deg,#327cf0,#1d5bca);color:#fff;border-radius:8px;padding:11px 16px;font-family:inherit;font-size:11px;font-weight:700;box-shadow:0 9px 18px rgba(37,99,207,.19);cursor:pointer}.flow-actions button span,.wide-button span{margin-right:9px}.flow-toast{position:fixed;right:50%;bottom:24px;transform:translate(50%,20px);opacity:0;pointer-events:none;transition:.25s;background:#102d52;color:#fff;border-radius:8px;padding:10px 16px;font-size:11px;z-index:5}.flow-toast.show{opacity:1;transform:translate(50%,0)}.join-main{max-width:1080px;margin:0 auto;padding:61px 30px}.join-intro{text-align:center;max-width:630px;margin:0 auto 31px}.join-intro h1{font-size:29px;letter-spacing:-1px;line-height:1.6;margin:7px 0}.join-intro p{color:#738499;font-size:12px;line-height:1.8;margin:0}.role-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.role-card{position:relative;text-align:right;min-height:180px;border:1px solid #e2e8ef;border-radius:13px;padding:17px;background:#fff;font-family:inherit;color:#263f5d;cursor:pointer;transition:.2s}.role-card:hover{transform:translateY(-3px);box-shadow:0 12px 27px rgba(34,70,115,.09)}.role-card.selected{border-color:#73a9f1;background:#f4f8ff;box-shadow:0 0 0 3px rgba(65,133,234,.09)}.role-card>span{height:37px;width:37px;border-radius:10px;display:grid;place-items:center;background:#e8f1ff;color:#2670e0;font-size:19px}.role-card:nth-child(2)>span{background:#e6f9f5;color:#1da88e}.role-card:nth-child(3)>span{background:#fff1dc;color:#dc981f}.role-card:nth-child(4)>span{background:#f0edff;color:#7c61d6}.role-card b{display:block;font-size:11px;margin:12px 0 5px}.role-card small{font-size:9px;color:#77889c;line-height:1.7}.role-card>i{position:absolute;left:12px;top:12px;font-style:normal;height:18px;width:18px;border:1px solid #dce5ee;border-radius:50%;color:transparent;font-size:9px;display:grid;place-items:center}.role-card.selected>i{background:#2b73e1;border-color:#2b73e1;color:#fff}.join-form-card{max-width:750px;margin:27px auto 0}.join-form-card>span{display:block;margin-bottom:4px}.join-form-card form{margin-top:19px}.consent{display:flex;gap:8px;align-items:flex-start;margin-top:16px;cursor:pointer}.consent input{opacity:0;position:absolute}.consent>span{height:18px;width:18px;flex:none;border:1px solid #cbd7e4;border-radius:5px;display:grid;place-items:center;color:transparent;font-size:10px}.consent input:checked+span{background:#2b73e1;border-color:#2b73e1;color:#fff}.consent p{margin:0;font-size:9px;color:#77879a;line-height:1.8}.wide-button{margin-top:17px;width:100%}@media(max-width:800px){.flow-header{padding:0 20px}.secure-note{display:none}.flow-main{grid-template-columns:1fr;padding:35px 20px;gap:18px}.flow-aside{padding-top:0}.flow-aside h1{font-size:25px}.steps{display:none}.flow-tip{margin-top:18px}.role-grid{grid-template-columns:1fr 1fr}.join-main{padding:38px 18px}.join-intro h1{font-size:24px}}@media(max-width:480px){.flow-header{height:63px;padding:0 15px}.flow-brand{font-size:18px}.back-link{font-size:9px}.flow-card,.join-form-card{padding:21px 16px}.choice-grid,.flow-fields{grid-template-columns:1fr}.role-grid{grid-template-columns:1fr}.role-card{min-height:130px}.join-intro{text-align:right}.join-intro h1{font-size:22px}}
