.how-it-works-section{max-width:800px;margin:0 auto;padding:var(--space-4)}.how-it-works-section h2{text-align:center;color:var(--color-primary);margin-bottom:var(--space-4)}.section-subtitle{color:var(--color-primary);font-size:var(--font-size-xl);margin-top:var(--space-5);margin-bottom:var(--space-3);padding-bottom:var(--space-1);border-bottom:2px solid var(--color-primary)}[lang=ar] .section-subtitle{text-align:right}.steps-container{display:flex;flex-direction:column;gap:var(--space-4)}.step{background-color:var(--color-background);border-radius:var(--border-radius-lg);padding:var(--space-3);box-shadow:var(--shadow-sm);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.step:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.step h3{color:var(--color-primary);margin-bottom:var(--space-2);font-size:var(--font-size-xl)}.step p{margin-bottom:var(--space-2);color:var(--color-text)}.step ul{list-style-type:disc;margin-left:var(--space-4);color:var(--color-text)}.step ol{list-style-type:decimal;margin-left:var(--space-4);color:var(--color-text)}.step li{margin-bottom:var(--space-1)}details.step{padding:0}details.step>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--space-2) var(--space-3);cursor:pointer;list-style:none;border-radius:var(--border-radius-lg)}details.step>summary::-webkit-details-marker{display:none}details.step>summary:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}details.step>summary h3{margin:0;font-size:var(--font-size-lg)}details.step>summary:after{content:"";flex:none;width:.55rem;height:.55rem;border-inline-end:2px solid var(--color-text-secondary);border-bottom:2px solid var(--color-text-secondary);transform:rotate(45deg);transition:transform var(--transition-fast)}details.step[open]>summary:after{transform:rotate(-135deg)}.step-body{padding:0 var(--space-3) var(--space-3)}.steps-container:has(>details.step){gap:var(--space-2)}[lang=ar] .how-it-works-section,.how-it-works-section[dir=rtl],[lang=ar] .step,.step[dir=rtl]{direction:rtl;text-align:right}[lang=ar] .step h3,.step[dir=rtl] h3,[lang=ar] .step p,.step[dir=rtl] p{text-align:right}[lang=ar] .step ul,.step[dir=rtl] ul,[lang=ar] .step ol,.step[dir=rtl] ol{margin-left:0;margin-right:var(--space-4);text-align:right}[lang=ar] .step li,.step[dir=rtl] li{text-align:right}@media(max-width:768px){.how-it-works-section{padding:0;background:none;box-shadow:none;border-radius:0}.how-it-works-section h2{font-size:var(--font-size-2xl);text-align:start;margin-bottom:var(--space-2)}.section-subtitle{font-size:var(--font-size-lg);margin-top:var(--space-3);margin-bottom:var(--space-2)}.step{padding:var(--space-2)}.steps-container{gap:var(--space-2)}.step h3{font-size:var(--font-size-lg)}details.step{padding:0}details.step>summary{padding:.875rem var(--space-2)}details.step>summary h3{font-size:var(--font-size-md)}.step-body{padding:0 var(--space-2) var(--space-2)}[lang=ar] .step ul,.step[dir=rtl] ul,[lang=ar] .step ol,.step[dir=rtl] ol{margin-right:var(--space-2)}}