/*
 * A.U.S.B - default theme. Source of truth: the reference index.html.
 * Values below are copied from the reference. Only these deliberate, non-visual changes were made:
 *  1) font stack: same primary fonts + Arabic-capable fallbacks for Android/Linux
 *  2) physical left/right replaced by logical properties that resolve to the SAME result in RTL
 *     (so the layout is identical in Arabic and correct in LTR languages)
 */
:root{
  --blue:#0878e8; --blue2:#0051b8; --cyan:#5bdcff;
  --gold:#ffd22e; --pink:#e80070; --ink:#071326;
  --glass:rgba(8,32,67,.58); --line:rgba(150,220,255,.48);
  --white:rgba(255,255,255,.94);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Tahoma","Noto Sans Arabic","Noto Naskh Arabic","DejaVu Sans","Arial",sans-serif;background:#031329;color:white}
body{
  background:
    radial-gradient(circle at 15% 15%,rgba(0,174,255,.55),transparent 28%),
    radial-gradient(circle at 85% 20%,rgba(231,0,112,.28),transparent 25%),
    linear-gradient(135deg,#021126 0%,#063d82 45%,#071326 100%);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.32;
  background:linear-gradient(115deg,transparent 0 42%,rgba(255,255,255,.08) 48%,transparent 54%);
}
.container{width:min(1450px,94%);margin:auto}
.glass{
  background:linear-gradient(145deg,rgba(18,94,171,.48),rgba(4,22,48,.63));
  border:1px solid var(--line);border-radius:28px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 18px 50px rgba(0,0,0,.28);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.nav{margin:18px auto;padding:10px 18px;display:flex;align-items:center;gap:22px;min-height:76px}
.brand{display:flex;align-items:center;gap:13px;margin-inline-end:auto}
.logo{width:62px;height:62px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(0,0,0,.35))}
.brand strong{display:block;font-size:19px}.brand span{font-size:14px;opacity:.85;display:block;margin-top:4px}
.links{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.links a,.pill{color:white;text-decoration:none;padding:12px 15px;border-radius:18px;font-weight:700;font-size:14px}
.links a:hover,.links a.active{background:linear-gradient(135deg,#19a8ff,#0878e8);box-shadow:0 0 24px rgba(41,180,255,.35)}
.actions{display:flex;gap:8px;align-items:center}
.btn{border:1px solid rgba(255,255,255,.25);color:white;background:rgba(255,255,255,.1);padding:12px 17px;border-radius:17px;font-weight:800;cursor:pointer}
.btn.primary{background:linear-gradient(135deg,#ffd83d,#ffb900);color:#182033;border:0;box-shadow:0 10px 30px rgba(255,190,20,.25)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:stretch;margin-top:20px}
.hero-copy{padding:45px;position:relative;overflow:hidden}
.hero-copy:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(0,205,255,.16);inset-inline-end:-90px;bottom:-120px;filter:blur(10px)}
.kicker{color:var(--gold);font-weight:900;font-size:17px}.hero h1{font-size:clamp(36px,5vw,67px);line-height:1.06;margin:13px 0}
.hero h1 span{color:#4fcfff}.hero p{font-size:19px;line-height:1.9;opacity:.9;max-width:700px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.crest-card{min-height:380px;display:grid;place-items:center;position:relative;overflow:hidden}
.crest-card:before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(51,210,255,.5),transparent 68%);filter:blur(10px)}
.crest-card img{width:min(320px,72%);position:relative;z-index:1;filter:drop-shadow(0 25px 25px rgba(0,0,0,.55))}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:20px}
.card{padding:22px;min-height:175px}
.card h3{margin:0 0 12px;font-size:18px}.muted{opacity:.72;font-size:13px}.big{font-size:25px;font-weight:900}
.match{display:flex;align-items:center;justify-content:space-between;gap:10px}.team{text-align:center;flex:1}.team img{width:52px;height:52px;object-fit:contain;display:block;margin:auto}.vs{font-weight:900;color:#6edcff}
.score{font-size:30px;font-weight:900;margin:7px 0}
.news{margin-top:20px;display:grid;grid-template-columns:1.3fr .7fr;gap:20px}
.section{padding:24px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.section-head h2{margin:0}
.news-list{display:grid;gap:10px}.news-item{padding:16px;border-radius:20px;background:rgba(255,255,255,.075);display:flex;justify-content:space-between;gap:15px}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px 9px;border-bottom:1px solid rgba(255,255,255,.1);text-align:start}.table tr.active{background:rgba(0,142,255,.22)}
.media{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.gallery div{height:105px;border-radius:18px;background:linear-gradient(135deg,#0d65b7,#18213e);display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);overflow:hidden}.gallery img{width:100%;height:100%;object-fit:cover}
.sponsors{display:flex;gap:12px;flex-wrap:wrap}.sponsor{flex:1;min-width:130px;height:85px;border-radius:20px;background:rgba(255,255,255,.92);color:#0a3a70;display:grid;place-items:center;font-weight:900;font-size:18px}
footer{margin:20px 0;padding:18px 24px;text-align:center}
@media(max-width:1050px){.hero{grid-template-columns:1fr}.grid4{grid-template-columns:repeat(2,1fr)}.news,.media{grid-template-columns:1fr}.links{display:none}}
@media(max-width:620px){.nav{border-radius:22px}.brand strong{font-size:15px}.actions .btn{padding:10px}.hero-copy{padding:28px}.hero h1{font-size:40px}.grid4{grid-template-columns:1fr}.gallery{grid-template-columns:repeat(2,1fr)}.crest-card{min-height:300px}}
