@font-face { font-family:"IBM Plex Sans Arabic"; src:url("assets/IBMPlexSansArabic-Regular.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"IBM Plex Sans Arabic"; src:url("assets/IBMPlexSansArabic-SemiBold.ttf") format("truetype"); font-weight:600; font-display:swap; }
@font-face { font-family:"IBM Plex Sans Arabic"; src:url("assets/IBMPlexSansArabic-Bold.ttf") format("truetype"); font-weight:700; font-display:swap; }
:root { --navy:#071d33; --green:#0a6758; --gold:#d6ad45; --paper:#f5f4ef; --ink:#1f3441; --muted:#5b6d75; --line:#dbe2de; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"IBM Plex Sans Arabic",Arial,sans-serif; line-height:1.95; }
a { color:inherit; }
.legal-container { width:min(calc(100% - 40px),960px); margin-inline:auto; }
.legal-header { background:#fff; border-bottom:1px solid var(--line); }
.legal-nav { min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.legal-brand { display:flex; align-items:center; gap:13px; text-decoration:none; }
.legal-logo { position:relative; width:74px; height:56px; overflow:hidden; background:#fff; border:1px solid #dce3df; border-radius:11px; }
.legal-logo img { position:absolute; top:2px; left:50%; display:block; width:64px; max-width:none; height:auto; transform:translateX(-50%); }
.legal-logo::after { content:""; position:absolute; inset-inline:0; bottom:0; height:10px; background:#fff; }
.legal-brand strong { display:block; color:var(--navy); font-size:15px; }
.legal-brand small { display:block; color:var(--green); font:400 10px Arial,sans-serif; letter-spacing:.06em; }
.home-link { color:var(--navy); font-size:14px; font-weight:600; text-decoration:none; }
.home-link span { color:var(--gold); margin-inline-end:6px; }
.legal-hero { padding:72px 0 48px; color:#fff; background:linear-gradient(135deg,#071d33,#0b3145); }
.legal-kicker { margin:0 0 9px; color:#9ed2c7; font-size:13px; font-weight:700; }
.legal-hero h1 { margin:0; font-size:clamp(38px,6vw,60px); line-height:1.3; letter-spacing:-.03em; }
.legal-hero p:last-child { max-width:720px; margin:18px 0 0; color:#c8d6da; font-size:16px; }
.legal-meta { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:23px; color:#9eb1b8; font-size:12px; }
.legal-main { padding:58px 0 78px; }
.legal-notice { margin-bottom:30px; padding:20px 22px; background:#edf5f2; border-right:4px solid var(--green); border-radius:10px; }
.legal-notice p { margin:0; color:#40565f; font-size:14px; }
.legal-section { padding:30px 0; border-bottom:1px solid var(--line); }
.legal-section:first-of-type { padding-top:0; }
.legal-section h2 { margin:0 0 11px; color:var(--navy); font-size:24px; line-height:1.5; }
.legal-section h3 { margin:22px 0 7px; color:var(--green); font-size:17px; }
.legal-section p { margin:0 0 10px; color:var(--muted); }
.legal-section ul,.legal-section ol { margin:8px 0 0; padding-right:22px; color:var(--muted); }
.legal-section li { margin:7px 0; }
.identity-card { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; overflow:hidden; margin-top:14px; background:var(--line); border:1px solid var(--line); border-radius:12px; }
.identity-card div { padding:15px 17px; background:#fff; }
.identity-card span { display:block; color:#7b888e; font-size:11px; }
.identity-card strong,.identity-card a { color:var(--navy); font-size:14px; font-weight:600; text-decoration:none; }
.legal-contact { margin-top:26px; padding:24px; color:#fff; background:var(--navy); border-radius:14px; }
.legal-contact h2 { margin:0 0 8px; color:#fff; font-size:21px; }
.legal-contact p { margin:0; color:#bdccd1; }
.legal-contact a { color:#f0d58d; }
.legal-footer { padding:26px 0; color:#94a6ad; background:#041421; font-size:12px; }
.legal-footer .legal-container { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.legal-footer nav { display:flex; flex-wrap:wrap; gap:12px 18px; }
.legal-footer a { color:#b8c6ca; }
@media (max-width:620px) { .legal-container{width:min(calc(100% - 28px),960px)} .legal-brand div{display:none} .legal-hero{padding:52px 0 38px} .legal-hero h1{font-size:38px} .identity-card{grid-template-columns:1fr} .legal-main{padding-top:40px} }