@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&display=swap');

:root{--green:#72d33f;--green2:#2d9f37;--ink:#050806;--panel:#0b100d;--line:rgba(126,215,73,.18);--white:#f5f8f4;--muted:#a9b2ab}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font-family:"Tajawal",Arial,sans-serif;overflow-x:hidden}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.ambient{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;opacity:.15;z-index:-1}.ambient-one{width:450px;height:450px;background:#4fff55;top:-180px;right:-180px}.ambient-two{width:360px;height:360px;background:#187f3a;bottom:0;left:-180px}.nav{height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.07)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}.brand img{width:56px;height:56px;border-radius:50%;object-fit:cover;box-shadow:0 0 20px rgba(91,218,78,.22)}.brand span{display:flex;flex-direction:column}.brand b{font-size:19px}.brand small{font-size:10px;letter-spacing:2px;color:#a8b5aa}.nav-link{color:#dce6dd;text-decoration:none;padding:10px 17px;border:1px solid rgba(255,255,255,.1);border-radius:999px;transition:.2s}.nav-link:hover{border-color:var(--green);color:var(--green)}
.hero{min-height:690px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:80px;padding-block:72px}.eyebrow,.section-title>span,.cta>div>span{color:var(--green);font-weight:700}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 13px;border:1px solid var(--line);background:rgba(74,179,57,.07);border-radius:99px;font-size:14px}.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}h1{font-size:clamp(48px,6vw,78px);line-height:1.08;margin:24px 0 20px;letter-spacing:-2.7px}h1 em{font-style:normal;color:var(--green)}.hero-copy>p{font-size:20px;line-height:1.9;color:#b7c0b9;max-width:660px}.hero-copy>p strong{color:#fff}.hero-actions{display:flex;align-items:center;gap:24px;margin-top:32px;flex-wrap:wrap}.primary-btn{min-height:60px;padding:0 27px;display:inline-flex;align-items:center;justify-content:center;gap:20px;background:linear-gradient(135deg,var(--green),#36a937);color:#071006;text-decoration:none;border-radius:12px;font-weight:900;font-size:18px;box-shadow:0 14px 45px rgba(75,194,55,.2);transition:.25s}.primary-btn:hover{transform:translateY(-3px);box-shadow:0 18px 55px rgba(75,194,55,.32)}.primary-btn svg{width:22px;fill:none;stroke:currentColor;stroke-width:2;transform:scaleX(-1)}.text-link{color:#d5ddd6;text-underline-offset:7px}.trust-row{display:flex;gap:24px;color:#829087;font-size:14px;margin-top:28px;flex-wrap:wrap}.trust-row span::first-letter{color:var(--green)}
.loyalty-card{position:relative;isolation:isolate;aspect-ratio:1.6;padding:32px;border-radius:27px;overflow:hidden;background:linear-gradient(145deg,#17271d,#050806 60%);border:1px solid rgba(128,239,91,.3);box-shadow:0 30px 90px rgba(0,0,0,.55),0 0 60px rgba(83,210,54,.1);transform:perspective(900px) rotateY(-7deg) rotateX(3deg)}.loyalty-card:before{content:"";position:absolute;inset:-2px;background:linear-gradient(120deg,transparent 20%,rgba(129,255,91,.19),transparent 60%);z-index:-1}.card-grid{position:absolute;inset:0;background-image:radial-gradient(rgba(118,222,68,.2) 1px,transparent 1px);background-size:15px 15px;mask-image:linear-gradient(90deg,transparent,#000);opacity:.42}.card-head,.card-foot{position:relative;display:flex;align-items:center;justify-content:space-between}.card-head{justify-content:flex-start;gap:12px}.card-head img{width:59px;height:59px;border-radius:50%}.card-head div{display:flex;flex-direction:column}.card-head b{font-size:18px}.card-head small,.card-foot{color:#89958c;font-size:9px;letter-spacing:1.5px}.card-center{position:absolute;inset:31% 0 auto;text-align:center}.stamp-icon{position:absolute;font-size:70px;color:rgba(105,212,61,.08);transform:translate(45px,-12px)}.card-center strong{font-size:66px;line-height:1;color:var(--green)}.card-center strong span{font-size:25px}.card-center small{display:block;color:#aab4ac}.stamp-row{position:absolute;display:flex;gap:11px;bottom:50px;right:32px}.stamp-row span{display:grid;place-items:center;width:33px;height:33px;border-radius:50%;border:1px solid rgba(111,207,75,.5);color:#77917b;font-size:13px}.stamp-row .filled{background:var(--green);color:#071006;font-weight:900}.card-foot{position:absolute;bottom:21px;right:32px;left:32px}.card-foot span{color:#b8c4ba}
.section{padding-block:110px}.section-title{text-align:center;max-width:650px;margin:0 auto 52px}.section-title>span{font-size:14px}.section-title h2,.cta h2{font-size:clamp(35px,5vw,54px);margin:9px 0 12px;letter-spacing:-1.6px}.section-title p,.cta p{color:var(--muted);font-size:18px;line-height:1.7;margin:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.step{position:relative;background:linear-gradient(145deg,#0e1510,#080c09);border:1px solid rgba(255,255,255,.07);padding:34px;border-radius:20px;overflow:hidden}.step:hover{border-color:var(--line)}.step-number{position:absolute;left:21px;top:15px;font-size:45px;font-weight:900;color:rgba(255,255,255,.035)}.icon{width:56px;height:56px;display:grid;place-items:center;border-radius:15px;background:rgba(103,208,61,.1);color:var(--green);font-size:27px;margin-bottom:25px}.step h3,.reward h3{font-size:23px;margin:0 0 10px}.step p,.reward p{color:var(--muted);line-height:1.75;margin:0}.rewards{background:linear-gradient(180deg,rgba(16,29,19,.8),rgba(5,8,6,0));border-block:1px solid rgba(255,255,255,.045)}.rewards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.reward{position:relative;min-height:340px;padding:27px;background:#0b100d;border:1px solid rgba(255,255,255,.08);border-radius:20px;display:flex;flex-direction:column;align-items:center;text-align:center;transition:.25s}.reward:hover{transform:translateY(-7px);border-color:rgba(114,211,63,.45)}.reward-count{align-self:stretch;display:flex;align-items:baseline;justify-content:center;gap:6px;color:var(--green)}.reward-count b{font-size:55px;line-height:1}.reward-count span{font-weight:700}.reward-icon{height:105px;display:flex;align-items:center;font-size:57px}.reward-icon span{font-size:14px;margin-right:5px;color:var(--green)}.reward.featured{border-color:rgba(114,211,63,.4);background:linear-gradient(150deg,#142319,#0a0e0b)}.popular{position:absolute;top:-13px;padding:5px 13px;border-radius:99px;background:var(--green);color:#071006;font-size:12px;font-weight:900}.reward.grand{background:linear-gradient(145deg,#18231a,#10110b);box-shadow:inset 0 0 45px rgba(188,146,41,.05)}
.cta{margin-block:60px 90px;padding:60px 65px;background:linear-gradient(115deg,#65ca3a,#2b8d35);color:#061006;border-radius:27px;display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:0 30px 80px rgba(42,152,51,.18)}.cta>div>span{color:#0d4a18}.cta h2{margin-block:5px;font-size:42px}.cta p{color:#17491e}.primary-btn.light{background:#071008;color:#fff;box-shadow:none;white-space:nowrap}.footer{min-height:120px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:space-between;gap:30px;color:#78837b;font-size:13px}.footer .brand img{width:44px;height:44px}.footer .brand b{font-size:15px}.footer p{text-align:center}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.loyalty-card.reveal.visible{transform:perspective(900px) rotateY(-7deg) rotateX(3deg)}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:55px;gap:60px}.hero-copy{text-align:center}.hero-copy>p{margin-inline:auto}.hero-actions,.trust-row{justify-content:center}.loyalty-card{width:min(570px,100%);margin:auto}.steps{grid-template-columns:1fr}.rewards-grid{grid-template-columns:repeat(2,1fr)}.cta{flex-direction:column;text-align:center}.footer{flex-direction:column;padding-block:30px}.footer p{margin:0}}
@media(max-width:560px){.shell{width:min(100% - 26px,1180px)}.nav{height:76px}.nav .brand span{display:none}.brand img{width:48px;height:48px}.hero{padding-block:48px 72px;min-height:auto}h1{font-size:45px;letter-spacing:-1.8px}.hero-copy>p{font-size:17px}.primary-btn{width:100%;font-size:16px;padding:0 18px}.trust-row{gap:10px 16px}.loyalty-card{padding:20px;border-radius:18px;transform:none!important}.card-head img{width:43px;height:43px}.card-head b{font-size:13px}.card-center{inset:34% 0 auto}.card-center strong{font-size:48px}.stamp-row{bottom:38px;right:20px;gap:7px}.stamp-row span{width:25px;height:25px}.card-foot{bottom:14px;right:20px;left:20px}.section{padding-block:78px}.rewards-grid{grid-template-columns:1fr}.reward{min-height:310px}.cta{margin-block:35px 60px;padding:43px 22px}.cta h2{font-size:33px}.footer>span{padding-bottom:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.primary-btn,.reward{transition:none}}