/* v86 — Content Center: same identity as the rest of the site */
.hb-hero{position:relative;isolation:isolate;overflow:hidden;background:#061f34;color:#fff;min-height:500px;display:flex;align-items:center}
.hb-photo{position:absolute;inset:0;z-index:-1;background:#061f34 url("../assets/visuals/hub/hero-en.webp") right center/cover no-repeat}
html[dir="rtl"] .hb-photo{background-image:url("../assets/visuals/hub/hero-ar.webp");background-position:left center}
.hb-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,31,52,.92) 0%,rgba(6,31,52,.8) 32%,rgba(6,31,52,.25) 52%,rgba(6,31,52,0) 62%),linear-gradient(180deg,rgba(6,31,52,0) 60%,rgba(6,31,52,.7))}
html[dir="rtl"] .hb-photo::after{background:linear-gradient(270deg,rgba(6,31,52,.92) 0%,rgba(6,31,52,.8) 32%,rgba(6,31,52,.25) 52%,rgba(6,31,52,0) 62%),linear-gradient(180deg,rgba(6,31,52,0) 60%,rgba(6,31,52,.7))}
.hb-in{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:60px 0 90px}
.hb-in>*{max-width:520px}
.hb-in h1{margin:0 0 16px;font:800 clamp(34px,3.4vw,52px)/1.12 Montserrat,Inter,Arial,sans-serif;color:#fff;text-shadow:0 4px 24px rgba(0,10,30,.6)}
html[dir="rtl"] .hb-in h1{font:800 clamp(36px,3.6vw,56px)/1.3 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-in .cx-lead{margin-bottom:26px}
.hb-main{position:relative;isolation:isolate;padding:110px 0 90px;
  background:url("../assets/visuals/hub/doodle-light.webp") center top/1340px auto repeat,linear-gradient(180deg,#eef4f9,#eaf2f8)}
.hb-main::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(238,244,249,.55)}
.hb-head{max-width:760px;margin:0 auto 46px;text-align:center}
.hb-head .cx-kicker{justify-content:center}
.hb-head h2{margin:0 0 12px;font:800 clamp(28px,2.6vw,38px)/1.25 Montserrat,Inter,Arial,sans-serif;color:#0b2a4a}
html[dir="rtl"] .hb-head h2{font:800 clamp(30px,2.8vw,40px)/1.45 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-head p:last-child{margin:0;font:400 16.5px/1.75 Inter,Arial,sans-serif;color:#3d5466}
html[dir="rtl"] .hb-head p:last-child{font:500 18.5px/1.9 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
/* featured video */
.hb-video{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr);gap:0;border-radius:26px;overflow:hidden;margin-bottom:40px;
  background:linear-gradient(120deg,#062d4e,#073d68 55%,#052a49);box-shadow:0 30px 60px -30px rgba(0,30,60,0.42),inset 0 0 0 1px rgba(127,208,245,0.108)}
.hb-poster{position:relative;display:block;min-height:340px;background:#061f34 url("../assets/visuals/hub/video-poster.webp") center/cover no-repeat}
.hb-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,31,52,0) 60%,rgba(6,45,78,.95))}
html[dir="rtl"] .hb-poster::after{background:linear-gradient(270deg,rgba(6,31,52,0) 60%,rgba(6,45,78,.95))}
.hb-play{position:absolute;z-index:1;left:50%;top:50%;width:86px;height:86px;border-radius:50%;transform:translate(-50%,-50%);
  background:radial-gradient(circle at 40% 32%,#ffe066,#F9C721 55%,#d9a600);box-shadow:0 0 0 10px rgba(249,199,33,0.132),0 18px 30px rgba(0,0,0,0.3);transition:transform .2s}
.hb-play::after{content:"";position:absolute;left:36px;top:27px;border-left:22px solid #062d4e;border-top:16px solid transparent;border-bottom:16px solid transparent}
.hb-poster:hover .hb-play{transform:translate(-50%,-50%) scale(1.07)}
.hb-vcopy{padding:40px 38px;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hb-tag{display:inline-block;margin-bottom:12px;padding:6px 14px;border-radius:999px;background:rgba(249,199,33,.15);color:#F9C721;font:800 12px/1 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase}
html[dir="rtl"] .hb-tag{font:700 15px/1 "Somar Sans",sans-serif;letter-spacing:0}
.hb-vcopy h3{margin:0 0 10px;font:800 30px/1.2 Montserrat,Inter,sans-serif}
html[dir="rtl"] .hb-vcopy h3{font:800 32px/1.4 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-vcopy p{margin:0 0 24px;font:400 16px/1.7 Inter,sans-serif;color:#dbe9f3}
html[dir="rtl"] .hb-vcopy p{font:500 18px/1.85 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-vcopy .btn{--pill-h:52px}
/* content types */
.hb-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.hb-card{position:relative;display:flex;flex-direction:column;padding:26px 22px 22px;border-radius:20px;text-decoration:none;color:inherit;
  background:radial-gradient(ellipse at 100% 0%,rgba(47,164,220,.12),rgba(47,164,220,0) 50%),linear-gradient(180deg,#fff 0%,#f1f7fc 55%,#e8f1f8 100%);
  box-shadow:0 24px 44px -26px rgba(0,50,90,0.27),inset 0 0 0 1px rgba(0,102,151,0.096);transition:transform .25s,box-shadow .25s}
.hb-card::before{content:"";position:absolute;top:0;inset-inline:22px;height:4px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,#006697,#2fa4dc 55%,#F9C721)}
a.hb-card:hover{transform:translateY(-4px);box-shadow:0 30px 50px -26px rgba(0,50,90,0.33),inset 0 0 0 1px rgba(249,199,33,0.42)}
.hb-card .cx-ic{margin-bottom:16px}
.hb-card h3{margin:0 0 8px;font:800 19px/1.3 Montserrat,Inter,sans-serif;color:#0b2a4a}
html[dir="rtl"] .hb-card h3{font:800 21px/1.4 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-card p{margin:0 0 18px;font:400 14.5px/1.65 Inter,sans-serif;color:#3d5466}
html[dir="rtl"] .hb-card p{font:500 16px/1.8 "Somar Sans","IBM Plex Sans Arabic",sans-serif}
.hb-go{margin-top:auto;align-self:flex-start;padding:7px 14px;border-radius:999px;font:700 13px/1 Inter,sans-serif;color:#006697;background:rgba(0,102,151,.08)}
html[dir="rtl"] .hb-go{font:700 15px/1 "Somar Sans",sans-serif}
.hb-card.is-soon .hb-go{color:#7d93a3;background:rgba(125,147,163,.12)}
@media (max-width:1100px){.hb-cards{grid-template-columns:1fr 1fr}.hb-video{grid-template-columns:1fr}.hb-poster::after{display:none}}
@media (max-width:760px){
  .hb-hero{min-height:0}
  .hb-photo{background-size:auto 100%;background-position:75% center}
  html[dir="rtl"] .hb-photo{background-position:25% center}
  .hb-photo::after,html[dir="rtl"] .hb-photo::after{background:linear-gradient(180deg,rgba(6,31,52,.45),rgba(6,31,52,.88) 55%,rgba(6,31,52,.95))}
  .hb-in{width:calc(100% - 36px);padding:180px 0 70px}
  .hb-main{padding:80px 0 60px}
  .hb-cards{grid-template-columns:1fr}
  .hb-poster{min-height:220px}
  .hb-vcopy{padding:26px 20px}
}
.hb-photo::after{background:linear-gradient(90deg,rgba(6,31,52,.72) 0%,rgba(6,31,52,.6) 32%,rgba(6,31,52,.2) 52%,rgba(6,31,52,0) 62%),linear-gradient(180deg,rgba(6,31,52,0) 60%,rgba(6,31,52,.7))!important}
html[dir="rtl"] .hb-photo::after{background:linear-gradient(270deg,rgba(6,31,52,.72) 0%,rgba(6,31,52,.6) 32%,rgba(6,31,52,.2) 52%,rgba(6,31,52,0) 62%),linear-gradient(180deg,rgba(6,31,52,0) 60%,rgba(6,31,52,.7))!important}
@media (max-width:760px){.hb-photo::after,html[dir="rtl"] .hb-photo::after{background:linear-gradient(180deg,rgba(6,31,52,.45),rgba(6,31,52,.88) 55%,rgba(6,31,52,.95))!important}}
/* v86b — hero: doodle background + hand writing the page name (man photo only on the video card) */
.hb-photo,html[dir="rtl"] .hb-photo{background:#061f34 url("../assets/visuals/hub/doodle-navy.webp") center/cover no-repeat!important}
html[dir="rtl"] .hb-photo{transform:scaleX(-1)}
.hb-photo::after,html[dir="rtl"] .hb-photo::after{background:linear-gradient(90deg,rgba(6,31,52,.88) 0%,rgba(6,31,52,.7) 40%,rgba(6,31,52,.45) 70%,rgba(6,31,52,.55) 100%),linear-gradient(180deg,rgba(6,31,52,0) 60%,rgba(6,31,52,.75))!important}
.hb-hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;width:100%}
.hb-hero .hb-in{grid-column:1;grid-row:1;width:auto;margin:0;padding-inline:max(24px,calc((100vw - 1180px)/2)) 0}
.hb-hand{grid-column:2;grid-row:1;position:relative;justify-self:center;width:min(92%,560px);aspect-ratio:1120/360;
  background:url("../assets/visuals/hub/hand-en.png") center/contain no-repeat;filter:drop-shadow(0 18px 30px rgba(0,0,0,0.27))}
html[dir="rtl"] .hb-hand{background-image:url("../assets/visuals/hub/hand-ar.png")}
.hb-word{position:absolute;left:2%;right:30%;top:2%;text-align:center;white-space:nowrap;
  font:400 clamp(40px,4.4vw,70px)/1.2 "Comic Sans MS","Segoe Print","Bradley Hand",cursive;color:#F9C721;text-transform:uppercase;letter-spacing:.02em;
  text-shadow:0 2px 0 rgba(160,110,0,.55),0 10px 24px rgba(0,0,0,.35)}
html[dir="rtl"] .hb-word{left:28%;right:4%;font:800 clamp(46px,5.2vw,82px)/1.2 "Somar Sans","IBM Plex Sans Arabic",sans-serif;text-transform:none}
@media (max-width:760px){
  .hb-hero{grid-template-columns:1fr}
  .hb-hand{grid-row:1;width:min(92%,400px);margin-top:26px}
  .hb-hero .hb-in{grid-row:2;padding:10px 18px 70px!important}
  .hb-word{font-size:34px}html[dir="rtl"] .hb-word{font-size:44px}
}
html[dir="ltr"] .hb-word{font-family:"Patrick Hand","Comic Sans MS","Segoe Print",cursive!important;font-weight:400!important}
@media (max-width:760px){.hb-hand{width:100%!important;max-width:400px;justify-self:center}.hb-hero .hb-in{padding-top:0!important}}
@media (max-width:760px){.hb-hero{grid-template-columns:1fr!important}.hb-hand{grid-column:1!important;grid-row:1!important}.hb-hero .hb-in{grid-column:1!important;grid-row:2!important}}
@media (max-width:760px){html[dir="ltr"] .hb-word{font-size:30px!important;right:26%!important}}
