/* RTL (Arabic) version - generated from the English stylesheet with rtlcss, plus Arabic font and no letter-spacing. Re-generate instead of hand-editing. */
/**
 * Single Webinar: bright hero (same visual language as the News hero recolor)
 * + a two-column body (content / registration+speakers sidebar). Scoped
 * under #sgweb-hero / #sgweb-body so nothing leaks site-wide.
 */
#sgweb-hero, #sgweb-body, #sgweb-related {
  --navy:#16294a; --navy-2:#1c3153; --navy-deep:#0c1830;
  --teal:#17a2ac; --teal-light:#2dc6cb; --teal-deep:#0f7c84;
  --ink:#182338; --grey:#616d80; --grey-soft:#8892a1;
  --line:#e1e7f0; --card:#ffffff; --card-grey:#eef1f6;
  --tealtint: color-mix(in srgb, var(--teal) 9%, transparent);
  font-family:'Inter','IBM Plex Sans Arabic',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  line-height:1.6;
}
#sgweb-hero *, #sgweb-body *, #sgweb-related * { box-sizing:border-box; }
#sgweb-hero h1, #sgweb-body h2, #sgweb-body h3, #sgweb-related h2 {
  font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',-apple-system,sans-serif; font-weight:700; margin:0; color:var(--ink); text-wrap:balance;
}
#sgweb-hero p, #sgweb-body p, #sgweb-related p { margin:0; }
#sgweb-hero a, #sgweb-body a, #sgweb-related a { color:inherit; text-decoration:none; }
#sgweb-hero img, #sgweb-body img, #sgweb-related img { max-width:100%; display:block; }
#sgweb-hero .wrap, #sgweb-body .wrap, #sgweb-related .wrap { max-width:1180px; margin:0 auto; padding-right:28px; padding-left:28px; }
@media (max-width:640px){ #sgweb-hero .wrap, #sgweb-body .wrap, #sgweb-related .wrap { padding-right:20px; padding-left:20px; } }

/* ============ Hero (navy, matches the Webinars archive) ============ */
#sgweb-hero{
  position:relative; overflow:hidden; color:#eef2f9;
  background:linear-gradient(-172deg, var(--navy) 0%, var(--navy-2) 55%, var(--navy-deep) 100%);
  padding:96px 0 108px;
}
#sgweb-hero .sgweb-hero-glow{ position:absolute; border-radius:50%; pointer-events:none; z-index:0; }
#sgweb-hero .sgweb-hero-glow.g1{ top:-160px; left:-90px; width:560px; height:440px; background:radial-gradient(closest-side, rgba(45,198,203,.22), transparent 72%); }
#sgweb-hero .sgweb-hero-glow.g2{ bottom:-200px; right:-120px; width:480px; height:380px; background:radial-gradient(closest-side, rgba(255,255,255,.05), transparent 72%); }
#sgweb-hero .sgweb-hero-in{ position:relative; z-index:1; }
#sgweb-hero .sgweb-crumb{
  display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:0;
  text-transform:uppercase; color:#8fa0bd; margin-bottom:22px;
}
#sgweb-hero .sgweb-crumb a{ color:#b7c4da; transition:color .15s ease; }
#sgweb-hero .sgweb-crumb a:hover{ color:#fff; }
#sgweb-hero .sgweb-crumb .sep{ opacity:.5; }
#sgweb-hero .sgweb-crumb .current{ text-transform:none; letter-spacing:normal; color:#8fa0bd; }
#sgweb-hero .sgweb-badge{
  display:inline-block; font-size:11.5px; font-weight:700; letter-spacing:0; text-transform:uppercase;
  padding:.4rem .9rem; border-radius:99px; margin-bottom:18px;
}
#sgweb-hero .sgweb-badge.is-upcoming{ background:rgba(45,198,203,.16); color:var(--teal-light); }
#sgweb-hero .sgweb-badge.is-replay{ background:rgba(255,255,255,.08); color:#b7c4da; }
#sgweb-hero h1{ font-size:clamp(28px,3.8vw,42px); line-height:1.2; letter-spacing:0; max-width:760px; color:#fff; }
#sgweb-hero .sgweb-meta{ display:flex; align-items:center; gap:14px; margin-top:22px; font-size:14px; color:#b7c4da; font-weight:600; }
#sgweb-hero .sgweb-meta .dot{ width:3px; height:3px; border-radius:50%; background:#8fa0bd; }

/* ============ Body layout ============ */
#sgweb-body .sgweb-layout{
  display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:48px; align-items:start;
  padding-top:56px; padding-bottom:80px;
}
@media (max-width:920px){
  #sgweb-body .sgweb-layout{ grid-template-columns:1fr; padding-top:36px; padding-bottom:56px; }
  #sgweb-body .sgweb-side{ display:none; }
}

#sgweb-body .sgweb-article > p{ font-size:16px; color:var(--grey); margin-bottom:20px; }
#sgweb-body .sgweb-article > p:first-of-type{ font-size:18px; color:var(--ink); font-weight:500; line-height:1.55; }
#sgweb-body .sgweb-article h2{ font-size:20px; margin:36px 0 14px; line-height:1.35; }
#sgweb-body .sgweb-article h3{ font-size:17px; margin:28px 0 12px; line-height:1.35; }
#sgweb-body .sgweb-article ul, #sgweb-body .sgweb-article ol{ margin:16px 0; padding-right:1.2rem; }
#sgweb-body .sgweb-article li{ font-size:15px; color:var(--ink); margin-bottom:8px; }
#sgweb-body .sgweb-article a{ color:var(--teal-deep); text-decoration:underline; text-underline-offset:2px; }
#sgweb-body .sgweb-article strong{ color:var(--ink); }

/* ============ Sidebar ============ */
#sgweb-body .sgweb-side{ position:sticky; top:calc(var(--sgweb-rail-top, 78px) + 20px); display:flex; flex-direction:column; gap:24px; }
#sgweb-body .sgweb-side-block{ background:var(--card-grey); border:1px solid var(--line); border-radius:16px; padding:22px; }
#sgweb-body .sgweb-side-label{ font-size:11px; font-weight:700; letter-spacing:0; text-transform:uppercase; color:var(--grey-soft); margin-bottom:16px; }

#sgweb-body .sgweb-reg{ background:linear-gradient(-165deg, var(--navy) 0%, var(--navy-deep) 100%); }
#sgweb-body .sgweb-reg .sgweb-side-label{ color:var(--teal-light); }
#sgweb-body a.sgweb-cta, #sgweb-body button.sgweb-cta{
  display:inline-flex; align-items:center; gap:8px; width:100%; justify-content:center; box-sizing:border-box;
  font-family:inherit; font-size:14px; font-weight:700; color:#fff; background:var(--teal); padding:12px 18px;
  border:0; border-radius:99px; cursor:pointer;
  box-shadow:0 16px 34px -16px rgba(23,162,172,.6); transition:background .18s ease, transform .18s ease;
}
#sgweb-body a.sgweb-cta:hover, #sgweb-body button.sgweb-cta:hover{ background:var(--teal-deep); transform:translateY(-2px); }
#sgweb-body a.sgweb-cta svg, #sgweb-body button.sgweb-cta svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; }

/* ============ Embed popup (legacy ClickMeeting embeds open here instead of squeezing into the sidebar) ============ */
.sgweb-embed{ position:relative; width:100%; border-radius:10px; overflow:hidden; background:#000; }
.sgweb-embed iframe{ position:absolute; inset:0; width:100% !important; height:100% !important; border:0; }

.sgweb-embed-modal{
  position:fixed; inset:0; z-index:2000; display:none; align-items:center; justify-content:center; padding:24px;
}
.sgweb-embed-modal.is-open{ display:flex; }
.sgweb-embed-modal-backdrop{ position:absolute; inset:0; background:rgba(12,24,48,.72); backdrop-filter:blur(2px); }
.sgweb-embed-modal-panel{
  position:relative; z-index:1; width:100%; max-width:min(92vw,960px); max-height:88vh;
  background:#000; border-radius:14px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.45);
}
.sgweb-embed-modal-body{ width:100%; }
.sgweb-embed-modal-body .sgweb-embed{ border-radius:0; }
.sgweb-embed-modal-close{
  position:absolute; top:10px; left:10px; z-index:2; width:36px; height:36px; border-radius:50%;
  background:rgba(0,0,0,.55); color:#fff; border:0; font-size:20px; line-height:1; cursor:pointer;
  transition:background .15s ease;
}
.sgweb-embed-modal-close:hover{ background:rgba(0,0,0,.78); }

#sgweb-body .sgweb-speakers{ display:flex; flex-direction:column; gap:16px; }
#sgweb-body .sgweb-speaker{ display:flex; gap:12px; align-items:center; }
#sgweb-body .sgweb-speaker .pic{ width:48px; height:48px; border-radius:50%; object-fit:cover; flex:none; }
#sgweb-body .sgweb-speaker .name{ font-size:13.5px; font-weight:700; color:var(--ink); line-height:1.3; }
#sgweb-body .sgweb-speaker .role{ font-size:12px; color:var(--grey); line-height:1.4; margin-top:2px; }

/* ============ "More webinars" closing section ============ */
#sgweb-related{ padding:64px 0; background:var(--card-grey); }
#sgweb-related .related-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:30px; }
#sgweb-related .related-head .eyebrow{ font-size:11.5px; font-weight:700; letter-spacing:0; text-transform:uppercase; color:var(--grey-soft); margin-bottom:6px; display:block; }
#sgweb-related .related-head h2{ font-size:24px; margin:0; }
#sgweb-related .related-head a{ font-size:13.5px; font-weight:600; color:var(--teal-deep); }
#sgweb-related .rel-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
@media (max-width:760px){ #sgweb-related .rel-grid{ grid-template-columns:1fr; } }
#sgweb-related .sgweb-card{ background:var(--card); }