.ts-root{
	--l-navy:var(--md-navy,#17406f);--l-navy-d:var(--md-navy-d,#0f2f55);--l-gold:var(--md-gold,#d8a23a);
	--l-bg:var(--md-bg,#f4f7fb);--l-card:var(--md-card,#fff);--l-border:var(--md-border,#e3e9f1);
	--l-text:var(--md-text,#15294a);--l-muted:var(--md-muted,#6b7a90);--l-btn:var(--md-btn,#17406f);
	--l-soft:var(--md-soft,#eaf1fa);--l-shadow:var(--md-shadow,0 2px 10px rgba(23,64,111,.07));
	font-family:"Tajawal","Segoe UI",Tahoma,Arial,sans-serif;line-height:1.7;direction:rtl;color:var(--l-text);background:var(--l-bg)
}
.ts-root *{box-sizing:border-box}
.ts-root a{text-decoration:none}
.ts-container{width:100%;max-width:1240px;margin-inline:auto;padding-inline:20px}
.ts-i{flex:none}

/* ---------- Hero ---------- */
.ts-hero{--ts-hero:none;position:relative;overflow:hidden;min-height:310px;display:flex;align-items:center;padding:48px 0 70px;background:linear-gradient(100deg,#e6f2fc,#f5fafe 55%,#d9e9f7)}
.ts-hero:before{content:"";position:absolute;inset:0;background:var(--ts-hero) center/cover no-repeat}
.ts-hero:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 52% 90% at 38% 50%,rgba(255,255,255,.9),rgba(255,255,255,.55) 55%,rgba(255,255,255,0) 100%)}
.ts-hero .ts-container{position:relative;z-index:2}
.ts-hero-in{max-width:620px;margin-inline:auto;text-align:center}
.ts-badge{display:inline-block;background:var(--l-navy);color:#fff;font-weight:800;font-size:19px;padding:8px 30px;border-radius:999px;margin-bottom:22px;box-shadow:0 4px 12px rgba(23,64,111,.25)}
.ts-hero h1{margin:0;font-size:27px;line-height:1.75;font-weight:800;color:var(--l-navy-d)}
.ts-swoosh{display:block;width:200px;height:16px;margin:14px auto 0;border-bottom:4px solid var(--l-gold);border-radius:50%}
.ts-wave{position:absolute;inset-inline:0;bottom:-1px;width:100%;height:46px;z-index:3;fill:var(--l-bg)}
html[data-md-theme="dark"] .ts-hero{background:linear-gradient(100deg,#10213a,#0d1726)}
html[data-md-theme="dark"] .ts-hero:after{background:radial-gradient(ellipse 52% 90% at 38% 50%,rgba(13,23,38,.88),rgba(13,23,38,.5) 55%,rgba(13,23,38,0) 100%)}
html[data-md-theme="dark"] .ts-hero h1{color:#fff}

.ts-body{padding-block:10px 56px}

/* ---------- Cards ---------- */
.ts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-bottom:34px}
.ts-card{--tc:#1769c2;--tt:#eaf3fd;--tb:#cfe0f3;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;background:linear-gradient(180deg,var(--l-card) 0 36%,var(--tt));border:1px solid var(--tb);border-radius:14px;overflow:hidden;box-shadow:var(--l-shadow);color:var(--l-text);transition:transform .2s,box-shadow .2s}
.ts-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(23,64,111,.16)}
.ts-c-green{--tc:#1f9d55;--tt:#e8f6ee;--tb:#c6e8d3}
.ts-c-purple{--tc:#7b3fc4;--tt:#f1eafb;--tb:#dccdf1}
.ts-c-lime{--tc:#5aa51e;--tt:#eef7e4;--tb:#d3e8bd}
.ts-c-orange{--tc:#e8782a;--tt:#fdf0e4;--tb:#f5d6b8}
.ts-c-teal{--tc:#0f8f7a;--tt:#e2f5f1;--tb:#bfe5dc}
html[data-md-theme="dark"] .ts-card{background:linear-gradient(180deg,var(--l-card) 0 36%,rgba(255,255,255,.04));border-color:var(--l-border)}
.ts-card-img{display:block;width:100%;height:130px;overflow:hidden;background:var(--tt)}
.ts-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.ts-ph{width:100%;height:100%;display:grid;place-items:center;color:var(--tc);opacity:.35;background:linear-gradient(135deg,var(--tt),var(--l-card))}
.ts-card-ico{width:56px;height:56px;border-radius:50%;background:var(--tc);color:#fff;display:grid;place-items:center;margin-top:-28px;border:4px solid var(--l-card);position:relative;z-index:1}
.ts-card h3{margin:12px 16px 4px;font-size:21px;font-weight:800;color:var(--l-text);line-height:1.4}
.ts-card p{margin:0 20px 16px;font-size:14px;color:var(--l-muted);flex:1;line-height:1.75}
.ts-card-btn{display:inline-flex;align-items:center;gap:6px;background:var(--tc);color:#fff;font-weight:700;font-size:14px;padding:8px 26px;border-radius:999px;margin-bottom:20px;transition:filter .15s}
.ts-card:hover .ts-card-btn{filter:brightness(1.12)}

/* ---------- Panels ---------- */
.ts-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ts-panel{background:var(--l-card);border:1px solid var(--l-border);border-radius:12px;overflow:hidden;box-shadow:var(--l-shadow);display:flex;flex-direction:column}
.ts-panel-h{margin:0;display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--l-navy);color:#fff;font-size:20px;font-weight:800}
html[data-md-theme="dark"] .ts-panel-h{background:#1b3a63}
.ts-green .ts-panel-h{background:#1f8a4c}
.ts-list{list-style:none;margin:0;padding:6px 8px;flex:1}
.ts-list li+li{border-top:1px solid var(--l-border)}
.ts-list a{display:flex;align-items:center;gap:12px;padding:12px 10px;color:var(--l-text);font-size:14px;font-weight:500;line-height:1.6;border-radius:8px}
.ts-list a:hover{background:var(--l-soft)}
.ts-list .t{flex:1;min-width:0}
.ts-list .ts-i:last-child{color:var(--l-muted);width:16px;height:16px}
.ts-none{padding:18px 10px;color:var(--l-muted);font-size:13.5px;text-align:center}
.ts-news time{flex:none;width:54px;text-align:center;line-height:1.25;background:var(--l-soft);border-radius:8px;padding:5px 2px;color:var(--l-navy)}
html[data-md-theme="dark"] .ts-news time{color:#fff}
.ts-news time b{display:block;font-size:19px;font-weight:800}
.ts-news time span{display:block;font-size:10.5px;color:var(--l-muted)}
.ts-file{flex:none;display:grid;place-items:center;width:30px;height:34px;border-radius:5px;color:#fff;background:#64748b}
.ts-file-pdf{background:#e03e3e}.ts-file-doc{background:#2b5fc1}.ts-file-xls{background:#1f9d55}
.ts-file .ts-i{width:17px;height:17px}
.ts-panel-f{display:flex;justify-content:center;align-items:center;gap:6px;padding:13px;font-weight:700;font-size:14px;color:var(--l-btn);border-top:1px solid var(--l-border)}
.ts-panel-f:hover{background:var(--l-soft)}

/* Guide */
.ts-guide{padding:18px 16px 20px;text-align:center;flex:1;background:linear-gradient(180deg,var(--l-card),var(--l-soft))}
.ts-guide p{margin:0 0 18px;font-size:14px;color:var(--l-muted)}
.ts-steps{list-style:none;margin:0 0 20px;padding:0;display:flex;justify-content:space-between;align-items:flex-start;gap:6px}
.ts-steps li{flex:1;display:grid;justify-items:center;gap:6px;position:relative;font-size:12px;line-height:1.45;color:var(--l-text)}
.ts-steps li+li:before{content:"";position:absolute;top:22px;inset-inline-start:-10px;width:20px;height:2px;background:var(--l-border)}
.ts-steps .c{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#fff3cf;color:#d99a00;border:2px solid currentColor}
.ts-steps .s2 .c{background:#e3f0fd;color:#2b7bd6}
.ts-steps .s3 .c{background:#dff5ee;color:#13a07d}
.ts-steps .s4 .c{background:#e9eefb;color:#2b5fc1}
.ts-btn{display:inline-flex;align-items:center;gap:8px;background:var(--l-navy);color:#fff;font-weight:700;font-size:14px;padding:10px 30px;border-radius:999px;transition:background .15s}
.ts-btn:hover{background:var(--l-navy-d)}

/* ---------- Banner ---------- */
.ts-banner{--ts-banner:none;position:relative;overflow:hidden;margin-top:34px;border-radius:14px;min-height:150px;display:flex;align-items:center;justify-content:center;gap:30px;padding:20px 30px;background:linear-gradient(90deg,#d9ecf9,#f3faff 55%,#d3e8f7);box-shadow:var(--l-shadow)}
.ts-banner:before{content:"";position:absolute;inset:0;background:var(--ts-banner) center/cover no-repeat}
.ts-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(236,246,253,.95),rgba(236,246,253,.88) 45%,rgba(236,246,253,.35))}
html[data-md-theme="dark"] .ts-banner{background:linear-gradient(90deg,#10213a,#14304f)}
html[data-md-theme="dark"] .ts-banner:after{background:linear-gradient(90deg,rgba(13,23,38,.92),rgba(13,23,38,.8) 45%,rgba(13,23,38,.35))}
.ts-banner p,.ts-banner img{position:relative;z-index:2}
.ts-banner p{margin:0;font-size:27px;font-weight:800;color:var(--l-navy-d);text-align:center}
html[data-md-theme="dark"] .ts-banner p{color:#fff}
.ts-banner img{max-height:130px;width:auto}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
	.ts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.ts-panels{grid-template-columns:1fr}
}
@media (max-width:640px){
	.ts-grid{grid-template-columns:1fr}
	.ts-hero h1{font-size:21px}.ts-badge{font-size:16px;padding:7px 20px}
	.ts-banner{flex-direction:column;text-align:center}.ts-banner p{font-size:21px}
	.ts-steps{flex-wrap:wrap;justify-content:center;row-gap:14px}.ts-steps li{flex:0 0 45%}.ts-steps li+li:before{display:none}
}