:root{--color-bg-page:#202027;--color-bg-surface:#13132099;--color-bg-elevated:#14141f;--color-text-primary:#fff;--color-text-secondary:#abadba;--color-text-tertiary:#787a87;--color-accent-solid:#e67300;--color-image-outline:#ffffff1a;--radius-lg:1.25rem;--radius-md:.875rem;--radius-sm:.5rem;--space-page:clamp(1rem, 3vw, 2rem);--space-group:clamp(1.5rem, 4vw, 3rem);--space-item:.75rem;--max:72rem;--card-min:14rem;--ease-out:cubic-bezier(.2, 0, 0, 1);--shadow-sm:0 1px 2px #0000003d;--shadow-md:0 4px 12px #00000047, 0 1px 2px #0003;--shadow-lg:0 12px 32px #0000005c, 0 2px 6px #0003;color:var(--color-text-primary);background:var(--color-bg-page);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Vazirmatn,system-ui,sans-serif;line-height:1.65}*,:before,:after{box-sizing:border-box}*{scrollbar-width:thin;scrollbar-color:var(--color-accent-solid) transparent}body{margin:0}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}.site-shell{flex-direction:column;min-height:100dvh;display:flex}.site-main{flex:1}.container{width:min(var(--max), 100% - var(--space-page) * 2);padding-inline:var(--space-page);margin-inline:auto}.skip{inset-inline-start:var(--space-page);z-index:200;background:var(--color-accent-solid);color:var(--color-text-primary);border-radius:var(--radius-sm);transition:top .15s var(--ease-out);padding:.5rem 1rem;position:absolute;top:-100%;&:focus{top:var(--space-page)}}.hero{min-height:min(72vh,40rem);padding-block:var(--space-group);display:grid;position:relative;overflow:clip;& .hero-bg{object-fit:cover;object-position:center 40%;outline:1px solid var(--color-image-outline);outline-offset:-1px;width:100%;height:100%;position:absolute;inset:0}&:after{content:"";inset-inline:0;background:linear-gradient(to top in hsl, var(--color-bg-page), hsl(from var(--color-bg-page) h s l / 0));z-index:1;pointer-events:none;height:6rem;position:absolute;bottom:0}& .hero-inner{z-index:2;grid-template-columns:1fr auto;grid-template-areas:"tagline brand""desc brand";align-content:start;align-items:start;gap:.75rem clamp(1rem,2vw,2rem);width:100%;max-width:none;margin-inline:0;padding-block-end:.5rem;display:grid;position:relative;@media (width<40rem){grid-template-columns:1fr;grid-template-areas:"brand""tagline""desc"}}& .hero-brand{width:fit-content;transition:opacity .15s var(--ease-out);filter:drop-shadow(0 1px #161616);grid-area:brand;place-self:center left;align-items:center;gap:.85rem;display:flex;&:hover{opacity:.85}& img{object-fit:contain;width:auto;height:clamp(4.25rem,2.5rem + 6.5vw,10rem)}}& .hero-tagline{letter-spacing:-.02em;max-width:18ch;color:var(--color-accent-solid);text-shadow:2px 2px 1px #000,2px 2px 1px #000,3px 3px 1px #000,1px 3px 1px #000,0 0 2px #000;grid-area:tagline;margin:clamp(1.25rem,4vw,3rem) 0 0;font-size:clamp(2rem,1.1rem + 3.8vw,5rem);font-weight:700;line-height:1.2}& .hero-desc{color:#000;text-shadow:1px 1px 2px #fff,-1px 1px 2px #fff,1px -1px 2px #fff,-1px -1px 2px #fff;grid-area:desc;max-width:60ch;margin:0;font-size:clamp(1.125rem,.85rem + .9vw,2rem);font-weight:700}}.products-section{padding-block:var(--space-group);min-height:100dvh}.section-title{letter-spacing:-.02em;margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:700}.filter-scroll{z-index:50;width:100%;min-width:0;background:color-mix(in hsl, var(--color-bg-page) 28%, transparent);backdrop-filter:blur(1.25rem)saturate(1.35);user-select:none;margin-block-end:var(--space-group);scroll-margin-top:0;position:sticky;top:0;&.is-scrollable{cursor:grab;& .filter-chip{cursor:grab}}&.is-dragging{cursor:grabbing;& .filter-chip{pointer-events:none;cursor:grabbing}}}.filter-bar{--filter-fade:3rem;--chip-glow:1.2rem;overscroll-behavior-x:contain;scrollbar-width:none;width:100%;min-width:0;padding-block:calc(var(--chip-glow) + .25rem);scroll-padding-inline:var(--filter-fade);mask-image:linear-gradient(to right, transparent, white var(--filter-fade), white calc(100% - var(--filter-fade)), transparent);touch-action:pan-x;flex-wrap:nowrap;justify-content:safe center;gap:.8rem;display:flex;overflow:auto hidden;mask-size:100% 100%;mask-repeat:no-repeat;mask-mode:alpha;&:before,&:after{content:"";flex:0 0 var(--filter-fade);pointer-events:none}&::-webkit-scrollbar{display:none}& .filter-chip{background:var(--color-bg-surface);min-height:2.25rem;color:var(--color-text-secondary);font:inherit;scroll-margin-inline:var(--filter-fade);cursor:pointer;transition:color .15s var(--ease-out), background-color .15s var(--ease-out), box-shadow .15s var(--ease-out);border:none;border-radius:16px;flex:none;align-items:center;padding:.375rem .875rem;font-size:1rem;font-weight:600;text-decoration:none;display:inline-flex;box-shadow:0 1px 2px #0006;&:hover{color:var(--color-text-primary);background:var(--color-bg-page)}&.active{color:#000;background:var(--color-accent-solid);box-shadow:0 0 var(--chip-glow) var(--color-accent-solid);outline:solid 3px var(--color-accent-solid);outline-offset:3px}}}.products{grid-template-columns:repeat(auto-fill, minmax(min(100%, var(--card-min)), 1fr));gap:var(--space-group);display:grid}.card{background:var(--color-bg-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow .2s var(--ease-out), transform .2s var(--ease-out);&:hover{box-shadow:var(--shadow-lg);color:var(--color-accent-solid);transform:translateY(-3px)}&:focus-within{outline:2px solid var(--color-accent-solid);outline-offset:3px}& .card-link{border-radius:inherit;display:grid;&:active{transform:scale(.98)}}& .card-media{padding:var(--space-item);border-radius:calc(var(--radius-lg) - var(--space-item));padding-block-end:0;overflow:clip;& img{aspect-ratio:4/3;object-fit:cover;outline:1px solid var(--color-image-outline);outline-offset:-1px;pointer-events:none;width:100%;display:block}}& h2{line-clamp:2;min-height:2lh;margin:0;padding:1rem 1.125rem 1.125rem;font-size:1.125rem;font-weight:600;line-height:1.35;overflow:hidden}}.product-page{padding-block:var(--space-group)}.back{background:var(--color-bg-surface);border-radius:var(--radius-sm);color:var(--color-text-secondary);box-shadow:var(--shadow-sm);transition:color .15s var(--ease-out), background-color .15s var(--ease-out), transform .15s var(--ease-out);align-items:center;margin-block-end:var(--space-group);padding:.5rem .875rem;font-size:.875rem;font-weight:600;display:inline-flex;&:hover{color:var(--color-accent-solid);background:var(--color-bg-elevated)}&:active{transform:scale(.96)}}.product-detail{gap:var(--space-group);grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));align-items:start;display:grid;& .product-media{border-radius:var(--radius-lg);outline:1px solid var(--color-image-outline);outline-offset:-1px;box-shadow:var(--shadow-md);overflow:clip;& img{pointer-events:none;user-select:none;width:100%;display:block}}& h1{color:var(--color-accent-solid);letter-spacing:-.02em;margin:0 0 1rem;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700}& dl{background:var(--color-bg-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);grid-template-columns:auto 1fr;gap:.625rem 1.25rem;margin:0 0 1.5rem;padding:1.125rem;display:grid}& dt{color:var(--color-text-tertiary);font-size:.875rem}& dd{color:var(--color-accent-solid);font-variant-numeric:tabular-nums;margin:0;font-weight:600}& .tags{flex-wrap:wrap;gap:.375rem;display:flex;& span{border-radius:var(--radius-sm);background:var(--color-bg-elevated);padding:.125rem .5rem;font-size:.8125rem;font-weight:500}}& .prose{color:var(--color-text-secondary);& p{margin:0 0 1rem}& strong{color:var(--color-text-primary)}}}.site-footer{background:var(--color-bg-surface);box-shadow:0 -4px 24px var(--color-bg-elevated);margin-top:auto;padding-block:1.25rem;& .footer-inner{scrollbar-width:none;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:1rem 1.5rem;display:flex;overflow-x:auto;&>*{flex-shrink:0}}& .footer-brand{align-items:center;gap:.75rem;display:flex;& a{transition:color .15s var(--ease-out), opacity .15s var(--ease-out);align-items:center;display:flex;&:hover{color:var(--color-accent-solid)}&:has(img):hover{color:inherit;opacity:.85}& img{object-fit:contain;mix-blend-mode:lighten;width:auto;height:clamp(2rem,6vw,3rem)}}}& .footer-email,& .footer-phones a{color:var(--color-text-secondary);white-space:nowrap;transition:color .15s var(--ease-out), background-size .28s var(--ease-out);background-image:linear-gradient(currentColor,currentColor),radial-gradient(circle closest-side,currentColor 90%,#0000 91%);background-position:0 100%;background-repeat:no-repeat,repeat-x;background-size:0% .09em,.28em .09em;padding-block-end:.2em;text-decoration:none;&:hover,&:focus-visible{color:var(--color-accent-solid);background-size:100% .09em,.28em .09em}}& .footer-email{text-transform:lowercase;font-size:1.0625rem;line-height:1.35}& .footer-phones{font-variant-numeric:tabular-nums;flex-wrap:nowrap;align-items:center;gap:1.25rem;margin:0;font-size:1.0625rem;font-style:normal;line-height:1.35;display:flex}& .footer-social{direction:ltr;flex-wrap:nowrap;align-items:start;gap:.75rem;display:flex;& .footer-handle{color:var(--color-text-secondary);white-space:nowrap;font-size:.9375rem;font-weight:600}& .footer-icons{flex-wrap:nowrap;align-items:center;gap:.75rem;display:flex;& a{color:var(--color-text-secondary);transition:color .15s var(--ease-out);display:flex;&:hover{color:var(--brand,var(--color-accent-solid))}}& svg{fill:currentColor;width:1.25rem;height:1.25rem}}}@media (width<=48rem){padding-block:2rem;& .footer-inner{text-align:center;flex-flow:column wrap;align-items:center;row-gap:1rem;overflow-x:visible;&>*{flex-shrink:1;min-width:0}}& .footer-phones{flex-wrap:wrap;justify-content:center}& .footer-social{justify-content:center;& .footer-handle{white-space:normal}}& .footer-email{white-space:normal;overflow-wrap:anywhere}}}.faq-section{padding-block:var(--space-group);& details{background:var(--color-bg-surface);border-radius:var(--radius-md);margin-block-end:.75rem;padding:1rem}& summary{cursor:pointer;font-weight:600}& p{color:var(--color-text-secondary);margin:.75rem 0 0}}:is(.hero-brand,.filter-bar .filter-chip,.back,.footer-brand a,.footer-email,.footer-phones a,.footer-icons a):focus-visible{outline:2px solid var(--color-accent-solid);outline-offset:3px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:no-preference){@view-transition{navigation:auto}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}