*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1; --tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ; --tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ; --tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow:0 0 #0000; --tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ; --tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ; --tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ; --tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0; --tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ; --tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ; --tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px; --tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000; --tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ; --tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ; --tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ; --tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: } /*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/ *,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host, html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent} body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px} abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted} h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit} b,strong{font-weight:bolder} code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em} small{font-size:80%} sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} sub{bottom:-.25em}sup{top:-.5em} table{text-indent:0;border-color:inherit;border-collapse:collapse} button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0} button,select{text-transform:none} button,input:where([type=button]), input:where([type=reset]), input:where([type=submit]) {-webkit-appearance:button;background-color:transparent;background-image:none} :-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none} progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search] {-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} summary{display:list-item} blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0} fieldset{margin:0} fieldset,legend{padding:0} menu,ol,ul{list-style:none;margin:0;padding:0} dialog{padding:0} textarea{resize:vertical} input::-moz-placeholder, textarea::-moz-placeholder{opacity:1;color:#9ca3af} input::placeholder, textarea::placeholder{opacity:1;color:#9ca3af}[role=button], button{cursor:pointer}:disabled{cursor:default} audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle} img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none} [multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])), select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem; --tw-shadow:0 0 #0000}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus, [type=time]:focus,[type=url]:focus,[type=week]:focus, input:where(:not([type])):focus, select:focus, textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow),var(--tw-shadow);border-color:#a21c43} input::-moz-placeholder, textarea::-moz-placeholder{color:#6b7280;opacity:1} input::placeholder, textarea::placeholder{color:#6b7280;opacity:1} ::-webkit-datetime-edit-fields-wrapper{padding:0} ::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit} ::-webkit-datetime-edit{display:inline-flex} ::-webkit-datetime-edit, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-meridiem-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0} select{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E") ;background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])) {background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset} [type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact; display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0; height:1rem;width:1rem;color:#a21c43;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000} [type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px; --tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)} [type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat} [type=checkbox]:checked{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")} @media (forced-colors:active) {[type=checkbox]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} [type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")} @media (forced-colors:active) {[type=radio]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} [type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=radio]:checked:focus,[type=radio]:checked:hover{border-color:transparent;background-color:currentColor} [type=checkbox]:indeterminate{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E") ;border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat} @media (forced-colors:active) {[type=checkbox]:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} [type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{border-color:transparent;background-color:currentColor} [type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit} [type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color} *{border-color:hsl(var(--border))}body,html{font-family:YekanBakh}[x-cloak]{display:none!important}html:not(.dark) .dark-icon{display:none}[dir=rtl] .form-select:not(.form-multiselect){background-position:left .5rem center;padding-left:2.5rem;padding-right:.75rem} .dark .light-icon{display:none} .swiper .swiper-button-next,.swiper .swiper-button-prev{display:flex;height:2.75rem;width:2.75rem;align-items:center;justify-content:center;border-radius:9999px;border-width:1px; border-color:hsl(var(--border));background-color:hsl(var(--background));color:hsl(var(--foreground))} .swiper .swiper-button-next:after, .swiper .swiper-button-prev:after{font-size:1.125rem;line-height:1.75rem} .swiper .swiper-button-disabled{opacity:0!important} .single-swiper-slider .swiper-pagination-bullet-active{background-color:hsl(var(--background))} .description h1, .description h2{margin-bottom:.75rem;font-size:1.25rem;line-height:1.75rem;font-weight:900} .description h3, .description h4{margin-bottom:.75rem;font-size:1.125rem;line-height:1.75rem;font-weight:900} .description h5{font-size:1rem;line-height:1.5rem} .description h5, .description h6{margin-bottom:.75rem;font-weight:900} .description h6, .description p{font-size:.875rem;line-height:1.25rem} .description p{margin-bottom:1.25rem;color:hsl(var(--muted))} .description img{margin-left:auto;margin-right:auto;margin-bottom:1.25rem;display:block;max-width:100%;border-radius:1.5rem} .faq-description h2, .faq-description h3{font-size:.875rem;line-height:1.25rem;font-weight:700;color:hsl(var(--muted))} .faq-description p{font-size:.75rem;line-height:1rem;font-weight:600;color:hsl(var(--muted))} .faq-description ul{display:flex;list-style-position:inside;list-style-type:disc;flex-direction:column;align-items:flex-start} .faq-description li{font-size:.75rem;line-height:1rem;font-weight:600;color:hsl(var(--muted))} .container{width:100%} @media (min-width:480px){.container{max-width:480px}} @media (min-width:576px){.container{max-width:576px}} @media (min-width:768px){.container{max-width:768px}} @media (min-width:992px){.container{max-width:992px}} @media (min-width:1280px){.container{max-width:1280px}} @media (min-width:1536px){.container{max-width:1536px}} .form-input, .form-multiselect, .form-select, .form-textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:rgb(25, 97, 174) ;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000} .form-input:focus, .form-multiselect:focus, .form-select:focus, .form-textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px; --tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#a21c43} .form-input::-moz-placeholder, .form-textarea::-moz-placeholder{color:#6b7280;opacity:1} .form-input::placeholder, .form-textarea::placeholder{color:#6b7280;opacity:1} form-input::-webkit-datetime-edit-fields-wrapper{padding:0} .form-input::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit} .form-input::-webkit-datetime-edit{display:inline-flex} .form-input::-webkit-datetime-edit, .form-input::-webkit-datetime-edit-day-field, .form-input::-webkit-datetime-edit-hour-field, .form-input::-webkit-datetime-edit-meridiem-field, .form-input::-webkit-datetime-edit-millisecond-field, .form-input::-webkit-datetime-edit-minute-field, .form-input::-webkit-datetime-edit-month-field, .form-input::-webkit-datetime-edit-second-field, .form-input::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0} .form-select{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E") ;background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact} .form-select:where([size]:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset} .form-checkbox,.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact; display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none; user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#a21c43;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000} .form-checkbox{border-radius:0} .form-radio{border-radius:100%} .form-checkbox:focus, .form-radio:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#a21c43;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow: var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)} .form-checkbox:checked, .form-radio:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat} .form-checkbox:checked{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")} @media (forced-colors:active) {.form-checkbox:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} .form-radio:checked{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")} @media (forced-colors:active) {.form-radio:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} .form-checkbox:checked:focus, .form-checkbox:checked:hover, .form-radio:checked:focus, .form-radio:checked:hover{border-color:transparent;background-color:currentColor} .form-checkbox:indeterminate{background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E") ;border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat} @media (forced-colors:active) {.form-checkbox:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}} .form-checkbox:indeterminate:focus, .form-checkbox:indeterminate:hover{border-color:transparent;background-color:currentColor} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0} .pointer-events-none{pointer-events:none} .visible{visibility:visible} .invisible{visibility:hidden} .fixed{position:fixed} .absolute{position:absolute} .relative{position:relative} .sticky{position:sticky} .inset-0{inset:0} .inset-x-0{left:0;right:0} .inset-x-4{left:1rem;right:1rem} .inset-y-0{top:0;bottom:0} .-bottom-3{bottom:-.75rem} .-bottom-4{bottom:-.1rem} .-bottom-px{bottom:-1px} .-right-1{right:-.25rem} .-top-0{top:-0.85rem} .-top-1{top:-.25rem} .-top-full{top:-100%} .-top-px{top:-1px} .bottom-0{bottom:0} .left-0{left:0} .left-3{left:.75rem} .left-4{left:1rem} .right-0{right:0} .right-1\/2{right:50%} .right-3{right:.75rem} .right-full{right:100%} .top-0{top:0} .top-2{top:.5rem} .top-24{top:6rem} .top-20{top:3rem} .top-3{top:.75rem} .top-full{top:100%} .z-10{z-index:10} .z-20{z-index:20} .z-30{z-index:30} .z-40{z-index:40} .z-50{z-index:50} .-order-1{order:-1} .mx-12{margin-left:3rem;margin-right:3rem} .mx-13{margin-left:0rem;margin-right:2rem} .mx-2{margin-left:.5rem;margin-right:.5rem} .mx-5{margin-left:1.25rem;margin-right:1.25rem} .mx-auto{margin-left:auto;margin-right:auto} .my-2{margin-top:.5rem;margin-bottom:.5rem} .my-20{margin-top:5rem;margin-bottom:5rem} .-mt-12{margin-top:-3rem} .-mt-10{margin-top:-2.5rem} .-mt-5{margin-top:-.65rem} .mb-2{margin-bottom:.5rem} .mb-3{margin-bottom:.75rem} .mb-5{margin-bottom:1.25rem} .mb-8{margin-bottom:2rem} .me-auto{margin-inline-end:auto} .mr-auto{margin-right:auto} .ms-1{margin-inline-start:.25rem} .ms-2{margin-inline-start:.5rem} .ms-auto{margin-inline-start:auto} .mt-10{margin-top:2.5rem} .mt-2{margin-top:.5rem} .mt-3{margin-top:.75rem} .mt-5{margin-top:1.25rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem} .line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1} .block{display:block} .inline-block{display:inline-block} .flex{display:flex} .inline-flex{display:inline-flex} .table{display:table} .grid{display:grid} .hidden{display:none} .size-10{width:2.5rem;height:2.5rem} .size-4{width:1rem;height:1rem} .size-5{width:1.25rem;height:1.25rem} .h-1{height:.25rem} .h-1\.5{height:.375rem} .h-10{height:2.5rem} .h-11{height:2.75rem} .h-12{height:3rem} .h-14{height:3.5rem} .h-2{height:.5rem} .h-20{height:5rem} .h-3{height:.75rem} .h-4{height:1rem} .h-5{height:1.25rem} .h-56{height:14rem} .h-64{height:20rem} .h-6{height:1.5rem} .h-8{height:2rem} .h-9{height:2.25rem} .h-96{height:24rem} .h-95{height:23rem} .h-full{height:100%} .h-px{height:1px} .h-screen{height:100vh} .max-h-48{max-height:12rem} .min-h-\[300px\]{min-height:300px} .min-h-screen{min-height:100vh} .w-1{width:.25rem} .w-1\.5{width:.375rem} .w-1\/2{width:50%} .w-10{width:2.5rem} .w-11{width:2.75rem} .w-12{width:3rem} .w-14{width:3.5rem} .w-2{width:.5rem} .w-20{width:5rem} .w-36{width:9rem} .w-4{width:1rem} .w-40{width:10rem}max-w-smtext-sm .w-5{width:1.25rem} .w-45{width:12rem} .w-52{width:13rem} .w-56{width:14rem} .w-6{width:1.5rem} .w-72{width:18rem} .w-8{width:2rem} .w-9{width:2.25rem} .w-96{width:24rem} .w-97{width:40rem} .w-100{width:78rem} .w-full{width:100%} .w-px{width:1px} .min-w-full{min-width:100%} .max-w-4xl{max-width:56rem} .max-w-5xl{max-width:64rem} .max-w-7xl{max-width:80rem} .max-w-6xl{max-width:75rem} .max-w-3xl{max-width:78rem} .max-w-8xl{max-width:78rem} .max-w-9xl{max-width:83rem} .max-w-full{max-width:100%} .max-w-md{max-width:28rem} .max-w-sm{max-width:24rem} .max-w-xl{max-width:36rem} .max-w-xxl{max-width:38.25rem} .max-w-xs{max-width:20rem} .max-w-xss{max-width:19rem} .flex-1{flex:1 1 0%} .flex-auto{flex:1 1 auto} .flex-shrink-0{flex-shrink:0} .flex-grow,.grow{flex-grow:1} .\!translate-x-0{--tw-translate-x:0px!important;transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important} .-translate-y-1\/2{--tw-translate-y:-50%} .-translate-y-1\/2, .-translate-y-5{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-5{--tw-translate-y:-1.25rem} .-translate-y-6{--tw-translate-y:-1.5rem} .-translate-y-6, .translate-x-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .translate-x-1\/2{--tw-translate-x:50%} .translate-x-full{--tw-translate-x:100%} .translate-x-full,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .translate-y-0{--tw-translate-y:0px} .translate-y-4{--tw-translate-y:1rem} .-rotate-45, .translate-y-4{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-rotate-45{--tw-rotate:-45deg} .-rotate-\[120deg\]{--tw-rotate:-120deg} .-rotate-\[120deg\], .rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .rotate-180{--tw-rotate:180deg} .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} @keyframes ping{75%,to{transform:scale(2);opacity:0}} .animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite} @keyframes pulse{50%{opacity:.5}} .animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite} @keyframes spin{to{transform:rotate(1turn)}} .animate-spin{animation:spin 1s linear infinite} .cursor-default{cursor:default} .cursor-pointer{cursor:pointer} .select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none} .list-inside{list-style-position:inside} .list-disc{list-style-type:disc} .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))} .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .flex-col{flex-direction:column} .flex-wrap{flex-wrap:wrap} .items-start{align-items:flex-start} .items-end{align-items:flex-end} .items-center{align-items:center} .justify-start{justify-content:flex-start} .justify-end{justify-content:flex-end} .justify-center{justify-content:center} .justify-between{justify-content:space-between} .gap-1{gap:.25rem} .gap-10{gap:2.5rem} .gap-12{gap:3.5rem} .gap-15{gap:5rem} .gap-16{gap:6rem} .gap-2{gap:.5rem} .gap-3{gap:.75rem} .gap-4{gap:1rem} .gap-5{gap:1.25rem} .gap-6{gap:1.45rem} .gap-8{gap:2rem} .gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem} .gap-x-1\.5{-moz-column-gap:.375rem;column-gap:.375rem} .gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem} .gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem} .gap-x-4{-moz-column-gap:1rem;column-gap:1rem} .gap-x-5{-moz-column-gap:1.25rem;column-gap:1.25rem} .gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem} .gap-x-8{-moz-column-gap:2rem;column-gap:2rem} .gap-y-1{row-gap:.25rem} .gap-y-1\.5{row-gap:.375rem} .gap-y-10{row-gap:2.5rem} .gap-y-8{row-gap:2rem} .space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))} .space-y-10>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem*var(--tw-space-y-reverse))} .space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(3rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem*var(--tw-space-y-reverse))} .space-y-14>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(3.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3.5rem*var(--tw-space-y-reverse))} .space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))} .space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))} .space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem*var(--tw-space-y-reverse))} .space-y-7>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.75rem*var(--tw-space-y-reverse))} .space-y-8>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem*var(--tw-space-y-reverse))} .divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse))} .divide-dashed>:not([hidden])~:not([hidden]){border-style:dashed} .divide-border>:not([hidden])~:not([hidden]){border-color:hsl(var(--border))} .overflow-hidden{overflow:hidden} .overflow-x-auto{overflow-x:auto} .overflow-y-auto{overflow-y:auto} .overflow-x-hidden{overflow-x:hidden} .whitespace-nowrap{white-space:nowrap} .rounded-2xl{border-radius:1rem} .rounded-3xl{border-radius:1.5rem} .rounded-full{border-radius:9999px} .rounded-lg{border-radius:.5rem} .rounded-xl{border-radius:.75rem} .rounded-b-3xl{border-bottom-right-radius:1.5rem;border-bottom-left-radius:1.5rem} .rounded-l-2xl{border-top-left-radius:1rem;border-bottom-left-radius:1rem} .rounded-t-3xl{border-top-right-radius:1.5rem} .rounded-t-3xl,.rounded-tl-3xl{border-top-left-radius:1.5rem} .\!border-0{border-width:0!important} .border{border-width:1px} .border-0{border-width:0} .border-2{border-width:1.7px} .border-3{border-width:3px} .border-b{border-bottom-width:1px} .border-b-4{border-bottom-width:4px} .border-t{border-top-width:1px} .border-dashed{border-style:dashed} .border-border{border-color:#303030} .border-gray-900\/10{border-color:rgba(17,24,39,.1)} .border-primary{border-color:hsl(var(--primary))} .border-transparent{border-color:transparent} .border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))} .border-zinc-200{--tw-border-opacity:1;border-color:rgb(228 228 231/var(--tw-border-opacity,1))} .bg-background{background-color:hsl(var(--background))} .bg-background\/80{background-color:hsl(var(--background)/.8)} .bg-black\/10{background-color:rgba(0,0,0,.1)} .bg-black\/20{background-color:rgba(0,0,0,.2)} .bg-black\/70{background-color:rgba(0,0,0,.7)} .bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))} .bg-border{background-color:hsl(var(--border))} .bg-error{background-color:hsl(var(--error))} .bg-foreground{background-color:hsl(var(--foreground))} .bg-green-500{--tw-bg-opacity:1;background-color:rgb(30 165 70/var(--tw-bg-opacity,1))} .bg-green2-500{--tw-bg-opacity:1;background-color:rgb(28 94 86/var(--tw-bg-opacity,1))} .bg-green-500\/20{background-color:rgba(34,197,94,.2)} .bg-primary{background-color:hsl(var(--primary))} .bg-primary\/10{background-color:hsl(var(--primary)/.1)} .bg-red-500{--tw-bg-opacity:1;background-color:rgb(162 28 67/var(--tw-bg-opacity,1))} .bg-secondary{background-color:hsl(var(--secondary))} .bg-secondary\/80{background-color:hsl(var(--secondary)/.8)} .bg-success{background-color:hsl(var(--success))} .bg-transparent{background-color:transparent} .bg-zinc-200{--tw-bg-opacity:1;background-color:rgb(228 228 231/var(--tw-bg-opacity,1))} .bg-zinc-50{--tw-bg-opacity:1;background-color:rgb(250 250 250/var(--tw-bg-opacity,1))} .bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))} .bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))} .bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))} .bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))} .bg-learning{background-image:url(../images/theme/intro/learning.jpg)} .from-background{--tw-gradient-from:hsl(var(--background)) var(--tw-gradient-from-position);--tw-gradient-to:hsl(var(--background)/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)} .from-border{--tw-gradient-from:hsl(var(--border)) var(--tw-gradient-from-position);--tw-gradient-to:hsl(var(--border)/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)} .from-secondary{--tw-gradient-from:hsl(var(--secondary)) var(--tw-gradient-from-position);--tw-gradient-to:hsl(var(--secondary)/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)} .from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)} .to-background{--tw-gradient-to:hsl(var(--background)) var(--tw-gradient-to-position)} .to-cyan-300{--tw-gradient-to:#a21c43 var(--tw-gradient-to-position)} .to-secondary{--tw-gradient-to:hsl(var(--secondary)) var(--tw-gradient-to-position)} .to-yellow-300{--tw-gradient-to:#fde047 var(--tw-gradient-to-position)} .bg-cover{background-size:cover} .bg-center{background-position:50%} .fill-background{fill:hsl(var(--background))} .object-cover{-o-object-fit:cover;object-fit:cover} .p-1{padding:.25rem} .p-10{padding:2.5rem} .p-3{padding:.75rem} .p-2{padding:.5rem} .p-4{padding:1rem} .p-5{padding:1.25rem} .p-7{padding:1.15rem} .p-6{padding:1.5rem} .p-8{padding:2rem} .px-0{padding-left:.60rem;padding-right:.60rem} .px-1{padding-left:.25rem;padding-right:.25rem} .px-2{padding-left:.5rem;padding-right:.5rem} .px-3{padding-left:.75rem;padding-right:.75rem} .px-4{padding-left:1rem;padding-right:1rem} .px-5{padding-left:1.25rem;padding-right:1.25rem} .px-6{padding-left:1.5rem;padding-right:1.5rem} .px-8{padding-left:2rem;padding-right:2rem} .py-0{padding-top:-.3rem;padding-bottom:-3rem} .py-1{padding-top:.25rem;padding-bottom:.25rem} .py-10{padding-top:2.5rem;padding-bottom:2.5rem} .py-14{padding-top:3.5rem;padding-bottom:3.5rem} .py-16{padding-top:4rem;padding-bottom:4rem} .py-2{padding-top:.5rem;padding-bottom:.5rem} .py-2\.5{padding-top:.625rem;padding-bottom:.625rem} .py-20{padding-top:5rem;padding-bottom:5rem} .py-30{padding-top:10rem;padding-bottom:10rem} .py-3{padding-top:.75rem;padding-bottom:.75rem} .py-4{padding-top:1rem;padding-bottom:1rem} .py-5{padding-top:1.25rem;padding-bottom:1.25rem} .py-6{padding-top:1.5rem;padding-bottom:1.5rem} .pb-12{padding-bottom:3rem} .pb-20{padding-bottom:5rem} .pb-3{padding-bottom:.75rem} .pb-0{padding-bottom:0rem} .pb-32{padding-bottom:8rem} .pb-33{padding-bottom:15rem} .pb-5{padding-bottom:1.25rem} .pb-8{padding-bottom:2rem} .pr-10{padding-right:2.5rem} .pr-16{padding-right:4rem} .pr-5{padding-right:1.25rem} .pr-6{padding-right:1.85rem} .ps-1{padding-inline-start:.25rem} .pt-10{padding-top:2.5rem} .pt-12{padding-top:3rem} .pt-20{padding-top:5rem} .pt-2{padding-top:.5rem} .pt-3{padding-top:.75rem} .pt-5{padding-top:1.25rem} .pt-8{padding-top:2rem} .text-center{text-align:center} .text-right{text-align:right} .text-justify{text-align:justify} .text-start{text-align:start} .font-sans{font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji} .text-2xl{font-size:1.5rem;line-height:2rem} .text-3xl{font-size:1.875rem;line-height:2.25rem} .text-4xl{font-size:1.875rem;line-height:1rem} .text-xl{font-size:1.25rem;line-height:1.75rem} .text-base{font-size:1rem;line-height:1.5rem} .text-lg{font-size:1.125rem;line-height:1.75rem} .text-ssm{font-size:1rem;line-height:1.75rem} .text-sm{font-size:.875rem;line-height:1.25rem} .text-xs{font-size:.75rem;line-height:1rem} .text-xxs{font-size:.65rem} .font-black{font-weight:900} .font-bold{font-weight:700} .font-medium{font-weight:500} .font-semibold{font-weight:600} .uppercase{text-transform:uppercase} .italic{font-style:italic} .leading-6{line-height:1.5rem} .tracking-9{letter-spacing:.6em} .\!text-primary-foreground{color:hsl(var(--primary-foreground))!important} .text-background{color:hsl(var(--background))} .text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))} .text-blue-500{--tw-text-opacity:1;color:rgb(25 97 174/var(--tw-text-opacity,1))} .text-cyan-400{--tw-text-opacity:1;color:rgb(34 211 238/var(--tw-text-opacity,1))} .text-cyan-500{--tw-text-opacity:1;color:rgb(6 182 212/var(--tw-text-opacity,1))} .text-emerald-500{--tw-text-opacity:1;color:rgb(160 185 18/var(--tw-text-opacity,1))} .text-error{color:hsl(var(--error))} .text-error-foreground{color:hsl(var(--error-foreground))} .text-foreground{color:hsl(var(--foreground))} .text-green-500{--tw-text-opacity:1;color:rgb(28 94 86/var(--tw-text-opacity,1))} .text-green2-500{--tw-text-opacity:1;color:rgb(35 202 29/var(--tw-text-opacity,1))} .text-info{color:hsl(var(--info))} .text-muted{color:hsl(var(--muted))} .text-muted\/80{color:hsl(var(--muted)/.8)} .text-primary{color:hsl(var(--primary))} .text-primary-foreground{color:hsl(var(--primary-foreground))} .text-red-500{--tw-text-opacity:1;color:rgb(162 28 67/var(--tw-text-opacity,1))} .text-rose-500{--tw-text-opacity:1;color:rgb(244 63 94/var(--tw-text-opacity,1))} .text-jewel-500{--tw-text-opacity:1;color:rgb(28 94 86/var(--tw-text-opacity,1))} .text-success{color:hsl(var(--success))} .text-violet-500{--tw-text-opacity:1;color:rgb(139 92 246/var(--tw-text-opacity,1))} .text-warning{color:hsl(var(--warning))} .text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))} .text-yellow-500{--tw-text-opacity:1;color:rgb(234 179 8/var(--tw-text-opacity,1))} .text-zinc-400{--tw-text-opacity:1;color:rgb(161 161 170/var(--tw-text-opacity,1))} .underline{text-decoration-line:underline} .line-through{text-decoration-line:line-through} .underline-offset-1{text-underline-offset:1px} .opacity-0{opacity:0} .opacity-100{opacity:1} .opacity-35{opacity:.35} .opacity2-75{opacity:.75} .shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)} .shadow-2xl, .shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)} .shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)} .shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)} .shadow-black\/5{--tw-shadow-color:rgba(0,0,0,.05);--tw-shadow:var(--tw-shadow-colored)} .\!ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)!important;--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)!important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)!important} .\!ring-offset-0{--tw-ring-offset-width:0px!important} .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)} .backdrop-blur-xl{--tw-backdrop-blur:blur(24px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)} .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter; transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter; transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter; transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s} .transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}primary .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s} .transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s} .duration-1000{transition-duration:1s} .duration-200{transition-duration:.2s} .duration-300{transition-duration:.3s} .ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)} .ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}:root{--background:0 0% 100%;--foreground:240 10% 3.9%;--secondary:240 4.8% 95.9%;--secondary-foreground:240 5.9% 10%;--primary:224.3 76.3% 48%; --primary-foreground:0 0% 100%;--info:188.7 94.5% 42.7%;--info-foreground:0 0% 100%;--success:142.1 70.6% 45.3%;--success-foreground:0 0% 100%;--warning:45.4 93.4% 47.5%; --warning-foreground:0 0% 100%;--error:0 84.2% 60.2%;--error-foreground:0 0% 100%;--muted:215 13.8% 34.1%;--border:240 5.9% 90%;--radius:0.75rem}.dark{--background:0 0% 4.9%; --foreground:0 0% 100%;--secondary:240 10% 10%;--secondary-foreground:240 4.8% 95.9%;--primary:216.88 100% 59.61%;--primary-foreground:0 0% 100%;--info:196.4 63.6% 23.7%; --info-foreground:0 0% 100%;--success:142.8 64.2% 24.1%;--success-foreground:0 0% 100%;--warning:35.5 91.7% 32.9%;--warning-foreground:0 0% 100%;--error:0 62.8% 30.6%; --error-foreground:0 0% 100%;--muted:239.9 5.73% 64.3%;--border:240 3.7% 15.9%;--radius:0.75rem}.ql-editor{direction:rtl!important;text-align:right!important;font-family:YekanBakh;color:hsl(var(--foreground))} .ql-container.ql-snow,.ql-toolbar.ql-snow{border-color:hsl(var(--border))} .ql-toolbar.ql-snow .ql-formats{margin-left:15px;margin-right:0} .ql-snow .ql-picker-label{padding-right:8px;padding-left:2px} .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{left:0;right:auto} .ql-editor li,.ql-editor ol{padding-right:1.5em;padding-left:0} .ql-editor li>.ql-ui:before{margin-right:-1.5em;margin-left:.3em;text-align:left} .placeholder\:text-right::-moz-placeholder{text-align:right} .placeholder\:text-right::placeholder{text-align:right} .before\:absolute:before{content:var(--tw-content);position:absolute} .before\:inset-y-3:before{content:var(--tw-content);top:.75rem;bottom:.75rem} .before\:-bottom-1:before{content:var(--tw-content);bottom:-.25rem} .before\:-bottom-2:before{content:var(--tw-content);bottom:-.5rem} .before\:-right-2:before{content:var(--tw-content);right:-.5rem} .before\:-top-3:before{content:var(--tw-content);top:-.75rem} .before\:right-0:before{content:var(--tw-content);right:0} .before\:right-3:before{content:var(--tw-content);right:.75rem} .before\:right-8:before{content:var(--tw-content);right:2rem} .before\:me-1\.5:before{content:var(--tw-content);margin-inline-end:.375rem} .before\:inline-block:before{content:var(--tw-content);display:inline-block} .before\:size-1:before{width:.25rem} .before\:h-1:before, .before\:size-1:before{content:var(--tw-content);height:.25rem} .before\:h-1\.5:before{content:var(--tw-content);height:.375rem} .before\:h-6:before{content:var(--tw-content);height:1.5rem} .before\:h-\[calc\(100\%-24px\)\]:before{content:var(--tw-content);height:calc(100% - 24px)} .before\:w-1:before{content:var(--tw-content);width:.25rem} .before\:w-1\.5:before{content:var(--tw-content);width:.375rem} .before\:w-2\/3:before{content:var(--tw-content);width:66.666667%} .before\:w-6:before{content:var(--tw-content);width:1.5rem} .before\:w-px:before{content:var(--tw-content);width:1px} .before\:rounded-full:before{content:var(--tw-content);border-radius:9999px} .before\:bg-border:before{content:var(--tw-content);background-color:hsl(var(--border))} .before\:bg-green-500:before{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))} .before\:bg-info\/20:before{content:var(--tw-content);background-color:hsl(var(--info)/.2)} .before\:bg-muted\/50:before{content:var(--tw-content);background-color:hsl(var(--muted)/.5)} .before\:bg-primary:before{content:var(--tw-content);background-color:hsl(var(--primary))} .before\:bg-primary\/20:before{content:var(--tw-content);background-color:hsl(var(--primary)/.2)} .before\:bg-success\/20:before{content:var(--tw-content);background-color:hsl(var(--success)/.2)} .before\:bg-warning\/20:before{content:var(--tw-content);background-color:hsl(var(--warning)/.2)} .before\:bg-yellow-500:before{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(234 179 8/var(--tw-bg-opacity,1))} .before\:bg-zinc-200:before{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(228 228 231/var(--tw-bg-opacity,1))} .before\:ring:before{content:var(--tw-content);--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)} .before\:ring-green-200:before{content:var(--tw-content);--tw-ring-opacity:1;--tw-ring-color:rgb(187 247 208/var(--tw-ring-opacity,1))} .before\:ring-yellow-200:before{content:var(--tw-content);--tw-ring-opacity:1;--tw-ring-color:rgb(254 240 138/var(--tw-ring-opacity,1))} .before\:content-\[\'\'\]:before{--tw-content:"";content:var(--tw-content)}.after\:absolute:after{content:var(--tw-content);position:absolute} .after\:inset-x-0:after{content:var(--tw-content);left:0;right:0} .after\:bottom-0:after{content:var(--tw-content);bottom:0} .after\:bottom-9:after{content:var(--tw-content);bottom:2.25rem} .after\:left-0\.5:after{content:var(--tw-content);left:.125rem} .after\:right-8:after{content:var(--tw-content);right:2rem} .after\:top-0\.5:after{content:var(--tw-content);top:.125rem} .after\:h-3:after{content:var(--tw-content);height:.75rem} .after\:h-7:after{content:var(--tw-content);height:1.75rem} .after\:h-px:after{content:var(--tw-content);height:1px} .after\:w-3:after{content:var(--tw-content);width:.75rem} .after\:w-8:after{content:var(--tw-content);width:2rem} .after\:rounded-full:after{content:var(--tw-content);border-radius:9999px} .after\:bg-border:after{content:var(--tw-content);background-color:hsl(var(--border))} .after\:bg-gradient-to-b:after{content:var(--tw-content);background-image:linear-gradient(to bottom,var(--tw-gradient-stops))} .after\:from-transparent:after{content:var(--tw-content);--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to :transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.after\:to-secondary:after {content:var(--tw-content);--tw-gradient-to:hsl(var(--secondary)) var(--tw-gradient-to-position)} .after\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s} .after\:content-\[\'\'\]:after{--tw-content:"";content:var(--tw-content)} .odd\:bg-background:nth-child(odd){background-color:hsl(var(--background))} .odd\:bg-secondary:nth-child(odd){background-color:hsl(var(--secondary))} .even\:bg-background:nth-child(2n){background-color:hsl(var(--background))} .even\:bg-secondary\/50:nth-child(2n){background-color:hsl(var(--secondary)/.5)} .invalid\:\!border-error:invalid{border-color:hsl(var(--error))!important} .invalid\:\!text-error:invalid{color:hsl(var(--error))!important} .hover\:bg-background:hover{background-color:hsl(var(--background))} .hover\:bg-foreground:hover{background-color:hsl(var(--foreground))} .hover\:bg-primary:hover{background-color:hsl(var(--primary))} .hover\:bg-secondary:hover{background-color:hsl(var(--secondary))} .hover\:bg-green:hover{background-color:hsl(var(--success))} .hover\:\!text-blue-500:hover{--tw-text-opacity:1!important;color:rgb(59 130 246/var(--tw-text-opacity,1))!important} .hover\:text-background:hover{color:hsl(var(--background))} .hover\:text-black:hover{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))} .hover\:text-error:hover{color:hsl(var(--error))} .hover\:text-foreground:hover{color:hsl(var(--foreground))} .hover\:text-primary:hover{color:hsl(var(--primary))} .hover\:text-primary-foreground:hover{color:hsl(var(--primary-foreground))} .hover\:text-red-500:hover{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))} .hover\:text-red-700:hover{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))} .hover\:text-black-700:hover{--tw-text-opacity:1;color:rgb(19 18 18/var(--tw-text-opacity,1))} .hover\:text-violet-700:hover{--tw-text-opacity:1;color:rgb(199 18 160/var(--tw-text-opacity,1))} .hover\:text-green-700:hover{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))} .hover\:text-blue-700:hover{--tw-text-opacity:1;color:rgb(25 97 174/var(--tw-text-opacity,1))} .hover\:underline:hover{text-decoration-line:underline} .hover\:opacity-80:hover{opacity:.8} .hover\:before\:bg-primary:hover:before{content:var(--tw-content);background-color:hsl(var(--primary))} .focus\:border-0:focus{border-width:0} .focus\:border-border:focus{border-color:hsl(var(--border))} .focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px} .focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color) ;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)} .disabled\:text-muted:disabled{color:hsl(var(--muted))} .group:hover .group-hover\:visible,.group\/categories:hover .group-hover\/categories\:visible,.group\/submenu:hover .group-hover\/submenu\:visible{visibility:visible} .group\/nav-item:hover .group-hover\/nav-item\:w-4{width:1rem} .group\/submenu:hover .group-hover\/submenu\:rotate-180{--tw-rotate:180deg ;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .group\/nav-item:hover .group-hover\/nav-item\:bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))} .group:hover .group-hover\:opacity-100,.group\/categories:hover .group-hover\/categories\:opacity-100,.group\/submenu:hover .group-hover\/submenu\:opacity-100{opacity:1} .peer:checked~ .peer-checked\:border-primary{border-color:hsl(var(--primary))} .peer:checked~ .peer-checked\:bg-primary{background-color:hsl(var(--primary))} .peer:checked~ .peer-checked\:after\:left-\[26px\]:after{content:var(--tw-content);left:26px} .peer:checked~ .peer-checked\:after\:bg-background:after{content:var(--tw-content);background-color:hsl(var(--background))} .peer:invalid~ .peer-invalid\:block{display:block} .peer:focus~ .peer-focus\:outline-none{outline:2px solid transparent;outline-offset:2px} .dark\:border-zinc-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(39 39 42/var(--tw-border-opacity,1))} .dark\:bg-white\/10:is(.dark *){background-color:hsla(0,0%,100%,.1)} .dark\:bg-zinc-800:is(.dark *){--tw-bg-opacity:1;background-color:rgb(39 39 42/var(--tw-bg-opacity,1))} .dark\:bg-zinc-900:is(.dark *){--tw-bg-opacity:1;background-color:rgb(24 24 27/var(--tw-bg-opacity,1))} .dark\:to-cyan-800:is(.dark *){--tw-gradient-to:#155e75 var(--tw-gradient-to-position)} .dark\:to-yellow-800:is(.dark *){--tw-gradient-to:#854d0e var(--tw-gradient-to-position)} .dark\:text-white:is(.dark *){--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))} .dark\:before\:bg-zinc-900:is(.dark *):before{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(24 24 27/var(--tw-bg-opacity,1))} .dark\:before\:ring-green-700:is(.dark *):before{content:var(--tw-content);--tw-ring-opacity:1;--tw-ring-color:rgb(21 128 61/var(--tw-ring-opacity,1))} .dark\:before\:ring-green-800:is(.dark *):before{content:var(--tw-content);--tw-ring-opacity:1;--tw-ring-color:rgb(22 101 52/var(--tw-ring-opacity,1))} .dark\:before\:ring-yellow-800:is(.dark *):before{content:var(--tw-content);--tw-ring-opacity:1;--tw-ring-color:rgb(133 77 14/var(--tw-ring-opacity,1))} .dark\:hover\:text-white:hover:is(.dark *){--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))} .group\/nav-item:hover .dark\:group-hover\/nav-item\:bg-white:is(.dark *){--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))} @media (min-width:480px) {.xs\:flex{display:flex} .xs\:w-80{width:20rem} .xs\:text-2xl{font-size:1.5rem;line-height:2rem} .xs\:text-base{font-size:1rem;line-height:1.5rem}} .xs\:text-base1{font-size:0.85rem;line-height:1.5rem} .xs\:text-base2{font-size:0.8rem;line-height:1.5rem} .xs\:text-base3{font-size:0.7rem;line-height:1.5rem} @media (min-width:576px) {.sm\:col-span-2{grid-column:span 2/span 2} .sm\:col-span-3{grid-column:span 3/span 3} .sm\:mr-0{margin-right:0} .sm\:block{display:block} .sm\:flex{display:flex} .sm\:h-12{height:3rem} .sm\:h-9{height:2.25rem} .sm\:w-1\/2{width:50%} .sm\:w-4\/12{width:33.333333%} .sm\:w-8\/12{width:66.666667%} .sm\:w-9{width:2.25rem} .sm\:w-96{width:24rem} .sm\:w-auto{width:auto} .sm\:translate-y-0{--tw-translate-y:0px} .sm\:scale-100, .sm\:translate-y-0 {transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sm\:scale-100{--tw-scale-x:1;--tw-scale-y:1} .sm\:scale-95{--tw-scale-x:.95;--tw-scale-y:.95; transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))} .sm\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))} .sm\:flex-row{flex-direction:row} .sm\:flex-nowrap{flex-wrap:nowrap} .sm\:items-center{align-items:center} .sm\:justify-between{justify-content:space-between} .sm\:gap-3{gap:.75rem} .sm\:p-10{padding:2.5rem} .sm\:px-4{padding-left:1rem;padding-right:1rem} .sm\:pl-16{padding-left:4rem} .sm\:pr-8{padding-right:2rem} .sm\:text-5xl{font-size:3rem;line-height:1.3} .sm\:text-base{font-size:1rem;line-height:1.5rem}} @media (min-width:768px) {.md\:sticky{position:sticky} .md\:top-24{top:6rem} .md\:order-2{order:2} .md\:col-span-4{grid-column:span 4/span 4} .md\:col-span-5{grid-column:span 5/span 5} .md\:col-span-7{grid-column:span 7/span 7} .md\:col-span-8{grid-column:span 8/span 8} .md\:block{display:block} .md\:grid{display:grid} .md\:hidden{display:none} .md\:h-60{height:15rem} .md\:w-3\/12{width:25%} .md\:w-4\/12{width:33.333333%} .md\:w-5\/12{width:41.666667%} .md\:w-7\/12{width:58.333333%} .md\:w-72{width:18rem} .md\:w-8\/12{width:66.666667%} .md\:w-9\/12{width:75%} .md\:max-w-lg{max-width:32rem} .md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))} .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))} .md\:flex-row{flex-direction:row} .md\:flex-nowrap{flex-wrap:nowrap} .md\:items-center{align-items:center} .md\:gap-10{gap:2.5rem} .md\:gap-5{gap:1.25rem} .md\:space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0; margin-top:calc(0px*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px*var(--tw-space-y-reverse))} .md\:px-10{padding-left:2.5rem;padding-right:2.5rem} .md\:px-20{padding-left:5rem;padding-right:5rem} .md\:pb-10{padding-bottom:2.5rem} .md\:pb-48{padding-bottom:12rem} .md\:pt-20{padding-top:5rem}} @media (min-width:992px){.lg\:sticky{position:sticky} .lg\:top-24{top:6rem} .lg\:order-2{order:2} .lg\:col-span-3{grid-column:span 3/span 3} .lg\:col-span-9{grid-column:span 9/span 9} .lg\:mx-auto{margin-left:auto;margin-right:auto} .lg\:mb-0{margin-bottom:0} .lg\:block{display:block} .lg\:flex{display:flex} .lg\:inline-flex{display:inline-flex} .lg\:hidden{display:none} .lg\:w-1\/2{width:50%} .lg\:w-4\/12{width:33.333333%} .lg\:w-8\/12{width:66.666667%} .lg\:w-96{width:24rem} .lg\:max-w-3xl{max-width:48rem} .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))} .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))} .lg\:flex-row{flex-direction:row} .lg\:flex-col{flex-direction:column} .lg\:flex-nowrap{flex-wrap:nowrap} .lg\:items-center{align-items:center} .lg\:justify-center{justify-content:center} .lg\:gap-10{gap:2.5rem} .lg\:py-16{padding-top:4rem;padding-bottom:4rem}} .ltr\:right-3:where([dir=ltr],[dir=ltr] *){right:.75rem} .ltr\:-translate-x-full:where([dir=ltr],[dir=ltr] *) {--tw-translate-x:-100%;transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .ltr\:rotate-180:where([dir=ltr],[dir=ltr] *){--tw-rotate:180deg; transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .ltr\:pl-5:where([dir=ltr],[dir=ltr] *){padding-left:1.25rem} .ltr\:text-left:where([dir=ltr],[dir=ltr] *){text-align:left} .ltr\:before\:left-3:where([dir=ltr],[dir=ltr] *):before{content:var(--tw-content);left:.75rem} .rtl\:left-3:where([dir=rtl],[dir=rtl] *){left:.75rem} .rtl\:translate-x-full:where([dir=rtl],[dir=rtl] *) {--tw-translate-x:100%;transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .rtl\:pr-5:where([dir=rtl],[dir=rtl] *){padding-right:1.25rem} .rtl\:text-right:where([dir=rtl],[dir=rtl] *){text-align:right} .rtl\:before\:right-3:where([dir=rtl],[dir=rtl] *):before{content:var(--tw-content);right:.75rem} [x-cloak] { display: none !important; } html { scroll-behavior: smooth; /* optional: smooth scrolling */ } /* Make sure your main container uses full width without vw issues */ body, .container { width: 100%; /* avoids 100vw shifting issue */ box-sizing: border-box; /* includes padding/border in width */ margin: 0; /* reset default margins */ padding: 0; } /* Optional: prevent horizontal scroll */ body { overflow-x: hidden; } /* Searchbar */ .spectacledcoder-search-bar { width: 40px; height: 40px; background-color: white; display: flex; align-items: center; border-radius: 0 30px 30px 30px; transition: width .4s ease; box-shadow: 5px 5px 20px #a21c4244, -5px -5px 30px rgba(255, 255, 255, 0.336); overflow: hidden; position: relative; justify-content: right; } .spectacledcoder-search-bar:hover, .spectacledcoder-search-bar:focus-within { width: 200px; justify-content: flex-start; /* shift content when open */ } /* 3px left offset – keeps the element in the flow */ .move-left { transform: translateX(-6px); /* –6px on the X‑axis */ } .spectacledcoder-search-input { border: none; outline: none; font-family: 'YekanBakh', sans-serif; font-size: 12px; padding: 0 0px; opacity: 0; width: 0; background: transparent; direction: rtl; text-align: right; transition: width .3s ease, opacity .2s ease; } .spectacledcoder-search-bar:hover .spectacledcoder-search-input, .spectacledcoder-search-bar:focus-within .spectacledcoder-search-input { opacity: 1; width: 130%; } .spectacledcoder-search-input:focus, .spectacledcoder-search-input:focus-visible { outline: none !important; box-shadow: none !important; border: none !important; } /* Footer */ footer { direction: rtl; /* ensures RTL layout */ text-align: right; } .about-footer li { padding-right: 40px; /* flip padding from left to right */ padding-left: 0; } .about-footer li i { right: 0; /* move icon to the right */ left: auto; } .footer-logo td { padding-left: 4px !important; /* flip logo spacing */ padding-right: 0 !important; } ul.footer-social { float: left; /* float social icons to left for RTL */ } ul.footer-social li { margin-left: 16px; margin-right: 0; } footer .table td:first-child { padding-right: 33px; /* flip padding from left to right */ padding-left: 0; } footer .table td:last-child { text-align: left; /* align content for RTL */ } /* Floating Menu */ .fmb-container { position: fixed; bottom: 16px; left: 8%; transform: translateX(-50%); font-family: 'YekanBakh'; pointer-events: none; } .fmb-banner { background: #ffffff; border-radius: 50px; padding: 10px 10px; display: flex; align-items: center; gap: 15px; box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); backdrop-filter: blur(12px) saturate(180%); -webkit-backdrop-filter: blur(12px) saturate(180%); border: 1px solid rgba(255, 255, 255, 0.18); position: relative; will-change: transform; pointer-events: auto; } .fmb-gb-btn { width: auto; /* auto width to fit icon + text */ min-width: 60px; /* optional minimum width */ padding: 0 12px; /* left/right padding */ height: 40px; /* keep the height consistent */ gap: 8px; /* space between icon and text */ font-weight: 600; font-size: 0.9rem; transition: background 0.3s ease, transform 0.2s ease; } .fmb-gb-btn:hover { background-color: #a21c43; /* slightly darker on hover */ transform: translateY(-2px); } .fmb-gb-btn { width: auto; min-width: 60px; padding: 0 12px; height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 600; font-size: 0.9rem; color: #000; /* default text color */ transition: background 0.3s ease, transform 0.2s ease, color 0.3s ease; } .fmb-gb-btn svg { fill: currentColor; /* SVG inherits button text color */ transition: fill 0.3s ease; } .fmb-gb-btn:hover { background-color: #a21c43; /* hover background */ transform: translateY(-2px); color: #ffffff !important; /* force text to white */ } /* Pulse animation for subtle attention */ @keyframes pulse { 0% { box-shadow: 0 6px 16px rgba(255, 76, 59, 0.4); } 50% { box-shadow: 0 10px 24px rgba(255, 76, 59, 0.6); } 100% { box-shadow: 0 6px 16px rgba(255, 76, 59, 0.4); } } .fmb-gb-btn.attention { animation: pulse 2s infinite; } @media (max-width: 768px) { .fmb-menu { padding: 32px 28px; width: 210px; } .fmb-menu-link { font-size: 20px; } .fmb-menu-list { gap: 26px; } } @media (max-width: 480px) { .fmb-banner { padding: 10px 16px; gap: 12px; } .fmb-scroll-top { width: 42px; height: 42px; } .fmb-scroll-top svg { width: 18px; height: 18px; } .fmb-social-icon { width: 42px; height: 42px; } .fmb-social-icon svg { width: 20px; height: 20px; } .fmb-hamburger { width: 42px; height: 42px; } .fmb-hamburger-line { width: 24px; } .fmb-menu { padding: 28px 24px; width: 200px; bottom: 75px; } .fmb-menu-link { font-size: 18px; } .fmb-menu-list { gap: 24px; } } /* card border */ /* Animated conic-gradient border */ .box { --border-angle: 0turn; /* For spinning animation */ border: solid 5px transparent; /* Thickness of the border */ border-radius: 1.5rem; /* Matches rounded-3xl */ background: /* main background clipped to padding-box */ conic-gradient(from var(--border-angle), #213, #112 5%, #112 60%, #213 95%) padding-box, /* spinning border gradient */ conic-gradient(from var(--border-angle), transparent 25%, #08f, #f03 99%, transparent) border-box, /* fill behind the border */ conic-gradient(from var(--border-angle), #213, #112 5%, #112 60%, #213 95%) border-box; animation: bg-spin 8s linear infinite; } @keyframes bg-spin { to { --border-angle: 1turn; } } .box:hover { animation-play-state: paused; } /* Register custom property for animation */ @property --border-angle { syntax: ""; inherits: true; initial-value: 0turn; } /* Pop effect on hover */ .box { transition: transform 0.6s ease, box-shadow 0.6s ease; } .box:hover { transform: scale(1.05); /* Slightly larger */ box-shadow: 0 10px 20px rgba(0, 255, 255, 0.4), 0 0 40px rgba(255, 0, 255, 0.3), 0 0 60px rgba(0, 255, 255, 0.2); } /* news and articles slider */ .splide__slide { height: auto; } .splide__arrow { background: #a21c43; width: 40px; height: 40px; opacity: 1; } .splide__arrow svg { fill: white; width: 18px; height: 18px; } .splide__arrow:hover { opacity: .8; } .splide__arrow--prev { right: -50px; left: auto; } .splide__arrow--next { left: -50px; right: auto; } /* Partial preview spacing */ .splide__slide { opacity: .5; transition: opacity .3s; } .splide__slide.is-active { opacity: 1; } /* Optional: flip arrow icons if they got mirrored */ .splide__arrow svg { transform: scaleX(1); /* keeps icon from flipping */ } .splide__arrow { background: white; box-shadow: 0 4px 12px rgba(0,0,0,0.15); border-radius: 50%; } .splide__slide button { margin: 0; } .splide__slide { width: auto !important; } .sub-tabs { background: linear-gradient( 90deg, #e4e4e7, #f4f4f5, #e4e4e7 ); background-size: 200% 100%; background-position: left; transition: background-position 0.6s ease; } .sub-tabs:hover { background-position: right; } /* subtabs animation */ @keyframes bg-pulse { 0%, 100% { background-color: #a21c425d; } 50% { background-color: #a21c43; } } .bg-pulse-gold { animation: bg-pulse 2.5s infinite; border-radius: 0.5rem; /* match button rounding */ } #series-dropdown { /* Example: position anywhere on screen */ top: 200px; /* distance from top of page */ left: 500px; /* distance from left of page */ opacity: 1; /* make it visible initially */ visibility: visible; } /* depatments container */ body { background: #EEE; overflow-x:hidden; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } .container { max-width: 100%; width: auto; } @media only screen and (min-width: 1200px) { .container { width: 1210px; } } @media only screen and (min-width: 960px) and (max-width: 1199px) { .container { width: 1030px; } } @media only screen and (min-width: 768px) and (max-width: 959px) { .container { width: 682px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .container { width: 428px; margin: 0 auto; } } @media only screen and (max-width: 479px) { .container { width: 320px; margin: 0 auto; } } .mcd-menu { list-style: none; direction: rtl; padding: 0; margin: 0; background: #FFF; height: auto; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .mcd-menu li { float: right; position: relative; } .mcd-menu li a { display: block; text-decoration: none; padding: 10px 13px; text-align: center; color: #000000; border-right: 1px solid #E7E7E7; } .mcd-menu li a svg { margin: 0 auto; /* Center the SVG horizontally */ width: 24px; height: 24px; display: inline-block; vertical-align: middle; } .mcd-menu li a strong { display: block; margin-top: 5px; } .mcd-menu li a small { display: block; font-size: 13.7px; margin-top: 2px; } /* Shrink all submenu fonts */ .mcd-menu li ul li a { font-size: 12px; /* adjust as needed */ } .mcd-menu li ul li a svg { font-size: 12px; /* adjust icon size */ margin-left: 5px; } .mcd-menu li a svg, .mcd-menu li a strong, .mcd-menu li a small { position: relative; transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; -moz-transition: all 300ms linear; -webkit-transition: all 300ms linear; } .mcd-menu li:hover > a svg { opacity: 1; -webkit-animation: moveFromTop 300ms ease-in-out; -moz-animation: moveFromTop 300ms ease-in-out; -ms-animation: moveFromTop 300ms ease-in-out; -o-animation: moveFromTop 300ms ease-in-out; animation: moveFromTop 300ms ease-in-out; } .mcd-menu li:hover a strong { opacity: 1; -webkit-animation: moveFromLeft 300ms ease-in-out; -moz-animation: moveFromLeft 300ms ease-in-out; -ms-animation: moveFromLeft 300ms ease-in-out; -o-animation: moveFromLeft 300ms ease-in-out; animation: moveFromLeft 300ms ease-in-out; } .mcd-menu li:hover a small { opacity: 1; -webkit-animation: moveFromRight 300ms ease-in-out; -moz-animation: moveFromRight 300ms ease-in-out; -ms-animation: moveFromRight 300ms ease-in-out; -o-animation: moveFromRight 300ms ease-in-out; animation: moveFromRight 300ms ease-in-out; } /* Animations */ @keyframes moveFromTop { from { transform: translateY(-20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @keyframes moveFromLeft { from { transform: translateX(20px); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes moveFromRight { from { transform: translateX(-20px); opacity: 0; } to { transform: translateX(0); opacity: 1; } } .mcd-menu li ul, .mcd-menu li ul li ul { position: absolute; height: auto; min-width: max-content; padding: 0; margin: 0; background: #FFF; border-top: 4px solid #a21c43; opacity: 0; visibility: hidden; transition: all 300ms linear; -o-transition: all 300ms linear; -ms-transition: all 300ms linear; -moz-transition: all 300ms linear; -webkit-transition: all 300ms linear; top: 130px; z-index: 1000; } .mcd-menu li ul:before { content: ""; position: absolute; top: -16px; left: 23%; border-bottom: 5px solid #a21c43; border-left: 5px solid transparent; border-right: 5px solid transparent; } .mcd-menu li:hover > ul, .mcd-menu li ul li:hover > ul { display: block; opacity: 1; visibility: visible; top: 100px; } .mcd-menu li ul li { float: none; } .mcd-menu li ul li a { padding: 10px; text-align: left; border: 0; border-bottom: 1px solid #EEE; } .mcd-menu li ul li a i { font-size: 16px; display: inline-block; margin: 0 10px 0 0; } .mcd-menu li ul li ul { left: 230px; top: 0; border: 0; border-left: 4px solid #a21c43; } .mcd-menu li ul li ul:before { content: ""; position: absolute; top: 15px; left: -14px; border-right: 5px solid #a21c43; border-bottom: 5px solid transparent; border-top: 5px solid transparent; } .mcd-menu li ul li:hover > ul { top: 0px; left: 200px; } @media only screen and (min-width: 768px) and (max-width: 959px) { .mcd-menu { height: 85px; } .mcd-menu li a { padding: 12px; } .mcd-menu li a i { font-size: 22px; } .mcd-menu li a strong { font-size: 12px; } .mcd-menu li a small { font-size: 10px; } .mcd-menu li a.search { display:none; } .search-mobile { display:block !important; margin: 20px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } .mcd-menu li:hover > ul { top:85px; min-width:180px; } .mcd-menu li ul li > ul { min-width:150px; left:200px; top:0; } .mcd-menu li ul li:hover > ul { min-width:150px; left:180px; top:0; } .mcd-menu li ul li ul li ul { min-width:150px; left:25px !important; top:54px; border:0; border-top:3px solid #a21c43; } .mcd-menu li ul li ul li:hover ul { top:35px; } .mcd-menu li ul li ul li ul:before { border:0; border-bottom:5px solid #a21c43; border-left:5px solid transparent; border-right:5px solid transparent; left:10%; top:-8px; } .mcd-menu li:hover ul a { font-size:12px; } .mcd-menu li:hover ul a i { font-size:14px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .mcd-menu { height: 42px; position: relative; } .mcd-menu li a { padding: 12px 17.7px; } .mcd-menu li a strong, .mcd-menu li a small, .mcd-menu li a.search { display: none; } .mcd-menu li a i { margin: 0; font-size: 18px; } .mcd-menu li { position: static; } .mcd-menu li ul { min-width: 100%; left: 0; top: 50px; } .mcd-menu li:hover > ul { top: 42px; } .mcd-menu li > ul:before { border:0; } .mcd-menu li ul > li { position: relative; } .mcd-menu li ul li:hover > ul { left:34px; } .mcd-menu li a { position: relative; font-size:12px; } .mcd-menu li a:hover strong,.mcd-menu li a.active strong { display:block; font-size:10px; padding:3px 0; position:absolute; top:-20px; left:0; background:#e67e22; color:#FFF; min-width:100%; text-transform:lowercase; font-weight:normal; } .mcd-menu li a.active:before{ left: 40%; } .search-mobile { display:block !important; } .mcd-menu li ul li > ul { min-width:200px; left:200px; } .mcd-menu li ul li:hover ul { left:180px; } .mcd-menu li ul li ul:before { left:-9px; } .mcd-menu li ul li ul li ul { min-width:200px; border:0; border-top:3px solid #e67e22; left:25px !important; top: 45px; } .mcd-menu li ul li ul li:hover ul { top:40px; } .mcd-menu li ul li ul li ul:before { border:0; border-bottom:5px solid #e67e22; border-left:5px solid transparent; border-right:5px solid transparent; left:10%; top:-8px; } } @media only screen and (max-width: 479px) { .mcd-menu { height: 42px; position: relative; } .mcd-menu li a strong, .mcd-menu li a small, .mcd-menu li a.search { display: none; } .mcd-menu li a { padding: 12px 13.8px; font-size:12px; } .mcd-menu li a i { margin: 0; font-size: 18px; } .mcd-menu li { position: static; } .mcd-menu li ul { min-width: 100%; left: 0; top: 50px; } .mcd-menu li:hover > ul { top: 42px; } .mcd-menu li > ul:before { border:0; } .mcd-menu li ul > li { position: relative; } .mcd-menu li ul li:hover > ul { left:34px; } .mcd-menu li a { position: relative; } .mcd-menu li a:hover strong,.mcd-menu li a.active strong { display:block; font-size:10px; padding:3px 0; position:absolute; top:-20px; left:0; background:#e67e22; color:#FFF; min-width:100%; text-transform:lowercase; font-weight:normal; } .mcd-menu li a.active:before{ left: 40%; } .mcd-menu li ul li > ul { min-width:150px; left:160px; } .mcd-menu li ul li:hover ul { left:120px; } .mcd-menu li ul li ul:before { left:-9px; } .mcd-menu li ul li ul li ul { min-width:160px; left:25px !important; top:39px; border:0; border-top:3px solid #e67e22; } .mcd-menu li ul li ul li:hover ul { top:39px; } .mcd-menu li ul li ul li ul:before { border:0; border-bottom:5px solid #e67e22; border-left:5px solid transparent; border-right:5px solid transparent; left:10%; top:-8px; } } /* Make entire menu RTL */ .mcd-menu, .mcd-menu ul { direction: rtl; text-align: right; } /* Fix first dropdown position */ .mcd-menu li ul { right: 0; left: auto; } /* Fix nested dropdown position */ .mcd-menu li ul li ul { right: 101%; /* same value as old left */ left: auto; } /* Fix arrow position */ .mcd-menu li ul:before { right: 23%; left: auto; } .mcd-menu li ul li ul:before { right: -14px; left: auto; } /* Make submenu RTL */ .mcd-menu li ul li a { direction: rtl; text-align: right; } /* Move icon to correct side */ .mcd-menu li ul li a i { margin: 0 0 0 10px; /* space on left instead of right */ } .dropdown-shift { right: -175px; } /* ringing animation */ .phone-button { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.5rem 1rem; height: 44px; background-color: #111; /* foreground */ color: #fff; /* text */ border-radius: 9999px; text-decoration: none; transition: opacity 0.2s ease; } .phone-button:hover { opacity: 0.8; } .phone-icon { width: 1rem; height: 1rem; display: inline-block; transform-origin: top center; /* pivot from top now */ animation: ring-top 0.9s ease-in-out infinite; } @keyframes ring-top { 0%, 100% { transform: rotate(0deg); } 25% { transform: rotate(15deg); } 75% { transform: rotate(-15deg); } } /* wiggle animation */ .arrow { display: inline-block; transition: transform 0.3s ease-in-out; /* smooth transition */ } /* Move diagonally up-left on hover of the button */ a:hover .arrow { transform: translate(-5px, -5px); /* 5px left, 5px up */ } /* scroll to top animation */ html { scroll-behavior: smooth; } /* Guidance Slider Config */ /* Add a gap between slider and static image */ .slider-with-gap { padding-right: 16.3333%; /* same as w-1/3 of static image */ } /* Optional: ensure last slider item doesn't go under the image */ .slider-with-gap .slider-item:last-child { margin-right: 1rem; /* extra breathing space */ } /* Bigger gap on mobile */ @media (max-width: 767px) { .slider-with-gap { padding-right: 50%; /* increase as needed */ } } /* Add this in your global CSS file or inside