:root{color-scheme:dark;--bg:#0b100e;--panel:#161d19;--panel2:#1b2721;--line:#304038;--text:#edf6f0;--muted:#a4b5ab;--green:#43df9a;--green2:#2db978;--danger:#ffb5ae;--radius:20px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Cairo","Noto Sans Arabic",Tahoma,Arial,sans-serif;line-height:1.65}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
.layout{max-width:1240px;margin:0 auto;padding:0 24px}
.header{height:91px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #26332b}
.brand{display:flex;gap:12px;align-items:center}
.brand strong{display:block;font-size:17px;letter-spacing:.1px}
.brand small{font-size:11px;color:var(--muted)}
.brand-icon{display:grid;place-items:center;background:#17472f;border:1px solid #33895b;color:var(--green);height:45px;width:45px;border-radius:14px;font-size:27px}
.main{padding:45px 0 50px;min-height:75vh}
.hero{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:0 10px 42px}
.eyebrow{font-size:11px;letter-spacing:1.1px;color:var(--green);font-weight:800;text-transform:uppercase;display:block;margin-bottom:9px}
.live-dot{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;margin-left:6px;box-shadow:0 0 12px #45e5a2}
.hero h1{margin:3px 0 13px;font-size:clamp(31px,4.7vw,54px);line-height:1.3;font-weight:900;letter-spacing:-1.4px}
.hero h1 em{font-style:normal;color:var(--green)}
.hero p{max-width:580px;color:#b1c0b6;margin:0;font-size:14px}
.hero-art{width:244px;height:190px;flex:none;position:relative;display:flex;align-items:center;justify-content:center}
.hero-art>span{position:absolute;right:4px;top:43px;background:#254e37;border:1px solid #3bb878;padding:7px 16px;border-radius:12px;transform:rotate(9deg);color:#b7ffce;font-size:18px;font-weight:900}
.mini-phone{width:109px;height:170px;border:6px solid #52645a;border-radius:21px;background:#1a3327;transform:rotate(-12deg);box-shadow:0 24px 80px #0c2e1a}
.mini-top{height:9px;width:36px;background:#0a1811;border-radius:0 0 8px 8px;margin:0 auto}
.mini-mark{height:73px;display:grid;place-items:center;color:var(--green);font-size:43px}
.mini-line{height:7px;margin:7px 13px;background:#426e54;border-radius:10px}
.mini-line.short{width:45px}
.columns{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(255px,1fr);gap:22px;align-items:start}
.card{background:linear-gradient(145deg,#19231d,#141b17);border:1px solid var(--line);border-radius:var(--radius);padding:27px;box-shadow:0 18px 50px #050a0717}
.section-top{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:18px}
h2{font-size:19px;margin:0;font-weight:850}h3{font-size:15px}
.chip{display:inline-grid;place-items:center;color:#90f2bd;background:#163b27;padding:5px 10px;border-radius:8px;font-size:11px;font-weight:800}
label:not(.feature){display:block;margin:16px 0 7px;font-size:12px;font-weight:750;color:#dae8dc}
input[type=text],input[type=url],input[type=password],select{background:#0e1511;border:1px solid #344539;color:var(--text);height:45px;border-radius:11px;width:100%;padding:0 13px;outline:0;min-width:0;transition:border .2s,box-shadow .2s}
input:focus,select:focus{border-color:#35bc79;box-shadow:0 0 0 3px #2da56632}
input::placeholder{color:#64776b;font-size:12px}
select{cursor:pointer;direction:rtl}
option{background:#152019}
.field-row{display:grid;grid-template-columns:1fr 1.1fr;gap:16px}
.optional{font-size:10px;color:#95aaa0;font-weight:400;margin-right:4px}
.feature-title{border-top:1px solid #2a382e;padding-top:22px;margin:26px 0 14px}
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.feature{position:relative;display:flex;align-items:center;gap:10px;padding:12px 11px;border:1px solid #35483b;background:#141d17;border-radius:11px;cursor:pointer;min-height:60px;font-size:11.5px;transition:all .2s}
.feature:has(input:checked){background:#183c28;border-color:#368b58}
.feature input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.feature:focus-within{outline:2px solid var(--green)}
.feature-icon{font-size:22px;display:grid;place-items:center;width:32px;color:#60dba1}
.checkmark{border:1px solid #58705d;border-radius:5px;width:16px;height:16px;flex:none;margin-right:auto}
.feature:has(input:checked) .checkmark{background:var(--green);border-color:var(--green)}
.feature:has(input:checked) .checkmark:before{content:"✓";color:#113220;font-size:12px;display:block;line-height:15px;text-align:center;font-weight:bold}
.signing{display:grid;gap:9px}
.signing label{display:flex;align-items:center;gap:12px;background:#121a14;border:1px solid #334438;border-radius:12px;padding:12px}
.signing label:has(input:checked){border-color:#38a76c;background:#173924}
.signing input{accent-color:var(--green);width:19px;height:19px}
.signing b,.signing small{display:block}
.signing b{font-size:12px}
.signing small{color:#a9b9ac;font-size:11px}
.note{font-size:11px;color:#94aaa0;margin:19px 0}
.primary{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(115deg,#47e5a5,#36b97d);border:0;border-radius:11px;color:#082418;padding:11px 18px;font-weight:900;font-size:13px;box-shadow:0 6px 22px #16a26728}
.primary:hover{filter:brightness(1.06)}
.primary.big{min-height:53px;font-size:15px;justify-content:space-between;padding:11px 25px}
.full{width:100%}
.ghost{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border:1px solid #405044;background:#18211c;color:#d5e7db;border-radius:10px;font-size:12px}
.ghost:hover{background:#26372b}
.muted{color:var(--muted);font-size:12.5px}
.sidebar{display:grid;gap:22px}
.step{display:flex;align-items:start;gap:12px;border-top:1px solid #2b392f;padding:17px 0}
.step span{font-weight:900;color:var(--green);font-size:19px;direction:ltr}
.step strong{font-size:12px}
.step p{color:#9daf9f;font-size:11px;margin:2px 0}
.project{display:flex;gap:11px;align-items:center;padding:12px 0;border-top:1px solid #2c392f}
.project-icon{width:37px;height:37px;display:grid;place-items:center;background:#213e2b;color:var(--green);border-radius:10px;font-size:19px}
.project b,.project small{display:block}
.project b{font-size:12px}
.project small{font-size:10px;color:var(--muted);overflow-wrap:anywhere}
.error{border:1px solid #8d403b;background:#42201c;color:var(--danger);padding:13px 16px;border-radius:11px;margin:15px 0;font-size:13px}
.status-card{margin-bottom:22px;border-color:#377959}
.status-pill{font-size:11px;background:#203f2c;color:#8beab3;padding:6px 12px;border-radius:10px}
.status-pill.ok{background:#1c4c2b;color:#a7f4c5}
.status-pill.fail{background:#4b2424;color:#ffc1b9}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:17px}
.disabled{opacity:.45;pointer-events:none}
.loading-track{height:6px;background:#273a2e;border-radius:8px;overflow:hidden;margin-top:18px}
.loading-indicator{height:100%;width:30%;background:var(--green);animation:move 1.8s ease-in-out infinite}
@keyframes move{0%{transform:translateX(350%)}100%{transform:translateX(-420%)}}
.login{max-width:470px;margin:35px auto 0;padding:34px}
.login h1{font-size:29px;line-height:1.3}
.login .primary{margin-top:24px}
footer{text-align:center;padding:20px 0 35px;color:#697e70;font-size:11px;border-top:1px solid #1b2a21}
@media(max-width:840px){.columns{grid-template-columns:1fr}.sidebar{grid-template-columns:1fr 1fr}.hero-art{width:165px;transform:scale(.83)}}
@media(max-width:570px){.layout{padding:0 15px}.header{height:72px}.main{padding:29px 0}.hero{padding:0 4px 30px}.hero h1{font-size:32px}.hero-art{display:none}.card{padding:20px;border-radius:15px}.sidebar{grid-template-columns:1fr}.field-row,.feature-grid{grid-template-columns:1fr}.feature-grid{gap:8px}.feature{min-height:54px}.section-top h2{font-size:18px}.brand strong{font-size:14px}.brand small{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}