/* WordPress glue: block content inside our pages, admin bar, screen-reader text, focus rings, skip link. */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;z-index:1000;inset-inline-start:8px;top:8px;background:var(--white);color:var(--ink);padding:12px 16px;border:2px solid var(--ink)}
.dir-b a:focus-visible,.dir-b button:focus-visible,.dir-b input:focus-visible,.dir-b select:focus-visible,.dir-b textarea:focus-visible{outline:3px solid var(--steel);outline-offset:2px}
.dir-b a{cursor:pointer}
.dir-b .head{position:relative;z-index:40}
.dir-b .head .logo .custom-logo{width:100%;height:100%;object-fit:contain}
.dir-b .nav a:hover{color:var(--white)}
.dir-b .acts a{display:inline-flex;align-items:center;color:inherit}
.dir-b .acts .cart{color:var(--white)}
.dir-b .util a{color:inherit}
.dir-b .util .ar,.dir-b .langsw .ar,.dir-b .lang-m{font-family:'IBM Plex Sans Arabic',sans-serif}
.dir-b .util .en{font-family:'Archivo Narrow',sans-serif}
/* Phone menu (drawer below the header) */
.dir-b .mnav{display:none;position:fixed;inset:0;top:var(--mnav-top,118px);z-index:39;overflow-y:auto;min-height:0}
body.menu-open{overflow:hidden}
body.menu-open .mnav{display:block}
.dir-b .head .menu-btn,.dir-b .head .x{width:44px;height:44px;display:grid;place-items:center}
.dir-b .head .menu-btn{background:var(--ember);color:var(--ink)}
.dir-b .head .x{display:none!important}
body.menu-open .head .x{display:grid!important}
body.menu-open .head .menu-btn{display:none!important}
.dir-b .mnav .links a i{display:flex}
.dir-b .mnav .quick a{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border:1px solid var(--line-d);font-family:'Archivo Narrow',sans-serif;font-weight:600;font-size:14px;letter-spacing:.07em;text-transform:uppercase}
.dir-b .langsw a{min-height:48px;display:grid;place-items:center;font-weight:600;font-size:15px;color:var(--mute-d)}
.dir-b .langsw a.on{background:var(--white);color:var(--ink)}
.dir-b .mnav .contact a{color:inherit}
@media (min-width:1280px){body.menu-open .mnav{display:none}}
/* Search panel */
.dir-b .search-panel{display:none;background:var(--iron);border-top:1px solid var(--line-d)}
.dir-b .search-panel.open{display:block}
.dir-b .search-panel form{display:flex;gap:8px;padding:16px 0}
.dir-b .search-panel .btn{flex:none}
.dir-b .search-panel input[type=search]{flex:1;min-width:0;width:100%;min-height:52px;border:1px solid var(--line-d);background:var(--ink);color:var(--white);padding:0 16px;font:inherit}
/* Cookie notice (fixed): a compact bar; the title button opens the text and privacy link (.open) */
.dir-b .cookie{position:fixed;display:none;gap:20px;padding:14px 20px}
.dir-b .cookie.show{display:grid}
.dir-b .cookie .ic{width:40px;height:40px}
.dir-b .cookie-toggle{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:4px 0;color:inherit;font:inherit;cursor:pointer;text-align:start}
.dir-b .cookie-toggle b{font-size:16px}
.dir-b .cookie-toggle .i-sm{transition:transform .2s}
.dir-b .cookie.open .cookie-toggle .i-sm{transform:rotate(180deg)}
.dir-b .cookie p[hidden]{display:none}
.dir-b .cookie p{font-size:14px}
@media (max-width:1023px){
  .dir-b .cookie{inset-inline:12px;bottom:12px;gap:10px;padding:12px 14px}
  .dir-b .cookie-toggle{width:100%;justify-content:space-between;min-height:32px}
  .dir-b .cookie-toggle b{font-size:15px}
  .dir-b .cookie .ctas{flex-direction:row;gap:8px}
  .dir-b .cookie .btn{flex:1 1 0;width:auto;min-height:44px;padding:0 10px;font-size:13px;letter-spacing:.04em;white-space:normal;text-align:center}
}
/* Generic page content from the block editor (policies, simple pages) */
.dir-b .entry{max-width:780px}
.dir-b .entry>*+*{margin-top:1em}
.dir-b .entry h2{font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:32px;line-height:1.05;margin-top:56px;padding-top:24px;border-top:3px solid var(--ink)}
.dir-b .entry h3{font-family:'Archivo',sans-serif;font-stretch:112%;font-weight:800;text-transform:uppercase;font-size:20px;margin-top:32px}
.dir-b .entry p,.dir-b .entry li{font-size:17px;line-height:1.7;color:#3b3935}
.dir-b .entry ul{list-style:square;padding-inline-start:1.2em}
.dir-b .entry ol{list-style:decimal;padding-inline-start:1.2em}
.dir-b .entry a{text-decoration:underline;text-underline-offset:3px}
.dir-b.rtl .entry h2,.dir-b.rtl .entry h3{font-family:'Noto Kufi Arabic',sans-serif;font-weight:700;font-stretch:100%;text-transform:none;letter-spacing:0;line-height:1.4}
.dir-b.rtl .entry p,.dir-b.rtl .entry li{line-height:1.9}
/* Section blocks stack with no gaps */
.dir-b .blocks>*{margin-block:0}
.dir-b img{height:auto}
.dir-b img.cover{height:100%}
/* WordPress admin bar offset for the fixed phone menu */
.admin-bar .dir-b .mnav{top:calc(var(--mnav-top,118px) + 46px)}
/* Search results */
.dir-b .search-results{display:grid;gap:12px;max-width:820px}
.dir-b .search-hit{display:flex;gap:16px;align-items:center;background:var(--white);border:1px solid var(--line);padding:12px}
.dir-b .search-hit .ph{width:72px;height:72px;flex:none;background:var(--conc)}
.dir-b .search-hit b{display:block;font-size:17px}
.dir-b .accl .q{width:100%;text-align:start}
.dir-b.rtl .mnav .links svg{transform:scaleX(-1)}
/* Small phones (320–380px): the header and the home cards fit without sideways scrolling */
@media (max-width:1023px){
	.dir-b .door>*{min-width:0}
	.dir-b .door h3{overflow-wrap:break-word}
	.dir-b .doors{grid-template-columns:minmax(0,1fr)}
	.dir-b .cart-empty-box{grid-template-columns:minmax(0,1fr)}
	.dir-b .cart-empty-box .btn{white-space:normal;text-align:center}
	/* Rows that run past the screen edge swipe sideways (about "How we work", related pieces, chips, tabs) */
	.dir-b .proc,.dir-b .more3,.dir-b .chips,.dir-b .tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}
	.dir-b .proc::-webkit-scrollbar,.dir-b .more3::-webkit-scrollbar,.dir-b .chips::-webkit-scrollbar,.dir-b .tabs::-webkit-scrollbar{display:none}
	.dir-b .proc,.dir-b .more3{scroll-snap-type:x mandatory;padding-inline-end:20px}
	.dir-b .proc>*,.dir-b .more3>*{scroll-snap-align:start}
	.dir-b .chips>*{flex:none}
	.dir-b .ahero .top,.dir-b .maker{grid-template-columns:minmax(0,1fr)}
	.dir-b .ahero .h1{overflow-wrap:break-word}
	.dir-b .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
	.dir-b .stats b{font-size:clamp(32px,11vw,44px)}
}
@media (max-width:380px){
	.dir-b .head .wrap{gap:8px}
	.dir-b .logo{font-size:17px;gap:8px}
	.dir-b .head .logo-mark{width:36px;height:36px}
	.dir-b .acts{gap:6px}
	.dir-b .lang-m,.dir-b .menu{width:40px!important;height:40px!important}
	.dir-b .cart{height:40px;padding:0 8px;gap:6px}
	.dir-b .door .ph{width:96px}
	.dir-b .door h3{font-size:17px}
	.dir-b .cart-empty-box{padding:20px}
}
/* Small laptops and tablets in landscape (1024–1279px): the desktop layout, made fluid; the main menu sits behind
   the menu button, as the seven links don't fit beside the logo and actions */
@media (min-width:1024px) and (max-width:1279px){
	.wrap{padding:0 40px}
	.dir-b .head .nav{display:none!important}
	.dir-b .head .menu-btn{display:grid!important}
	.dir-b .acts{margin-inline-start:auto;gap:16px}
	.dir-b .hero .wrap{grid-template-columns:minmax(0,1fr) 380px;gap:48px}
	.dir-b .hero h1{font-size:68px}
	.dir-b .shop{grid-template-columns:240px minmax(0,1fr);gap:32px}
	.dir-b .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
	.dir-b .pgrid.g3{grid-template-columns:repeat(2,minmax(0,1fr))}
	.dir-b .phead .row2>*{min-width:0}
	.dir-b .phead .row2>:first-child{flex:1 1 auto}
	.dir-b .phead .row2>:last-child{flex:0 1 380px}
	.dir-b .phead .h1,.dir-b .phero .h1{font-size:clamp(40px,4.8vw,60px);overflow-wrap:normal}
	.dir-b .doors,.dir-b .cgrid,.dir-b .types,.dir-b .proc,.dir-b .vals{min-width:0}
}
/* Tablets in portrait (700–1023px): the phone layout, with three tools per row */
@media (min-width:700px) and (max-width:1023px){
	.dir-b .pgrid,.dir-b .pgrid.g3,.dir-b .pgrid.g4{grid-template-columns:repeat(3,minmax(0,1fr))}
}
