
*{box-sizing:border-box}body{margin:0;background:#080c13;color:#edf2fa;font-family:Tahoma,Arial,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:18px 5%;background:#101a29;border-bottom:2px solid #c49a36;gap:15px;flex-wrap:wrap}.brand{font-weight:900;font-size:22px;color:#e0b64e;letter-spacing:1px}.brand span{color:#eaf1ff}nav{display:flex;gap:18px;flex-wrap:wrap}a{color:#e5c46c;text-decoration:none}main{max-width:1200px;margin:30px auto;padding:0 18px;min-height:75vh}.hero{min-height:300px;padding:38px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:20px;border:1px solid #263b58;border-radius:20px;background:radial-gradient(ellipse at 75% 55%,#24496d 0,#142b45 35%,#101722 75%);overflow:hidden}.hero small,.section-head small,.tag{color:#e4bd58;letter-spacing:2px}.hero h1{font-size:36px;margin:12px 0}.hero p{color:#b8c6d8;line-height:1.8}.hero-car{height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;color:#c9d7e8;font-size:11px;letter-spacing:2px}.car-glow{position:absolute;width:85%;height:75px;bottom:48px;background:#3d83bd55;filter:blur(28px);border-radius:50%}.car-shape{position:relative;width:90%;height:90px;border-radius:65% 35% 18% 20%;background:linear-gradient(160deg,#d5e0e8,#566d82 45%,#17283a 80%);clip-path:polygon(5% 65%,18% 50%,30% 20%,65% 15%,82% 43%,96% 55%,100% 82%,0 85%);box-shadow:0 20px 30px #000}.car-shape span{position:absolute;bottom:0;left:18%;width:65%;height:15px;border-radius:50%;background:#070b10}.hero-car small{position:absolute;bottom:0}.categories{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0 38px}.category-card{min-height:125px;padding:20px;display:flex;align-items:center;gap:15px;border:1px solid #30435b;border-radius:15px;background:linear-gradient(135deg,#17283c,#101722);transition:.2s}.category-card:hover{transform:translateY(-3px);border-color:#d2a746}.category-card b{display:block;font-size:18px;color:#f0f4fa}.category-card small{display:block;color:#9eafc4;margin-top:8px}.category-card i{margin-right:auto;font-style:normal;font-size:23px}.cat-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:#d2a74620;color:#e4bd58;font-size:27px}.programs{background:linear-gradient(120deg,#1a2c43,#111923)}.files{background:linear-gradient(120deg,#172d36,#111923)}.images{background:linear-gradient(120deg,#30263a,#111923)}.section-head{display:flex;justify-content:space-between;align-items:end;margin:25px 0 16px}.section-head h2{margin:6px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}.product,.panel,.empty{background:#111a27;border:1px solid #26364c;border-radius:14px;padding:22px}.product h3{margin:14px 0 8px}.muted{color:#9aa9bd;font-size:14px}.price{font-size:22px;color:#e9c45d;font-weight:bold;margin:18px 0}button,.button{display:inline-block;background:#c69c3e;color:#111;padding:12px 20px;border:0;border-radius:8px;font-weight:bold;cursor:pointer;font-size:15px}button:hover,.button:hover{background:#e4bd58}input,textarea,select{display:block;width:100%;margin:7px 0 16px;padding:12px;border:1px solid #35465c;border-radius:7px;background:#0a111c;color:white}label{display:block;color:#c8d3e2;font-size:14px}.narrow{max-width:480px;margin:45px auto}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tablewrap{overflow-x:auto;margin-bottom:28px}table{width:100%;border-collapse:collapse;background:#111a27}td,th{padding:13px;border-bottom:1px solid #2a394d;text-align:right;white-space:nowrap}th{color:#e4bd58}.notice{background:#26351f;border:1px solid #657e38;padding:10px 18px;border-radius:8px;margin-bottom:20px}.notice p{margin:5px 0}footer{text-align:center;padding:20px;color:#76869b;border-top:1px solid #202c3c}@media(max-width:760px){.hero{grid-template-columns:1fr}.hero h1{font-size:28px}.hero-car{height:150px}.categories{grid-template-columns:1fr}.formgrid{grid-template-columns:1fr}header{align-items:flex-start}nav{gap:12px}}

/* V3 premium automotive storefront */
.hero-v3{position:relative;min-height:390px;padding:34px 42px;grid-template-columns:.9fr 1.1fr;background:linear-gradient(110deg,#0b111c 0%,#101d2d 48%,#101723 100%);border-color:#35445a;box-shadow:0 18px 55px #0006}
.hero-v3:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#080d15 0%,transparent 55%),radial-gradient(ellipse at 75% 70%,#b68a3020,transparent 50%)}
.hero-copy,.hero-visual{position:relative;z-index:1}.eyebrow{font-size:11px;letter-spacing:2px;color:#e4bd58}.hero-v3 h1{font-size:clamp(30px,3.5vw,47px);line-height:1.35;margin:15px 0}.hero-v3 h1 em{font-style:normal;color:#e2b84f}.hero-v3 p{max-width:490px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.ghost-button{display:inline-block;padding:11px 18px;border:1px solid #53677f;border-radius:8px;color:#eaf1fa}.hero-stats{display:flex;gap:23px;margin-top:28px;color:#93a4b8;font-size:12px}.hero-stats b{color:#e4bd58;margin-left:5px}.hero-visual{height:300px;display:flex;align-items:center;justify-content:center;overflow:hidden}.cars-svg{position:relative;width:112%;max-width:760px;z-index:1;filter:drop-shadow(0 18px 18px #0008)}.visual-glow{position:absolute;width:85%;height:110px;bottom:38px;border-radius:50%;background:#2d77ad55;filter:blur(40px)}.visual-label{position:absolute;top:8px;right:12px;color:#8fa4bc;font-size:10px;letter-spacing:2px}.visual-label i{color:#e4bd58;font-style:normal;padding:0 8px}.visual-caption{position:absolute;bottom:5px;left:8%;display:flex;align-items:center;gap:9px;color:#d5b65d;font-size:10px;letter-spacing:2px}.visual-caption span{width:34px;height:2px;background:#d5b65d}.category-card{min-height:140px;box-shadow:0 10px 25px #0003}.category-card b{font-size:19px}.product{box-shadow:0 10px 25px #0002;transition:.2s}.product:hover{transform:translateY(-3px);border-color:#b9913d}
@media(max-width:760px){.hero-v3{grid-template-columns:1fr;padding:25px 20px}.hero-visual{height:205px;order:-1}.cars-svg{width:125%}.hero-v3 h1{font-size:29px}.hero-stats{gap:14px}}


/* V4: photographic automotive hero and editable seller catalog */
.hero-v4{
 min-height:430px; position:relative; display:flex; align-items:center;
 padding:48px; border:1px solid #27425c; border-radius:18px; overflow:hidden;
 background-image:linear-gradient(90deg,rgba(3,9,17,.18) 0%,rgba(3,9,17,.52) 42%,rgba(3,9,17,.96) 100%),url("/static/hero-cars.jpg");
 background-size:cover; background-position:center; box-shadow:0 18px 55px #0008;
}
.hero-v4 .hero-copy{width:48%; margin-right:auto; text-align:right; position:relative; z-index:2}
.hero-v4 h1{font-size:clamp(32px,4vw,52px);line-height:1.35;text-shadow:0 3px 14px #000}
.hero-v4 p{color:#eef3fa;text-shadow:0 2px 8px #000;max-width:560px}
.brand-section{margin:34px 0}
.brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.brand-tile{min-height:105px;padding:20px 14px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;text-align:center;border:1px solid #9c762b;border-radius:13px;background:linear-gradient(135deg,#17283b,#080f1b);box-shadow:inset 0 0 25px #1a477022;transition:.2s}
.brand-tile b{font-size:clamp(13px,1.6vw,19px);color:#e9bd50;letter-spacing:.3px}
.brand-tile span{font-size:14px;color:#eaf0f7}
.brand-tile:hover{transform:translateY(-3px);border-color:#f0c85b;background:linear-gradient(135deg,#203b56,#111b2a)}
.brand-tile.other{border-style:dashed}
@media(max-width:760px){
 .hero-v4{min-height:360px;padding:25px;background-position:35% center}
 .hero-v4 .hero-copy{width:100%;padding:18px;background:#050b14b8;border-radius:12px}
 .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* V5 refinements: move hero copy right, reveal the real car photo on the left,
   and make the storefront buttons jump directly to uploaded products. */
body{font-family:"Segoe UI","Noto Sans Arabic",Tahoma,Arial,sans-serif}
.hero-v4{
  background-image:
    linear-gradient(90deg,rgba(2,8,15,.05) 0%,rgba(2,8,15,.18) 38%,rgba(2,8,15,.88) 100%),
    url("/static/hero-cars.jpg");
  background-position:center center;
}
.hero-v4 .hero-copy{
  width:47%;
  margin-left:0;
  margin-right:auto;
  text-align:right;
  padding:20px 22px;
  border-radius:14px;
  background:linear-gradient(90deg,rgba(3,9,17,0),rgba(3,9,17,.22));
}
.hero-v4 h1{
  font-family:"Segoe UI","Noto Sans Arabic",Tahoma,Arial,sans-serif;
  font-weight:800;
  letter-spacing:-.5px;
}
#products{scroll-margin-top:24px}
@media(max-width:760px){
 .hero-v4{background-position:35% center}
 .hero-v4 .hero-copy{width:100%;margin:0;background:rgba(3,9,17,.58)}
}

/* V6 bilingual interface: English is the default; Arabic switch is RTL. */
body.english{direction:ltr;text-align:left;font-family:Inter,"Segoe UI",Arial,sans-serif}
body.arabic{direction:rtl;text-align:right;font-family:"Segoe UI","Noto Sans Arabic",Tahoma,Arial,sans-serif}
.language-switch{border:1px solid #d7ad48!important;border-radius:8px;padding:7px 12px;color:#f2c75c!important;font-weight:800}
body.english .hero-copy{text-align:right;margin-left:auto;margin-right:0}
body.english .hero-v4{direction:ltr}
body.english .section-head{direction:ltr}

/* V8: integrated animated automotive programming showcase */
.hero-v4{
  display:grid !important;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:26px;
  direction:ltr;
  align-items:center;
  min-height:430px;
  padding:30px;
}
.hero-v4 .hero-animation{
  grid-column:1;
  grid-row:1;
  width:100%;
  min-width:0;
  position:relative;
  z-index:2;
  overflow:hidden;
  border:1px solid rgba(70,160,230,.55);
  border-radius:16px;
  background:#02060c;
  box-shadow:0 0 28px rgba(0,130,255,.22),0 15px 38px #0009;
}
.hero-v4 .hero-animation img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  object-fit:cover;
}
.hero-v4 .hero-copy{
  grid-column:2;
  grid-row:1;
  width:100%;
  margin:0;
  padding:22px;
  text-align:right;
  direction:rtl;
  background:linear-gradient(135deg,rgba(3,9,17,.45),rgba(3,9,17,.12));
  border-radius:14px;
}
.hero-v4 h1{font-size:clamp(29px,3.1vw,46px)}
@media(max-width:760px){
  .hero-v4{
    grid-template-columns:1fr;
    padding:18px;
    gap:18px;
  }
  .hero-v4 .hero-animation{
    grid-column:1;
    grid-row:1;
  }
  .hero-v4 .hero-copy{
    grid-column:1;
    grid-row:2;
    width:100%;
    padding:16px;
    background:rgba(3,9,17,.72);
  }
}

/* V9: true full-width cinematic animated hero */
body{overflow-x:hidden}
main{max-width:none!important;margin:0!important;padding:0!important;min-height:0}
.hero-fullscreen{
  width:100%;
  height:clamp(520px,calc(100vh - 82px),900px);
  min-height:520px;
  margin:0;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:#020814;
  box-shadow:0 16px 42px rgba(0,0,0,.48);
}
.hero-fullscreen picture,.hero-fullscreen img{
  display:block;
  width:100%;
  height:100%;
}
.hero-fullscreen img{
  object-fit:cover;
  object-position:center center;
}
.categories,.brand-section,#products,.grid{
  max-width:1500px;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:22px;
  padding-right:22px;
}
.categories{margin-top:26px!important}
@media(max-width:760px){
  .hero-fullscreen{height:58vh;min-height:360px}
  .hero-fullscreen img{object-position:center}
}

/* V10: static high-definition full-width automotive hero */
.hero-fullscreen{
  width:100%;
  height:clamp(520px,calc(100vh - 82px),920px);
  min-height:520px;
  margin:0;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:#020814;
  box-shadow:0 16px 42px rgba(0,0,0,.48);
}
.hero-fullscreen img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  animation:none!important;
  transform:none!important;
}
@media(max-width:760px){
  .hero-fullscreen{height:58vh;min-height:360px}
  .hero-fullscreen img{object-position:center}
}

/* V11: show the entire original banner without cropping any edges */
.hero-fullscreen{
  width:100%;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:2560 / 1003;
  overflow:hidden;
  background:#020814;
}
.hero-fullscreen img{
  display:block;
  width:100%;
  height:auto!important;
  aspect-ratio:2560 / 1003;
  object-fit:contain!important;
  object-position:center center!important;
  animation:none!important;
  transform:none!important;
}
@media(max-width:760px){
  .hero-fullscreen{
    height:auto!important;
    min-height:0!important;
    aspect-ratio:2560 / 1003;
  }
  .hero-fullscreen img{
    height:auto!important;
    object-fit:contain!important;
  }
}

/* Contact footer */
.site-footer{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:24px 16px;color:#9aabc0;border-top:1px solid #26364c;background:#0b121d}
.footer-brand{font-weight:900;letter-spacing:1px;color:#e4bd58}
.footer-contact{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px}
.footer-contact a{padding:7px 10px;border:1px solid #344b65;border-radius:7px;color:#f0cc68}
.footer-contact a:hover{border-color:#e4bd58;background:#17283b}


/* Contact numbers: keep international dialing prefix visually left-to-right */
.footer-contact .contact-number{direction:ltr;unicode-bidi:isolate;display:inline-block;font-variant-numeric:tabular-nums;white-space:nowrap}
