@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&display=swap');
/* TAFAWOQ v0.3.0 — scoped to the home page only; no changes to global Ordrat assets. */
.tfq:has(.tfq-v3-home){font-family:'Cairo',Tahoma,Arial,sans-serif;background:#f2f4ff}
.tfq:has(.tfq-v3-home) .tfq-topbar{background:linear-gradient(105deg,#eef5ffed,#ede8ffee);backdrop-filter:blur(16px);border-bottom:1px solid #e2dffa;box-shadow:0 4px 19px #16245410}
.tfq:has(.tfq-v3-home) .tfq-topbar-inner{min-height:72px;max-width:1550px}
.tfq:has(.tfq-v3-home) .tfq-account-btn{background:linear-gradient(115deg,#6b13e5,#8233ff);font-size:0;min-width:166px;border-radius:999px;box-shadow:0 4px 19px #6634d446}
.tfq:has(.tfq-v3-home) .tfq-account-btn:after{content:'دخول / تسجيل';font-size:14px;font-weight:900}
.tfq:has(.tfq-v3-home) .tfq-topnav{font-size:14px;gap:22px}
.tfq:has(.tfq-v3-home) .tfq-topnav a:hover,.tfq:has(.tfq-v3-home) .tfq-topnav a[aria-current=page]{color:#772cec}
.tfq-v3-home{--v3-navy:#101a44;--v3-violet:#7228e8;--v3-line:#d2cefa;direction:rtl;text-align:right;overflow:hidden;background:#f3f4ff}
.tfq-v3-home *{box-sizing:border-box}
.tfq-v3-home h1,.tfq-v3-home h2,.tfq-v3-home p{margin-top:0}
.tfq-v3-home a:focus-visible{outline:3px solid #ffe26b;outline-offset:3px}
.tfq-v3-home .tfq-v3-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tfq-v3-hero{position:relative;min-height:490px;isolation:isolate;color:#fff;background:radial-gradient(ellipse at 65% 35%,#464eb0 0,transparent 56%),linear-gradient(115deg,#0a2b63 0%,#1b2e6b 48%,#0b1d4b 70%,#172f7b 100%)}
.tfq-v3-hero:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 17% 20%,#885deb30 0,transparent 50%),linear-gradient(0deg,#892fff15,transparent 22%);z-index:1}
.tfq-v3-hero-art{position:absolute;left:0;top:0;height:calc(100% - 10px);width:min(68%,1120px);object-fit:fill;object-position:left 38%;mask-image:linear-gradient(to right,#000 0%,#000 72%,transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 72%,transparent 100%);z-index:0}
.tfq-v3-hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to left,#111f56ed 0%,#14256eaf 26%,transparent 50%)}
.tfq-v3-copy{position:relative;z-index:2;width:min(650px,45%);margin-right:max(36px,5.1vw);margin-left:auto;padding-top:30px}
.tfq-v3-kicker{display:inline-flex;gap:10px;align-items:center;border:1px solid #c9b3fa96;border-radius:100px;padding:7px 13px;background:#ffffff13;color:#fff;font-size:13px;font-weight:900;line-height:1.8;backdrop-filter:blur(10px);box-shadow:0 4px 17px #16123750}
.tfq-v3-kicker-dot{width:9px;height:9px;border-radius:50%;background:#66eec6;box-shadow:0 0 0 4px #66eec62e}
.tfq-v3-flag{font-size:16px}
.tfq-v3-copy h1{font-size:clamp(30px,3.35vw,57px);font-weight:900;line-height:1.4;letter-spacing:-.04em;margin:9px 0 10px;color:#fff;text-shadow:0 3px 17px #0a113b4f;white-space:nowrap}
.tfq-v3-copy h1 em{font-style:normal;background:linear-gradient(110deg,#ffe848,#ffc857 70%,#ff8f23);background-clip:text;-webkit-background-clip:text;color:transparent}
.tfq-v3-copy p{font-size:clamp(13px,1.14vw,17px);line-height:1.9;color:#eef0ff;font-weight:700;margin:0 0 17px;max-width:600px}
.tfq-v3-hero-actions{display:flex;gap:13px;flex-wrap:wrap;align-items:center}
.tfq-v3-hero-actions a{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-align:center;border-radius:32px;min-height:53px;padding:10px 25px;font-size:14px;font-weight:900;line-height:1.6;transition:transform .15s,box-shadow .15s}
.tfq-v3-hero-actions a:hover{transform:translateY(-2px)}
.tfq-v3-cta{background:linear-gradient(115deg,#9a25ef,#6d34e8);color:#fff!important;border:2px solid #e1acff;box-shadow:0 0 24px #ae50ff80,inset 0 1px 0 #fff8}
.tfq-v3-outline{border:2px solid #fff9;background:#0e214b6b;color:#fff!important}
.tfq-v3-cta span{font-size:21px;line-height:1}
.tfq-v3-copy p.tfq-v3-trial-note{font-size:11px;opacity:.75;margin:10px 0 0;line-height:1.7}
.tfq-v3-features{position:absolute;z-index:3;bottom:15px;right:5.1%;width:min(960px,64%);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.tfq-v3-features a{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:linear-gradient(155deg,#282656c7,#272d69b8);border:1px solid #f2ddffb0;border-radius:17px;min-height:91px;padding:9px 5px;color:#fff!important;font-weight:800;font-size:12px;text-align:center;line-height:1.4;backdrop-filter:blur(12px);box-shadow:0 7px 24px #111c574f;transition:transform .15s,background .15s}
.tfq-v3-features a:hover{transform:translateY(-4px);background:#3c398bdb}
.tfq-v3-features svg{width:27px;height:27px;stroke:#fff;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tfq-v3-content{position:relative;z-index:4;background:radial-gradient(ellipse at 90% 5%,#eff3ff,transparent 52%),linear-gradient(180deg,#edf2ff 0%,#f8f5ff 85%,#e9eaff 100%);padding:15px max(25px,4.8vw) 20px;color:#121b42}
.tfq-v3-content:after{content:'';position:absolute;bottom:-20px;left:-6%;width:35%;height:86px;border-radius:50%;background:#7239e61f;filter:blur(30px);pointer-events:none}
.tfq-v3-row{display:grid;grid-template-columns:minmax(250px,400px) minmax(0,1fr);align-items:end;column-gap:44px;direction:ltr}
.tfq-v3-tour{grid-column:1;position:relative;display:block;height:176px;border:5px solid white;border-radius:25px;box-shadow:0 9px 27px #404c8a23;overflow:hidden;color:#fff!important;direction:rtl}
.tfq-v3-tour img{width:100%;height:100%;object-fit:cover;object-position:center}
.tfq-v3-tour:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#08174d8e,transparent 50%,#091344a9)}
.tfq-v3-tour-title,.tfq-v3-tour small,.tfq-v3-tour-play{position:absolute;z-index:2;color:#fff;text-shadow:0 2px 8px #050b31b2}
.tfq-v3-tour-title{top:7px;right:12px;font-size:15px;font-weight:900}
.tfq-v3-tour small{bottom:6px;right:11px;font-size:10px;font-weight:700}
.tfq-v3-tour-play{top:50%;left:50%;transform:translate(-50%,-50%);width:63px;height:63px;display:grid;place-items:center;background:#15266eb8;border:3px solid #fff;border-radius:50%;font-size:22px;transition:scale .16s}
.tfq-v3-tour:hover .tfq-v3-tour-play{scale:1.06}
.tfq-v3-levels{grid-column:2;min-width:0;direction:rtl}
.tfq-v3-content h2{font-family:'Cairo',Tahoma,Arial,sans-serif;font-size:21px;font-weight:900;text-align:right;color:#131a39;margin:0 0 10px;line-height:1.5}
.tfq-v3-content h2 svg{display:inline-block;width:24px;height:24px;vertical-align:middle;stroke:#7037e3;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-inline-start:5px}
.tfq-v3-stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tfq-v3-stage{position:relative;min-width:0;display:block;aspect-ratio:2.19/1;border:2px solid #fff;border-radius:19px;background-image:url('/cdn/shop/files/tafawoq-v03-stages.webp?v=1794139963');background-repeat:no-repeat;background-size:400% 100%;box-shadow:0 7px 20px #3d568020;transition:transform .16s}
.tfq-v3-stage:hover,.tfq-v3-subject:hover{transform:translateY(-3px)}
.tfq-v3-stage-kg{background-position:100% 0}
.tfq-v3-stage-primary{background-position:66.6667% 0}
.tfq-v3-stage-middle{background-position:33.3333% 0}
.tfq-v3-stage-secondary{background-position:0 0}
.tfq-v3-subjects{margin-top:8px}
.tfq-v3-subject-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.tfq-v3-subject{position:relative;display:block;min-width:0;aspect-ratio:3.15/1;border:2px solid white;border-radius:16px;background-image:url('/cdn/shop/files/tafawoq-v03-subjects.webp?v=1794139969');background-repeat:no-repeat;background-size:600% 100%;box-shadow:0 7px 21px #435c8a1b;transition:transform .16s}
.tfq-v3-subject-0{background-position:0 0}
.tfq-v3-subject-1{background-position:20% 0}
.tfq-v3-subject-2{background-position:40% 0}
.tfq-v3-subject-3{background-position:60% 0}
.tfq-v3-subject-4{background-position:80% 0}
.tfq-v3-subject-5{background-position:100% 0}
.tfq-v3-status{margin:20px auto 0;max-width:1350px;display:flex;align-items:center;justify-content:space-around;gap:8px;border:2px solid #fff;border-radius:45px;min-height:73px;padding:12px 22px;box-shadow:0 9px 29px #5356ae0f;background:#ffffffac;backdrop-filter:blur(8px)}
.tfq-v3-status span{font-weight:800;font-size:12px;line-height:1.6;display:flex;align-items:center;gap:9px;color:#202852}
.tfq-v3-status strong{font-size:23px;color:#7637e8}
.tfq-v3-home + .tfq-section{padding-top:22px}
@media(max-width:1300px){.tfq-v3-hero{min-height:490px}.tfq-v3-copy{width:49%}.tfq-v3-features{width:68%}.tfq-v3-row{gap:19px;grid-template-columns:minmax(220px,310px) minmax(0,1fr)}.tfq-v3-tour{height:153px}.tfq-v3-features a{font-size:11px}.tfq-v3-content{padding-inline:24px}.tfq-v3-content h2{font-size:19px}}
@media(max-width:1050px){.tfq-v3-hero{min-height:525px}.tfq-v3-hero-art{width:70%;height:78%;top:0;object-fit:cover}.tfq-v3-copy{width:56%;margin-right:23px}.tfq-v3-copy h1{font-size:36px}.tfq-v3-features{right:2.3%;width:95%;bottom:14px}.tfq-v3-hero-shade{background:linear-gradient(to left,#101a51ef 0%,#17265da1 40%,transparent 85%)}.tfq-v3-stage-grid{gap:5px}.tfq-v3-stage{border-radius:12px}.tfq-v3-subject-grid{gap:6px}.tfq-v3-subject{border-radius:11px}.tfq-v3-content h2{font-size:17px}}
@media(max-width:820px){.tfq-v3-hero{min-height:650px}.tfq-v3-hero-art{width:100%;height:320px;top:auto;bottom:120px;max-height:none;object-fit:cover;object-position:center 42%;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 99%);mask-image:linear-gradient(to bottom,#000 0%,#000 72%,transparent 99%)}.tfq-v3-hero-shade{background:linear-gradient(180deg,#111d52 0%,#172b77c6 43%,transparent 70%,#091d53dd 99%)}.tfq-v3-copy{padding-top:23px;margin:0 auto;width:calc(100% - 35px);max-width:680px}.tfq-v3-copy h1{font-size:clamp(29px,5.9vw,48px);white-space:normal}.tfq-v3-copy p{max-width:570px;font-size:14px}.tfq-v3-features{right:3%;width:94%;grid-template-columns:repeat(3,minmax(0,1fr));bottom:12px;gap:7px}.tfq-v3-features a{min-height:59px;flex-direction:row;font-size:11px}.tfq-v3-features svg{width:23px;height:23px;flex:none}.tfq-v3-row{grid-template-columns:1fr;direction:rtl;gap:11px}.tfq-v3-levels{grid-column:1;grid-row:1}.tfq-v3-tour{grid-column:1;grid-row:2;height:170px;max-width:420px;width:100%}.tfq-v3-content{padding:22px 16px}.tfq-v3-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.tfq-v3-stage{aspect-ratio:2.18/1}.tfq-v3-subject-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tfq-v3-status{flex-wrap:wrap;border-radius:20px;gap:10px;justify-content:flex-start}.tfq-v3-status span{flex:1 1 calc(50% - 10px)}}
@media(max-width:520px){.tfq:has(.tfq-v3-home) .tfq-account-btn{min-width:0;padding:8px 10px}.tfq:has(.tfq-v3-home) .tfq-account-btn:after{content:'دخول';font-size:12px}.tfq-v3-hero{min-height:620px}.tfq-v3-copy{padding-top:17px}.tfq-v3-kicker{font-size:10px;padding:5px 10px}.tfq-v3-copy h1{font-size:clamp(26px,7vw,35px);margin:11px 0 9px;line-height:1.65}.tfq-v3-copy p{font-size:12px;line-height:1.9;margin-bottom:13px}.tfq-v3-hero-actions{gap:8px}.tfq-v3-hero-actions a{min-height:46px;padding:8px 11px;font-size:11px;flex:1}.tfq-v3-copy p.tfq-v3-trial-note{font-size:9px;margin-top:8px}.tfq-v3-hero-art{bottom:115px;height:240px;object-position:48% center}.tfq-v3-features{bottom:10px;gap:6px}.tfq-v3-features a{font-size:9px;min-height:54px;padding:5px 3px;gap:4px;border-radius:10px}.tfq-v3-features svg{width:18px;height:18px}.tfq-v3-content{padding:18px 12px}.tfq-v3-content h2{font-size:17px}.tfq-v3-stage-grid{gap:8px}.tfq-v3-stage{aspect-ratio:2.18/1;border-radius:11px}.tfq-v3-subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tfq-v3-status{margin-top:15px;padding:10px}.tfq-v3-status span{font-size:10px}.tfq-v3-status strong{font-size:18px}}
@media(max-width:355px){.tfq-v3-copy h1{font-size:25px}.tfq-v3-kicker{font-size:9px}.tfq-v3-features a{font-size:8.4px}}
@media(prefers-reduced-motion:reduce){.tfq-v3-home *, .tfq-v3-home *:before,.tfq-v3-home *:after{animation:none!important;transition:none!important}}

.tfq-v3-flag svg{width:25px;height:16px;vertical-align:middle;display:inline-block;border-radius:2px;box-shadow:0 1px 5px #0015}
.tfq-v3-status-flag svg{width:28px;height:19px;vertical-align:middle;display:block;border-radius:2px}
