.storefront-home { overflow: hidden; }
.home-banner-hero { padding: 20px; background: linear-gradient(180deg,var(--moweb-color-brand-soft) 0%,#fff 100%); }
.home-banner-slider { position: relative; width: min(100%,1560px); padding: 0; overflow: hidden; border: 1px solid rgba(111,0,70,.1); border-radius: 30px; background: #fff8fd; box-shadow: 0 22px 60px rgba(111,0,70,.13); isolation: isolate; }
.home-banner-slider:focus-visible { outline: 3px solid #ff67d7; outline-offset: 4px; }
.home-banner-slider__slides { display: grid; }
.home-banner-slide { z-index: 0; grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .55s ease,visibility .55s ease; }
.home-banner-slide.is-active { z-index: 1; opacity: 1; visibility: visible; }
.home-banner-slide a { display: block; }
.home-banner-slide img { display: block; width: 100%; aspect-ratio: 8 / 3; object-fit: cover; }
.home-banner-slider__arrow { position: absolute; z-index: 3; top: 50%; display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid rgba(255,255,255,.56); border-radius: 50%; color: #15121a; background: rgba(255,255,255,.9); box-shadow: 0 8px 24px rgba(0,0,0,.18); font-size: 1.05rem; cursor: pointer; transform: translateY(-50%); transition: background .2s ease,transform .2s ease; backdrop-filter: blur(8px); }
.home-banner-slider__arrow:hover { background: #fff; transform: translateY(-50%) scale(1.06); }
.home-banner-slider__arrow:focus-visible,.home-banner-slider__dots button:focus-visible { outline: 3px solid #ff48c5; outline-offset: 2px; }
.home-banner-slider__arrow--previous { right: 22px; }
.home-banner-slider__arrow--next { left: 22px; }
.home-banner-slider__dots { position: absolute; z-index: 3; right: 50%; bottom: 18px; display: flex; gap: 7px; padding: 7px 9px; border-radius: 99px; background: rgba(9,9,14,.38); transform: translateX(50%); backdrop-filter: blur(8px); }
.home-banner-slider__dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: rgba(255,255,255,.62); cursor: pointer; transition: width .2s ease,background .2s ease; }
.home-banner-slider__dots button[aria-current="true"] { width: 26px; background: #fff; }
.trust-strip { border-bottom: 1px solid var(--moweb-color-border); background: #fff; }.trust-strip .container { display: grid; grid-template-columns: repeat(4,1fr); }.trust-strip .container > div { display: grid; min-height: 105px; place-content: center; padding: 20px; text-align: center; border-inline-end: 1px solid var(--moweb-color-border); }.trust-strip .container > div:last-child { border: 0; }.trust-strip strong { font-size: 1.3rem; }.trust-strip span { color: var(--moweb-color-muted); font-size: .68rem; }
.home-section { padding-block: 90px; }.home-section__header { max-width: 760px; margin: 0 auto 40px; text-align: center; }.home-eyebrow { display: block; margin-bottom: 10px; color: var(--moweb-color-brand-deep); font-size: .72rem; font-weight: 700; }.home-section h2,.home-plans__intro h2,.home-faq h2 { margin: 0; font-size: clamp(2.15rem,4.5vw,4.2rem); line-height: 1.12; }.home-section__header p,.home-plans__intro > p { color: var(--moweb-color-muted); }.home-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }.home-steps article { position: relative; padding: 28px; border: 1px solid var(--moweb-color-heading); border-radius: 19px; background: #fff; box-shadow: 5px 6px 0 var(--moweb-color-heading); }.home-steps article > span { color: var(--moweb-color-brand-dark); font-family: Arial,sans-serif; font-size: 1.8rem; font-weight: 800; }.home-steps h3 { margin: 30px 0 7px; }.home-steps p { margin: 0; color: var(--moweb-color-muted); font-size: .8rem; }
.home-plans { color: #fff; background: #081720; }.home-plans__layout { display: grid; grid-template-columns: .75fr 1.25fr; align-items: start; gap: 75px; }.home-plans__intro { position: sticky; top: 140px; }.home-plans__intro .home-eyebrow { color: #ff75db; }.home-plans__intro > p { color: #b9b5be; }.home-plans__intro aside { display: grid; padding: 18px; margin-top: 25px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: rgba(255,255,255,.05); }.home-plans__intro aside span { color: #bab6bf; font-size: .72rem; }.plan-stack { display: grid; gap: 12px; }.plan-card { overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 17px; background: rgba(255,255,255,.04); }
.plan-card.is-recommended { position: relative; border-color: #ff60d3; box-shadow: 0 0 0 1px #ff60d3; }
.plan-card.is-recommended > button { padding-top: 36px; }
.plan-card__badge { position: absolute; top: 10px; right: 23px; z-index: 2; padding: 4px 14px; border-radius: 999px; color: #fff; background: linear-gradient(90deg,#ff60d3,#a269ff); font-size: .62rem; font-weight: 800; white-space: nowrap; box-shadow: 0 3px 8px rgba(255,96,211,.35); }.plan-card > button { display: grid; width: 100%; min-height: 105px; grid-template-columns: 1fr auto 30px; align-items: center; gap: 15px; padding: 20px 23px; border: 0; color: #fff; background: transparent; text-align: right; cursor: pointer; }.plan-card > button > span:first-child { display: grid; }.plan-card > button small { color: #b9b5be; font-size: .65rem; }.plan-card__price { display: flex; align-items: baseline; gap: 5px; }.plan-card__price strong { color: #ff60d3; font-size: 2.3rem; }.plan-card > button i { font-size: 1.5rem; font-style: normal; }.plan-card__details { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s ease; }.plan-card__details > div { overflow: hidden; }.plan-card.is-open { color: var(--moweb-color-heading); background: #fff; }.plan-card.is-open > button { color: var(--moweb-color-heading); }.plan-card.is-open .plan-card__details { grid-template-rows: 1fr; }.plan-card__details > div { padding-inline: 23px; }.plan-card.is-open .plan-card__details > div { padding-bottom: 23px; }.plan-card__details p,.plan-card__details li { color: var(--moweb-color-muted); font-size: .76rem; }.plan-card__details ul { margin-bottom: 18px; }
.home-products { background: #fff; }.home-section__header--row { display: flex; max-width: none; align-items: end; justify-content: space-between; text-align: right; }.home-section__header--row > a { color: var(--moweb-color-brand-dark); font-weight: 700; text-decoration: none; }
.home-categories { padding-block: 90px; background: #fff; }.home-categories__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }.home-category { position: relative; display: grid; min-height: 300px; align-content: end; gap: 10px; padding: 24px; overflow: hidden; border: 1px solid var(--moweb-color-border); border-radius: 22px; color: var(--moweb-color-heading); isolation: isolate; text-decoration: none; transition: transform .22s ease,box-shadow .22s ease; }.home-category:hover { color: var(--moweb-color-heading); box-shadow: 0 20px 32px rgba(22,15,30,.12); transform: translateY(-6px); }.home-category__shape { position: absolute; z-index: -1; top: -57px; left: -31px; width: 210px; height: 210px; border-radius: 43% 57% 65% 35% / 45% 42% 58% 55%; opacity: .95; transform: rotate(-24deg); }.home-category__label { width: max-content; padding: 6px 9px; border-radius: 99px; background: rgba(255,255,255,.7); font-size: .64rem; font-weight: 700; backdrop-filter: blur(5px); }.home-category strong { max-width: 160px; font-size: 1.45rem; line-height: 1.2; }.home-category small { min-height: 47px; color: #635d68; font-size: .73rem; line-height: 1.7; }.home-category > i { position: absolute; bottom: 19px; left: 20px; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: rgba(255,255,255,.72); font-style: normal; }.home-category--records { background: linear-gradient(145deg,#fff8d6,#fffdf5); }.home-category--records .home-category__shape { background: linear-gradient(140deg,#ffe673,#ffb54d); }.home-category--initiatives { background: linear-gradient(145deg,#f9eaff,#fffaff); }.home-category--initiatives .home-category__shape { background: linear-gradient(140deg,#bd69ff,#ef5ac9); }.home-category--strategies { background: linear-gradient(145deg,#e7f5ff,#f7fcff); }.home-category--strategies .home-category__shape { background: linear-gradient(140deg,#63c6ff,#5376ff); }.home-category--games { background: linear-gradient(145deg,#ffe8ed,#fff9fa); }.home-category--games .home-category__shape { background: linear-gradient(140deg,#ff8a5f,#ff3c9c); }
.home-curated { overflow: hidden; background: #fcfafc; }.home-curated .home-section__header { margin-bottom: 29px; }.home-curated .home-section__header p { max-width: 540px; margin: 13px 0 0; }.home-curated__viewport { position: relative; }.home-curated__track { display: flex; gap: 20px; overflow-x: auto; padding: 4px 2px 18px; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #d48bc4 transparent; }.curated-product { display: grid; width: min(290px,76vw); flex: 0 0 min(290px,76vw); gap: 9px; scroll-snap-align: start; color: var(--moweb-color-heading); text-decoration: none; }.curated-product:hover { color: var(--moweb-color-heading); }.curated-product__cover { position: relative; display: block; min-height: 235px; overflow: hidden; border-radius: 18px; box-shadow: 0 10px 20px rgba(23,16,31,.1); }.curated-product__cover::before,.curated-product__cover::after { position: absolute; border-radius: 50%; content: ""; }.curated-product__cover::before { top: -54px; left: -38px; width: 170px; height: 170px; opacity: .75; }.curated-product__cover::after { right: -27px; bottom: -42px; width: 155px; height: 155px; background: rgba(255,255,255,.2); }.curated-product__cover b { position: absolute; z-index: 2; bottom: 20px; right: 20px; color: rgba(255,255,255,.94); font-family: Arial,sans-serif; font-size: 2.6rem; letter-spacing: -.06em; }.curated-product__cover i { position: absolute; z-index: 1; top: 51%; left: 24px; width: 102px; height: 125px; border: 2px solid rgba(255,255,255,.88); border-radius: 9px; background: rgba(255,255,255,.18); transform: rotate(-9deg); }.curated-product__cover--math { background: linear-gradient(135deg,#6630be,#b833dd); }.curated-product__cover--math::before { background:#ffbd66; }.curated-product__cover--science { background: linear-gradient(135deg,#187bbb,#62c7df); }.curated-product__cover--science::before { background:#d4ef72; }.curated-product__cover--arabic { background: linear-gradient(135deg,#ee4d6f,#f58c76); }.curated-product__cover--arabic::before { background:#ffd56a; }.curated-product__cover--guide { background: linear-gradient(135deg,#1e7169,#4da593); }.curated-product__cover--guide::before { background:#e9dc7a; }.curated-product__meta { color: var(--moweb-color-brand-deep); font-size: .69rem; font-weight: 700; }.curated-product > strong { min-height: 52px; font-size: .95rem; line-height: 1.55; }.curated-product__link { color: #756e78; font-size: .72rem; font-weight: 700; }.curated-product__link i { margin-inline-start: 4px; color: var(--moweb-color-brand-deep); font-style: normal; }.home-curated__controls { display: flex; justify-content: flex-end; gap: 8px; margin-top: 5px; }.home-curated__controls button { display: grid; width: 39px; height: 39px; place-items: center; border: 1px solid var(--moweb-color-border); border-radius: 50%; color: var(--moweb-color-heading); background: #fff; cursor: pointer; transition: background .2s ease,color .2s ease; }.home-curated__controls button:hover { color:#fff; background: var(--moweb-color-brand-dark); }
.home-categories { background: #f8f8fa; }.home-categories__grid { gap: 12px; }.home-category { min-height: 276px; align-content: start; gap: 15px; padding: 22px; border: 1px solid #dfdde4; border-top: 4px solid var(--category-color); border-radius: 12px; background: #fff; box-shadow: none; }.home-category:hover { box-shadow: 0 12px 28px rgba(15,19,31,.08); transform: translateY(-4px); }.home-category__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.home-category__number { color: var(--category-color); font-family: Arial,sans-serif; font-size: .78rem; font-weight: 800; letter-spacing: .08em; }.home-category__label { padding: 0; border-radius: 0; color: #6f6874; background: transparent; font-size: .66rem; font-weight: 500; backdrop-filter: none; }.home-category strong { max-width: none; margin-top: 20px; font-size: 1.25rem; line-height: 1.35; }.home-category small { min-height: 0; color: #696371; font-size: .76rem; line-height: 1.85; }.home-category__action { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 15px; border-top: 1px solid #ebe9ee; color: #302a35; font-size: .73rem; font-weight: 700; }.home-category__action i { color: var(--category-color); font-size: 1rem; font-style: normal; }.home-category--records { --category-color: #c08a16; }.home-category--initiatives { --category-color: #a24189; }.home-category--strategies { --category-color: #356fb4; }.home-category--games { --category-color: #bf4c68; }
.home-catalogue { padding-block: 90px; background: #f8f8fa; }.home-catalogue .home-section__header { margin-bottom: 45px; }.home-catalogue .home-section__header p { max-width: 540px; margin: 12px 0 0; }.catalogue-section { padding-block: 29px; border-top: 1px solid #dfdde4; }.catalogue-section:last-child { border-bottom: 1px solid #dfdde4; }.catalogue-section__header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }.catalogue-section__header h3 { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--moweb-color-heading); font-size: 1.35rem; }.catalogue-section__icon { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid #ddd8e1; border-radius: 9px; color: var(--moweb-color-brand-deep); background: #fff; font-size: 18px; }.catalogue-section__header a { color: var(--moweb-color-brand-deep); font-size: .78rem; font-weight: 700; text-decoration: none; }.catalogue-section__viewport { position: relative; }.catalogue-section__track { display: flex; gap: 18px; overflow-x: auto; padding: 3px 2px 13px; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #c9c5cb transparent; }.catalogue-product { display: grid; width: min(245px,68vw); flex: 0 0 min(245px,68vw); gap: 8px; padding: 10px; border: 1px solid #e4e0e8; border-radius: 14px; background: #ffffff; scroll-snap-align: start; color: var(--moweb-color-heading); text-decoration: none; transition: border-color .2s ease, box-shadow .2s ease; }\n.catalogue-product:hover { border-color: var(--moweb-color-brand-dark); box-shadow: 0 6px 16px rgba(23,16,31,.08); }.catalogue-product:hover { color: var(--moweb-color-heading); }.catalogue-product__image { display: block; aspect-ratio: 1 / .83; overflow: hidden; border-radius: 10px; background: #eeeaf0; }.catalogue-product__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }.catalogue-product:hover .catalogue-product__image img { transform: scale(1.035); }.catalogue-product__meta { color: var(--moweb-color-brand-deep); font-size: .66rem; font-weight: 700; }.catalogue-product > strong { min-height: 45px; font-size: .84rem; line-height: 1.55; }.catalogue-product__price { color: #635c67; font-size: .76rem; font-weight: 700; }.catalogue-section__controls { display: flex; justify-content: flex-end; gap: 7px; margin-top: 3px; }.catalogue-section__controls button { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #dedbe2; border-radius: 50%; color: var(--moweb-color-heading); background: #fff; cursor: pointer; }.catalogue-section__controls button:hover { border-color: var(--moweb-color-brand-dark); color: #fff; background: var(--moweb-color-brand-dark); }
.catalogue-section .catalogue-section__icon { border-color: color-mix(in srgb,var(--catalogue-accent) 25%,#ddd8e1); color: var(--catalogue-accent); background: var(--catalogue-tint); }
.catalogue-section--primary { --catalogue-accent: #326aa7; --catalogue-tint: #eaf4ff; }.catalogue-section--nafs { --catalogue-accent: #9b3d81; --catalogue-tint: #faebf6; }.catalogue-section--grade-six { --catalogue-accent: #b27b13; --catalogue-tint: #fff6dc; }.catalogue-section--grade-five { --catalogue-accent: #b74461; --catalogue-tint: #ffedf1; }
.home-faq { background: var(--moweb-color-surface-muted); }.home-faq__layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 75px; }.faq-list { display: grid; gap: 10px; }.faq-list details { padding: 18px 20px; border: 1px solid var(--moweb-color-border); border-radius: 15px; background: #fff; }.faq-list summary { font-weight: 700; cursor: pointer; }.faq-list p { margin: 12px 0 0; color: var(--moweb-color-muted); font-size: .78rem; }
@media (max-width: 900px) { .home-banner-hero { padding: 10px; }.home-banner-slider { border-radius: 22px; }.home-plans__layout,.home-faq__layout { grid-template-columns: 1fr; gap: 35px; }.home-plans__intro { position: static; }.home-steps { grid-template-columns: 1fr; }.home-categories__grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 650px) { .home-banner-slider { border-radius: 16px; }.home-banner-slider__arrow { width: 36px; height: 36px; }.home-banner-slider__arrow--previous { right: 10px; }.home-banner-slider__arrow--next { left: 10px; }.home-banner-slider__dots { bottom: 9px; }.trust-strip .container { grid-template-columns: repeat(2,1fr); }.trust-strip .container > div:nth-child(2) { border: 0; }.home-section,.home-categories,.home-catalogue { padding-block: 65px; }.home-section__header--row { align-items: start; flex-direction: column; gap: 12px; }.plan-card > button { grid-template-columns: 1fr auto 24px; padding: 17px; }.plan-card__price strong { font-size: 1.8rem; }.home-categories__grid { grid-template-columns: 1fr; }.home-category { min-height: 240px; }.home-curated__controls,.catalogue-section__controls { display: none; } }

@media (prefers-reduced-motion: reduce) { .home-banner-slide,.home-banner-slider__arrow,.home-banner-slider__dots button { transition: none; } }

.plan-card__details .button.is-disabled { cursor: not-allowed; opacity: .55; }
