﻿.how-page{max-width:1120px;margin:0 auto;padding:0 24px 80px;font-family:"IBM Plex Sans Arabic","Tajawal",system-ui,sans-serif}.how-hero{min-height:430px;padding:86px 30px 70px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;isolation:isolate}.how-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 35%,rgba(171,105,35,.22),transparent 55%),linear-gradient(180deg,rgba(9,8,6,.05),rgba(9,8,6,.8))}.how-kicker{color:#d7a95e;font:700 13px 'Courier Prime',sans-serif;letter-spacing:2px}.how-hero h1{font:clamp(56px,9vw,104px) Rakkas;color:#f0d39a;margin:15px 0;text-shadow:0 8px 22px #000}.how-hero>p{max-width:650px;color:#ccb28b;font-size:19px;line-height:1.9;margin:0}.how-quick-facts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:34px}.how-quick-facts span{border:1px solid rgba(211,167,101,.36);background:rgba(20,15,10,.72);border-radius:999px;padding:11px 17px;color:#e4c287;font-size:13px;box-shadow:0 8px 22px rgba(0,0,0,.2)}.how-quick-facts b{font-weight:700;margin-right:5px}.how-section{padding:70px 0 0}.how-section-heading{display:flex;align-items:center;gap:18px;margin-bottom:24px}.how-section-heading small{color:#c09454;font:700 11px 'Courier Prime',sans-serif;letter-spacing:2px}.how-section-heading h2{font:38px Rakkas;color:#ecd3a2;margin:7px 0}.how-index{color:#e2b96f;font:bold 24px 'Courier Prime',monospace;border:1px solid rgba(211,167,101,.35);width:54px;height:54px;display:grid;place-items:center;background:rgba(27,19,11,.75)}.how-paper,.how-step,.how-element,.how-progress,.how-example,.how-report,.how-outcomes article,.how-tips,.how-cta{border:1px solid var(--line);background:linear-gradient(145deg,rgba(29,22,15,.9),rgba(12,10,8,.9));box-shadow:0 14px 36px rgba(0,0,0,.16)}.how-paper{padding:27px 32px;border-right:3px solid var(--red);color:#ceb58e;line-height:2;font-size:17px}.how-paper p{margin:0 0 10px}.how-paper p:last-child{margin-bottom:0}.how-timeline{display:grid;gap:14px}.how-step{display:grid;grid-template-columns:66px 1fr;align-items:center;gap:20px;padding:22px}.how-step>b{color:#e1b76c;font:bold 27px 'Courier Prime',monospace}.how-step h3,.how-element h3{font:25px Rakkas;color:#e7c98e;margin:0 0 6px}.how-step p,.how-element p{color:#bca27b;line-height:1.8;margin:0}.how-elements{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.how-element{padding:23px;min-height:170px;transition:transform .25s, border-color .25s}.how-element:hover{transform:translateY(-5px);border-color:rgba(211,167,101,.7)}.how-element>span{font-size:25px}.how-progress{padding:25px;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.how-progress-item{display:grid;gap:12px;align-content:start;min-height:110px;border-right:1px solid rgba(211,167,101,.24);padding:0 12px}.how-progress-item:first-child{border-right:0}.how-progress-item b{color:#d65345;font:bold 20px 'Courier Prime',monospace}.how-progress-item span{color:#d3b98d;line-height:1.7;font-size:13px}.how-note{color:#bba17c;line-height:1.8;margin:17px 3px}.how-example{padding:24px;display:grid;grid-template-columns:1fr 34px 1fr 34px 1fr 34px 1fr;align-items:stretch;gap:10px}.how-example article{padding:20px;background:rgba(238,213,164,.08);border:1px solid rgba(211,167,101,.23);display:flex;flex-direction:column;justify-content:center;gap:9px;transition:transform .25s}.how-example article:hover{transform:translateY(-4px)}.how-example small{color:#d9a95a;font-weight:700}.how-example strong{color:#e4d3b2;line-height:1.8;font-size:14px}.how-example i{display:grid;place-items:center;color:#b8372f;font-style:normal;font-size:24px}.how-example .how-result{border-color:#ad342b;background:rgba(164,46,38,.13)}.how-report{padding:15px}.how-report>div{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:12px;padding:15px;border-bottom:1px solid rgba(78,51,25,.36);color:#ead6ac}.how-report>div:last-child{border-bottom:0}.how-report span{color:#d8a75b;font:bold 14px 'Courier Prime',monospace}.how-report em{color:#917b5b;font-style:normal;font-size:12px}.how-outcomes{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.how-outcomes article{padding:25px}.how-outcomes article>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#243d2b;color:#acd59b;font-size:22px}.how-outcomes article+article>span{background:#4a291d;color:#e6b26b}.how-outcomes h3{font:27px Rakkas;color:#e7c98e;margin:14px 0 6px}.how-outcomes p{color:#bca27b;line-height:1.8;margin:0}.how-tips{display:grid;grid-template-columns:repeat(2,1fr);padding:12px}.how-tips>div{display:flex;gap:14px;padding:14px;border-bottom:1px solid rgba(211,167,101,.16);color:#ceb58e;line-height:1.7}.how-tips b{color:#d65447;font:700 13px 'Courier Prime',monospace}.how-cta{margin-top:80px;padding:55px 25px;text-align:center;border-color:rgba(211,167,101,.45);background:radial-gradient(circle at center,rgba(125,61,26,.3),rgba(16,11,8,.93) 65%)}.how-cta h2{font:40px Rakkas;color:#f0d39a;margin:11px 0}.how-cta p{color:#c8ae88;margin:0 0 24px}.how-cta .btn{min-width:190px}.how-reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.how-reveal.is-visible{opacity:1;transform:none}@media(max-width:800px){.how-page{padding:0 18px 55px}.how-hero{min-height:390px;padding:60px 12px 48px}.how-hero>p{font-size:17px}.how-quick-facts{gap:8px}.how-quick-facts span{font-size:12px;padding:9px 12px}.how-section{padding-top:50px}.how-section-heading h2{font-size:31px}.how-elements,.how-outcomes,.how-tips{grid-template-columns:1fr}.how-progress{grid-template-columns:repeat(2,1fr);gap:0}.how-progress-item{min-height:85px;margin:10px 0}.how-progress-item:nth-child(odd){border-right:0}.how-example{grid-template-columns:1fr;gap:8px}.how-example i{height:22px;transform:rotate(0)}.how-report>div{grid-template-columns:35px 1fr}.how-report em{grid-column:2}.how-cta{margin-top:55px}.how-cta h2{font-size:33px}}@media(prefers-reduced-motion:reduce){.how-reveal,.how-element,.how-example article{transition:none!important;transform:none!important}.how-reveal{opacity:1}}

