:root{
--ink:#0B1230; --ink2:#1B2A6B; --brand:#4B6BFF; --brand2:#93A7FF; --brand3:#8B5CF6;
--warm:#F3C77B; --onBrand:#fff; --surface:#F6F5F2; --card:#fff;
--line:#E7E3DC; --muted:#5D6785; --ok:#2E9E6B;
}
:root{
--s1:8px; --s2:12px; --s3:16px; --s4:24px; --s5:32px; --s6:48px; --s7:72px; --s8:96px;
--r-xs:8px; --r-sm:12px; --r:16px; --r-lg:20px; --r-xl:28px; --r-full:999px;
--maxw:1180px;
--deck:0px;
}
[data-theme="indigo"]{
--ink:#0B1230; --ink2:#1B2A6B; --brand:#4B6BFF; --brand2:#93A7FF; --brand3:#8B5CF6;
--warm:#F3C77B; --onBrand:#fff; --surface:#F6F5F2; --card:#fff;
--line:#E7E3DC; --muted:#5D6785; --ok:#2E9E6B;
}
[data-theme="ink"]{
--ink:#0A1F33; --ink2:#123A5A; --brand:#0E9A94; --brand2:#4FCFC4; --brand3:#2BB3D4;
--warm:#F0C27B; --onBrand:#fff; --surface:#F7F6F3; --card:#fff;
--line:#E8E4DC; --muted:#647686; --ok:#2E9E6B;
}
[data-theme="gold"]{
--ink:#0C2340; --ink2:#1A4271; --brand:#D9A521; --brand2:#F2CF6B; --brand3:#EFC65A;
--warm:#7FA8CF; --onBrand:#0C2340; --surface:#F8F6F1; --card:#fff;
--line:#E9E3D6; --muted:#5E7086; --ok:#2E9E6B;
}
[data-theme="emerald"]{
--ink:#0C231F; --ink2:#154239; --brand:#1E8F62; --brand2:#5DC496; --brand3:#3FB98A;
--warm:#EFC57E; --onBrand:#fff; --surface:#F5F7F3; --card:#fff;
--line:#E1E6DC; --muted:#5C6F67; --ok:#1E8F62;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:calc(var(--deck) + 88px)}
#chromeTop{display:contents}
body{
margin:0; background:var(--surface); color:var(--ink);
font-family:"IBM Plex Sans Arabic","SF Arabic","Geeza Pro","Segoe UI",Tahoma,sans-serif;
font-size:16px; line-height:1.8; -webkit-font-smoothing:antialiased;
--grad:linear-gradient(135deg, var(--brand), var(--brand3));
--sh-1:0 1px 2px color-mix(in srgb,var(--ink) 7%,transparent), 0 4px 14px color-mix(in srgb,var(--ink) 6%,transparent);
--sh-2:0 2px 6px color-mix(in srgb,var(--ink) 8%,transparent), 0 18px 44px color-mix(in srgb,var(--ink) 13%,transparent);
--sh-3:0 30px 70px color-mix(in srgb,var(--ink) 22%,transparent);
}
h1,h2,h3,h4,.display{font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif; font-weight:800; line-height:1.25; margin:0; letter-spacing:-.01em}
p{margin:0} a{color:inherit; text-decoration:none}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}
.num{font-variant-numeric:tabular-nums; direction:ltr; display:inline-block}
.lat{font-family:"Plus Jakarta Sans","IBM Plex Sans Arabic",sans-serif; direction:ltr;unicode-bidi:isolate}
.hide{display:none !important}
.logo{display:flex; align-items:center; gap:12px}
.logo svg{display:block; flex:none}
.logo .markuse{width:auto}
.logo--rev svg, .logo--mono svg{fill:#fff}
.logo--brand svg{fill:var(--onBrand)}
.tape-in svg{fill:var(--onBrand)}
.lg-badge{fill:var(--ink)} .lg-fg{fill:#fff} .lg-fold{fill:#fff; opacity:.42}
.lg-stroke{stroke:#fff; fill:none; stroke-linecap:round; stroke-linejoin:round}
.lg-ring{stroke:var(--ink); fill:none; stroke-linecap:round}
.lg-dot{fill:var(--brand)}
.logo--rev .lg-badge{fill:#fff} .logo--rev .lg-fg,.logo--rev .lg-fold{fill:var(--ink)}
.logo--rev .lg-stroke{stroke:var(--ink)} .logo--rev .lg-ring{stroke:#fff}
.logo--brand .lg-badge{fill:var(--brand)} .logo--brand .lg-fg,.logo--brand .lg-fold{fill:var(--onBrand)}
.logo--brand .lg-stroke{stroke:var(--onBrand)} .logo--brand .lg-ring{stroke:var(--onBrand)}
.logo--brand .lg-dot{fill:var(--onBrand); opacity:.5}
.logo--mono .lg-badge{fill:#111} .logo--mono .lg-ring{stroke:#111} .logo--mono .lg-dot{fill:#fff}
.logo--mono .lg-fg,.logo--mono .lg-fold{fill:#fff} .logo--mono .lg-stroke{stroke:#fff}
.logo-txt{display:flex; flex-direction:column; line-height:1}
.logo-txt b{font-family:"Tajawal",sans-serif; font-weight:800; font-size:20px; letter-spacing:-.02em}
.logo-txt span{font-family:"Plus Jakarta Sans",sans-serif; font-size:10px; font-weight:700; letter-spacing:.24em;
color:var(--muted); direction:ltr; text-align:right; margin-top:4px}
.logo--rev .logo-txt b{color:#fff} .logo--rev .logo-txt span{color:rgba(255,255,255,.6)}
.logo--lat .logo-txt b{font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; letter-spacing:-.01em; direction:ltr; text-align:left}
.logo--lat .logo-txt span{font-family:"Tajawal",sans-serif; letter-spacing:0; font-size:11.5px; direction:rtl; text-align:left}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:13px 24px; border-radius:100px;
border:1px solid transparent; font-family:"Tajawal",sans-serif; font-weight:700; font-size:15.5px; cursor:pointer;
white-space:nowrap; transition:transform .18s cubic-bezier(.2,.8,.3,1), box-shadow .18s, background .18s, color .18s}
.btn:hover{transform:translateY(-2px)}
.btn-brand{background:var(--brand); color:var(--onBrand); box-shadow:0 8px 22px -8px var(--brand)}
.btn-ink{background:var(--ink); color:#fff}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-light{background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.25)}
.btn-light:hover{background:rgba(255,255,255,.18)}
.btn-sm{padding:9px 17px; font-size:14px}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--brand);
background:color-mix(in srgb,var(--brand) 11%,transparent); padding:6px 14px; border-radius:100px; margin-bottom:18px}
.eyebrow::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--brand)}
.sec{padding:92px 0}
.sec-head{max-width:660px; margin-bottom:50px}
.sec-head h2{font-size:clamp(28px,3.6vw,42px); margin-bottom:14px}
.sec-head p{color:var(--muted); font-size:17px}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1)}
.chip{display:inline-flex; align-items:center; gap:7px; padding:7px 14px; border-radius:100px; background:var(--card);
border:1px solid var(--line); font-size:13.5px; font-weight:600; color:var(--ink2)}
.dim{color:var(--muted)}
html.barid-js [data-reveal]{opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.3,1)}
html.barid-js [data-reveal].in{opacity:1; transform:none}
.il-bg{fill:color-mix(in srgb,var(--brand) 9%,var(--card))} .il-floor{fill:color-mix(in srgb,var(--ink) 9%,transparent)}
.il-ink{fill:var(--ink)} .il-ink2{fill:var(--ink2)} .il-brand{fill:var(--brand)} .il-brand2{fill:var(--brand2)}
.il-soft{fill:color-mix(in srgb,var(--ink) 16%,transparent)} .il-w{fill:#fff}
.il-s{stroke:var(--ink); fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round}
.il-sb{stroke:var(--brand); fill:none; stroke-width:2.4; stroke-linecap:round}
.frame{border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--card); display:block; position:relative}
.frame svg{display:block; width:100%; height:auto}
.frame-cap{padding:14px 18px; font-size:13.5px; color:var(--muted); border-top:1px solid var(--line); display:flex; align-items:center; gap:8px}
.frame-cap b{color:var(--ink); font-family:"Tajawal",sans-serif; font-size:14.5px}
.deck{position:fixed; inset-block-start:0; inset-inline:0; z-index:130; background:rgba(11,18,48,.95);
backdrop-filter:blur(14px); color:#fff; border-bottom:1px solid rgba(255,255,255,.1)}
.topbar{background:var(--ink); color:rgba(255,255,255,.85); font-size:13.5px}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; padding-block:9px; gap:14px; flex-wrap:wrap}
.topbar b{color:var(--brand2); font-weight:700}
header.nav{position:sticky; top:var(--deck); z-index:60; background:color-mix(in srgb,var(--surface) 84%,transparent);
backdrop-filter:blur(16px); border-bottom:1px solid var(--line)}
.nav-in{display:flex; align-items:center; gap:26px; padding-block:13px}
.nav-links{display:flex; gap:22px; font-size:14.5px; font-weight:600; color:var(--ink2)}
.nav-links a{position:relative; transition:color .2s; cursor:pointer}
.nav-links a::after{content:""; position:absolute; inset-inline:0; bottom:-5px; height:2px; background:var(--brand);
border-radius:2px; transform:scaleX(0); transition:transform .25s}
.nav-links a:hover{color:var(--brand)} .nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{margin-inline-start:auto; display:flex; gap:10px; align-items:center}
.has-mega{position:relative}
.has-mega>a::before{content:""; position:absolute; inset-inline:-10px; top:100%; height:18px}
.mega{position:absolute; top:calc(100% + 16px); inset-inline-start:50%; transform:translateX(50%) translateY(10px);
width:min(720px,88vw); background:var(--card); border:1px solid var(--line); border-radius:22px;
box-shadow:var(--sh-2); padding:20px; opacity:0; visibility:hidden; transition:.22s cubic-bezier(.2,.8,.3,1); z-index:80}
.has-mega:hover .mega, .has-mega.open .mega{opacity:1; visibility:visible; transform:translateX(50%) translateY(0)}
.mega h5{font-family:"Tajawal",sans-serif; font-size:12px; font-weight:800; color:var(--muted); margin:0 0 10px; letter-spacing:.02em}
.mega-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px}
.mega-grid a{padding:9px 11px; border-radius:11px; font-size:13.5px; font-weight:600; transition:.16s;
display:flex; align-items:center; gap:8px; color:var(--ink2); white-space:nowrap}
.mega-grid a:hover{background:var(--surface); color:var(--brand)}
.mega-grid a i{font-style:normal; font-size:15px; line-height:1}
.mega-foot{margin-top:16px; padding-top:14px; border-top:1px solid var(--line); display:flex;
justify-content:space-between; align-items:center; gap:12px; font-size:13px; color:var(--muted); flex-wrap:wrap}
.hero{position:relative; overflow:hidden; padding:66px 0 30px}
.hero::before{content:""; position:absolute; top:-340px; inset-inline-start:-240px; width:860px; height:860px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb,var(--brand) 16%,transparent), transparent 62%); pointer-events:none}
.hero-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:52px; align-items:center; position:relative}
.hero h1{font-size:clamp(34px,5.2vw,58px); font-weight:900; letter-spacing:-.03em; line-height:1.16}
.hero h1 em{font-style:normal; position:relative; color:var(--brand); white-space:nowrap}
.hero h1 em::after{content:""; position:absolute; inset-inline:-.06em; bottom:-.12em; height:.12em;
background:color-mix(in srgb,var(--brand) 40%,transparent); border-radius:100px}
.hero-sub{font-size:18px; color:var(--muted); margin:22px 0 28px; max-width:520px}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:24px}
.hero-chips{display:flex; gap:9px; flex-wrap:wrap}
.hero-visual{position:relative}
.hero-visual .frame{box-shadow:var(--sh-2)}
.addr{background:var(--ink); color:#fff; border-radius:var(--r-xl); padding:24px 26px; box-shadow:var(--sh-3);
position:relative; overflow:hidden; margin:-54px 22px 0; z-index:2}
.addr::before{content:""; position:absolute; inset-block-start:-90px; inset-inline-end:-90px; width:250px; height:250px;
border-radius:50%; background:radial-gradient(circle, color-mix(in srgb,var(--brand) 40%,transparent), transparent 70%)}
.addr-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; position:relative}
.addr-top span{font-size:13px; color:rgba(255,255,255,.55); font-weight:600}
.addr-badge{background:color-mix(in srgb,var(--brand) 24%,transparent); color:var(--brand2); padding:5px 12px;
border-radius:100px; font-size:12px; font-weight:700; border:1px solid color-mix(in srgb,var(--brand) 40%,transparent); direction:ltr}
.addr-line{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0;
border-bottom:1px dashed rgba(255,255,255,.14); position:relative}
.addr-line:last-of-type{border-bottom:0}
.addr-line small{display:block; font-size:11.5px; color:rgba(255,255,255,.45); font-weight:600; margin-bottom:1px}
.addr-line div>span{font-size:15px; font-weight:600; direction:ltr; display:block; text-align:left}
.copy{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); color:#fff; width:31px; height:31px;
border-radius:9px; cursor:pointer; flex:none; display:grid; place-items:center; transition:.2s}
.copy:hover{background:var(--brand); border-color:var(--brand); color:var(--onBrand)}
.maskstar{letter-spacing:.1em; color:rgba(255,255,255,.88); user-select:none}
.addr-lock{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
margin-top:12px; padding-top:14px; border-top:1px dashed rgba(255,255,255,.16);
font-size:12.5px; color:rgba(255,255,255,.65); position:relative}
.float-badge{position:absolute; inset-block-start:18px; inset-inline-start:18px; background:var(--card); border:1px solid var(--line);
border-radius:18px; padding:12px 18px; box-shadow:var(--sh-2); display:flex; align-items:center; gap:12px; z-index:3}
.float-badge b{font-family:"Tajawal",sans-serif; font-size:25px; font-weight:900; color:var(--brand); line-height:1}
.float-badge span{font-size:12px; color:var(--muted); font-weight:600; line-height:1.4}
.mq{overflow:hidden; position:relative; padding:26px 0;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.mq-row{display:flex; gap:52px; align-items:center; width:max-content; animation:mqslide 40s linear infinite}
.mq:hover .mq-row{animation-play-state:paused}
@keyframes mqslide{to{transform:translateX(50%)}}
.btile{font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; font-size:18px; letter-spacing:-.025em;
white-space:nowrap; direction:ltr; transition:.25s; cursor:default; padding:13px 26px; border-radius:14px;
border:1px solid var(--line); background:var(--card); color:color-mix(in srgb,var(--ink) 46%, var(--surface));
display:inline-flex; align-items:center; justify-content:center; min-width:132px; height:56px}
.btile:hover{color:var(--brand); border-color:color-mix(in srgb,var(--brand) 45%,var(--line)); transform:translateY(-2px)}
.blogo{display:inline-flex; align-items:center; justify-content:center; gap:0; line-height:1}
.blogo img{height:26px; max-width:112px; width:auto; object-fit:contain; display:block;
filter:grayscale(1) opacity(.55); transition:filter .25s}
.btile:hover .blogo img, .store-card:hover .blogo img{filter:grayscale(0) opacity(1)}
.blogo.has-img b, body.barid .blogo.has-img b{display:none}
.blogo b{font-weight:800; letter-spacing:-.025em}
.carriers .blogo img{height:30px; max-width:120px}
.store-card .blogo{height:34px; margin-bottom:8px}
.store-card .blogo img{height:30px; max-width:120px; filter:grayscale(1) opacity(.7)}
.lp-badge .blogo img{height:34px; max-width:150px; filter:none}
.lp-badge .blogo b{font-family:"Plus Jakarta Sans",sans-serif; font-size:25px; font-weight:800;
color:var(--ink); letter-spacing:-.02em}
.blogo img[src$="/bhphoto.svg"]{height:35px; max-width:48px}
.carriers .blogo img[src$="/bhphoto.svg"]{height:40px; max-width:56px}
.store-card .blogo img[src$="/bhphoto.svg"]{height:40px; max-width:56px}
.lp-badge .blogo img[src$="/bhphoto.svg"]{height:46px; max-width:64px}
.mq-row{gap:16px}
.mq-label{text-align:center; font-size:12px; font-weight:700; color:var(--muted); letter-spacing:.06em; text-transform:uppercase}
.carriers{background:color-mix(in srgb,var(--ink) 4%, var(--surface)); border-block:1px solid var(--line)}
.carriers .btile{font-size:20px; background:var(--surface)}
.stores-grid{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px}
.store-card{padding:20px 12px 16px; text-align:center; transition:transform .22s, box-shadow .22s, border-color .22s; cursor:pointer}
.store-card:hover{transform:translateY(-4px); box-shadow:var(--sh-2); border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}
.store-name{font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; font-size:16.5px; direction:ltr;
letter-spacing:-.02em; margin-bottom:5px; line-height:1.2}
.store-cat{font-size:11.5px; color:var(--muted); font-weight:600}
.store-flag{display:inline-block; margin-top:9px; font-size:10.5px; font-weight:700; padding:3px 9px; border-radius:100px;
background:color-mix(in srgb,var(--ok) 12%,transparent); color:var(--ok)}
.store-flag.no{background:color-mix(in srgb,var(--warm) 20%,transparent); color:#9A6B12}
.countries{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px}
.ccard{display:flex; align-items:center; gap:11px; padding:14px 16px; transition:.22s; cursor:pointer}
.ccard:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line)); transform:translateX(-3px)}
.ccard i{font-style:normal; font-size:22px; line-height:1}
.ccard b{font-family:"Tajawal",sans-serif; font-size:15px; display:block; line-height:1.3}
.ccard small{font-size:11.5px; color:var(--muted); font-weight:600}
.cmp{overflow:hidden; border-radius:var(--r-xl)}
.cmp table{width:100%; border-collapse:collapse}
.cmp th,.cmp td{padding:16px 18px; text-align:right; border-bottom:1px solid var(--line); font-size:14.5px}
.cmp thead th{background:var(--surface); font-family:"Tajawal",sans-serif; font-size:15px; font-weight:800}
.cmp thead th.us{background:var(--ink); color:#fff; position:relative}
.cmp td.us{background:color-mix(in srgb,var(--brand) 6%,transparent); font-weight:700}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp .yes{color:var(--ok); font-weight:800} .cmp .no{color:#B03A2E; font-weight:700}
.track{display:flex; gap:10px; padding:10px; border-radius:100px; background:var(--card); border:1px solid var(--line);
box-shadow:var(--sh-1); max-width:520px}
.track input{flex:1; border:0; background:transparent; padding:0 16px; font-family:inherit; font-size:15px;
color:var(--ink); direction:ltr; text-align:right; outline:0}
.track input::placeholder{color:var(--muted)}
.counters{background:var(--ink); position:relative; overflow:hidden}
.counters::before{content:""; position:absolute; inset-block-start:-260px; inset-inline-start:50%; transform:translateX(50%);
width:900px; height:520px; border-radius:50%;
background:radial-gradient(circle, color-mix(in srgb,var(--brand) 20%,transparent), transparent 66%)}
.counters-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); position:relative}
.ct{padding:44px 22px; text-align:center; border-inline-start:1px solid rgba(255,255,255,.1)}
.ct:first-child{border-inline-start:0}
.ct b{display:block; font-family:"Tajawal",sans-serif; font-size:clamp(38px,4.6vw,56px); font-weight:900; line-height:1;
letter-spacing:-.035em; color:#fff; direction:ltr; margin-bottom:10px}
.ct b i{font-style:normal; color:var(--brand2); font-size:.48em; vertical-align:.42em; margin-inline-end:.06em}
.ct > span{font-size:14.5px; color:rgba(255,255,255,.62); font-weight:600}
.ct b span{font-size:inherit; color:inherit}
.steps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px}
.step{padding:28px 26px; position:relative; overflow:hidden; transition:transform .25s, box-shadow .25s}
.step:hover{transform:translateY(-5px); box-shadow:var(--sh-2)}
.step-ic{width:56px; height:56px; border-radius:16px; background:color-mix(in srgb,var(--brand) 11%,transparent);
display:grid; place-items:center; margin-bottom:16px}
.step-n{position:absolute; inset-block-start:22px; inset-inline-start:24px; font-family:"Plus Jakarta Sans",sans-serif;
font-size:38px; font-weight:800; line-height:.8; color:transparent;
-webkit-text-stroke:1.4px color-mix(in srgb,var(--ink) 14%,transparent); direction:ltr}
.step h3{font-size:19px; margin-bottom:9px}
.step p{font-size:14.8px; color:var(--muted); line-height:1.75}
.oregon{background:var(--ink); color:#fff; border-radius:var(--r-xl); padding:56px; position:relative; overflow:hidden}
.oregon::before{content:""; position:absolute; inset-block-start:-160px; inset-inline-start:-120px; width:520px; height:520px;
border-radius:50%; background:radial-gradient(circle, color-mix(in srgb,var(--brand) 24%,transparent), transparent 68%)}
.oregon-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:50px; align-items:center; position:relative}
.oregon h2{font-size:clamp(26px,3.4vw,38px); margin-bottom:16px}
.oregon p{color:rgba(255,255,255,.72); font-size:16.5px}
.bars{display:flex; flex-direction:column; gap:15px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
border-radius:var(--r-lg); padding:26px}
.bar-row{display:grid; grid-template-columns:104px 1fr 82px; align-items:center; gap:14px; font-size:14px}
.bar-track{height:12px; background:rgba(255,255,255,.09); border-radius:100px; overflow:hidden}
.bar-fill{display:block; height:100%; width:100%; border-radius:100px; background:rgba(255,255,255,.3);
transform:scaleX(0); transform-origin:100% 50%; transition:transform .8s cubic-bezier(.22,1,.36,1)}
.bar-row.win .bar-fill{background:var(--brand)} .bar-row.win{color:var(--brand2); font-weight:700}
.bar-val{text-align:left; direction:ltr; font-weight:700}
.oregon-note{margin-top:18px; font-size:13px; color:rgba(255,255,255,.45)}
.route .frame{background:linear-gradient(180deg, color-mix(in srgb,var(--brand) 7%,var(--card)), var(--card))}
.route-facts{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:22px}
.rf{padding:20px 22px; text-align:center}
.rf b{display:block; font-family:"Tajawal",sans-serif; font-size:26px; font-weight:900; color:var(--brand); line-height:1.1; direction:ltr}
.rf span{font-size:13.5px; color:var(--muted); font-weight:600}
.calc{display:grid; grid-template-columns:1fr .82fr; overflow:hidden; border-radius:var(--r-xl)}
.calc-in{padding:38px; background:var(--card)}
.field{margin-bottom:18px}
.field label{display:block; font-size:13.5px; font-weight:700; margin-bottom:8px; color:var(--ink2)}
.field input, .field select{width:100%; padding:12px 15px; border:1px solid var(--line); border-radius:12px;
background:var(--surface); font-family:inherit; font-size:15px; color:var(--ink); transition:.2s; direction:ltr; text-align:right}
.field input:focus, .field select:focus{outline:0; border-color:var(--brand); background:var(--card);
box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 12%,transparent)}
.dims{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.row2{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px}
.seg{display:flex; gap:6px; background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:5px}
.seg button{flex:1; padding:9px; border:0; background:transparent; border-radius:9px; font-family:"Tajawal",sans-serif;
font-weight:700; font-size:14px; color:var(--muted); cursor:pointer; transition:.2s}
.seg button.on{background:var(--ink); color:#fff}
.calc-out{background:var(--ink); color:#fff; padding:38px; display:flex; flex-direction:column}
.calc-out h4{font-size:15px; color:rgba(255,255,255,.55); font-weight:600; margin-bottom:22px}
.price{font-family:"Tajawal",sans-serif; font-size:56px; font-weight:900; line-height:1; letter-spacing:-.03em; direction:ltr; text-align:right}
.price sup{font-size:24px; font-weight:700; vertical-align:super; color:var(--brand2)}
.price-sar{font-size:15px; color:rgba(255,255,255,.55); margin-top:8px; direction:ltr; text-align:right; font-weight:600}
.brk{margin-top:26px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12); display:flex; flex-direction:column; gap:12px}
.brk-row{display:flex; justify-content:space-between; align-items:center; font-size:14px}
.brk-row span{color:rgba(255,255,255,.6)} .brk-row b{font-weight:700; direction:ltr}
.brk-row.hi b{color:var(--brand2)}
.calc-note{margin-top:auto; padding-top:22px; font-size:12.5px; color:rgba(255,255,255,.42); line-height:1.7}
.svcs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px}
.svc{padding:28px; transition:transform .25s, box-shadow .25s, border-color .25s}
.svc:hover{transform:translateY(-4px); box-shadow:var(--sh-2); border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
.svc-ic{width:46px; height:46px; border-radius:14px; background:color-mix(in srgb,var(--brand) 12%,transparent);
color:var(--brand); display:grid; place-items:center; margin-bottom:16px}
.svc h3{font-size:17.5px; margin-bottom:7px}
.svc p{font-size:14.5px; color:var(--muted); line-height:1.72}
.svc.big{grid-column:span 2; grid-row:span 2; order:-1; display:flex; flex-direction:column; padding:0; overflow:hidden}
.svc.big:hover{transform:none}
.svc-big-art{background:linear-gradient(160deg, color-mix(in srgb,var(--brand) 12%,var(--card)), var(--card)); border-bottom:1px solid var(--line)}
.svc-big-art svg{display:block; width:100%; height:auto}
.svc-big-txt{padding:26px 28px 28px}
.svc-big-txt h3{font-size:22px; margin-bottom:8px}
.svc-big-txt p{font-size:15px; color:var(--muted); line-height:1.75}
.save-pill{display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:8px 16px; border-radius:100px;
background:color-mix(in srgb,var(--brand) 12%,transparent); color:var(--brand); font-weight:700; font-size:14px}
.gal{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px}
.shot{margin-top:22px; font-size:14px; color:var(--muted); background:var(--card); border:1px dashed var(--line);
border-radius:14px; padding:16px 20px; line-height:1.8}
.shot b{color:var(--ink)}
.dash{border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-2); border:1px solid var(--line); background:var(--card)}
.dash-bar{background:var(--ink); padding:14px 20px; display:flex; align-items:center; gap:9px}
.dot3{display:flex; gap:6px} .dot3 i{width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.2)}
.dash-url{margin-inline-start:14px; background:rgba(255,255,255,.08); border-radius:8px; padding:4px 14px;
font-size:12px; color:rgba(255,255,255,.55); direction:ltr}
.dash-body{padding:26px}
.dash-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:12px}
.dash-head h3{font-size:20px} .dash-head small{color:var(--muted); font-size:13.5px}
.code-pill{background:color-mix(in srgb,var(--brand) 12%,transparent); color:var(--brand);
border:1px dashed color-mix(in srgb,var(--brand) 45%,transparent); padding:6px 14px; border-radius:10px;
font-weight:700; font-size:13.5px; direction:ltr}
table{width:100%; border-collapse:collapse; font-size:14px}
th{text-align:right; font-size:12.5px; color:var(--muted); font-weight:700; padding:10px 12px; border-bottom:1px solid var(--line)}
td{padding:13px 12px; border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
tbody tr{transition:background .2s} tbody tr:hover{background:var(--surface)}
.thumb{width:44px; height:44px; border-radius:10px; overflow:hidden; border:1px solid var(--line); display:block}
.thumb svg{display:block; width:100%; height:100%}
.tag{display:inline-flex; align-items:center; gap:6px; padding:4px 11px; border-radius:100px; font-size:12.5px; font-weight:700}
.tag::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor}
.t-in{background:color-mix(in srgb,var(--ok) 13%,transparent); color:var(--ok)}
.t-prep{background:color-mix(in srgb,var(--brand) 14%,transparent); color:var(--brand)}
.t-out{background:color-mix(in srgb,var(--ink2) 10%,transparent); color:var(--ink2)}
.mono{direction:ltr; font-variant-numeric:tabular-nums; font-size:13.5px}
.revs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px}
.rev{padding:26px; position:relative}
.rev-stars{color:var(--brand); letter-spacing:2px; font-size:15px; margin-bottom:12px; direction:ltr}
.rev p{font-size:15px; color:var(--ink2); line-height:1.8; margin-bottom:18px}
.rev-who{display:flex; align-items:center; gap:11px}
.avi{width:38px; height:38px; border-radius:50%; background:color-mix(in srgb,var(--brand) 16%,transparent);
color:var(--brand); display:grid; place-items:center; font-weight:800; font-family:"Tajawal",sans-serif; flex:none}
.rev-who b{font-size:14.5px; display:block; line-height:1.3} .rev-who small{font-size:12.5px; color:var(--muted)}
.ph{position:absolute; inset-block-start:16px; inset-inline-start:16px; font-size:10.5px; font-weight:700; color:var(--muted);
background:var(--surface); border:1px solid var(--line); padding:3px 9px; border-radius:100px}
.disclaim{margin-top:22px; font-size:13.5px; color:var(--muted); background:var(--card); border:1px dashed var(--line);
border-radius:14px; padding:14px 18px}
.faq{max-width:820px; margin:0 auto}
.q{border-bottom:1px solid var(--line)}
.q button{width:100%; background:0; border:0; padding:22px 0; display:flex; align-items:center; justify-content:space-between;
gap:16px; cursor:pointer; font-family:"Tajawal",sans-serif; font-weight:700; font-size:17.5px; color:var(--ink); text-align:right}
.q-ic{width:30px; height:30px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center;
flex:none; transition:.25s; color:var(--brand)}
.q.open .q-ic{background:var(--brand); color:var(--onBrand); border-color:var(--brand); transform:rotate(45deg)}
.q-a{max-height:0; overflow:hidden; transition:max-height .35s cubic-bezier(.2,.8,.3,1)}
.q-a p{padding:0 0 22px; color:var(--muted); font-size:15.5px; line-height:1.85}
.cta{background:linear-gradient(135deg, var(--ink), var(--ink2)); color:#fff; border-radius:var(--r-xl); padding:62px;
text-align:center; position:relative; overflow:hidden}
.cta-bg{position:absolute; inset:0; opacity:.35}
.cta h2{font-size:clamp(28px,4vw,44px); margin-bottom:16px; position:relative}
.cta p{color:rgba(255,255,255,.72); font-size:17px; max-width:520px; margin:0 auto 30px; position:relative}
footer{background:var(--ink); color:rgba(255,255,255,.62); padding:64px 0 26px; margin-top:92px}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1.1fr; gap:34px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.1)}
.foot-grid h4{color:#fff; font-size:15.5px; margin-bottom:16px}
.foot-grid ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; font-size:14.5px}
.foot-grid a:hover{color:var(--brand2)}
.foot-about p{font-size:14.5px; margin:16px 0; max-width:300px; line-height:1.8}
.pay{display:flex; gap:8px; margin-top:16px; flex-wrap:wrap}
.pay span{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:8px; padding:6px 12px;
font-size:11.5px; font-weight:600; color:rgba(255,255,255,.75)}
.foot-bot{padding-top:22px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:13px; color:rgba(255,255,255,.4)}
.crumb{font-size:13px; color:var(--muted); padding:20px 0 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.crumb b{color:var(--ink); font-weight:700}
.lp-hero{padding:34px 0 56px; position:relative; overflow:hidden}
.lp-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center}
.lp-hero h1{font-size:clamp(30px,4.4vw,50px); font-weight:900; letter-spacing:-.03em; line-height:1.18}
.lp-hero h1 em{font-style:normal; color:var(--brand)}
.lp-hero p{font-size:17.5px; color:var(--muted); margin:20px 0 26px; max-width:520px}
.lp-badge{display:inline-flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line);
border-radius:20px; padding:14px 22px; box-shadow:var(--sh-1); margin-bottom:20px}
.lp-badge .btile{opacity:1; font-size:26px; color:var(--ink)}
.lp-badge span{font-size:12.5px; color:var(--muted); font-weight:700; border-inline-start:1px solid var(--line); padding-inline-start:12px}
.facts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:8px}
.fact{padding:18px 20px}
.fact b{display:block; font-family:"Tajawal",sans-serif; font-size:22px; font-weight:900; color:var(--brand); line-height:1.2; direction:ltr}
.fact span{font-size:13px; color:var(--muted); font-weight:600}
.ptable{overflow:hidden; border-radius:var(--r-lg)}
.ptable th{background:var(--surface); font-family:"Tajawal",sans-serif; font-size:14px; color:var(--ink); font-weight:800; padding:14px 18px}
.ptable td{padding:14px 18px; font-size:14.5px}
.ptable td.p{font-weight:800; color:var(--brand); direction:ltr}
.cats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
.cat{padding:20px; display:flex; align-items:center; gap:12px; transition:.22s}
.cat:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}
.cat i{font-style:normal; font-size:26px} .cat b{font-family:"Tajawal",sans-serif; font-size:15.5px; display:block}
.cat small{font-size:12px; color:var(--muted)}
.other{display:flex; gap:10px; flex-wrap:wrap}
.other a{padding:10px 18px; border-radius:100px; background:var(--card); border:1px solid var(--line);
font-family:"Plus Jakarta Sans",sans-serif; font-weight:700; font-size:14px; direction:ltr; transition:.2s; cursor:pointer}
.other a:hover{border-color:var(--brand); color:var(--brand)}
.filters{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:26px}
.search{flex:1; min-width:240px; display:flex; align-items:center; gap:10px; padding:12px 18px;
border:1px solid var(--line); border-radius:var(--r-full); background:var(--card); box-shadow:var(--sh-1)}
.search input{flex:1; border:0; background:transparent; font-family:inherit; font-size:15px; color:var(--ink); outline:0}
.chipbtn{padding:9px 16px; border-radius:var(--r-full); border:1px solid var(--line); background:var(--card);
font-family:"Tajawal",sans-serif; font-weight:700; font-size:13.5px; color:var(--ink2); cursor:pointer; transition:.18s}
.chipbtn:hover{border-color:var(--brand); color:var(--brand)}
.chipbtn.on{background:var(--ink); border-color:var(--ink); color:#fff}
.empty{text-align:center; padding:60px 20px; color:var(--muted); font-size:16px}
.count{font-size:13.5px; color:var(--muted); font-weight:600; margin-bottom:16px}
.zones{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:26px}
.zone{padding:18px 20px; cursor:pointer; transition:.2s; text-align:right}
.zone:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}
.zone.on{border-color:var(--brand); box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 13%,transparent)}
.zone b{display:block; font-family:"Tajawal",sans-serif; font-size:16px; margin-bottom:3px}
.zone small{font-size:12.5px; color:var(--muted); display:block; line-height:1.6}
.zone i{font-style:normal; display:inline-block; margin-top:8px; font-size:12px; font-weight:700; color:var(--brand)}
.fees{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.fee{padding:22px 24px; display:flex; justify-content:space-between; align-items:flex-start; gap:14px}
.fee b{font-family:"Tajawal",sans-serif; font-size:16px; display:block; margin-bottom:4px}
.fee small{font-size:13px; color:var(--muted); line-height:1.7}
.fee span{font-family:"Tajawal",sans-serif; font-weight:900; font-size:19px; color:var(--brand); white-space:nowrap; direction:ltr}
.fee span.free{color:var(--ok)}
.calcband{background:linear-gradient(180deg, color-mix(in srgb,var(--brand) 7%,var(--surface)), var(--surface) 64%);
border-block:1px solid var(--line)}
.presets{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:18px}
.presets em{font-style:normal; font-size:12.5px; font-weight:700; color:var(--muted); margin-inline-end:2px}
.presets button{padding:8px 14px; border-radius:var(--r-full); border:1px solid var(--line); background:var(--card);
font-family:"Tajawal",sans-serif; font-weight:700; font-size:13px; color:var(--ink2); cursor:pointer; transition:.18s}
.presets button:hover{border-color:var(--brand); color:var(--brand)}
.presets button.on{background:var(--ink); border-color:var(--ink); color:#fff}
.lblband{display:grid; grid-template-columns:1.02fr .98fr; overflow:hidden; align-items:center; border-radius:var(--r-xl)}
.lblband-txt{padding:46px 48px}
.lblband-txt h2{font-size:clamp(26px,3.4vw,38px); margin-bottom:14px}
.lblband-txt p{color:var(--muted); font-size:16.5px; max-inline-size:52ch}
.lblband-art{background:linear-gradient(160deg, color-mix(in srgb,var(--brand) 10%,var(--card)), var(--card));
border-inline-start:1px solid var(--line); align-self:stretch; display:grid; place-items:center}
.lblband-art svg{display:block; width:100%; height:auto}
.lblband-art.standalone{border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-2)}
.lbl-chips{display:flex; gap:9px; flex-wrap:wrap; margin:18px 0 22px}
.printer text{direction:ltr; unicode-bidi:isolate}
.lbl-out{animation:printout 4.6s cubic-bezier(.35,0,.2,1) infinite}
@keyframes printout{
0%{transform:translateY(-150px); opacity:1}
50%{transform:translateY(0); opacity:1}
84%{transform:translateY(0); opacity:1}
92%{transform:translateY(0); opacity:0}
92.01%{transform:translateY(-150px); opacity:0}
100%{transform:translateY(-150px); opacity:1}
}
@media (max-width:1000px){
.lblband{grid-template-columns:1fr}
.lblband-art{border-inline-start:0; border-top:1px solid var(--line)}
.lblband-txt{padding:34px 26px}
}
.pagenav{position:sticky; top:calc(var(--deck) + 68px); z-index:55; background:color-mix(in srgb,var(--surface) 92%,transparent);
backdrop-filter:blur(14px); border-bottom:1px solid var(--line); padding:12px 0}
.pm-head{padding:70px 0 40px}
.safe{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; margin-top:10px}
.rule{padding:20px 24px; display:flex; gap:14px; align-items:flex-start; font-size:15px; line-height:1.75}
.rule i{width:24px; height:24px; border-radius:50%; display:grid; place-items:center; flex:none; font-style:normal;
font-weight:800; font-size:14px; margin-top:3px}
.rule.do i{background:color-mix(in srgb,var(--ok) 15%,transparent); color:var(--ok)}
.rule.no i{background:rgba(200,60,60,.12); color:#B03A2E}
.rule b{font-family:"Tajawal",sans-serif}
.bp-hero{padding:70px 0 46px}
.evo{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); overflow:hidden; margin-bottom:26px}
@media (max-width:820px){ .evo,.evo-list{grid-template-columns:1fr} .evo-side.old{border-inline-end:0; border-bottom:1px solid var(--line)} }
.mark-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px}
.mark-cap{position:absolute; inset-block-start:14px; inset-inline-start:16px; font-size:11.5px; font-weight:700; color:var(--muted)}
.tape{margin-top:24px; border-radius:16px; overflow:hidden; border:1px solid var(--line)}
.tape-in{background:var(--brand); color:var(--onBrand); padding:15px 0; display:flex; align-items:center; white-space:nowrap;
overflow:hidden; font-family:"Tajawal",sans-serif; font-weight:800; font-size:17px}
.tape-in>div{display:flex; gap:32px; align-items:center; animation:mqslide 24s linear infinite; padding-inline-end:32px}
.tape-in span{display:inline-flex; align-items:center; gap:11px}
.dont{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px}
.hero-paths{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:.55}
.hero-grid{position:relative; z-index:1}
.hero-paths path{fill:none; stroke:var(--brand); stroke-width:1.6; stroke-dasharray:5 10; opacity:.30}
.hero-paths .pk{fill:var(--brand)}
@keyframes draw{to{stroke-dashoffset:0}}
.trail{stroke:var(--brand); fill:none; stroke-width:2.6; stroke-linecap:round}
.frame.in .trail{animation:draw 2.6s cubic-bezier(.4,0,.25,1) forwards}
.plane{fill:var(--brand)}
.planeg{opacity:0} .frame.in .planeg{opacity:1; transition:opacity .25s .12s}
@keyframes floaty{0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)}}
.il-float{animation:floaty 3.6s ease-in-out infinite}
.il-float.d1{animation-delay:-.5s} .il-float.d2{animation-delay:-1.1s}
.il-float.d3{animation-delay:-1.8s} .il-float.d4{animation-delay:-2.4s}
.belt{position:relative; overflow:hidden; padding:34px 0 0; background:var(--surface)}
.belt-row{display:flex; gap:64px; width:max-content; align-items:flex-end; animation:mqslide 26s linear infinite;
padding-inline-end:64px}
.belt-row svg{display:block}
.belt-line{position:relative; height:10px; margin-top:-2px; background:var(--ink); border-radius:6px}
.belt-line{overflow:hidden}
.belt-line::after{content:""; position:absolute; inset-block:3px auto; inset-inline-start:0; height:4px; width:300%;
background:repeating-linear-gradient(90deg, transparent 0 14px, color-mix(in srgb,#fff 22%,transparent) 14px 28px);
animation:beltstripe 1.1s linear infinite}
@keyframes beltstripe{to{transform:translateX(28px)}}
.belt-wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}
.belt-cap{text-align:center; font-size:12px; font-weight:700; color:var(--muted); letter-spacing:.06em;
text-transform:uppercase; padding:16px 0 34px}
@keyframes ping{0%{transform:scale(1); opacity:.35} 70%{transform:scale(2.1); opacity:0} 100%{opacity:0}}
.ping{transform-origin:center; transform-box:fill-box; animation:ping 2.6s cubic-bezier(0,0,.2,1) infinite}
@media (prefers-reduced-motion: reduce){
*,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important;
transition-duration:.01ms !important; scroll-behavior:auto !important}
}
.lux .btn-brand{background:var(--grad); box-shadow:0 10px 30px -10px var(--brand)}
.lux .btn-brand:hover{box-shadow:0 18px 42px -12px var(--brand)}
.lux .card{border-color:color-mix(in srgb,var(--ink) 8%,var(--line))}
.dk{position:relative; overflow:hidden}
.lux .dk::after{content:""; position:absolute; inset:0; pointer-events:none; z-index:3; opacity:.15; mix-blend-mode:overlay;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.lux .counters::before{background:radial-gradient(circle at 32% 42%, color-mix(in srgb,var(--brand3) 32%,transparent), transparent 60%),
radial-gradient(circle at 70% 58%, color-mix(in srgb,var(--brand) 30%,transparent), transparent 62%)}
.lux .oregon::before{background:radial-gradient(circle at 40% 40%, color-mix(in srgb,var(--brand3) 30%,transparent), transparent 62%),
radial-gradient(circle at 65% 60%, color-mix(in srgb,var(--brand) 26%,transparent), transparent 64%)}
.lux .ct b{background:linear-gradient(180deg,#fff 20%, color-mix(in srgb,var(--brand2) 92%,#fff));
-webkit-background-clip:text; background-clip:text; color:transparent}
.lux .ct b i{-webkit-text-fill-color:var(--warm); color:var(--warm)}
.lux .hero h1 em, .lux .lp-hero h1 em{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.lux .hero h1 em::after{background:var(--grad); opacity:.5}
.lux .float-badge b, .lux .rf b, .lux .fact b, .lux .pm-stat b{background:var(--grad);
-webkit-background-clip:text; background-clip:text; color:transparent}
.lux .topbar b{color:var(--warm)}
.lux .addr-badge{color:var(--warm); background:color-mix(in srgb,var(--warm) 15%,transparent);
border-color:color-mix(in srgb,var(--warm) 38%,transparent)}
.lux .bar-row.win{color:var(--warm)} .lux .rev-stars{color:var(--warm)}
.lux .step-ic,.lux .svc-ic{background:linear-gradient(140deg, color-mix(in srgb,var(--brand) 15%,transparent), color-mix(in srgb,var(--brand3) 10%,transparent))}
.lat,.num,.mono,.price,.ct b,.blogo b,.step-n,.logo--lat .logo-txt b{letter-spacing:-.02em}
.mq-label,.belt-cap{text-transform:none; font-size:13px; word-spacing:.06em}
h1,h2,h3,h4,.display{line-height:1.34}
.hero h1{line-height:1.30} .lp-hero h1{line-height:1.32}
h1,h2{text-wrap:balance}
.hero-sub{max-inline-size:52ch} .sec-head{max-width:62ch} .sec-head p{max-inline-size:58ch}
.q-a p{max-inline-size:66ch} .shot,.disclaim{max-inline-size:74ch}
.q-a p,.shot,.svc p,.step p,.rev p,.rule,.oregon p{text-wrap:pretty}
p,li,.rule,.calc-note,.q-a p{line-height:1.8}
.num,.mono{font-variant-numeric:tabular-nums lining; direction:ltr; unicode-bidi:isolate}
:where(a,button,input,select,[tabindex]):focus-visible{outline:2px solid var(--brand); outline-offset:3px}
:focus:not(:focus-visible){outline:0}
.btn:active{transform:translateY(0) scale(.985); transition-duration:80ms}
@media (hover:none){
.btn:hover,.step:hover,.svc:hover,.store-card:hover,.btile:hover,.ccard:hover,.cat:hover{transform:none}
}
.step-n{color:color-mix(in srgb,var(--ink) 13%,transparent); -webkit-text-stroke:0}
@supports (-webkit-text-stroke: 1px black){
.step-n{color:transparent; -webkit-text-stroke:1.3px color-mix(in srgb,var(--ink) 17%,transparent)}
}
.lux .btn-brand{box-shadow:0 1px 2px color-mix(in srgb,var(--ink) 18%,transparent),
0 8px 18px -10px color-mix(in srgb,var(--brand) 55%,transparent)}
.lux .btn-brand:hover{box-shadow:0 2px 5px color-mix(in srgb,var(--ink) 20%,transparent),
0 14px 26px -10px color-mix(in srgb,var(--brand) 55%,transparent)}
.lux .float-badge b,.lux .rf b,.lux .fact b,.lux .pm-stat b{
background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--brand)}
.mq-row{gap:clamp(38px,5vw,64px)}
.mq{-webkit-mask-image:linear-gradient(90deg,transparent,#000 11%,#000 89%,transparent);
mask-image:linear-gradient(90deg,transparent,#000 11%,#000 89%,transparent)}
.blogo b{font-weight:600; letter-spacing:normal; font-size:16px;
color:color-mix(in srgb,var(--ink) 52%,var(--surface))}
.btile{min-width:126px; height:54px}
.slot-note{text-align:center; font-size:12.5px; color:var(--muted); padding:4px 22px 0}
.addr-line div>span{unicode-bidi:isolate}
.price-sar{unicode-bidi:isolate}
.field select{direction:rtl; text-align:right}
.field input[type=number]{direction:ltr; text-align:left}
.track input{direction:rtl; text-align:right}
.track input:not(:placeholder-shown){direction:ltr; text-align:left; unicode-bidi:isolate}
th,.cmp th,.cmp td,.ptable th,.ptable td{text-align:start}
.cflag{font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; font-size:12px; direction:ltr;
width:34px; height:26px; border-radius:7px; display:grid; place-items:center; flex:none;
background:color-mix(in srgb,var(--brand) 12%,transparent); color:var(--brand); letter-spacing:.02em}
.lp-badge .cflag{width:46px; height:34px; font-size:15px}
.navtoggle{display:none; margin-inline-start:auto; width:42px; height:42px; border-radius:12px;
border:1px solid var(--line); background:var(--card); cursor:pointer; place-items:center; color:var(--ink)}
.mbar{position:fixed; inset-inline:0; bottom:0; z-index:118; display:none; gap:8px;
padding:10px 14px calc(10px + env(safe-area-inset-bottom));
background:color-mix(in srgb,var(--card) 94%,transparent); backdrop-filter:blur(14px);
border-top:1px solid var(--line)}
.mbar .btn{flex:1}
@media (max-width:1000px){
.navtoggle{display:grid} .nav-cta{display:none}
.mbar{display:flex} body{padding-bottom:80px}
.nav-links.open{display:flex; flex-direction:column; gap:2px; position:absolute; inset-inline:0;
top:100%; background:var(--card); border-bottom:1px solid var(--line); padding:14px 22px 20px;
box-shadow:var(--sh-2)}
.nav-links.open a{padding:11px 0; border-bottom:1px solid var(--line)}
.nav-links.open .has-mega{width:100%}
.nav-links.open .mega{display:none}
.nav-links.open .has-mega.open .mega{display:block; position:static; width:100%; transform:none;
box-shadow:none; border:0; margin-top:8px; opacity:1; visibility:visible}
}
.hero-paths{opacity:1}
.hero-paths path{opacity:.13; stroke-width:1.4; stroke-dasharray:4 12}
.hero-paths .pk{opacity:.30}
@media (prefers-reduced-motion: reduce){
.mq-row,.belt-row,.tape-in>div,.belt-line::after,#routePath,#rp2,.il-float,.lbl-out{animation:none !important}
}
@media (max-width:1080px){
.stores-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .countries{grid-template-columns:repeat(3,minmax(0,1fr))}
.cats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1000px){
.hero-grid,.oregon-grid,.calc,.mark-grid,.apps,.lp-grid{grid-template-columns:1fr}
.steps,.svcs,.revs,.gal,.opts,.route-facts,.pm-stats,.safe,.dont,.fees,.zones{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.counters-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ct:nth-child(3){border-inline-start:0} .ct:nth-child(n+3){border-top:1px solid rgba(255,255,255,.1)}
.pal{grid-template-columns:repeat(3,minmax(0,1fr))} .ui-grid{grid-template-columns:1fr}
.foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .nav-links{display:none}
.oregon,.cta{padding:38px 26px} .svc.big{grid-column:span 2; grid-row:auto}
}
@media (max-width:640px){
.steps,.svcs,.revs,.gal,.opts,.foot-grid,.route-facts,.pm-stats,.facts,.safe,.dont,
.fees,.zones,.cats,.pal{grid-template-columns:1fr}
.fee{flex-wrap:wrap} .fee>div{min-width:0; flex:1 1 auto}
.stores-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .countries{grid-template-columns:1fr}
.counters-grid{grid-template-columns:1fr} .ct{border-inline-start:0; border-top:1px solid rgba(255,255,255,.1)}
.ct:first-child{border-top:0} .sec{padding:60px 0} .calc-in,.calc-out{padding:26px}
.bcard-box{grid-template-columns:1fr} .addr{margin-inline:0} .svc.big{grid-column:auto}
.cmp{overflow-x:auto} .cmp table{min-width:620px}
.ptable{overflow-x:auto} .ptable table{min-width:560px}
}
body.barid{background:var(--surface); color:var(--ink);
font-family:"IBM Plex Sans Arabic","SF Arabic","Geeza Pro","Segoe UI",Tahoma,sans-serif;
font-size:16px; line-height:1.8}
body.barid #page,
body.barid .site-content,
body.barid .ast-container{background:transparent}
body.barid h1,body.barid h2,body.barid h3,body.barid h4{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif; font-weight:800; letter-spacing:normal}
body.barid .entry-content > .wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:22px}
body.barid{overflow-x:hidden}
body.barid .mq,body.barid .belt{max-width:100vw}
.barid-calc-wrap .bs-card{border-radius:var(--r-lg); border:1px solid var(--line);
box-shadow:var(--sh-1); background:var(--card)}
.barid-calc-wrap .bs-btn{border-radius:var(--r-full); font-family:"Tajawal",sans-serif; font-weight:700}
body.barid-full .site-content .ast-container,
body.barid-full .ast-container > .site-main,
body.barid-full .entry-content{max-width:none;padding-left:0;padding-right:0;margin-left:0;margin-right:0}
body.barid-full .entry-header,
body.barid-full .ast-single-post-order,
body.barid-full .post-navigation{display:none}
body.barid-full .site-content{padding-top:0}
body.barid-full .entry-content > .sec:first-child{margin-top:0}
body.barid .site-header,
body.barid .ast-primary-header-bar{background:#fff;border-bottom:1px solid var(--line,#E4E6F0)}
body.barid .custom-logo-link img,
body.barid .astra-logo-svg{width:auto;max-width:none;height:46px}
body.barid .site-title,
body.barid .site-description,
body.barid .ast-site-identity .site-title{display:none}
body.barid .ast-builder-menu .main-header-menu > .menu-item > .menu-link,
body.barid .main-header-menu > .menu-item > .menu-link{
font-weight:700;font-size:15.5px;color:var(--ink,#0B1230);padding-inline:14px}
body.barid .main-header-menu > .menu-item > .menu-link:hover{color:var(--brand,#4B6BFF)}
body.barid .main-header-menu .sub-menu{
border:1px solid var(--line,#E4E6F0);border-radius:14px;overflow:hidden;
box-shadow:0 18px 44px rgba(11,18,48,.10);padding:6px 0}
body.barid .main-header-menu .sub-menu .menu-link{font-size:14.5px;padding:9px 18px}
body.barid .ast-header-break-point .main-header-bar{padding-block:8px}
body.barid .ast-header-break-point .custom-logo-link img{height:38px}
body.barid .site-footer,
body.barid .ast-small-footer{background:var(--ink,#0B1230);color:#C7CEE4}
body.barid .site-footer a{color:#fff}
body.barid .barid-footer{background:var(--ink,#0B1230);padding:64px 0 26px;margin-top:0}
body.barid .foot-about svg{width:72px;height:auto;display:block;fill:#fff}
body.barid .barid-footer .foot-grid a{color:rgba(255,255,255,.62);text-decoration:none}
body.barid .barid-footer .foot-grid a:hover{color:#fff}
body.barid .barid-footer .foot-bot span:last-child{direction:ltr;opacity:.8}
@media (max-width:980px){
body.barid .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px}
body.barid .foot-about{grid-column:1 / -1}
}
@media (max-width:520px){ body.barid .foot-grid{grid-template-columns:1fr} }
body.barid .entry-content a{text-decoration:none}
body.barid .entry-content p > a:not(.btn):not(.chip):not(.card):not(.bw-btn){text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion: reduce){
body.barid *,
body.barid *::before,
body.barid *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
transition-duration:.001ms!important;scroll-behavior:auto!important}
body.barid .mq-row,
body.barid .belt-row{animation:none!important;transform:none!important}
}
body.barid .elementor-element-a44cb39{background-color:var(--ink,#0B1230)!important}
body.barid .elementor-element-a44cb39,
body.barid .elementor-element-a44cb39 *{color:rgba(255,255,255,.84)!important}
body.barid .elementor-element-a44cb39 svg{fill:#8FA6FF!important}
body.barid .elementor-element-a44cb39 a:hover,
body.barid .elementor-element-a44cb39 a:hover *{color:#fff!important}
body.barid .elementor-element-5946075{background:#fff!important;border-bottom:1px solid var(--line,#E4E6F0)}
body.barid img[src*="/logo.webp"]{opacity:0!important;height:52px!important;width:186px!important}
body.barid .elementor-widget-image:has(img[src*="/logo.webp"]) .elementor-widget-container{
background:url("../logo/barid-lockup-ink.svg") no-repeat center/contain}
body.barid .ekit-template-content-header .elementor-item.elementor-item-active,
body.barid .ekit-template-content-header .current-menu-item > a{color:var(--brand,#4B6BFF)!important}
body.barid .bw-hdr-btn{background:var(--brand,#4B6BFF)!important;color:#fff!important;
border-radius:999px!important;padding:9px 22px!important;font-weight:700!important;
box-shadow:0 6px 18px rgba(75,107,255,.28)!important;border:0!important}
body.barid .bw-hdr-btn:hover{background:#3B5BEF!important}
body:has(.ekit-template-content-markup) .barid-footer{display:none!important}
body.barid footer.site-footer:empty{display:none!important}
body.barid footer.site-footer .ast-footer-copyright:empty{display:none!important}
body.barid .bs-wrap{
--bs-brand:var(--brand);
--bs-brand-soft:color-mix(in srgb,var(--brand) 8%,var(--card));
--bs-accent:var(--warm);
--bs-ink:var(--ink);
--bs-mute:var(--muted);
--bs-line:var(--line);
--bs-bg:var(--card);
--bs-soft:var(--surface);
--bs-ok:var(--ok);
--bs-err:#C0342F;
--bs-r:var(--r-lg);
--bs-shadow:var(--sh-1);
--bs-tint:color-mix(in srgb,var(--brand) 7%,var(--card));
--bs-tint-line:color-mix(in srgb,var(--brand) 22%,var(--card));
--bs-ring:0 0 0 4px color-mix(in srgb,var(--brand) 13%,transparent);
--bs-hover-line:color-mix(in srgb,var(--brand) 34%,var(--line));
--bs-brand-text:color-mix(in srgb,var(--brand) 76%,var(--ink));
--bs-grad-deep:linear-gradient(135deg,
color-mix(in srgb,var(--brand) 86%,var(--ink)),
color-mix(in srgb,var(--brand3) 86%,var(--ink)));
--bs-warm-bg:color-mix(in srgb,var(--warm) 26%,var(--card));
--bs-warm-line:color-mix(in srgb,var(--warm) 62%,var(--card));
--bs-err-bg:color-mix(in srgb,var(--bs-err) 7%,var(--card));
--bs-err-line:color-mix(in srgb,var(--bs-err) 26%,var(--card));
max-width:var(--maxw);
line-height:1.75;
}
body.barid .bs-wrap .bs-title{font-size:clamp(22px,3vw,30px)}
body.barid .bs-wrap .bs-title-d{color:var(--muted); font-size:15.5px}
body.barid .bs-wrap .bs-h{font-size:19px; gap:12px; margin-bottom:20px}
body.barid .bs-wrap .bs-step{
width:32px; height:32px; border-radius:11px;
background:var(--bs-grad-deep); color:var(--onBrand);
font-family:"Tajawal",sans-serif; font-weight:800; font-size:14.5px;
box-shadow:0 6px 14px -8px var(--brand);
}
body.barid .bs-wrap .bs-h-note{
font-size:12.5px; font-weight:600; color:var(--muted);
background-color:var(--surface); border:1px solid var(--line);
border-radius:var(--r-full); padding:5px 13px; line-height:1.4;
}
body.barid .bs-wrap .bs-sub{
display:flex; align-items:center; gap:12px;
font-size:13px; color:var(--bs-brand-text); text-transform:none;
margin:26px 0 12px;
}
body.barid .bs-wrap .bs-sub::after{content:""; flex:1 1 auto; height:1px; background:var(--line)}
body.barid .bs-wrap .bs-sub span{color:var(--muted)}
body.barid .bs-wrap .bs-card{
background-color:var(--card);
border:1px solid var(--line);
border-radius:var(--r-lg);
box-shadow:var(--sh-1);
padding:24px 26px;
margin-bottom:16px;
}
body.barid .bs-wrap .bs-field > span{font-size:13.5px; font-weight:700; color:var(--ink2)}
body.barid .bs-wrap .bs-field input,
body.barid .bs-wrap .bs-field select,
body.barid .bs-wrap .bs-field textarea{
border:1px solid var(--line);
border-radius:var(--r-sm);
background-color:var(--surface);
color:var(--ink);
box-shadow:none;
min-height:48px;
}
body.barid .bs-wrap .bs-field input:hover,
body.barid .bs-wrap .bs-field select:hover,
body.barid .bs-wrap .bs-field textarea:hover{border-color:var(--bs-hover-line)}
body.barid .bs-wrap .bs-field input:focus,
body.barid .bs-wrap .bs-field select:focus,
body.barid .bs-wrap .bs-field textarea:focus{
border-color:var(--brand);
background-color:var(--card); box-shadow:var(--bs-ring);
}
body.barid .bs-wrap .bs-field select{
padding-inline-start:.85rem;
padding-inline-end:2.3rem;
}
body.barid .bs-wrap .bs-field input:disabled{
background-color:color-mix(in srgb,var(--ink) 5%,var(--surface));
color:var(--ink2); -webkit-text-fill-color:var(--ink2); opacity:1;
}
body.barid .bs-wrap .bs-row .bs-field input,
body.barid .bs-wrap .bs-row .bs-field select,
body.barid .bs-wrap .bs-row .bs-field textarea{background-color:var(--card)}
body.barid .bs-wrap .bs-row{
border:1px solid var(--line);
border-radius:var(--r-sm);
background-color:var(--surface);
}
body.barid .bs-wrap .bs-row:hover{border-color:var(--bs-hover-line)}
body.barid .bs-wrap .bs-row-n{
font-family:"Tajawal",sans-serif; font-weight:800; font-size:12.5px;
color:var(--bs-brand-text); background-color:color-mix(in srgb,var(--brand) 12%,transparent);
border-radius:var(--r-full); padding:5px 13px;
}
body.barid .bs-wrap .bs-row-calc{color:var(--muted); font-size:12.5px}
body.barid .bs-wrap .bs-remove{
width:32px; height:32px; padding:0; display:grid; place-items:center;
border-radius:var(--r-full); color:var(--muted); font-size:20px;
}
body.barid .bs-wrap .bs-remove:hover{background-color:var(--bs-err-bg); color:var(--bs-err)}
body.barid .bs-wrap .bs-form button.bs-add{
border:1.5px dashed color-mix(in srgb,var(--brand) 38%,var(--line));
background-color:var(--card); color:var(--bs-brand-text);
border-radius:var(--r-full);
font-family:"Tajawal",sans-serif; font-weight:700; font-size:14.5px;
padding:11px 22px;
}
body.barid .bs-wrap .bs-form button.bs-add:hover{
border-color:var(--brand);
background-color:color-mix(in srgb,var(--brand) 8%,var(--card));
color:var(--bs-brand-text);
}
body.barid .bs-wrap .bs-form button.bs-submit,
body.barid .bs-wrap .bs-form button.bs-bar-btn{
background:var(--grad); background-color:transparent;
color:var(--onBrand); border:0; border-radius:var(--r-full);
font-family:"Tajawal",sans-serif; font-weight:700;
padding:15px 22px;
box-shadow:0 1px 2px color-mix(in srgb,var(--ink) 18%,transparent),
0 10px 22px -10px color-mix(in srgb,var(--brand) 60%,transparent);
}
body.barid .bs-wrap .bs-form button.bs-submit:hover:not(:disabled),
body.barid .bs-wrap .bs-form button.bs-bar-btn:hover:not(:disabled){
background:var(--grad); color:var(--onBrand); filter:none; transform:translateY(-2px);
box-shadow:0 2px 5px color-mix(in srgb,var(--ink) 20%,transparent),
0 16px 30px -10px color-mix(in srgb,var(--brand) 60%,transparent);
}
body.barid .bs-wrap .bs-form button.bs-submit:disabled{opacity:.6; transform:none; box-shadow:none}
body.barid .bs-wrap .bs-submit-total{direction:ltr; unicode-bidi:isolate}
body.barid .bs-wrap .bs-price{
border:1px solid var(--line); border-radius:var(--r);
background-color:var(--card);
transition:border-color .18s, background-color .18s, box-shadow .18s;
}
body.barid .bs-wrap .bs-price:hover{border-color:var(--bs-hover-line); box-shadow:var(--sh-1)}
body.barid .bs-wrap .bs-price.is-on{
border-color:var(--brand);
background-color:var(--bs-tint);
box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 14%,transparent);
}
body.barid .bs-wrap .bs-price-label{
font-family:"Tajawal",sans-serif; font-weight:800; font-size:15px; color:var(--ink);
}
body.barid .bs-wrap .bs-price-eta{font-size:12.5px; color:var(--muted)}
body.barid .bs-wrap .bs-price-amt{
font-family:"Tajawal",sans-serif; font-weight:900; font-size:26px;
color:var(--brand); line-height:1.15; direction:ltr; unicode-bidi:isolate;
}
body.barid .bs-wrap .bs-price-amt small{
font-size:12px; font-weight:600; color:var(--muted); margin-top:2px;
}
body.barid .bs-wrap .bs-badge{
border-radius:var(--r-full); padding:2px 10px; font-size:11px; line-height:1.15;
font-family:"Tajawal",sans-serif; font-weight:800; letter-spacing:normal;
background-color:color-mix(in srgb,var(--ok) 80%,var(--ink));
}
body.barid .bs-wrap .bs-x{
border-radius:var(--r-full); background-color:var(--surface);
border:1px solid var(--line); color:var(--muted); padding:2px 9px; font-size:11.5px;
}
body.barid .bs-wrap .bs-skeleton{
border-radius:var(--r);
background:linear-gradient(90deg, var(--surface) 25%,
color-mix(in srgb,var(--ink) 8%,var(--surface)) 37%, var(--surface) 63%);
background-size:400% 100%;
}
body.barid .bs-wrap .bs-hint{color:var(--muted); font-size:14px}
body.barid .bs-wrap .bs-check{
border:1px solid var(--line); border-radius:var(--r-sm);
background-color:var(--card); padding:14px 16px; gap:12px;
}
body.barid .bs-wrap .bs-check:hover{
border-color:var(--bs-hover-line);
background-color:color-mix(in srgb,var(--brand) 4%,var(--card));
}
body.barid .bs-wrap .bs-check:has(input:checked){border-color:var(--brand); background-color:var(--bs-tint)}
body.barid .bs-wrap .bs-check input{width:19px; height:19px; accent-color:var(--brand)}
body.barid .bs-wrap .bs-check-t b{font-family:"Tajawal",sans-serif; font-weight:700; color:var(--ink)}
body.barid .bs-wrap .bs-check-d{font-size:12.5px; color:var(--muted)}
body.barid .bs-wrap .bs-check-t{flex:1 1 auto; min-width:0}
body.barid .bs-wrap .bs-check-p{
font-family:"Tajawal",sans-serif; font-weight:800; color:var(--bs-brand-text);
direction:ltr; unicode-bidi:isolate; margin-inline:0;
}
body.barid .bs-wrap .bs-note{color:var(--muted); font-size:13.5px}
body.barid .bs-wrap .bs-account{
border-radius:var(--r); padding:11px 16px; font-size:13.5px;
align-items:flex-start; color:var(--ink2);
background-color:color-mix(in srgb,var(--brand) 6%,var(--card));
border:1px solid var(--bs-tint-line);
}
body.barid .bs-wrap .bs-account a{color:var(--bs-brand-text)}
body.barid .bs-wrap .bs-weight-note{
border-radius:var(--r-sm); padding:14px 16px; color:var(--ink);
background-color:var(--bs-tint); border:1px solid var(--bs-tint-line);
}
body.barid .bs-wrap .bs-weight-hint{color:var(--muted); font-size:12.5px}
body.barid .bs-wrap .bs-estimated,
body.barid .bs-wrap .bs-warn-note,
body.barid .bs-wrap .bs-incomplete{
border-radius:var(--r-sm); padding:12px 16px; color:var(--ink);
background-color:var(--bs-warm-bg); border:1px solid var(--bs-warm-line);
}
body.barid .bs-wrap .bs-error,
body.barid .bs-wrap .bs-liquids-warn{
border-radius:var(--r-sm); padding:13px 16px; font-size:14px;
color:var(--bs-err);
background-color:var(--bs-err-bg);
border:1px solid var(--bs-err-line);
font-weight:600;
}
body.barid .bs-wrap .bs-req{color:var(--bs-err)}
body.barid .bs-wrap .bs-drop{
border:1.5px dashed color-mix(in srgb,var(--brand) 32%,var(--line));
border-radius:var(--r-sm); background-color:var(--surface);
}
body.barid .bs-wrap .bs-drop:hover,
body.barid .bs-wrap .bs-drop.is-over{border-color:var(--brand); background-color:var(--bs-tint)}
body.barid .bs-wrap .bs-drop-t{font-family:"Tajawal",sans-serif; font-weight:700; color:var(--ink)}
body.barid .bs-wrap .bs-drop-d{color:var(--muted); font-size:12.5px}
body.barid .bs-wrap .bs-thumb{border-radius:var(--r-sm); border-color:var(--line)}
body.barid .bs-wrap .bs-thumb button{background-color:var(--ink)}
body.barid .bs-wrap .bs-total-row{
font-family:"Tajawal",sans-serif; font-weight:800;
border-top:1px dashed var(--line); padding-top:14px;
}
body.barid .bs-wrap .bs-items-total{color:var(--bs-brand-text); direction:ltr; unicode-bidi:isolate}
body.barid .bs-wrap .bs-terms,
body.barid .bs-wrap .bs-sla{color:var(--muted); font-size:12.5px}
body.barid .bs-wrap .bs-terms a{color:var(--bs-brand-text); text-decoration:underline; text-underline-offset:3px}
body.barid .bs-wrap .bs-bar{
background-color:color-mix(in srgb,var(--card) 92%,transparent);
backdrop-filter:blur(14px);
border-block-start:1px solid var(--line);
box-shadow:0 -6px 22px -12px color-mix(in srgb,var(--ink) 45%,transparent);
}
body.barid .bs-wrap .bs-bar-svc{color:var(--muted); font-size:12.5px}
body.barid .bs-wrap .bs-bar-amt{
font-family:"Tajawal",sans-serif; font-weight:900; color:var(--bs-brand-text);
direction:ltr; unicode-bidi:isolate; align-self:flex-start;
}
body.barid .bs-wrap :is(input,select,textarea,button,a,[tabindex]):focus-visible{
outline:3px solid color-mix(in srgb,var(--brand) 55%,transparent);
outline-offset:2px;
}
body.barid .bs-wrap .bs-price:has(input:focus-visible){
outline:3px solid color-mix(in srgb,var(--brand) 55%,transparent);
outline-offset:2px; border-color:var(--brand);
}
@media (max-width:900px){
body.barid .bs-wrap .bs-card{border-radius:var(--r); padding:18px 16px}
body.barid .bs-wrap .bs-h{font-size:17px}
body.barid .bs-wrap .bs-price-amt{font-size:23px}
body.barid.bs-has-bar #ast-scroll-top{inset-block-end:96px}
}
@media (max-width:560px){
body.barid .bs-wrap .bs-account{border-radius:var(--r-sm); font-size:13px}
body.barid .bs-wrap .bs-sub{margin-top:20px}
body.barid .bs-wrap .bs-form button.bs-submit{padding:14px 16px; font-size:15px}
body.barid .bs-wrap .bs-price-body{min-width:0}
body.barid .bs-wrap .bs-price-label,
body.barid .bs-wrap .bs-price-eta{overflow-wrap:anywhere}
}
body.barid .bw-ship,
body.barid .bw-addr,
body.barid .bw-reqform,
body.barid .bw-home,
body.barid .bw-empty,
body.barid .bw-errors,
body.barid .bw-ok,
body.barid .bw-how{
--bw-brand:var(--ink);
--bw-accent:var(--warm);
font-family:inherit;
}
body.barid{--bw-brand-aa:color-mix(in srgb,var(--brand) 86%,var(--ink))}
body.barid .bw-item-code,
body.barid .bw-code,
body.barid .bw-addr-code,
body.barid .bw-home-code{
font-family:"Plus Jakarta Sans","IBM Plex Sans Arabic",ui-monospace,Menlo,monospace;
font-variant-numeric:tabular-nums lining;
letter-spacing:.01em;
unicode-bidi:isolate;
}
body.barid .bw-muted,
body.barid .bw-facts span,
body.barid .bw-pick-label,
body.barid .bw-f small,
body.barid .bw-opt small,
body.barid .bw-home-stat span,
body.barid .bw-tl-step,
body.barid .bw-review-where{color:var(--muted)}
body.barid .bw-help a{color:var(--muted)!important}
body.barid .bw-help a:hover{color:var(--bw-brand-aa)!important}
body.barid .bw-help{border-top-color:var(--line)}
body.barid .bw-ship,
body.barid .bw-addr,
body.barid .bw-reqform,
body.barid .bw-home{margin-inline:auto; max-width:960px}
body.barid .bw-ship-top{
position:relative; overflow:hidden;
background:linear-gradient(135deg,var(--ink) 0%,var(--ink2) 70%,var(--brand3) 190%);
color:#fff;
border-radius:var(--r-xl);
padding:24px 26px;
margin-bottom:22px;
box-shadow:var(--sh-2);
}
body.barid .bw-ship-top::after{
content:""; position:absolute; inset-inline-end:-70px; top:-90px;
width:240px; height:240px; border-radius:50%; pointer-events:none;
background:radial-gradient(circle,color-mix(in srgb,var(--brand) 60%,transparent),transparent 68%);
}
body.barid .bw-ship-top > *{position:relative; z-index:1}
body.barid .bw-ship-top h2{color:#fff; font-size:clamp(21px,2.4vw,27px); margin:0 0 6px}
body.barid .bw-ship-top .bw-muted{color:rgba(255,255,255,.76)}
body.barid .bw-ship-top .bw-muted strong{
display:inline-block;
background:color-mix(in srgb,var(--warm) 20%,transparent);
border:1px dashed color-mix(in srgb,var(--warm) 46%,transparent);
color:var(--warm);
padding:2px 11px; border-radius:var(--r-xs);
font-family:"Plus Jakarta Sans",ui-monospace,monospace;
font-variant-numeric:tabular-nums lining;
margin-inline-start:4px;
}
body.barid .bw-ship-top .bw-total{
background:rgba(255,255,255,.13);
border:1px solid rgba(255,255,255,.26);
color:#fff;
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700; font-size:13.5px;
padding:8px 18px; border-radius:var(--r-full);
white-space:nowrap;
}
body.barid .bw-item{
background:var(--card);
border:1px solid var(--line);
border-radius:var(--r-lg);
box-shadow:var(--sh-1);
padding:20px 22px;
margin-bottom:16px;
transition:border-color .2s, box-shadow .2s, transform .2s cubic-bezier(.2,.8,.3,1);
}
body.barid .bw-item:hover{
border-color:color-mix(in srgb,var(--brand) 40%,var(--line));
box-shadow:var(--sh-2);
}
body.barid .bw-item.is-selected{
border-color:var(--brand);
background:color-mix(in srgb,var(--brand) 5%,var(--card));
box-shadow:0 0 0 1px var(--brand), var(--sh-1);
}
body.barid .bw-item-head{
border-bottom:1px solid var(--line);
padding-bottom:13px; margin-bottom:15px;
}
body.barid .bw-item-head > div{
display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; min-width:0;
}
body.barid .bw-item-code{color:var(--ink); font-weight:800; font-size:15.5px}
body.barid .bw-item-head .bw-muted{unicode-bidi:plaintext}
body.barid .bw-badge{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700; font-size:13px;
padding:6px 15px; border-radius:var(--r-full);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
}
body.barid .bw-facts > div{
background:var(--surface);
border:1px solid var(--line);
border-radius:var(--r-sm);
padding:11px 13px;
min-width:0;
}
body.barid .bw-facts span{font-size:12.5px; font-weight:600}
body.barid .bw-facts strong{
color:var(--ink); font-size:14.5px; font-weight:700;
font-variant-numeric:tabular-nums lining;
overflow-wrap:anywhere;
}
body.barid .bw-gallery a{
border:1px solid var(--line); border-radius:var(--r-sm);
transition:border-color .2s, box-shadow .2s;
}
body.barid .bw-gallery a:hover{border-color:var(--brand); box-shadow:var(--sh-1)}
body.barid .bw-pick-lead,
body.barid .bw-filter{
background:color-mix(in srgb,var(--brand) 7%,var(--card));
border:1px solid color-mix(in srgb,var(--brand) 18%,var(--line));
border-radius:var(--r-sm);
color:var(--ink);
padding:12px 16px;
}
body.barid .bw-filter a{color:var(--bw-brand-aa); font-weight:700}
body.barid .bw-pick-box{
background:var(--surface);
border:1px solid var(--line);
border-radius:var(--r-full);
padding-block:5px; padding-inline:10px 13px;
}
body.barid .bw-item.is-selected .bw-pick-box{
background:color-mix(in srgb,var(--brand) 12%,transparent);
border-color:color-mix(in srgb,var(--brand) 40%,transparent);
}
body.barid .bw-pick-box input,
body.barid .bw-opt input{accent-color:var(--brand)}
body.barid .bw-pick-label{font-size:13px}
body.barid .bw-selbar{
background:linear-gradient(135deg,var(--ink),var(--ink2));
border:1px solid rgba(255,255,255,.14);
border-radius:var(--r-lg);
box-shadow:var(--sh-2);
padding:14px 20px;
z-index:100;
}
body.barid .bw-selbar-txt b{color:var(--warm)}
body.barid .bw-btn{
background:var(--bw-brand-aa);
border-radius:var(--r-full);
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700; font-size:15px;
padding:12px 26px;
box-shadow:0 1px 2px color-mix(in srgb,var(--ink) 18%,transparent),
0 8px 18px -10px color-mix(in srgb,var(--brand) 55%,transparent);
transition:transform .18s cubic-bezier(.2,.8,.3,1), background .18s, box-shadow .18s;
}
body.barid .bw-btn:hover{
background:color-mix(in srgb,var(--brand) 70%,var(--ink));
transform:translateY(-2px);
}
body.barid .bw-selbar .bw-btn{
background:#fff; color:var(--ink)!important;
box-shadow:0 6px 18px -8px rgba(0,0,0,.5);
}
body.barid .bw-selbar .bw-btn:hover{background:var(--warm)}
body.barid .bw-btn-ghost{
border:1px solid var(--line);
color:var(--ink)!important;
box-shadow:none;
}
body.barid .bw-btn-ghost:hover{
border-color:var(--brand);
background:color-mix(in srgb,var(--brand) 8%,transparent)!important;
color:var(--bw-brand-aa)!important;
}
body.barid .bw-btn.bw-copy{
font-size:14.5px;
padding:12px 26px;
border:0;
background:var(--bw-brand-aa);
box-shadow:none;
}
body.barid .bw-btn.bw-copy:hover{
background:color-mix(in srgb,var(--brand) 70%,var(--ink));
transform:none;
}
body.barid .bw-btn.bw-copy.is-done{
background:color-mix(in srgb,var(--ok) 78%,var(--ink));
border:0;
}
body.barid .bw-copy{
border:1px solid var(--line);
border-radius:var(--r-full);
color:var(--ink);
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700; font-size:12px;
padding:4px 12px;
transition:border-color .18s, background .18s, color .18s;
}
body.barid .bw-copy:hover{
border-color:var(--brand); color:var(--bw-brand-aa);
background:color-mix(in srgb,var(--brand) 8%,transparent);
}
body.barid .bw-copy.is-done{
background:color-mix(in srgb,var(--ok) 12%,transparent);
border-color:color-mix(in srgb,var(--ok) 45%,transparent);
color:var(--ok);
}
body.barid .bw-pager a{
border:1px solid var(--line);
border-radius:var(--r-full);
color:var(--ink);
font-weight:700;
padding:8px 14px;
transition:border-color .18s, color .18s, background .18s;
}
body.barid .bw-pager a:hover{border-color:var(--brand); color:var(--bw-brand-aa)}
body.barid .bw-pager a.is-current{
background:var(--bw-brand-aa); border-color:var(--bw-brand-aa); color:var(--onBrand);
}
body.barid .bw-empty{
background:var(--card);
border:1px dashed color-mix(in srgb,var(--brand) 34%,var(--line));
border-radius:var(--r-xl);
color:var(--ink);
padding:38px 24px;
box-shadow:var(--sh-1);
}
body.barid .bw-empty::before{
content:""; display:block; width:60px; height:60px; margin:0 auto 16px;
border-radius:var(--r-lg);
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8v8a2 2 0 0 1-1 1.73l-7 4a2 2 0 0 1-2 0l-7-4A2 2 0 0 1 3 16V8a2 2 0 0 1 1-1.73l7-4a2 2 0 0 1 2 0l7 4A2 2 0 0 1 21 8z'/%3E%3Cpath d='m3.3 7 8.7 5 8.7-5'/%3E%3Cpath d='M12 22V12'/%3E%3C/svg%3E")
no-repeat center/30px 30px,
linear-gradient(135deg,var(--brand),var(--brand3));
box-shadow:0 12px 26px -14px var(--brand);
}
body.barid .bw-empty p:first-of-type strong{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-size:18px; color:var(--ink);
}
body.barid .bw-empty p{color:var(--muted); max-width:46ch; margin-inline:auto}
body.barid .bw-empty p strong{color:var(--ink)}
body.barid .bw-ok,
body.barid .bw-errors,
body.barid .bw-note{border-radius:var(--r-lg)}
body.barid .bw-ok{
background:color-mix(in srgb,var(--ok) 10%,var(--card));
border-color:color-mix(in srgb,var(--ok) 34%,transparent);
border-inline-start:4px solid var(--ok);
color:color-mix(in srgb,var(--ok) 55%,var(--ink));
}
body.barid .bw-ok strong{font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif}
body.barid .bw-errors{
background:#FDECEA;
border-color:#F0B4AE;
border-inline-start:4px solid #C2410C;
color:#7A2620;
box-shadow:var(--sh-1);
}
body.barid .bw-note{
background:color-mix(in srgb,var(--warm) 16%,var(--card));
border-color:color-mix(in srgb,var(--warm) 52%,transparent);
border-inline-start:4px solid var(--warm);
}
body.barid .bw-note strong{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
color:var(--ink); font-size:13.5px;
}
body.barid .bw-note p{color:var(--ink)}
body.barid .bw-timeline{gap:14px; margin-top:16px}
body.barid .bw-tl-step{position:relative; align-items:center}
body.barid .bw-tl-step i{
width:26px; height:26px;
background:var(--surface);
border:1px solid var(--line);
color:var(--muted);
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
z-index:1;
}
body.barid .bw-tl-step.is-done{color:var(--ink)}
body.barid .bw-tl-step.is-done i{
background:var(--bw-brand-aa); border-color:var(--bw-brand-aa); color:var(--onBrand);
box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent);
}
body.barid .bw-tl-step:not(:last-child)::before{
content:""; position:absolute;
inset-inline-start:12px;
top:calc(50% + 13px); height:14px; width:2px;
background:var(--line);
}
body.barid .bw-tl-step.is-done:not(:last-child)::before{
background:color-mix(in srgb,var(--brand) 55%,var(--line));
}
body.barid .bw-fbox{
background:var(--card);
border:1px solid var(--line);
border-radius:var(--r-lg);
box-shadow:var(--sh-1);
padding:20px 22px;
}
body.barid .bw-fbox h3{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-size:17px; color:var(--ink);
}
body.barid .bw-f > span{color:var(--ink2); font-size:13.5px}
body.barid .bw-f .req{color:#C2410C}
body.barid .bw-f input,
body.barid .bw-fbox textarea{
border:1px solid var(--line)!important;
border-radius:var(--r-sm)!important;
background:var(--surface)!important;
color:var(--ink)!important;
font-family:inherit;
font-size:15px!important;
padding:12px 15px!important;
}
body.barid .bw-f input:hover,
body.barid .bw-fbox textarea:hover{border-color:color-mix(in srgb,var(--ink) 26%,var(--line))!important}
body.barid .bw-f input::placeholder,
body.barid .bw-fbox textarea::placeholder,
body.barid .bw-review-form input::placeholder,
body.barid .bw-review-form textarea::placeholder{
color:var(--muted);
opacity:1;
}
body.barid .bw-f input:focus,
body.barid .bw-fbox textarea:focus{
border-color:var(--brand)!important;
background:var(--card)!important;
box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 13%,transparent)!important;
}
body.barid .bw-f-hint input{
border-color:color-mix(in srgb,var(--warm) 70%,var(--ink))!important;
background:color-mix(in srgb,var(--warm) 13%,var(--card))!important;
}
body.barid .bw-f-hint input:focus{
border-color:var(--brand)!important;
background:var(--card)!important;
}
body.barid .bw-opt{
border:1px solid var(--line);
border-radius:var(--r-sm);
padding:12px 14px;
transition:border-color .18s, background .18s;
}
body.barid .bw-opt:hover{border-color:color-mix(in srgb,var(--brand) 35%,var(--line))}
body.barid .bw-opt:has(input:checked){
border-color:var(--brand);
background:color-mix(in srgb,var(--brand) 6%,transparent);
}
body.barid .bw-opt b{color:var(--ink); font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif}
body.barid .bw-chip{
background:var(--surface);
border:1px solid var(--line);
border-radius:var(--r-full);
color:var(--ink);
padding:7px 14px;
}
body.barid .bw-chip b{color:var(--ink)}
body.barid .bw-chip.is-total{
background:var(--ink); border-color:var(--ink); color:#fff;
}
body.barid .bw-chip.is-total b{color:var(--warm)}
body.barid .bw-addr,
body.barid .bw-home-addr,
body.barid .bw-home-stat{
background:var(--card);
border:1px solid var(--line);
border-radius:var(--r-lg);
box-shadow:var(--sh-1);
}
body.barid .bw-addr{padding:24px}
body.barid .bw-addr-head h3,
body.barid .bw-home-addr h3{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
color:var(--ink); font-size:20px;
}
body.barid .bw-addr-code{
background:color-mix(in srgb,var(--warm) 28%,transparent);
border:1px solid color-mix(in srgb,var(--warm) 60%,transparent);
color:var(--ink);
border-radius:var(--r-xs);
padding:6px 15px;
}
body.barid .bw-addr-warn{
background:color-mix(in srgb,var(--warm) 15%,var(--card));
border:1px solid color-mix(in srgb,var(--warm) 48%,transparent);
border-inline-start:4px solid var(--warm);
border-radius:var(--r-sm);
color:var(--ink);
padding:12px 16px;
}
body.barid .bw-addr-warn strong{color:var(--ink)}
body.barid .bw-addr-table th,
body.barid .bw-addr-table td{
border-bottom:1px solid var(--line);
padding:11px 14px;
}
body.barid .bw-addr-table th{
background:var(--surface);
color:var(--muted);
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700;
}
body.barid .bw-addr-table td{
color:var(--ink);
overflow-wrap:anywhere;
}
body.barid .bw-addr-table tr:last-child th,
body.barid .bw-addr-table tr:last-child td{border-bottom:0}
body.barid .bw-home-hero{
position:relative; overflow:hidden;
background:linear-gradient(135deg,var(--ink) 0%,var(--ink2) 70%,var(--brand3) 190%);
border-radius:var(--r-xl);
box-shadow:var(--sh-2);
padding:24px 26px;
}
body.barid .bw-home-hero::after{
content:""; position:absolute; inset-inline-end:-70px; top:-90px;
width:240px; height:240px; border-radius:50%; pointer-events:none;
background:radial-gradient(circle,color-mix(in srgb,var(--brand) 60%,transparent),transparent 68%);
}
body.barid .bw-home-hero > *{position:relative; z-index:1}
body.barid .bw-home-who strong{font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif; font-size:21px}
body.barid .bw-home-code{
background:color-mix(in srgb,var(--warm) 22%,transparent);
border:1px dashed color-mix(in srgb,var(--warm) 50%,transparent);
color:var(--warm);
border-radius:var(--r-sm);
font-size:19px;
}
body.barid .bw-home-stat{padding:16px 18px}
body.barid .bw-home-stat b{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
color:var(--brand); font-size:27px;
}
body.barid .bw-home-next{
background:color-mix(in srgb,var(--warm) 16%,var(--card));
border:1px solid color-mix(in srgb,var(--warm) 52%,transparent);
border-inline-start:4px solid var(--warm);
border-radius:var(--r-lg);
padding:18px 20px;
}
body.barid .bw-home-next strong{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
color:var(--ink); font-size:15.5px;
}
body.barid .bw-home-next p{color:var(--ink)}
body.barid .bw-home-addr{padding:22px}
body.barid.woocommerce-account.logged-in .woocommerce{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:24px;
}
body.barid.woocommerce-account.logged-in .woocommerce::before,
body.barid.woocommerce-account.logged-in .woocommerce::after{display:none}
@media (min-width:1000px){
body.barid.woocommerce-account.logged-in .woocommerce{grid-template-columns:264px minmax(0,1fr)}
}
body.barid .woocommerce-MyAccount-navigation,
body.barid .woocommerce-MyAccount-content{width:auto; float:none; margin:0; min-width:0}
body.barid .woocommerce-MyAccount-navigation{
background:var(--surface);
border:1px solid var(--line);
border-radius:var(--r-lg);
padding:10px;
align-self:start;
}
body.barid .woocommerce-MyAccount-navigation ul{list-style:none; margin:0; padding:0}
body.barid .woocommerce-MyAccount-navigation li{margin:0; border:0}
body.barid .woocommerce-MyAccount-navigation li a{
display:block;
padding:11px 16px;
border-radius:var(--r-sm);
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:700; font-size:15px;
color:var(--ink);
text-decoration:none;
transition:background .18s, color .18s;
}
body.barid .woocommerce-MyAccount-navigation li a:hover{
background:color-mix(in srgb,var(--brand) 10%,transparent);
color:var(--bw-brand-aa);
}
body.barid .woocommerce-MyAccount-navigation li.is-active > a{
background:var(--bw-brand-aa);
color:var(--onBrand);
box-shadow:0 6px 16px -10px var(--brand);
}
body.barid .woocommerce-MyAccount-navigation li a{color:var(--ink) !important}
body.barid .woocommerce-MyAccount-navigation li a:hover{color:var(--bw-brand-aa) !important}
body.barid .woocommerce-MyAccount-navigation li.is-active > a{color:var(--onBrand) !important}
body.barid .woocommerce-MyAccount-navigation li a br{display:none}
body.barid .woocommerce-MyAccount-content{color:var(--ink)}
body.barid .bw-reviews{max-width:var(--maxw)}
body.barid .bw-reviews-title{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-weight:800; color:var(--ink);
font-size:clamp(24px,3.2vw,34px);
}
body.barid .bw-review{
background:var(--card);
border:1px solid var(--line);
border-radius:var(--r-lg);
box-shadow:var(--sh-1);
transition:border-color .2s, box-shadow .2s;
}
body.barid .bw-review:hover{
border-color:color-mix(in srgb,var(--brand) 38%,var(--line));
box-shadow:var(--sh-2);
}
body.barid .bw-review blockquote{
color:var(--ink); font-size:15.5px;
border:0; padding-inline:0;
}
body.barid .bw-review blockquote::before{color:color-mix(in srgb,var(--brand) 45%,transparent)}
body.barid .bw-review figcaption{border-top-color:var(--line)}
body.barid .bw-review-who{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif; color:var(--ink);
}
body.barid .bw-review-ok{
background:color-mix(in srgb,var(--ok) 12%,transparent);
color:color-mix(in srgb,var(--ok) 70%,var(--ink));
border-radius:var(--r-full);
}
body.barid .bw-review-form label{
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
color:var(--ink2); font-size:13.5px;
}
body.barid .bw-review-form input[type=text],
body.barid .bw-review-form select,
body.barid .bw-review-form textarea{
border:1px solid var(--line);
border-radius:var(--r-sm);
background:var(--surface);
color:var(--ink);
font-family:inherit; font-size:15px;
padding:12px 15px;
height:auto;
min-height:48px;
}
body.barid .bw-review-form textarea{min-height:110px}
body.barid .bw-review-form input[type=text]:focus,
body.barid .bw-review-form select:focus,
body.barid .bw-review-form textarea:focus{
border-color:var(--brand);
background:var(--card);
box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 13%,transparent);
}
body.barid .bw-review-note{
background:color-mix(in srgb,var(--brand) 8%,var(--card));
border:1px solid color-mix(in srgb,var(--brand) 22%,var(--line));
border-radius:var(--r-lg);
color:var(--ink);
}
body.barid .bw-review-ok-note{
background:color-mix(in srgb,var(--ok) 11%,var(--card));
border-color:color-mix(in srgb,var(--ok) 34%,transparent);
color:color-mix(in srgb,var(--ok) 55%,var(--ink));
}
body.barid .bw-f input:focus-visible,
body.barid .bw-fbox textarea:focus-visible{
outline:2px solid var(--brand)!important;
outline-offset:3px!important;
}
body.barid .bw-btn:focus-visible,
body.barid .bw-btn-ghost:focus-visible,
body.barid .bw-copy:focus-visible,
body.barid .bw-pager a:focus-visible,
body.barid .bw-help a:focus-visible,
body.barid .bw-gallery a:focus-visible,
body.barid .bw-pick-box input:focus-visible,
body.barid .bw-opt input:focus-visible,
body.barid .bw-review-form input:focus-visible,
body.barid .bw-review-form select:focus-visible,
body.barid .bw-review-form textarea:focus-visible,
body.barid .woocommerce-MyAccount-navigation li a:focus-visible,
body.barid .bw-hdr-link:focus-visible{
outline:2px solid var(--brand);
outline-offset:3px;
}
body.barid .bw-selbar .bw-btn:focus-visible,
body.barid .bw-ship-top a:focus-visible,
body.barid .bw-home-hero a:focus-visible,
body.barid .bw-hdr-btn:focus-visible,
body.barid .woocommerce-MyAccount-navigation li.is-active > a:focus-visible{
outline:2px solid #fff;
outline-offset:3px;
box-shadow:0 0 0 5px color-mix(in srgb,var(--brand) 55%,transparent);
}
body.barid .bw-lightbox{background:color-mix(in srgb,var(--ink) 92%,transparent)}
@media (max-width:600px){
body.barid .bw-ship-top{padding:20px; border-radius:var(--r-lg)}
body.barid .bw-ship-top .bw-total{align-self:flex-start}
body.barid .bw-item{padding:16px}
body.barid .bw-item-head{flex-direction:column; align-items:flex-start; gap:11px}
body.barid .bw-addr,
body.barid .bw-fbox,
body.barid .bw-home-addr{padding:16px}
body.barid .bw-empty{padding:30px 18px}
body.barid .bw-btn{width:100%; text-align:center}
body.barid .bw-selbar .bw-btn{width:auto}
body.barid .bw-facts{grid-template-columns:repeat(auto-fit,minmax(112px,1fr))}
}
@media (max-width:560px){
body.barid .bw-addr-table,
body.barid .bw-addr-table tbody,
body.barid .bw-addr-table tr,
body.barid .bw-addr-table th,
body.barid .bw-addr-table td{display:block; width:auto}
body.barid .bw-addr-table tr{
border:1px solid var(--line);
border-radius:var(--r-sm);
margin-bottom:10px;
overflow:hidden;
}
body.barid .bw-addr-table th{
border-bottom:1px solid var(--line);
font-size:12.5px;
padding:8px 14px;
}
body.barid .bw-addr-table td{border-bottom:0; padding:12px 14px}
body.barid .bw-addr-table tr:last-child{margin-bottom:0}
body.barid .bw-copy{display:inline-block; margin-top:8px; margin-inline-start:0; padding-block:8px}
}
body.barid .oregon h1, body.barid .oregon h2, body.barid .oregon h3,
body.barid .cta h1, body.barid .cta h2, body.barid .cta h3,
body.barid .counters h1, body.barid .counters h2, body.barid .counters h3,
body.barid .dk h1, body.barid .dk h2, body.barid .dk h3, body.barid .dk h4,
body.barid .belt h2, body.barid .lblband h2, body.barid .entry-content .oregon h2, body.barid .entry-content .cta h2,
body.barid .entry-content .dk h2, body.barid .entry-content .dk h3{color:#fff}
body.barid .oregon p, body.barid .cta p, body.barid .dk p{color:rgba(255,255,255,.78)}
@media (max-width:921px){
body.barid .ast-mobile-menu-trigger-minimal,
body.barid .menu-toggle,
body.barid .ekit_menu_responsive .ekit-menu-hamburger{
min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
}
body.barid .blogo b{
font-family:"Plus Jakarta Sans","Inter",system-ui,sans-serif;
font-weight:800;
font-size:16.5px;
letter-spacing:-.035em;
color:var(--ink,#0B1230);
white-space:nowrap;
line-height:1;
display:block;
}
body.barid .mq .btile{
min-width:132px;
padding:14px 20px;
background:var(--card,#fff);
border:1px solid var(--line,#E4E6F0);
border-radius:14px;
box-shadow:0 1px 2px rgba(11,18,48,.04);
transition:border-color .2s, transform .2s, box-shadow .2s;
}
body.barid .mq .btile:hover{
border-color:color-mix(in srgb, var(--brand,#4B6BFF) 42%, var(--line,#E4E6F0));
box-shadow:0 8px 20px rgba(75,107,255,.12);
}
body.barid .mq .btile:hover .blogo b{color:var(--brand,#4B6BFF)}
body.barid .carriers .blogo b{font-size:18px;letter-spacing:-.04em}
body.barid .store-card .blogo{
height:auto;
margin-bottom:10px;
min-height:26px;
align-items:flex-start;
justify-content:flex-start;
}
body.barid .store-card .blogo b{font-size:19px;letter-spacing:-.04em}
body.barid .store-card:hover .blogo b{color:var(--brand,#4B6BFF)}
@media (max-width:600px){
body.barid .mq .btile{min-width:112px;padding:12px 16px}
body.barid .blogo b{font-size:15px}
}
@media (max-width:600px){
body.barid small,
body.barid .bs-h-note, body.barid .bs-weight-hint, body.barid .bs-check-d,
body.barid .bs-warn-note, body.barid .bs-drop-d, body.barid .bs-note,
body.barid .bw-hint, body.barid .bw-muted,
body.barid .bs-terms, body.barid .bs-sla, body.barid .dash-url,
body.barid .oregon-note, body.barid .frame-cap, body.barid .disclaim{
font-size:13.5px!important;line-height:1.75}
body.barid .copy,
body.barid .bs-remove,
body.barid .bs-add{min-width:40px;min-height:40px;
display:inline-flex;align-items:center;justify-content:center}
body.barid .chip, body.barid .tag, body.barid .code-pill{
font-size:13px;padding-block:7px}
body.barid .counters-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
body.barid .ct b{font-size:34px}
body.barid .ct > span{font-size:13.5px}
}
body.barid .dash-head h3{color:var(--ink)}
@media (max-width:640px){
body.barid .bar-row{grid-template-columns:88px minmax(24px,1fr) 62px;gap:8px;font-size:13px}
body.barid .bars{padding:18px}
}
body.barid .store-card--flat{cursor:default}
body.barid .store-card--flat:hover{transform:none;box-shadow:var(--sh-1)}
body.barid.woocommerce-account:not(.logged-in) .woocommerce h2,
body.barid .ur-frontend-form h2,
body.barid .user-registration h2{color:var(--ink) !important}
body.barid.woocommerce-account:not(.logged-in) form.login label,
body.barid.woocommerce-account:not(.logged-in) form.login .woocommerce-form-login__rememberme,
body.barid .ur-frontend-form label,
body.barid .user-registration label,
body.barid .woocommerce form .form-row label{color:var(--ink) !important}
body.barid.woocommerce-account:not(.logged-in) form.login input.input-text,
body.barid .ur-frontend-form input,
body.barid .user-registration input,
body.barid .woocommerce form .form-row input.input-text{color:var(--ink) !important}
body.barid .ur-frontend-form input:focus,
body.barid .user-registration input:focus,
body.barid .woocommerce form .form-row input.input-text:focus{
border-color:var(--brand) !important;
box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent) !important;
}
body.barid.woocommerce-account:not(.logged-in) form.login button.button,
body.barid .ur-frontend-form button,
body.barid .user-registration button,
body.barid .woocommerce button.button,
body.barid .woocommerce input.button{
background:var(--bw-brand-aa) !important;
color:var(--onBrand) !important;
box-shadow:0 12px 28px -14px var(--brand) !important;
}
body.barid.woocommerce-account:not(.logged-in) form.login button.button:hover,
body.barid .ur-frontend-form button:hover,
body.barid .user-registration button:hover,
body.barid .woocommerce button.button:hover,
body.barid .woocommerce input.button:hover{
background:var(--ink2) !important;
color:var(--onBrand) !important;
}
body.barid.woocommerce-account:not(.logged-in) form.login .lost_password a,
body.barid .barid-login-register-link a,
body.barid .woocommerce-LostPassword a,
body.barid .woocommerce form.login a,
body.barid .user-registration a{color:var(--bw-brand-aa) !important}
body.barid.woocommerce-account:not(.logged-in) form.login .lost_password a:hover,
body.barid .barid-login-register-link a:hover,
body.barid .woocommerce-LostPassword a:hover,
body.barid .user-registration a:hover{
color:var(--ink2) !important;
text-decoration:underline !important;
}
body.barid .barid-login-register-link{color:var(--ink) !important}
body.barid .user-registration .password_preview,
body.barid .ur-frontend-form .password_preview{color:var(--muted) !important}
body.barid .barid-register-hero{
background:
radial-gradient(circle at left top, color-mix(in srgb,var(--brand2) 22%,transparent), transparent 34%),
linear-gradient(135deg, var(--ink) 0%, var(--ink2) 72%, var(--ink) 100%) !important;
box-shadow:0 24px 70px color-mix(in srgb,var(--ink) 20%,transparent) !important;
}
body.barid .barid-register-hero h1 strong{color:var(--brand2) !important}
body.barid .bw-ship-top h2,
body.barid .bw-ship-top h1,
body.barid .bw-ship-top h3{color:#fff !important}
body.barid .bw-ship-top .bw-muted{color:rgba(255,255,255,.78) !important}
body.barid .bw-home-code{
background:color-mix(in srgb,var(--brand2) 20%,transparent) !important;
border-color:color-mix(in srgb,var(--brand2) 52%,transparent) !important;
color:var(--brand2) !important;
}
body.barid .bw-ship-top .bw-muted strong{
background:color-mix(in srgb,var(--brand2) 20%,transparent) !important;
border-color:color-mix(in srgb,var(--brand2) 52%,transparent) !important;
color:var(--brand2) !important;
}
body.barid .bw-home-next{
background:color-mix(in srgb,var(--brand) 6%,var(--card)) !important;
border-color:color-mix(in srgb,var(--brand) 26%,transparent) !important;
}
body.barid .bw-home-next strong,
body.barid .bw-home-next b{color:var(--bw-brand-aa) !important}
body.barid .dk .btn-ghost,
body.barid .cta .btn-ghost,
body.barid .oregon .btn-ghost{
color:#fff;
border-color:rgba(255,255,255,.42);
background:rgba(255,255,255,.06);
}
body.barid .dk .btn-ghost:hover,
body.barid .cta .btn-ghost:hover,
body.barid .oregon .btn-ghost:hover{
border-color:#fff;
background:rgba(255,255,255,.14);
}
body.barid .store-card{position:relative}
body.barid .store-tag{
position:absolute; top:9px; inset-inline-start:9px;
font-family:"Tajawal","IBM Plex Sans Arabic",sans-serif;
font-size:10px; font-weight:800; line-height:1;
padding:4px 8px; border-radius:100px;
background:color-mix(in srgb,var(--brand) 13%,var(--card));
border:1px solid color-mix(in srgb,var(--brand) 30%,transparent);
color:var(--bw-brand-aa);
pointer-events:none;
}
body.barid .store-flag.no{
background:color-mix(in srgb,var(--brand) 11%,transparent);
color:var(--bw-brand-aa);
}
body.barid .bc-burger,
body.barid.woocommerce-checkout .bc-burger,
body.barid .menu-toggle,
body.barid .main-header-menu-toggle,
body.barid .ast-mobile-menu-trigger-minimal,
body.barid .ast-mobile-menu-trigger-fill,
body.barid .ekit_menu_responsive .ekit-menu-hamburger{
background:#fff !important;
border:1px solid rgba(11,18,48,.14) !important;
color:var(--ink,#0B1230) !important;
}
body.barid .bc-burger span{background:var(--ink,#0B1230) !important}
body.barid .menu-toggle::before,
body.barid .main-header-menu-toggle::before,
body.barid .ast-mobile-menu-trigger-minimal .menu-toggle-icon,
body.barid .ekit-menu-hamburger span{color:var(--ink,#0B1230) !important;background:var(--ink,#0B1230) !important}
body.barid.woocommerce-checkout .shop_table thead th,
body.barid.woocommerce-checkout .cart_totals table th,
body.barid.woocommerce-checkout table.shop_table th{
background:var(--ink,#0B1230) !important; color:#fff !important;
border-color:transparent !important;
}
body.barid.woocommerce-checkout .shop_table,
body.barid.woocommerce-checkout .cart_totals table{
border:1px solid var(--line,#E7E3DC) !important; border-radius:14px !important;
overflow:hidden; background:#fff !important;
}
body.barid.woocommerce-checkout .shop_table td,
body.barid.woocommerce-checkout .cart_totals table td,
body.barid.woocommerce-checkout .shop_table th{
border-color:var(--line2,#EEEDF6) !important; color:var(--ink,#0B1230) !important;
}
body.barid.woocommerce-checkout .order-total .amount,
body.barid.woocommerce-checkout .order-total th{font-weight:800 !important}
body.barid.woocommerce-checkout .woocommerce form.checkout > p{
text-align:center; color:var(--muted,#5D6785); font-weight:600; letter-spacing:.04em;
}
body.barid.woocommerce-checkout .StripeElement:empty{min-height:0 !important}
body.barid .sib-cities{padding:26px 0 8px}
body.barid .sib-cities h2{font-size:20px;margin:0 0 12px}
body.barid .sib-links{display:flex;flex-wrap:wrap;gap:10px}
body.barid .sib-link{display:inline-block;padding:10px 16px;border-radius:999px;border:1px solid var(--line,#E7E3DC);
background:var(--card,#fff);color:var(--ink,#0B1230);font-weight:700;font-size:14.5px;text-decoration:none}
body.barid .sib-link:hover{border-color:var(--brand,#4B6BFF);color:var(--brand,#4B6BFF)}
body.barid.woocommerce-cart :is(h1,h2,h3,h4,h5,h6,p,a,td,th,input,button,textarea,span,label),
body.barid.woocommerce-checkout :is(h1,h2,h3,h4,h5,h6,p,a,td,th,input,button,textarea,span,label,.woocommerce-info){
font-family:inherit !important}
body.barid.woocommerce-cart, body.barid.woocommerce-checkout{font-family:"IBM Plex Sans Arabic","SF Arabic","Geeza Pro",Tahoma,sans-serif}
body.barid.woocommerce-cart :is(h1,h2,h3,h4,h5,h6),
body.barid.woocommerce-checkout :is(h1,h2,h3,h4,h5,h6){font-family:Tajawal,"IBM Plex Sans Arabic",sans-serif !important}
body.barid textarea, body.barid input.input-text, body.barid .field textarea, body.barid select{font-family:inherit}