/* ==========================================================================
   v5: new Home structure (ecosystem flip cards, focus diagram, journal, education, why),
   Education page (topics, method, resources + player), About (vision / goals / team),
   phone + WhatsApp rows.
   ========================================================================== */
[hidden]{display:none!important}
.sc-h1{max-width:18ch}
html[dir=rtl] .sc-h1{max-width:20ch}
.sc-btn-line{background:transparent;border-color:rgba(255,255,255,.45);color:#fff!important}
.sc-btn-line:hover{background:rgba(255,255,255,.1);border-color:#fff;transform:translateY(-3px)}
.sc-lead{max-width:680px}

/* ---- words ticker ---- */
.sc-words{padding:26px 0 46px}
.sc-words span{font:800 clamp(1.5rem,3.2vw,2.6rem) var(--fh);letter-spacing:.2em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px #3d5a86;transition:color .3s,-webkit-text-stroke-color .3s}
.sc-words span:hover{color:#e0b872;-webkit-text-stroke-color:#e0b872}
.sc-words .track{gap:44px}.sc-words i{width:10px;height:10px;background:#e0b872;transform:rotate(45deg);border-radius:2px}
html[dir=rtl] .sc-words span{letter-spacing:0;font-family:'Cairo',sans-serif;-webkit-text-stroke-width:1.2px}

/* ---- built for ---- */
.sc-built{padding:46px 0 4px;background:#fff;position:relative;z-index:2}
.sc-built-label{text-align:center;margin:0 0 18px;font:700 .74rem var(--f);letter-spacing:.2em;text-transform:uppercase;color:#7a8aa0}
html[dir=rtl] .sc-built-label{letter-spacing:0;font-size:.9rem;text-transform:none}
.sc-built-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px}
.sc-built .b-item{display:inline-flex;align-items:center;gap:10px;color:#4a5b72;font-weight:600;font-size:.95rem}
.sc-built .b-ico{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#e7eff9,#f6ead2);color:#0a3566}
.sc-built .b-ico svg{width:20px;height:20px}
.sc-sec.sc-round{margin-top:0;border-radius:0}

/* ---- section heads with accent ---- */
.sc-head h2 em{font-style:normal;color:#b98a43}
.split-head{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
.split-head>div{max-width:620px}.split-head>p{max-width:430px;margin:0 0 .6em}

/* ---- ecosystem flip cards ---- */
.sc-flips{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.sc-flip{perspective:1400px;height:340px;outline:none;cursor:pointer}
.sc-flip .in{position:relative;width:100%;height:100%;transition:transform .85s var(--ease);transform-style:preserve-3d}
.sc-flip .face{position:absolute;inset:0;display:flex;flex-direction:column;padding:26px 24px;border-radius:26px;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.sc-flip .front{background:#fff;border:1px solid #e1e8f1;box-shadow:0 12px 34px rgba(4,22,50,.08)}
.sc-flip .front .num{position:absolute;inset-inline-end:22px;top:18px;font:800 2.4rem/1 var(--fh);color:transparent;-webkit-text-stroke:1.5px #d3deeb}
.sc-flip .ico{width:56px;height:56px;padding:13px;border-radius:17px;margin-bottom:18px;background:linear-gradient(135deg,#e7eff9,#f6ead2);color:#0a3566}
.sc-flip .front h3{font-size:1.3rem;margin:0 0 8px;color:#0a3566}
.sc-flip .front p{margin:0;color:#5a6b80;font-size:.94rem;line-height:1.6}
.sc-flip .hint{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:#a87a33;font-size:.8rem;font-weight:700}
.sc-flip .back{transform:rotateY(180deg);color:#fff;background:linear-gradient(150deg,#041632,#0a3566 62%,#05498a);box-shadow:0 22px 50px rgba(4,22,50,.28);overflow:hidden}
.sc-flip .back::before{content:"";position:absolute;width:200px;height:200px;inset-inline-end:-70px;top:-80px;border-radius:50%;background:radial-gradient(circle,rgba(224,184,114,.4),transparent 68%)}
.sc-flip .back>*{position:relative}
.sc-flip .back h3{color:#f2d79f;font-size:1.1rem;margin:0 0 12px}
.sc-flip .back ul{list-style:none;padding:0;margin:0 0 16px;flex:1}
.sc-flip .back li{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.sc-flip .back li a{display:flex;align-items:center;gap:10px;color:#e6eef8;text-decoration:none;font-size:.9rem;font-weight:500;transition:color .2s,translate .3s var(--ease)}
.sc-flip .back li a::before{content:"";flex:none;width:7px;height:7px;border-radius:2px;background:#e0b872;rotate:45deg}
.sc-flip .back li a:hover{color:#f2d79f;translate:4px 0}html[dir=rtl] .sc-flip .back li a:hover{translate:-4px 0}
.sc-flip .back .sc-btn{align-self:flex-start}
.sc-flip:focus-visible .front{box-shadow:0 0 0 3px #e0b872}
@media(hover:hover){.sc-flip:hover .in{transform:rotateY(180deg)}}
.sc-flip.flipped .in,.sc-flip:focus-within .in{transform:rotateY(180deg)}
@media(max-width:1100px){.sc-flips{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.split-head{flex-direction:column;align-items:flex-start;gap:6px}}

/* ---- focus diagram ---- */
.sc-focus-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.sc-venn{position:relative;max-width:460px;width:100%;margin-inline:auto}
.sc-venn svg{width:100%;display:block;overflow:visible}
.sc-venn .vc{mix-blend-mode:multiply;opacity:.92;transform-box:fill-box;transform-origin:center;animation:vfloat 9s ease-in-out infinite}
.sc-venn .c2{animation-delay:-3s}.sc-venn .c3{animation-delay:-6s}
.sc-venn .pulse{transform-box:fill-box;transform-origin:center;animation:vpulse 2.6s ease-in-out infinite}
@keyframes vfloat{50%{transform:translate(6px,-8px) scale(1.03)}}
@keyframes vpulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.4);opacity:0}}
.sc-venn .vl{position:absolute;color:#fff;font:700 .95rem var(--fh);text-shadow:0 2px 12px rgba(4,22,50,.45);text-align:center;max-width:120px;line-height:1.25}
.sc-venn .vl{translate:-50% -50%}.sc-venn .l1{left:25%;top:31%}.sc-venn .l2{left:75%;top:31%}.sc-venn .l3{left:50%;top:79%;color:#041632;text-shadow:none}
html[dir=rtl] .sc-venn .vl{font-family:'Cairo',sans-serif}
.sc-focus-txt h2{font-size:clamp(1.7rem,3.4vw,2.6rem);line-height:1.15;margin:.3em 0 .5em}
.sc-focus-txt p{color:#5a6b80;font-size:1.05rem}
.sc-focus-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.sc-focus-list li{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:18px;background:#fff;border:1px solid #e1e8f1;font-weight:600;color:#0a3566;transition:translate .35s var(--ease),box-shadow .35s}
.sc-focus-list li:hover{translate:6px 0;box-shadow:0 10px 26px rgba(4,22,50,.1)}html[dir=rtl] .sc-focus-list li:hover{translate:-6px 0}
.sc-focus-list i{flex:none;width:14px;height:14px;border-radius:50%}
.sc-focus-list .d1{background:#0a3566}.sc-focus-list .d2{background:#167a9b}.sc-focus-list .d3{background:#c99a4e}

/* ---- journal ---- */
.sc-journal-in{display:grid;grid-template-columns:.85fr 1.6fr;gap:48px;align-items:center}
.j-sub{font:600 1.3rem var(--fh);color:#a87a33;margin:.1em 0 .6em}
html[dir=rtl] .j-sub{font-family:'Cairo',sans-serif}
.sc-jtxt h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:.2em 0 0}
.sc-jtxt p{color:#5a6b80}
.sc-jcards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sc-jcard{display:flex;flex-direction:column;gap:6px;padding:12px 12px 16px;border-radius:22px;background:#fff;border:1px solid #e1e8f1;text-decoration:none;box-shadow:0 10px 30px rgba(4,22,50,.07);transition:translate .4s var(--ease),box-shadow .4s}
.sc-jcard:hover{translate:0 -6px;box-shadow:0 20px 44px rgba(4,22,50,.14)}
.sc-jcard .jimg{display:block;height:140px;border-radius:14px;background:#e7eff9 center/cover no-repeat;margin-bottom:6px}
.sc-jcard .jimg.ph{display:grid;place-items:center;background:linear-gradient(135deg,#0a3566,#05498a);color:#f2d79f}.sc-jcard .jimg.ph svg{width:34px;height:34px}
.sc-jcard .jmeta{font:700 .7rem var(--f);letter-spacing:.14em;text-transform:uppercase;color:#a87a33;padding-inline:6px}
.sc-jcard b{color:#0a3566;line-height:1.35;padding-inline:6px}.sc-jcard small{color:#5a6b80;padding-inline:6px;line-height:1.5}
.sc-jempty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 20px;border:1.5px dashed #cdd9e8;border-radius:24px;background:#fafcfe;text-align:center}
.sc-jempty svg{width:34px;height:34px;color:#a87a33}.sc-jempty b{color:#0a3566;font-size:1.1rem}.sc-jempty small{color:#5a6b80}

/* ---- education (home) ---- */
.sc-edu-in{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;align-items:center}
.sc-etxt h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:.2em 0 0}.sc-etxt p{color:#5a6b80}
.sc-etiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.sc-etile{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:20px 16px;border-radius:22px;background:#fff;border:1px solid #e1e8f1;text-decoration:none;color:#0a3566;box-shadow:0 10px 30px rgba(4,22,50,.07);transition:translate .4s var(--ease),box-shadow .4s,background .3s,color .3s}
.sc-etile .ico{width:48px;height:48px;padding:11px;border-radius:15px;background:linear-gradient(135deg,#e7eff9,#f6ead2)}
.sc-etile b{font-size:.95rem;line-height:1.35}
.sc-etile:hover{translate:0 -6px;box-shadow:0 20px 44px rgba(4,22,50,.14);background:linear-gradient(150deg,#041632,#0a3566);color:#fff}
.sc-etile:hover .ico{background:rgba(255,255,255,.12);color:#f2d79f}

/* ---- why ---- */
.sc-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.sc-why-item{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:22px;background:#fff;border:1px solid #e1e8f1;transition:translate .4s var(--ease),box-shadow .4s}
.sc-why-item:hover{translate:0 -5px;box-shadow:0 16px 36px rgba(4,22,50,.12)}
.sc-why-item .ico{flex:none;width:50px;height:50px;padding:12px;border-radius:50%;background:linear-gradient(135deg,#f6ead2,#e7eff9);color:#a87a33;border:1px solid #ecd9b3}
.sc-why-item b{display:block;color:#0a3566;font-size:1.02rem;margin-bottom:4px}.sc-why-item small{display:block;color:#5a6b80;font-size:.86rem;line-height:1.5}

/* ---- education page ---- */
.sc-topics{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.sc-topic{position:relative;padding:26px 26px 22px;border-radius:26px;background:#fff;border:1px solid #e1e8f1;box-shadow:0 10px 30px rgba(4,22,50,.07);transition:translate .45s var(--ease),box-shadow .45s}
.sc-topic:hover{translate:0 -6px;box-shadow:0 20px 44px rgba(4,22,50,.13)}
.sc-topic .n{position:absolute;inset-inline-end:22px;top:16px;font:800 2.4rem/1 var(--fh);color:transparent;-webkit-text-stroke:1.5px #d3deeb}
.sc-topic .ico{width:52px;height:52px;padding:12px;border-radius:16px;background:linear-gradient(135deg,#e7eff9,#f6ead2);color:#0a3566;margin-bottom:14px}
.sc-topic h3{margin:0 0 6px;font-size:1.25rem;color:#0a3566}.sc-topic p{margin:0 0 12px;color:#5a6b80}
.sc-topic ul{list-style:none;padding:0;margin:0}.sc-topic li{position:relative;padding:6px 0;padding-inline-start:24px;color:#33455d;font-size:.93rem;border-top:1px dashed #e3ebf3}
.sc-topic li::before{content:"";position:absolute;inset-inline-start:2px;top:13px;width:8px;height:8px;border-radius:2px;background:linear-gradient(135deg,#e0b872,#c99a4e);rotate:45deg}
.sc-how{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:s;position:relative}
.sc-how li{position:relative;padding:22px;border-radius:22px;background:#fff;border:1px solid #e1e8f1;display:flex;flex-direction:column;gap:6px}
.sc-how .n{font:800 1.8rem/1 var(--fh);background:linear-gradient(135deg,#05498a,#167a9b 55%,#c99a4e);-webkit-background-clip:text;background-clip:text;color:transparent}
.sc-how b{color:#0a3566;font-size:1.05rem}.sc-how small{color:#5a6b80;font-size:.9rem;line-height:1.55}
.sc-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.sc-chips .chip{cursor:pointer;font:600 .88rem var(--f);padding:9px 18px}
.sc-chips .chip.on{background:#0a3566;border-color:#0a3566;color:#fff}
.sc-res{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.sc-resc{display:flex;flex-direction:column;gap:7px;padding:12px 12px 16px;border-radius:22px;background:#fff;border:1px solid #e1e8f1;box-shadow:0 10px 30px rgba(4,22,50,.07);cursor:pointer;outline:none;transition:translate .4s var(--ease),box-shadow .4s}
.sc-resc:hover,.sc-resc:focus-visible{translate:0 -6px;box-shadow:0 20px 44px rgba(4,22,50,.14)}
.sc-resc .rthumb{position:relative;display:grid;place-items:center;aspect-ratio:16/10;border-radius:15px;background:#0a3566 center/cover no-repeat;overflow:hidden}
.sc-resc .rthumb.ph{background:linear-gradient(135deg,#0a3566,#05498a);color:#f2d79f}.sc-resc .rthumb.ph>svg{width:38px;height:38px}
.sc-resc .play{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.92);color:#0a3566;box-shadow:0 8px 24px rgba(4,22,50,.35);transition:scale .35s var(--ease)}
.sc-resc .play svg{width:22px;height:22px;margin-inline-start:2px}.sc-resc:hover .play{scale:1.12}
.sc-resc .rmeta{display:flex;justify-content:space-between;gap:8px;padding-inline:6px;font-size:.72rem;font-weight:700;color:#a87a33;letter-spacing:.06em;text-transform:uppercase}
html[dir=rtl] .sc-resc .rmeta{letter-spacing:0;text-transform:none;font-size:.8rem}
.sc-resc .rk{display:inline-flex;align-items:center;gap:6px}.sc-resc .rk svg{width:14px;height:14px}.sc-resc .rt{color:#7a8aa0}
.sc-resc b{padding-inline:6px;color:#0a3566;line-height:1.35}.sc-resc small{padding-inline:6px;color:#5a6b80;line-height:1.5}
.sc-resempty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 20px;border:1.5px dashed #cdd9e8;border-radius:26px;background:#fafcfe;text-align:center}
.sc-resempty .ei{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#e7eff9,#f6ead2);color:#0a3566;margin:0 3px}.sc-resempty .ei svg{width:22px;height:22px}
.sc-resempty{flex-direction:column}.sc-resempty b{color:#0a3566;font-size:1.15rem;margin-top:6px}.sc-resempty small{color:#5a6b80}
.sc-dlg{border:0;padding:0;background:transparent;max-width:min(920px,94vw);width:100%;color:#14213d}
.sc-dlg::backdrop{background:rgba(4,22,50,.72);backdrop-filter:blur(6px)}
.sc-dlg[open]{animation:dlgIn .45s var(--ease)}
@keyframes dlgIn{from{opacity:0;translate:0 24px;scale:.97}to{opacity:1;translate:0 0;scale:1}}
.dlg-box{position:relative;background:#fff;border-radius:26px;padding:26px;max-height:90vh;overflow:auto}
.dlg-box h3{margin:0 40px 14px 0;font-size:1.3rem;color:#0a3566}html[dir=rtl] .dlg-box h3{margin:0 0 14px 40px}
.dlg-x{position:absolute;inset-inline-end:16px;top:14px;width:38px;height:38px;border-radius:50%;border:0;background:#eef3f9;color:#0a3566;font-size:1.5rem;line-height:1;cursor:pointer;transition:background .2s}.dlg-x:hover{background:#f6ead2}
.dlg-media iframe,.dlg-media video{width:100%;aspect-ratio:16/9;border:0;border-radius:16px;background:#041632;display:block}
.dlg-media img{width:100%;border-radius:16px;display:block}
.dlg-text{margin-top:14px;color:#33455d}.dlg-sum{color:#5a6b80;margin:12px 0 0}
.sc-edu-courses{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.sc-edu-courses h2{margin:0 0 .2em}.sc-edu-courses p{margin:0;color:#5a6b80}

/* ---- about ---- */
.sc-abt.vg .ico{width:48px;height:48px;padding:11px;border-radius:15px;background:linear-gradient(135deg,#e7eff9,#f6ead2);color:#0a3566;margin-bottom:10px}
.sc-goals{list-style:none;padding:0;margin:8px 0 0}.sc-goals li{position:relative;padding:8px 0;padding-inline-start:26px;color:#33455d;border-top:1px dashed #e3ebf3}
.sc-goals li:first-child{border-top:0}
.sc-goals li::before{content:"";position:absolute;inset-inline-start:2px;top:16px;width:9px;height:9px;border-radius:2px;background:linear-gradient(135deg,#e0b872,#c99a4e);rotate:45deg}

/* ---- phone + WhatsApp ---- */
.phone{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0}
.phone a:first-child{font-weight:600;letter-spacing:.01em}
.phone .wa{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 8px;border-radius:999px;background:#1fa855;color:#fff!important;font-size:.76rem;font-weight:700;transition:background .2s,translate .3s var(--ease)}
.phone .wa:hover{background:#188a45;translate:0 -2px;color:#fff!important}
.phone .wa svg{width:16px;height:16px}
.sc-ftr .phone a:first-child,.sc-reach .phone a:first-child{color:#cfe3f5}
.sc-ftr .phone .wa:hover,.sc-reach .phone .wa:hover{color:#fff}
.sc-ftr-contact .lbl{color:#e0b872;font-weight:700}
.sc-reach{align-items:center}
.sc-info .phone a:first-child{color:#14213d}

/* ---- responsive ---- */
@media(max-width:1100px){
  .sc-why-grid{grid-template-columns:1fr 1fr}.sc-etiles{grid-template-columns:1fr 1fr}.sc-how{grid-template-columns:1fr 1fr}
  .sc-edu-in,.sc-journal-in{grid-template-columns:1fr;gap:24px}
}
@media(max-width:900px){
  .sc-focus-in{grid-template-columns:1fr;gap:26px}.sc-topics{grid-template-columns:1fr}
  .sc-jcards{grid-template-columns:1fr 1fr}.sc-jcards .sc-jcard:nth-child(3){display:none}
}
@media(max-width:640px){
  .sc-words{padding:14px 0 28px}.sc-words span{font-size:1.2rem}.sc-words .track{gap:28px}
  .sc-built{padding-top:28px}.sc-built-row{gap:10px 16px}.sc-built .b-item{font-size:.82rem;gap:8px}.sc-built .b-ico{width:32px;height:32px;border-radius:10px}
  .sc-flips{grid-template-columns:1fr;gap:12px}.sc-flip{height:236px}
  .sc-flip .face{padding:18px 18px}.sc-flip .ico{width:44px;height:44px;padding:10px;margin-bottom:10px;border-radius:14px}
  .sc-flip .front h3{font-size:1.15rem}.sc-flip .front p{font-size:.88rem;line-height:1.5}.sc-flip .front .num{font-size:1.8rem;top:14px}
  .sc-flip .back h3{font-size:1rem;margin-bottom:6px}.sc-flip .back li{padding:5px 0}.sc-flip .back li a{font-size:.86rem}.sc-flip .back ul{margin-bottom:10px}
  .sc-venn{max-width:300px}.sc-venn .vl{font-size:.74rem;max-width:80px}
  .sc-focus-txt h2{font-size:1.5rem}.sc-focus-list li{padding:11px 14px;font-size:.9rem}
  .j-sub{font-size:1.1rem}.sc-jcards{grid-template-columns:1fr}.sc-jcards .sc-jcard:nth-child(3){display:flex}
  .sc-jcard .jimg{height:110px}
  .sc-etiles{grid-template-columns:1fr 1fr;gap:8px}.sc-etile{padding:14px 12px;gap:10px;border-radius:18px}.sc-etile .ico{width:40px;height:40px;padding:9px}.sc-etile b{font-size:.84rem}
  .sc-why-grid{grid-template-columns:1fr;gap:8px}.sc-why-item{padding:14px;border-radius:18px;gap:12px}.sc-why-item .ico{width:42px;height:42px;padding:10px}
  .sc-topic{padding:20px 18px 16px;border-radius:22px}.sc-topic h3{font-size:1.1rem}.sc-topic li{font-size:.88rem}
  .sc-how{grid-template-columns:1fr 1fr;gap:10px}.sc-how li{padding:14px;border-radius:18px}.sc-how b{font-size:.95rem}.sc-how small{font-size:.8rem}
  .sc-res{grid-template-columns:1fr 1fr;gap:10px}.sc-resc{padding:8px 8px 12px;border-radius:18px}.sc-resc .rmeta{font-size:.62rem}.sc-resc b{font-size:.9rem}.sc-resc small{display:none}
  .sc-resc .play{width:42px;height:42px}
  .dlg-box{padding:16px;border-radius:20px}
  .phone .wa span{display:none}.phone .wa{padding:6px 8px}
}
