
:root{--how-navy:#0b2d57;--how-navy-deep:#08223f;--how-orange:#ff5a0a;--how-ink:#102b4a;--how-copy:#5f6f82;--how-bg:#f6f8fb;--how-line:#dfe6ee;--how-soft:#fff7f0}
body{background:#eef2f6}
.sd-page.sd-how-page{width:min(100%,1180px);background:#fff;box-shadow:0 0 70px rgba(11,33,57,.10);font-family:"Cairo",Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;position:relative}
.sd-how-page .sd-header{background:rgba(255,255,255,.96);border-bottom:1px solid rgba(13,44,89,.08)}
.sd-how-page .sd-brand-logo-new{width:min(250px,40vw);height:auto;display:block}
.sd-how-page .sd-language-trigger{width:68px;min-width:68px}
.sd-how-page .sd-menu-link[aria-current="page"]{background:#fff1e8;color:var(--how-orange)}
.sd-how-page .sd-modal-logo-new{width:min(250px,72%);height:auto;display:block;margin:0 auto}
.sd-share-mobile-float{display:none}

.how-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:48px;align-items:center;padding:72px 58px 42px;background:radial-gradient(circle at 88% 15%,rgba(255,90,10,.07),transparent 28%),linear-gradient(180deg,#fffdfa 0%,#fff 100%);position:relative;overflow:hidden}
.how-hero:after{content:"";position:absolute;inset:auto -90px -180px auto;width:420px;height:420px;border:1px solid rgba(13,44,89,.06);border-radius:50%;box-shadow:0 0 0 52px rgba(13,44,89,.018),0 0 0 104px rgba(255,90,10,.012);pointer-events:none}
.how-hero-copy{position:relative;z-index:2;max-width:720px}.how-eyebrow{display:block;color:var(--how-orange);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;margin-bottom:14px}.how-hero h1{font-size:clamp(44px,5.6vw,70px);line-height:1.02;letter-spacing:-.035em;color:var(--how-ink);margin:0 0 18px;font-weight:800}.how-hero p{font-size:19px;line-height:1.6;color:var(--how-copy);margin:0;max-width:690px}
.how-promise{position:relative;z-index:2;border:1px solid var(--how-line);border-radius:26px;padding:28px 26px;background:linear-gradient(160deg,#fff 0%,#fbfcfe 100%);box-shadow:0 18px 44px rgba(16,43,74,.08);overflow:hidden}.how-promise:before{content:"";position:absolute;right:-55px;top:-55px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,10,.10),rgba(255,90,10,0) 70%)}.how-promise-mark{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:#fff1e8;margin-bottom:18px}.how-promise-mark img{width:34px;height:34px;object-fit:contain}.how-promise strong{display:block;color:var(--how-ink);font-size:25px;line-height:1.18;margin-bottom:10px}.how-promise p{font-size:14px;line-height:1.55;color:#697789;margin:0}.how-promise-rule{width:78px;height:3px;border-radius:999px;background:linear-gradient(90deg,var(--how-orange),#ff8a45);margin-top:22px}

.how-steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:16px 54px 38px;background:#fff}.how-flow-line{position:absolute;left:13%;right:13%;top:72px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,90,10,.22) 16%,rgba(13,44,89,.12) 50%,rgba(255,90,10,.22) 84%,transparent);z-index:0}.how-step{position:relative;z-index:1;border:1px solid var(--how-line);border-radius:24px;padding:25px 22px 24px;background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);box-shadow:0 12px 34px rgba(16,43,74,.055);min-height:300px}.how-step-icon{width:68px;height:68px;border-radius:20px;background:#f5f7fa;display:grid;place-items:center;margin-bottom:18px}.how-step-icon svg{width:42px;height:42px;fill:none;stroke:var(--how-navy);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.how-step-icon svg .accent{stroke:var(--how-orange);fill:none}.how-step-num{position:absolute;top:23px;right:22px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff1e7;color:var(--how-navy);font-weight:800;font-size:14px}.how-step h2{font-size:23px;line-height:1.18;color:var(--how-ink);margin:0 0 10px;letter-spacing:-.02em}.how-step p{font-size:15.5px;line-height:1.58;color:#657487;margin:0}
.how-benefits{margin:0 54px 28px;border:1px solid var(--how-line);border-radius:21px;padding:17px 16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fbfcfe}.how-benefit{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;padding:8px 12px}.how-benefit+.how-benefit{border-inline-start:1px solid var(--how-line)}.how-benefit span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto}.how-benefit svg{width:30px;height:30px;fill:none;stroke:var(--how-navy);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.how-benefit strong{font-size:13px;line-height:1.18;color:var(--how-ink)}
.how-actions{padding:12px 54px 60px;display:flex;align-items:center;gap:14px;background:#fff}.how-primary,.how-secondary{min-height:56px;border-radius:16px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;gap:14px;font-weight:800;text-decoration:none;cursor:pointer}.how-primary{border:0;background:linear-gradient(90deg,#ff6800,#ff4f00);color:#fff;box-shadow:0 12px 28px rgba(255,90,10,.22);font-size:17px}.how-primary span{font-size:22px;font-weight:400}.how-secondary{border:1px solid var(--how-line);background:#fff;color:var(--how-navy);font-size:15px}.how-footer{margin-top:0}

html[dir="rtl"] .sd-how-page .how-hero-copy,html[dir="rtl"] .sd-how-page .how-promise,html[dir="rtl"] .sd-how-page .how-step-copy{text-align:right}html[dir="rtl"] .sd-how-page .how-step-num{right:auto;left:22px}html[dir="rtl"] .sd-how-page .sd-header .sd-language-menu{left:auto!important;right:0!important}html[dir="rtl"] .sd-how-page .about-footer-nav{direction:rtl}html[dir="rtl"] .sd-how-page .how-primary span{transform:rotate(180deg)}

@media(max-width:820px){
 .how-hero{grid-template-columns:1fr;gap:24px;padding:48px 28px 30px}.how-promise{max-width:650px}.how-steps{grid-template-columns:1fr;padding:12px 28px 28px}.how-flow-line{display:none}.how-step{min-height:0;display:grid;grid-template-columns:68px minmax(0,1fr);column-gap:18px;align-items:start}.how-step-icon{grid-row:1/3;margin:0}.how-step-num{top:18px}.how-benefits{margin:0 28px 22px;grid-template-columns:1fr 1fr}.how-benefit:nth-child(3){border-inline-start:0}.how-benefit:nth-child(n+3){border-top:1px solid var(--how-line)}.how-actions{padding:8px 28px 48px}.how-footer .about-footer-main{grid-template-columns:1fr}.how-footer .about-footer-brand{display:flex;justify-content:center}.how-footer .about-footer-nav{justify-content:center}
}
@media(max-width:620px){
 .sd-how-page .sd-header{height:66px;padding:0 12px}.sd-how-page .sd-brand-logo-new{width:190px;max-width:calc(100vw - 118px)}.sd-how-page .sd-share-header{display:none}.sd-share-mobile-float{display:grid;position:absolute;right:14px;top:78px;z-index:16;width:44px;height:44px;min-width:44px;border-radius:14px;color:var(--how-navy);background:rgba(255,255,255,.92);border:1px solid rgba(13,44,89,.12);box-shadow:0 9px 24px rgba(16,43,74,.12);backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}.sd-share-mobile-float svg{width:21px;fill:none;stroke:currentColor;stroke-width:1.8}
 .how-hero{display:block;padding:48px 20px 24px;background:radial-gradient(circle at 92% 0%,rgba(255,90,10,.065),transparent 27%),#fff}.how-hero h1{font-size:39px;line-height:1.04}.how-hero p{font-size:16px;line-height:1.58}.how-promise{margin-top:28px;padding:22px 20px;border-radius:21px}.how-promise-mark{width:46px;height:46px}.how-promise strong{font-size:21px}.how-promise p{font-size:13.5px}
 .how-steps{padding:8px 16px 22px;gap:12px}.how-step{grid-template-columns:58px minmax(0,1fr);column-gap:14px;padding:18px 16px;border-radius:20px}.how-step-icon{width:58px;height:58px;border-radius:17px}.how-step-icon svg{width:36px;height:36px}.how-step-num{width:28px;height:28px;top:16px;right:15px;font-size:12px}.how-step h2{font-size:19px;padding-right:36px;margin-bottom:6px}.how-step p{font-size:14px;line-height:1.48}.how-benefits{margin:0 16px 18px;padding:8px;border-radius:18px}.how-benefit{padding:10px 6px;gap:6px;flex-direction:column;text-align:center}.how-benefit span{width:30px;height:30px}.how-benefit svg{width:27px;height:27px}.how-benefit strong{font-size:11.5px}.how-actions{padding:8px 16px 40px;display:grid;grid-template-columns:1fr}.how-primary,.how-secondary{width:100%;min-height:58px}.how-footer{padding:24px 18px 18px}.how-footer .about-footer-brand img{width:min(56vw,210px)}.how-footer .about-footer-bottom{justify-content:center;text-align:center}
 html[dir="rtl"] .sd-how-page .how-step-num{left:15px;right:auto}html[dir="rtl"] .sd-how-page .how-step h2{padding-right:0;padding-left:36px}html[dir="rtl"] .sd-how-page .sd-language-menu{left:auto!important;right:0!important;width:min(264px,calc(100vw - 24px));max-height:72vh;overflow:auto}
}
@media(max-width:390px){.sd-share-mobile-float{right:11px;top:76px;width:42px;height:42px;min-width:42px}.how-hero{padding-left:18px;padding-right:18px}.how-hero h1{font-size:35px}.how-steps{padding-left:12px;padding-right:12px}.how-benefits{margin-left:12px;margin-right:12px}.how-actions{padding-left:12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Self-contained footer shell for How It Works. */
.how-footer{background:#071421;color:#cbd5df;padding:28px 34px 22px}
.how-footer .about-footer-main{display:grid;grid-template-columns:minmax(190px,270px) 1fr;gap:30px;align-items:center}
.how-footer .about-footer-brand img{display:block;width:min(100%,250px);height:auto}
.how-footer .about-footer-nav{display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap}
.how-footer .about-footer-nav a,.how-footer .about-footer-nav button{color:#dce5ee;text-decoration:none;background:transparent;border:0;padding:8px 10px;border-radius:9px;cursor:pointer;font-size:13px}
.how-footer .about-footer-nav a:hover,.how-footer .about-footer-nav button:hover,.how-footer .about-footer-nav a[aria-current="page"]{background:rgba(255,255,255,.07);color:#fff}
.how-footer .about-footer-bottom{margin-top:18px;padding-top:15px;border-top:1px solid rgba(255,255,255,.10);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:11px;color:#8fa0b0}
@media(max-width:820px){.how-footer .about-footer-main{grid-template-columns:1fr}.how-footer .about-footer-brand{display:flex;justify-content:center}.how-footer .about-footer-nav{justify-content:center}}
@media(max-width:620px){.how-footer{padding:24px 18px 18px}.how-footer .about-footer-brand img{width:min(56vw,210px)}.how-footer .about-footer-bottom{justify-content:center;text-align:center}}
@media(max-width:620px){
  /* Mobile-first lock: keep the process short. The promise panel is a desktop reassurance device, not another mobile step. */
  .how-promise{display:none}
  .how-hero{padding-bottom:18px}
}
