/* شاشة قاعة الاجتماعات: التصميم المشترك
   خلفية فاتحة جدًا، وأقواس البوابة أثر خفيف، والبطل جملة الترحيب.
   كل المقاسات بوحدة rem، و1rem = 10 نقاط على عرض 1920، فيظهر سليمًا على 4K. */

@font-face { font-family: "Plex"; src: url("../fonts/IBMPlexSansArabic-Light.ttf"); font-weight: 300; }
@font-face { font-family: "Plex"; src: url("../fonts/IBMPlexSansArabic-Regular.ttf"); font-weight: 400; }
@font-face { font-family: "Plex"; src: url("../fonts/IBMPlexSansArabic-Medium.ttf"); font-weight: 500; }
@font-face { font-family: "Plex"; src: url("../fonts/IBMPlexSansArabic-SemiBold.ttf"); font-weight: 600; }
@font-face { font-family: "Plex"; src: url("../fonts/IBMPlexSansArabic-Bold.ttf"); font-weight: 700; }

:root {
  --teal-dark: #3c7974;
  --teal: #6ac7bd;
  --mint: #bbe3e7;
  --paper: #f1f9f7;
  --deep: #1d3f3c;
  --deepest: #16302e;
  --grey: #898b8e;
  --ink: #10201e;
  --soft: #5f7f7b; /* نص ثانوي بتباين كافٍ على الخلفية الفاتحة */
}

html { font-size: calc(100vw / 192); }
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  width: 100vw; height: 100vh; overflow: hidden;
  font-family: "Plex", sans-serif; color: var(--deep);
  background: #f8fcfb;
  -webkit-font-smoothing: antialiased;
}

.screen {
  position: relative; width: 100%; height: 100%; overflow: hidden;
  background: radial-gradient(90% 80% at 50% 45%, #ffffff 0%, #f8fcfb 55%, var(--paper) 100%);
}

.arches { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.arches path { fill: none; }

/* المظهر الداكن (الأساسي) */
body.dark { background: var(--deepest); color: #fff; }
.dark .screen { background: radial-gradient(85% 75% at 50% 50%, #24504c 0%, var(--deep) 55%, var(--deepest) 100%); }
.dark .headline, .dark .big .t { color: #fff; }
.dark .sub, .dark .dates { color: rgba(255,255,255,.78); }
.dark .kind, .dark .when, .dark .lead, .dark .big .ap { color: var(--teal); }
.dark .host, .dark .next { color: rgba(255,255,255,.6); }
.dark .next b { color: var(--teal); }

/* الشعار في أعلى الوسط، بعرض 15% من الشاشة */
.logo { position: absolute; top: 7rem; left: 50%; transform: translateX(-50%); width: 28.8rem; z-index: 2; }

.kind { font-size: 3.2rem; font-weight: 500; color: var(--teal-dark); }
.headline { font-weight: 700; line-height: 1.25; color: var(--deep); }
.sub { font-weight: 400; line-height: 1.45; color: var(--soft); }
.when { font-size: 3.4rem; font-weight: 500; color: var(--teal-dark); }

.host {
  position: absolute; bottom: 6rem; left: 0; right: 0; text-align: center;
  font-size: 2.2rem; font-weight: 400; color: var(--soft); z-index: 2;
}

/* المحتوى في الوسط بين نصفي البوابة، في كل الشاشات */
.content { position: absolute; left: 50%; top: 56%; transform: translate(-50%, -50%); width: 120rem; text-align: center; z-index: 2; }