/* RTL (Arabic) version - generated from the English stylesheet with rtlcss, plus Arabic font and no letter-spacing. Re-generate instead of hand-editing. */
/* ================= hero ================= */
#sgss-hero{
  --navy:#16294a; --navy-2:#1c3153; --navy-deep:#0c1830;
  --teal:#17a2ac; --teal-light:#2dc6cb; --teal-deep:#0f7c84; --mint:#00bfad;
  --ink:#182338; --grey:#616d80; --grey-soft:#8892a1; --line:#e1e7f0; --paper:#f5f8fb;
  font-family:'Inter','IBM Plex Sans Arabic',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  box-sizing:border-box;
  background:var(--paper); padding:64px 0;
}
#sgss-hero *,#sgss-hero *::before,#sgss-hero *::after{box-sizing:inherit;}
#sgss-hero h1{font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',sans-serif; font-weight:700; margin:0; color:var(--ink); letter-spacing:0; font-size:clamp(28px,3.4vw,42px); line-height:1.12; max-width:16ch;}
#sgss-hero p{margin:0;}
#sgss-hero img{max-width:100%; display:block;}
#sgss-hero a{text-decoration:none; color:inherit;}
#sgss-hero .sgss-wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

#sgss-hero .sgss-crumb{
  display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700;
  letter-spacing:0; text-transform:uppercase; margin-bottom:6px;
}
#sgss-hero .sgss-crumb a{color:var(--teal-deep);}
#sgss-hero .sgss-crumb span{color:var(--grey-soft); font-weight:600;}
#sgss-hero .sgss-crumb b{color:var(--ink);}

#sgss-hero .sgss-hero-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:52px; align-items:center;}
#sgss-hero .sgss-hero-grid.no-media{grid-template-columns:1fr;}

#sgss-hero .sgss-referent{display:flex; align-items:center; gap:12px; margin-top:24px;}
#sgss-hero .sgss-referent-avatar{width:42px; height:42px; border-radius:50%; flex:none; object-fit:cover;}
#sgss-hero .sgss-referent-initials{
  background:linear-gradient(-135deg, var(--teal) 0%, var(--mint) 100%);
  display:flex; align-items:center; justify-content:center; color:#06262a; font-weight:800; font-size:15px;
}
#sgss-hero .sgss-referent b{display:block; font-size:14.5px; color:var(--ink);}
#sgss-hero .sgss-referent span{font-size:12.5px; color:var(--grey);}

#sgss-hero .sgss-hero-photo{
  aspect-ratio:16/10.5; border-radius:18px; overflow:hidden; position:relative;
  background:linear-gradient(-200deg, var(--navy-2), var(--navy-deep));
  box-shadow:0 24px 48px -28px rgba(12,24,48,.4);
}
#sgss-hero .sgss-hero-photo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}

@media (max-width:900px){
  #sgss-hero .sgss-hero-grid{grid-template-columns:1fr; gap:28px;}
}
@media (max-width:600px){
  #sgss-hero .sgss-wrap{padding:0 18px;}
}

/* ================= facts + pullquote + prose ================= */
#sgss-body{
  --teal:#17a2ac; --teal-light:#2dc6cb; --teal-deep:#0f7c84; --mint:#00bfad;
  --ink:#182338; --grey:#616d80; --grey-soft:#8892a1; --line:#e1e7f0; --card:#ffffff; --paper:#f5f8fb;
  --tealtint:color-mix(in srgb, var(--teal) 10%, transparent);
  font-family:'Inter','IBM Plex Sans Arabic',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  box-sizing:border-box;
  line-height:normal;
}
#sgss-body *,#sgss-body *::before,#sgss-body *::after{box-sizing:inherit;}
#sgss-body h2,#sgss-body h3{font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',sans-serif; font-weight:600; color:var(--ink);}
#sgss-body p{color:var(--grey); line-height:1.7; margin:0;}
#sgss-body a{text-decoration:none;}
#sgss-body img{max-width:100%; display:block;}
#sgss-body .sgss-wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
#sgss-body .sgss-layout{display:grid; grid-template-columns:252px 1fr; gap:56px; align-items:start; padding:56px 0 64px;}

#sgss-body .sgss-facts{
  position:sticky; top:calc(var(--sgss-rail-top, 0px) + 28px); align-self:start;
  display:flex; flex-direction:column; gap:26px;
}
#sgss-body .sgss-facts-name{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',sans-serif; font-weight:700; font-size:14.5px;
  letter-spacing:0; color:var(--ink); padding-bottom:14px; border-bottom:2px solid var(--ink);
}
#sgss-body .sgss-facts-name-lockup{display:flex; align-items:center; gap:10px;}
#sgss-body .sgss-facts-logo{width:96px; height:96px; object-fit:contain; flex:none;}
#sgss-body .sgss-facts-name svg{width:14px; height:14px; stroke:var(--grey-soft); fill:none; stroke-width:2; flex:none; transition:stroke .15s ease;}
#sgss-body .sgss-facts-name a:hover svg{stroke:var(--teal-deep);}
#sgss-body .sgss-facts-about{font-size:13.5px; line-height:1.6; color:var(--grey);}

#sgss-body .sgss-facts-block{display:flex; flex-direction:column; gap:8px;}
#sgss-body .sgss-facts-label{font-size:11px; font-weight:700; letter-spacing:0; text-transform:uppercase; color:var(--grey-soft);}
#sgss-body .sgss-facts-block p{font-size:13.5px; color:var(--grey);}
#sgss-body .sgss-facts-tag{
  display:inline-flex; align-self:flex-start; font-size:12.5px; font-weight:600; color:var(--teal-deep);
  background:var(--tealtint); padding:5px 12px; border-radius:99px; margin:2px 0 2px 6px;
}
#sgss-body .sgss-facts-block ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px;}
#sgss-body .sgss-facts-block li{display:flex; align-items:center; gap:8px; font-size:13.5px; line-height:1.5; color:var(--ink); font-weight:600;}
#sgss-body .sgss-facts-block li svg{width:14px; height:14px; stroke:var(--teal); fill:none; stroke-width:2; flex:none;}

#sgss-body .sgss-main{min-width:0; display:flex; flex-direction:column; gap:44px;}

#sgss-body .sgss-pullquote{
  background:var(--tealtint); border-right:3px solid var(--teal); border-radius:14px 4px 4px 14px;
  padding:26px 30px; display:flex; flex-direction:column; gap:16px;
}
#sgss-body .sgss-pullquote-mark{font-family:Georgia,serif; font-size:40px; line-height:.5; color:var(--teal); font-weight:700;}
#sgss-body .sgss-pullquote blockquote{margin:0; font-size:15px; line-height:1.7; color:var(--ink); font-weight:600;}
#sgss-body .sgss-pullquote-lede{font-size:15px; color:var(--teal-deep); font-weight:600; line-height:1.7;}

/* Every real success_story post opens its narrative with an <h4> lede line
   (confirmed across all 15 posts) before the first real <h2> section - style
   it explicitly instead of leaving it to fall back to the browser's default
   h4, which read as an inconsistent, unstyled jump in the text. Rules below
   target direct children only (">"), not all descendants: one post (IB
   Langenthal) embeds a hand-authored wp:html block that brings its own
   scoped <style> several levels deep - a blanket descendant selector would
   stomp that block's own typography. */
#sgss-body .sgss-prose{min-width:0; display:flex; flex-direction:column; gap:16px;}
#sgss-body .sgss-prose > *:first-child{margin-top:0;}
#sgss-body .sgss-prose > h2{font-size:22px; line-height:1.3; margin:14px 0 0; font-weight:600;}
#sgss-body .sgss-prose > h3{font-size:18px; line-height:1.3; margin:10px 0 0; font-weight:600;}
#sgss-body .sgss-prose > h4,#sgss-body .sgss-prose > h5,#sgss-body .sgss-prose > h6{
  font-family:'Inter','IBM Plex Sans Arabic','system-ui',sans-serif; font-size:15px; line-height:1.7; margin:0; color:var(--ink); font-weight:600;
}
#sgss-body .sgss-prose > p{font-size:15px; line-height:1.7; margin:0; font-weight:400;}
#sgss-body .sgss-prose > ul,#sgss-body .sgss-prose > ol{margin:0; padding-right:22px; color:var(--grey); line-height:1.7; font-size:15px;}
#sgss-body .sgss-prose li{margin-bottom:8px;}
#sgss-body .sgss-prose > p strong,#sgss-body .sgss-prose > p b,
#sgss-body .sgss-prose > ul strong,#sgss-body .sgss-prose > ul b{color:var(--ink); font-weight:600;}
#sgss-body .sgss-prose em{color:var(--ink);}
#sgss-body .sgss-prose > p a,#sgss-body .sgss-prose > ul a,#sgss-body .sgss-prose > ol a{color:var(--teal-deep); text-decoration:underline;}
#sgss-body .sgss-prose > figure{margin:0;}
#sgss-body .sgss-prose > figure figcaption{font-size:13px; color:var(--grey-soft); margin-top:8px; text-align:center;}
#sgss-body .sgss-prose > .wp-block-table table,#sgss-body .sgss-prose > table{width:100%; border-collapse:collapse; font-size:14.5px;}
#sgss-body .sgss-prose > .wp-block-table th,#sgss-body .sgss-prose > .wp-block-table td,
#sgss-body .sgss-prose > table th,#sgss-body .sgss-prose > table td{padding:12px 16px; border:1px solid var(--line); text-align:right; vertical-align:top;}
#sgss-body .sgss-prose > .wp-block-table th,#sgss-body .sgss-prose > table th{background:var(--paper); color:var(--ink); font-weight:700;}
#sgss-body .sgss-prose > .wp-block-table td,#sgss-body .sgss-prose > table td{color:var(--grey);}
#sgss-body .sgss-prose > hr{border:none; border-top:1px solid var(--line); margin:8px 0;}

@media (max-width:900px){
  #sgss-body .sgss-layout{grid-template-columns:1fr; gap:40px;}
  #sgss-body .sgss-facts{position:static;}
}
@media (max-width:600px){
  #sgss-body .sgss-wrap{padding:0 18px;}
}

/* ================= similar stories ================= */
#sgss-similar{
  --teal:#17a2ac; --teal-deep:#0f7c84; --navy-2:#1c3153; --navy-deep:#0c1830;
  --ink:#182338; --grey:#616d80; --line:#e1e7f0; --card:#ffffff; --paper:#f5f8fb;
  --tealtint:color-mix(in srgb, var(--teal) 10%, transparent);
  font-family:'Inter','IBM Plex Sans Arabic',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  box-sizing:border-box;
  line-height:normal;
  background:var(--card); padding:64px 0;
}
#sgss-similar *,#sgss-similar *::before,#sgss-similar *::after{box-sizing:inherit;}
#sgss-similar .sgss-wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
#sgss-similar h2{font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',sans-serif; font-weight:600; color:var(--ink); font-size:26px; text-align:center; margin:0 0 34px;}
#sgss-similar p{margin:0; color:var(--grey); line-height:1.65;}
#sgss-similar a{text-decoration:none; color:inherit;}
#sgss-similar img{max-width:100%; display:block;}

#sgss-similar .sgss-sim-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
#sgss-similar .sgss-sim-card{
  background:var(--paper); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  display:flex; flex-direction:column; transition:transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s ease;
}
#sgss-similar .sgss-sim-card:hover{transform:translateY(-3px); box-shadow:0 18px 34px -18px rgba(20,37,63,.28);}
#sgss-similar .sgss-sim-img{aspect-ratio:16/10; overflow:hidden; background:linear-gradient(-145deg, var(--navy-2), var(--navy-deep)); position:relative;}
#sgss-similar .sgss-sim-img > img{width:100%; height:100%; object-fit:cover;}
#sgss-similar .sgss-sim-logo{
  position:absolute; right:14px; bottom:-18px; width:132px; height:64px; border-radius:12px;
  background:var(--card); border:1px solid var(--line); box-shadow:0 10px 22px -8px rgba(20,37,63,.28);
  display:flex; align-items:center; justify-content:center; padding:8px 12px;
}
#sgss-similar .sgss-sim-logo img{width:100%; height:100%; object-fit:contain;}
#sgss-similar .sgss-sim-body{padding:32px 18px 20px; display:flex; flex-direction:column; gap:12px; flex:1;}
#sgss-similar .sgss-sim-tags{display:flex; flex-wrap:wrap; gap:6px;}
#sgss-similar .sgss-sim-tags span{align-self:flex-start; font-size:11px; font-weight:600; color:var(--teal-deep); background:var(--tealtint); padding:4px 10px; border-radius:99px;}
#sgss-similar .sgss-sim-card h3{font-family:'Anek Latin','IBM Plex Sans Arabic','Inter','IBM Plex Sans Arabic',sans-serif; font-weight:700; font-size:15.5px; line-height:1.35; color:var(--ink);}
#sgss-similar .sgss-sim-card p{font-size:13.5px; line-height:1.6; flex:1;}
#sgss-similar .sgss-sim-referent{display:flex; align-items:center; gap:10px; padding-top:12px; border-top:1px solid var(--line); font-size:12px; color:var(--grey);}
#sgss-similar .sgss-sim-referent img{width:32px; height:32px; border-radius:50%; object-fit:cover; flex:none;}
#sgss-similar .sgss-sim-ref-fallback{width:32px; height:32px; border-radius:50%; background:var(--line); flex:none; display:inline-block;}
#sgss-similar .sgss-sim-referent b{color:var(--ink); font-weight:600;}
#sgss-similar .sgss-sim-link{display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--teal-deep);}
#sgss-similar .sgss-sim-link span{transition:transform .18s ease;}
#sgss-similar .sgss-sim-link:hover span{transform:translateX(-3px);}

@media (max-width:800px){
  #sgss-similar .sgss-sim-grid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  #sgss-similar .sgss-wrap{padding:0 18px;}
}

/* ================= shared reveal-on-scroll (matches .sgr-reveal elsewhere) ================= */
#sgss-hero .sgss-reveal,#sgss-body .sgss-reveal,#sgss-similar .sgss-reveal,#sgref-cta .sgss-reveal{
  opacity:0; transform:translateY(18px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
}
#sgss-hero .sgss-reveal.in,#sgss-body .sgss-reveal.in,#sgss-similar .sgss-reveal.in,#sgref-cta .sgss-reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  #sgss-hero .sgss-reveal,#sgss-body .sgss-reveal,#sgss-similar .sgss-reveal,#sgref-cta .sgss-reveal{opacity:1; transform:none; transition:none;}
}
