/* Arabic is the default storefront language. Preserve the original logo/artwork. */
@font-face{font-family:'IBM Plex Sans Arabic';src:url('assets/fonts/ibm-400.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Sans Arabic';src:url('assets/fonts/ibm-500.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'IBM Plex Sans Arabic';src:url('assets/fonts/ibm-700.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
:root{--font-ar:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;--muted:#626272}
html{scroll-padding-block-end:90px}
body{font-family:var(--font-ar);font-size:16px;line-height:1.7;text-align:start;font-synthesis:none}
button,input,select,textarea{font-family:var(--font-ar);line-height:1.6}
button,input,select,textarea,p,span,b,h1,h2,h3,small{letter-spacing:normal!important}
button,a{touch-action:manipulation}
button{font-weight:500}
h1,h2,h3,b,strong{font-weight:700}
input,select,textarea{font-size:16px}
select{max-inline-size:100%}
input::placeholder{color:#72727e;opacity:1}
.icon-arrow{transform:scaleX(-1)}
/* The chevron is downward-facing: its vertical direction stays unchanged. */
.topbar{font-size:13px;line-height:1.65;padding-block:9px}
.topbar button{font-size:13px;line-height:1.65;min-block-size:30px}
.top-message span{padding-left:0;padding-inline-start:13px}
.header-main{min-block-size:112px;height:auto;padding-block:18px;gap:24px}
.brand{gap:12px}
.brand-word{font-family:var(--font-ar);font-size:28px;line-height:1.25;font-weight:700}
.brand-word span{font-family:var(--font-ar);font-size:11px;line-height:1.6;font-weight:400;margin-block-start:6px}
.search{height:50px;margin-left:0;margin-inline-start:8px}
.search input{font-size:16px;padding-inline:12px;line-height:1.6}
.search button{min-inline-size:44px}
.header-icon{text-align:start;font-size:16px;line-height:1.5;gap:9px}
.header-icon small{font-size:13px;line-height:1.5;margin-block-start:3px;color:#666674}
.cart-count{right:auto;inset-inline-end:-7px;min-inline-size:20px;block-size:20px;font-size:12px;line-height:1;font-weight:700}
.bag-total{unicode-bidi:isolate;white-space:nowrap}
.money{unicode-bidi:isolate;white-space:nowrap}
.header-nav{min-block-size:54px;height:auto;gap:20px}
.header-nav nav{gap:28px;min-block-size:54px}
.header-nav nav button{font-size:16px;line-height:1.6;min-block-size:48px;white-space:nowrap}
.location{font-size:15px;min-block-size:44px;flex-shrink:0}
.location svg{inline-size:18px;block-size:18px}
.hero{min-block-size:430px}
.hero-copy{padding:38px 42px 28px}
.eyebrow,.muted{font-size:13px;font-weight:500;line-height:1.7}
.muted{color:#696977}
.hero h1{font-family:var(--font-ar);font-size:clamp(38px,4.1vw,56px);font-weight:700;line-height:1.35;margin-block:16px}
.hero h1 em{font-family:var(--font-ar);font-weight:700;font-style:normal}
.hero p{font-size:17px;line-height:1.9;color:#62626d;margin-block-end:22px}
.primary{font-size:16px;font-weight:500;line-height:1.6;min-block-size:48px;padding:12px 20px;gap:16px}
.primary svg{inline-size:20px;block-size:20px}
.hero-foot{font-size:13px;line-height:1.7;color:#66665e;margin-block-start:20px}
.hero-sticker{right:auto;inset-inline-end:27px;inline-size:112px;block-size:112px;line-height:1.55;font-size:15px;font-weight:700;padding:12px;transform:rotate(-9deg)}
.hero-sticker span{font-size:20px;line-height:1.1}
.hero-image-label{left:auto;inset-inline-start:35px}
.hero-image-label>span{font-size:13px;line-height:1.7;margin-block-end:7px}
.hero-image-label b{font:500 30px/1.55 var(--font-ar)}
.hero-pagination{right:auto;inset-inline-end:26px}
.benefits{gap:12px;padding-block:25px}
.benefits>div{border-right:0;border-inline-end:1px solid var(--line);padding-inline-end:12px}
.benefits>div:last-child{border-inline-end:0;padding-inline-end:0}
.benefits b{font-size:16px;font-weight:500;line-height:1.6}
.benefits small{font-size:13px;line-height:1.7;color:#626272}
.benefits svg{flex-shrink:0}
.section-heading{align-items:flex-end;flex-wrap:wrap;gap:12px}
.section-heading>div{min-inline-size:0}
.section-heading h2{font:700 28px/1.5 var(--font-ar);margin-block-start:6px}
.text-button{font-size:16px;min-block-size:44px;line-height:1.6}
.category{font-size:16px;font-weight:500;line-height:1.6;justify-content:flex-start}
.category>span:last-child{min-block-size:26px;text-align:center;justify-content:center}
.category svg{inline-size:16px;block-size:16px}
.sample-label{font-size:13px;line-height:1.6;color:#636373;padding:5px 9px}
.shop-controls{flex-wrap:wrap;gap:12px}
.filter-pills{min-inline-size:0;max-inline-size:100%;padding-block:2px}
.filter-pills button{font-size:16px;line-height:1.6;min-block-size:44px;padding:8px 15px}
.filter-pills svg{inline-size:16px;block-size:16px}
.sort-label{margin-inline-start:auto}
.sort-label select{font-size:16px;line-height:1.6;min-block-size:44px;max-width:none;max-inline-size:270px;padding:7px;color:#626272}
.save-button{right:auto;inset-inline-end:9px;inline-size:40px;block-size:40px}
.save-button svg{inline-size:19px;block-size:19px}
.badge{left:auto;inset-inline-start:10px;font-size:12px;line-height:1.6;font-weight:500;max-inline-size:calc(100% - 20px)}
.product-brand{text-transform:none;font-size:13px;line-height:1.6;color:#666675;unicode-bidi:isolate}
.product-title{text-align:start;font-size:16px;line-height:1.65;font-weight:500;margin-block:6px 8px}
.price{font-size:20px;line-height:1.5;font-weight:700;unicode-bidi:isolate;white-space:nowrap}
.price small{font-size:13px;line-height:1.5;font-weight:400}
.price-row{gap:8px}
.add-button{inline-size:40px;block-size:40px;flex-shrink:0}
.add-button svg{inline-size:18px;block-size:18px}
.delivery-note{font-size:13px;line-height:1.6;color:#666675;align-items:flex-start;gap:6px}
.delivery-note svg{inline-size:15px;block-size:15px;flex-shrink:0;margin-block-start:3px}
.community-banner .eyebrow{font-size:13px;line-height:1.7}
.community-banner h2{font:700 36px/1.4 var(--font-ar);margin-block:12px}
.community-banner p{font-size:16px;line-height:1.8;color:#d4d5e9}
.community-banner .primary{margin-left:0;margin-inline-start:auto}
.footer-main{font-size:16px;line-height:1.7}
.footer-brand{font-size:30px;font-weight:400;line-height:1.5}
.footer-brand b,.footer-main>div>b{font-weight:700}
.footer-main p{font-size:14px;line-height:1.85;color:#666675}
.footer-main button{font-size:16px;line-height:1.7;min-block-size:44px;color:#626272;padding-block:8px}
.footer-bottom{font-size:13px;line-height:1.7;color:#666675;gap:12px;flex-wrap:wrap}
#active-filters{font-size:15px;line-height:1.7}
#active-filters button{margin-left:0;margin-inline-start:10px;min-block-size:44px}
.empty p{font-size:16px;line-height:1.8}
.empty h3{font-size:22px;line-height:1.5}
.toast{font-size:16px;line-height:1.7}
.close-dialog{right:auto;inset-inline-end:16px;inline-size:44px;block-size:44px}
.detail-copy{padding:54px 30px 30px}
.detail-copy h2{font:700 30px/1.5 var(--font-ar)}
.detail-copy p{font-size:16px;line-height:1.85;color:#626272}
.detail-copy .price{font-size:26px}
.detail-facts div{font-size:14px;line-height:1.8;align-items:flex-start;color:#626272}
.detail-facts svg{flex-shrink:0;margin-block-start:4px}
.cart-dialog{margin:0;margin-inline-start:auto;inline-size:510px}
.drawer-header{gap:16px}
.drawer-header h2{font-size:27px;line-height:1.5}
.drawer-header h2 span{font-size:17px;unicode-bidi:isolate}
.icon-button{min-inline-size:44px;min-block-size:44px}
.cart-group h3{font-size:17px;line-height:1.6;flex-wrap:wrap}
.cart-item{gap:12px}
.cart-item>div{min-inline-size:0}
.cart-item-name{font-size:16px;line-height:1.6}
.cart-item .product-brand{font-size:13px;line-height:1.6}
.cart-item-price{font-size:16px;line-height:1.6;font-weight:500;white-space:nowrap;unicode-bidi:isolate}
.quantity{font-size:16px;line-height:1.5;gap:10px}
.quantity button{inline-size:40px;block-size:40px}
.quantity svg{inline-size:15px;block-size:15px}
.remove-item{font-size:14px;line-height:1.7;color:#666675;margin-left:0;margin-inline-start:auto;min-block-size:44px}
.delivery-select{flex-wrap:wrap;gap:8px 14px}
.delivery-select label{font-size:16px;line-height:1.6}
.delivery-select select{font-size:16px;line-height:1.6;min-block-size:44px;max-width:none;max-inline-size:100%;flex:1;min-inline-size:165px}
.group-explain{font-size:14px;line-height:1.8;color:#626272}
.summary-row{font-size:16px;line-height:1.7;gap:14px}
.summary-row>span:last-child,.summary-row>b:last-child{unicode-bidi:isolate}
.summary-row.total{font-size:22px;line-height:1.6}
.fee-note,.demo-note{font-size:14px;line-height:1.85;color:#626272}
.demo-note{color:#535a42}
.info-content h2{font:700 29px/1.5 var(--font-ar);padding-right:0;padding-inline-end:30px}
.info-content p{font-size:16px;line-height:1.85;color:#626272}
.info-content h3{font-size:20px;line-height:1.5}
.field{font-size:16px;line-height:1.7}
.field input,.field select,.field textarea{font:400 16px/1.6 var(--font-ar);text-align:start;min-block-size:48px}
.order-card b{font-size:16px;line-height:1.6;unicode-bidi:isolate}
.order-card .sample-label{float:inline-end;margin-inline-start:8px}
.order-card p{clear:both;overflow-wrap:anywhere}
.order-id{font-weight:700;overflow-wrap:anywhere}
.maker{text-align:start;min-inline-size:0}
.maker b{font-size:17px;line-height:1.6}
.maker small{font-size:14px;line-height:1.7;color:#626272}

@media(min-width:1500px){.hero-copy{padding-block-start:48px}}
@media(max-width:1150px){
 .header-main{gap:20px}.brand-word{font-size:26px}.brand-word span{font-size:10px}.search{margin-inline-start:0}
 .hero-copy{padding:32px}.hero h1{font-size:46px}.hero{min-block-size:430px}.header-nav nav{gap:23px}
 .benefits b{font-size:15px}.benefits small{font-size:12px}.community-banner{gap:24px}
}
@media(max-width:900px) and (min-width:761px){
 .header-nav nav{gap:20px;overflow:auto;scrollbar-width:none;min-inline-size:0}.header-nav nav button{font-size:15px}
 .hero-copy{padding:30px 26px}.hero h1{font-size:40px}.hero p{font-size:16px}.hero-foot{font-size:12px}
 .community-symbol{font-size:100px}.community-banner{padding:32px 28px;flex-wrap:wrap}.community-banner h2{font-size:31px}
 .community-banner .primary{margin-inline-start:auto}.footer-main{gap:22px}
}
@media(max-width:760px){
 .topbar{padding:8px 18px;font-size:13px}.top-message{font-size:13px}.top-message span{padding-inline-start:8px}
 .header-main{min-block-size:130px;padding-block:12px;gap:13px;grid-template-columns:minmax(0,1fr) auto}
 .brand{gap:10px;min-inline-size:0}.brand-word{font-size:26px}.brand-word span{font-size:10px;line-height:1.5}
 .logo-image{flex-shrink:0}.search{height:48px;margin:0;min-inline-size:0}.search input{font-size:16px}.search button{width:44px}
 .header-icon.cart-button{font-size:16px;padding:8px}.header-nav{min-block-size:50px;height:auto;gap:14px}
 .header-nav nav{min-block-size:50px;gap:21px}.header-nav nav button{font-size:15px;min-block-size:48px}.location{font-size:14px}
 .hero{min-block-size:0;grid-template-columns:1fr;margin-block-start:18px}.hero-copy{padding:28px 26px 24px}
 .hero .eyebrow{font-size:13px;line-height:1.7;gap:8px}.hero .eyebrow i{inline-size:6px;block-size:6px}
 .hero h1{font-size:42px;line-height:1.35;margin-block:14px}.hero p{font-size:16px;line-height:1.85;margin-block-end:20px}
 .hero .primary{font-size:16px;line-height:1.6;min-block-size:48px;padding:12px 18px;gap:15px}.hero .primary svg{inline-size:20px;block-size:20px}
 .hero-foot{font-size:13px;line-height:1.7;margin-block-start:18px;gap:8px}.mini-spark{font-size:24px}
 .hero-visual{min-block-size:235px}.hero-sticker{inline-size:98px;block-size:98px;top:18px;right:auto;inset-inline-end:19px;font-size:13px;padding:10px;line-height:1.55}
 .hero-sticker span{font-size:19px}.hero-image-label{left:auto;inset-inline-start:24px;bottom:25px}.hero-image-label b{font-size:27px;line-height:1.5}
 .hero-image-label>span{font-size:12px;line-height:1.7}.hero-pagination{right:auto;inset-inline-end:19px;bottom:15px}
 .benefits{padding-block:20px;gap:10px}.benefits>div{flex-direction:column;align-items:flex-start;gap:7px;padding-right:0;padding-inline-end:8px}
 .benefits b{font-size:13px;line-height:1.7;font-weight:500}.benefits svg{inline-size:22px;block-size:22px}
 .section-heading{gap:10px;margin-block-end:18px}.section-heading h2{font-size:25px;line-height:1.5}.section-heading .eyebrow{font-size:12px;line-height:1.7}
 .text-button{font-size:15px;line-height:1.6;gap:7px}.category-section{padding-block:27px}
 .categories{grid-template-columns:repeat(6,96px);gap:14px;padding-block:4px 10px}.category-photo{block-size:96px}
 .category{font-size:15px;line-height:1.6;gap:9px}.category>span:last-child{min-block-size:48px;align-items:flex-start}
 .filter-pills{gap:7px}.filter-pills button{font-size:15px;min-block-size:44px;padding:8px 14px}
 .sort-label{margin-left:0;margin-inline-start:auto}.sort-label select{font-size:16px;min-block-size:44px;padding:6px;max-inline-size:100%}
 .sample-label{font-size:12px;line-height:1.6;padding:5px 8px}.product-grid{gap:23px 12px}.product-meta{padding-block-start:10px}
 .product-title{font-size:16px;line-height:1.65}.product-brand{font-size:13px;line-height:1.6}.price{font-size:19px}.price small{font-size:12px}
 .badge{left:auto;inset-inline-start:8px;bottom:8px;font-size:12px;line-height:1.6;padding:4px 6px;max-inline-size:calc(100% - 16px)}
 .save-button{inline-size:40px;block-size:40px}.delivery-note{font-size:12px;line-height:1.7}
 .community-banner{padding:26px 23px;gap:18px}.community-symbol{font-size:65px;align-self:flex-start;margin-block-start:10px}
 .community-banner>div:nth-child(2){min-inline-size:0}.community-banner .eyebrow{font-size:12px;line-height:1.7}
 .community-banner h2{font-size:31px;line-height:1.45}.community-banner p{font-size:16px;line-height:1.85}
 .community-banner .primary{margin-left:0;margin-inline-start:0;font-size:16px;line-height:1.6;min-block-size:48px;padding:12px 18px}
 .footer-main{gap:24px;font-size:16px}.footer-main p{font-size:14px}.footer-main button{font-size:16px}.footer-bottom{font-size:12px;line-height:1.8;flex-direction:column;align-items:flex-start;gap:5px;padding-block-end:105px}
 .mobile-nav{padding-block:10px max(10px,env(safe-area-inset-bottom));padding-inline:6px}.mobile-nav button{font-size:13px;line-height:1.5;min-inline-size:48px;min-block-size:50px;gap:5px}
 .mobile-nav .cart-count{font-size:11px;inline-size:18px;block-size:18px;min-inline-size:18px}.toast{font-size:15px;line-height:1.7;bottom:95px}
 .detail-copy{padding:25px}.detail-copy h2{font-size:27px;line-height:1.5}.detail-copy p{font-size:16px}.detail-image{block-size:300px;min-block-size:0}
 .info-content{padding:44px 22px 26px}.info-content h2{font-size:27px;line-height:1.5;padding-inline-end:20px}
 .cart-dialog{width:100%;inline-size:100%;padding-block-end:env(safe-area-inset-bottom)}.drawer-header{padding-block:22px}.drawer-header h2{font-size:25px}
 .cart-item{grid-template-columns:56px minmax(0,1fr);gap:10px 13px}.cart-item img{inline-size:56px;block-size:72px}
 .cart-item>div:last-child{grid-column:2;display:flex;justify-content:space-between;align-items:center;gap:12px}.cart-item-name{font-size:16px}
 .cart-item-price{font-size:16px}.remove-item{margin:0;padding-block:8px}.quantity button{inline-size:40px;block-size:40px}
 .delivery-select{align-items:flex-start}.delivery-select select{flex-basis:100%;inline-size:100%}.summary-row{font-size:16px}.summary-row.total{font-size:22px}
 .maker-list{gap:10px}.maker{padding:15px}.maker b{font-size:16px}.maker small{font-size:13px}.order-card .sample-label{float:none;display:table;margin-inline-start:0;margin-block-start:6px}
}
@media(max-width:375px){
 .hero-copy{padding:25px 22px}.hero h1{font-size:39px}.hero p,.hero .primary{font-size:16px}.hero{min-block-size:0}
 .hero-image-label b{font-size:26px}.benefits{gap:8px}.benefits b{font-size:12px;line-height:1.75}.section-heading h2{font-size:24px}
 .community-banner{padding:24px 18px}.community-symbol{display:none}.community-banner .primary{margin-inline-start:0}.header-nav nav{gap:18px}
 .price{font-size:16px}.price-row{gap:4px}.price small{font-size:11px}.mobile-nav button{font-size:12px}.brand-word span{font-size:9px}
}
@media(max-width:760px){.save-button,.add-button{inline-size:44px;block-size:44px}.quantity button{inline-size:44px;block-size:44px}.header-nav nav{gap:14px}}