:root{--navy:#1F2A1C;--blue:#B94E15;--blue-soft:#FCE9DC;--bg:#FAF7F2;--card:#fff;--fg:#1E2420;--muted:#5F6B62;--line:#E7E1D6;--green:#2F8A1E;--leaf:#62BB46;--green-soft:#E8F5E1;--amber:#8A5A00;--amber-soft:#FFF4DC;--hd:#fff;--h1:#FFF1E4;--h2:#E9F6E2;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#151813;--card:#1F231C;--fg:#EEF2EA;--muted:#A5AFA2;--line:#333A2E;--blue:#F29A62;--blue-soft:#3A2416;--green:#7FD060;--green-soft:#1D3317;--amber-soft:#3A2A0C;--amber:#F0B85A;--hd:#1A1D17;--h1:#2C1D12;--h2:#17281A;color-scheme:dark}}
:root[data-theme=dark]{--bg:#151813;--card:#1F231C;--fg:#EEF2EA;--muted:#A5AFA2;--line:#333A2E;--blue:#F29A62;--blue-soft:#3A2416;--green:#7FD060;--green-soft:#1D3317;--amber-soft:#3A2A0C;--amber:#F0B85A;--hd:#1A1D17;--h1:#2C1D12;--h2:#17281A;color-scheme:dark}
[dir=rtl]{--display:"Noto Sans Arabic",system-ui,sans-serif;--body:"Noto Sans Arabic",system-ui,sans-serif}
header{background:var(--hd);color:var(--fg);border-bottom:1px solid var(--line)}
.logo{background:none;padding:0}.logo .lg{height:44px;width:163px}
.search input{border:1px solid var(--line);border-inline-end:0;background:var(--card);color:var(--fg)}
.search button,.add .go,.b1{background:#B94E15}.add .go.in,.b2{background:#2F8A1E}
.cartbtn{color:var(--fg);border-color:var(--line)}.cartbtn b{background:#62BB46;color:#102A0A}
.hx{flex:none;font:600 13px var(--body);padding:9px 8px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--fg);cursor:pointer}
.note{background:#B94E15}.note .wrap{gap:4px 18px;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none}#th{font-size:17px;line-height:1;padding:7px 10px}.note button{all:unset;cursor:pointer;font-weight:600;padding:2px 0}.note button:focus-visible{outline:2px solid #fff}
footer{background:#1F2A1C}
.hero{background:linear-gradient(135deg,var(--h1),var(--h2));color:var(--fg);border:1px solid var(--line)}
.hero h1{text-transform:uppercase;font-weight:700;max-width:16ch}.hero h1 em{font-style:normal;color:var(--blue)}
.eyebrow{color:var(--blue)}.hl{color:var(--muted)}
.stats div{background:var(--card);border-color:var(--line)}.stats dd{color:var(--muted)}.stats dt{color:var(--green)}
.steps li::before{background:#2F8A1E}
.sx{scroll-margin-top:130px}.sx>p{max-width:75ch;color:var(--muted);margin:0 0 12px}
.g{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;list-style:none;padding:0;margin:0}
.g li,.box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.g b{display:block;font:700 15px var(--display);margin-bottom:3px}.g span{color:var(--muted);font-size:13.5px}
.hap li{display:flex;gap:12px;align-items:flex-start}.hap i{flex:none;font:700 26px var(--display);font-style:normal;color:#fff;background:#B94E15;border-radius:10px;width:42px;height:42px;display:grid;place-items:center}.hap li:nth-child(even) i{background:#2F8A1E}
.ser{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.ser button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;height:100%;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;font:600 14px var(--body);display:flex;flex-direction:column;gap:6px}.ser button:hover,.ser button:focus-visible{border-color:var(--blue)}.ser i{font-style:normal;font-size:26px}
.num li{counter-increment:n}.num{counter-reset:n}.num li::before{content:counter(n);font:700 13px var(--display);color:#fff;background:#2F8A1E;border-radius:99px;display:inline-grid;place-items:center;width:26px;height:26px;margin-inline-end:8px}.num li{display:flex;align-items:center;font-weight:600;font-size:14px}
.kv{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:8px 16px;margin:0}.kv dt{font-weight:700}.kv dd{margin:0;color:var(--muted)}
.dog{text-align:center;margin-top:28px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}.dog img{max-width:100%;height:auto}.dog p{margin:0;font:700 13px var(--display);letter-spacing:.12em;color:#1E2420}
.fr{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:14px}.fr .w{grid-column:1/-1}.fr button{justify-self:start}
.ctl{display:flex;flex-wrap:wrap;gap:10px 16px;padding-bottom:12px}.ctl label{flex-direction:row;align-items:center;gap:8px}.ctl select,.ctl input{font:inherit;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--fg)}.ctl input{width:90px}
.panel>.sendto{order:2}.sendto select{font:inherit;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg)}
[dir=rtl] .search input{border-radius:0 10px 10px 0}[dir=rtl] .search button{border-radius:10px 0 0 10px}[dir=rtl] .fab{right:auto;left:16px}[dir=rtl] .drawer{justify-content:flex-start}
@media (max-width:560px){.logo .lg{height:36px;width:133px}.cartbtn{margin-left:0;margin-inline-start:0;padding:8px 10px}.cartbtn span{display:none}.cartbtn::before{content:"🛒"}.hx{margin-inline-start:auto;padding:8px 4px;max-width:92px}.hx+.hx{margin-inline-start:0}.note span{display:none!important}.kv{grid-template-columns:1fr;gap:2px}.kv dd{margin-bottom:8px}}
.card{transition:transform .18s,box-shadow .18s}.card:hover{transform:translateY(-3px);box-shadow:0 8px 22px #0002}
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}.rv.in{opacity:1;transform:none}
footer .wrap{flex-direction:column;gap:4px;padding-bottom:88px}
#intro{position:fixed;inset:0;z-index:100;background:#0D110B;color:#F4EFE4;display:flex;align-items:center;justify-content:center;overflow:auto;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));transition:opacity .5s,visibility .5s}
#intro.out{opacity:0;visibility:hidden}
#intro::before{content:"";position:fixed;inset:-20%;background:radial-gradient(40% 35% at 22% 28%,#E06B2740,transparent 70%),radial-gradient(38% 34% at 80% 72%,#62BB4633,transparent 70%),radial-gradient(30% 30% at 70% 18%,#C9A24A26,transparent 70%);animation:igl 14s ease-in-out infinite alternate;pointer-events:none}
#intro::after{content:"";position:fixed;inset:12px;border:1px solid #C9A24A66;border-radius:18px;pointer-events:none}
@keyframes igl{to{transform:translate(4%,-3%) rotate(8deg) scale(1.08)}}
.ib{position:relative;width:min(100%,560px);margin:auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.ib svg{width:118px;height:118px}.ib .rg{stroke-dasharray:460;stroke-dashoffset:460;animation:idr 1.5s .2s ease-out forwards}.ib .gp{opacity:0;animation:ifd .7s 1.1s forwards}
@keyframes idr{to{stroke-dashoffset:0}}@keyframes ifd{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ib>*{opacity:0;animation:ifd .7s forwards}.ib>svg{opacity:1;animation:none}
.ib .in1{animation-delay:1.3s;font:700 34px var(--display);letter-spacing:.12em;color:#E8833F;margin:0}.ib .in2{animation-delay:1.6s;font:600 12px var(--body);letter-spacing:.3em;color:#D9B863;margin:0;text-transform:uppercase}
.ib .in3{animation-delay:1.9s;font:700 clamp(22px,5vw,32px)/1.25 var(--display);margin:6px 0 0;text-wrap:balance}.ib .in3 em{font-style:normal;color:#D9B863}
.ib .in4{animation-delay:2.2s;width:min(100%,400px);border-radius:14px;border:1px solid #C9A24A99;box-shadow:0 18px 50px #0009;height:auto}
.ib .in5{animation-delay:2.5s;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:6px}
.ib .in5 a,.ib .in5 button{font:700 15px var(--body);padding:13px 20px;border-radius:99px;cursor:pointer;text-decoration:none;border:1px solid #C9A24A;background:transparent;color:#F4EFE4;min-width:150px}
.ib .in5 .go1{background:linear-gradient(135deg,#E0B95A,#B98A2B);color:#17130A;border:0;padding-inline:30px}.ib .in5 .gwa{background:#1E8449;border-color:#1E8449}.ib .in5 .gwx{background:#07C160;border-color:#07C160;color:#06240F}
.ib .in6{animation-delay:2.7s}.ib .in6 select{font:600 13px var(--body);padding:7px 10px;border-radius:99px;border:1px solid #C9A24A66;background:#171C13;color:#F4EFE4}
.iwx{background:#fff;color:#1E2420;border-radius:14px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:6px;animation-delay:0s!important}.iwx img{width:170px;height:170px}.iwx b{font:700 18px var(--display)}.iwx a{color:#0A7A3B;font-weight:700}
@media (prefers-reduced-motion:reduce){#intro::before,.ib *{animation:none!important}.ib>*,.ib .gp{opacity:1}.ib .rg{stroke-dashoffset:0}.rv{opacity:1;transform:none;transition:none}.card{transition:none}}
@media (max-width:560px){.ib{gap:9px}.ib svg{width:80px;height:80px}.ib .in1{font-size:25px}.ib .in3{font-size:21px;margin:0}.ib .in4{width:min(100%,290px)}.ib .in5 a,.ib .in5 button{min-width:0;flex:1 1 40%;padding:12px 10px}.ib .in5 .go1{flex-basis:100%}}
:root{--bg:#fff;--card:#fff;--fg:#1B1B1B;--muted:#6A6A6A;--line:#E6E6E6;--blue:#C2551A;--blue-soft:#FBEADF;--hd:#fff;--soft:#F5F5F2;--or:#E06B27}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#111;--card:#191919;--fg:#F2F2F2;--muted:#A8A8A8;--line:#2C2C2C;--blue:#F29A62;--blue-soft:#3A2416;--hd:#111;--soft:#1B1B1B}}
:root[data-theme=dark]{--bg:#111;--card:#191919;--fg:#F2F2F2;--muted:#A8A8A8;--line:#2C2C2C;--blue:#F29A62;--blue-soft:#3A2416;--hd:#111;--soft:#1B1B1B}
.note{display:none}header{border-bottom:1px solid var(--line)}
.search input{border-radius:99px 0 0 99px;padding-inline:18px}.search button{border-radius:0 99px 99px 0;padding:0 20px}
[dir=rtl] .search input{border-radius:0 99px 99px 0}[dir=rtl] .search button{border-radius:99px 0 0 99px}
.search button,.add .go,.b1{background:var(--fg);color:var(--bg)}.add .go{border-radius:99px}.add .go.in{background:#2F8A1E;color:#fff}
.b1,.b2{border-radius:99px;padding:16px 28px;font-size:16px;transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s,color .2s}.b2{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1.5px var(--fg)}.b1:hover{background:var(--or);color:#fff}.b2:hover{background:var(--fg);color:var(--bg)}
.hx,.cartbtn{border-radius:99px}.card{border-radius:18px}.pager button,.subs button{border-radius:99px}
.hero2{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:center;padding:clamp(28px,6vw,80px) 0 12px}
.big{font-size:clamp(40px,8.2vw,118px);line-height:.98;letter-spacing:-.035em;font-weight:700;padding:0;margin:0;text-wrap:balance}.big em{font-style:normal;color:var(--or)}
[dir=rtl] .big{line-height:1.25;letter-spacing:0;font-size:clamp(34px,6.4vw,88px)}
.hero2 .hl{font-size:clamp(16px,1.6vw,20px);max-width:52ch;margin-top:22px}.hero2 .cta{margin-top:28px}
.coin3{position:relative;perspective:900px;display:grid;place-items:center;min-height:260px}.cw{transform:rotateX(var(--rx,8deg)) rotateY(var(--ry,-18deg));transform-style:preserve-3d;transition:transform .25s ease-out}
.coin{width:min(40vw,280px);aspect-ratio:1;position:relative;transform-style:preserve-3d;animation:spin 10s linear infinite}@keyframes spin{to{transform:rotateY(360deg)}}
.coin b{position:absolute;inset:0;border-radius:50%;background:#C9581C}.coin i{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;backface-visibility:hidden;background:radial-gradient(circle at 32% 28%,#fff,#F3ECDF 70%);box-shadow:inset 0 0 0 9px #E06B27,inset 0 0 0 14px #fff,inset 0 0 0 16px #62BB46}
.coin .cf{transform:translateZ(9px)}.coin .cb{transform:rotateY(180deg) translateZ(9px)}.coin svg{width:62%}.coin .cb span{font:700 clamp(56px,10vw,104px) var(--display);color:#E06B27;font-style:normal}
.fl{position:absolute;border-radius:50%;animation:flt 7s ease-in-out infinite alternate}.f1{width:74px;height:74px;left:4%;top:8%;background:radial-gradient(circle at 30% 30%,#B8E6A6,#62BB46)}.f2{width:44px;height:44px;right:6%;top:18%;background:radial-gradient(circle at 30% 30%,#FFC9A3,#E06B27);animation-delay:-2s}.f3{width:30px;height:30px;left:16%;bottom:6%;background:radial-gradient(circle at 30% 30%,#fff,#1B1B1B 85%);animation-delay:-4s}
@keyframes flt{to{transform:translate(14px,-26px)}}
.mq{overflow:hidden;border-block:1px solid var(--line);padding:16px 0;margin:36px 0 8px}.mq div{display:inline-flex;gap:34px;white-space:nowrap;animation:mq 46s linear infinite;font:600 clamp(18px,2.6vw,30px) var(--display)}.mq .dt{color:var(--or)}@keyframes mq{to{transform:translateX(-50%)}}
.bigst{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:28px 0 0}.bigst div{background:none;border:0;border-top:2px solid var(--fg);border-radius:0;padding:14px 0}.bigst dt{font-size:clamp(40px,6.4vw,92px);line-height:1;letter-spacing:-.03em;color:var(--fg)}.bigst dd{font-size:15px;margin-top:8px}
.sh{font-size:clamp(28px,4.6vw,60px);letter-spacing:-.03em;line-height:1.05;margin:clamp(56px,8vw,110px) 0 24px}.sx .sh+.g,.sx h2.sh~h2.sh{margin-top:0}.sx h2.sh~h2.sh{font-size:clamp(20px,2.4vw,30px);margin:40px 0 16px;letter-spacing:-.01em}
[dir=rtl] .sh{letter-spacing:0;line-height:1.3}
.sx>p{font-size:clamp(16px,1.5vw,19px);color:var(--fg);opacity:.82}
.g li,.box,.steps li,.feat li,.cc{background:var(--soft);border:0;border-radius:18px}.ser button{background:var(--soft);border:0;border-radius:18px;padding:18px;transition:transform .2s ease-out,background .2s}.ser button:hover{background:var(--fg);color:var(--bg)}
.hap i{background:var(--fg);color:var(--bg);border-radius:50%}.hap li:nth-child(even) i{background:var(--or);color:#fff}.num li::before,.steps li::before{background:var(--fg);color:var(--bg)}
.tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:16px;scrollbar-width:none}.tabs button{flex:none;font:600 15px var(--body);padding:11px 18px;border-radius:99px;border:1.5px solid var(--line);background:none;color:var(--fg);cursor:pointer;display:flex;gap:8px;align-items:center}.tabs small{color:var(--muted);font-weight:500}.tabs .on{background:var(--fg);color:var(--bg);border-color:var(--fg)}.tabs .on small{color:inherit;opacity:.7}
.cov{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px}
.cv{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:4px;background:var(--soft);border-radius:18px;padding:12px 12px 14px;transition:transform .2s ease-out,box-shadow .2s}.cv:hover,.cv:focus-visible{box-shadow:0 14px 34px #0002}.cv:focus-visible{outline:2px solid var(--or)}
.cvi{display:grid;grid-template-columns:1fr 1fr;gap:3px;aspect-ratio:1;border-radius:12px;overflow:hidden;background:#fff;margin-bottom:8px}.cvi img{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.cv b{font:700 16px var(--display);line-height:1.2}.cv small{color:var(--muted);font-size:13px}.cv em{font-style:normal;font-weight:600;font-size:13px;color:var(--blue);margin-top:4px}.cv.all{justify-content:center;align-items:flex-start;background:var(--fg);color:var(--bg);padding:22px}.cv.all small{color:inherit;opacity:.7}.cv.all em{color:#F5A36C}
#mn{position:fixed;inset:0;z-index:90;background:var(--bg);color:var(--fg);padding:max(18px,env(safe-area-inset-top)) clamp(18px,6vw,80px) 24px;display:flex;flex-direction:column;overflow:auto;animation:mnin .35s ease-out}@keyframes mnin{from{opacity:0;transform:translateY(-14px)}}
#mn #mx{align-self:flex-end;font-size:18px;padding:10px 14px}#mn nav{display:flex;flex-direction:column;gap:2px;margin:auto 0}#mn nav button{all:unset;cursor:pointer;font:700 clamp(30px,6.4vw,72px)/1.12 var(--display);letter-spacing:-.03em;transition:color .15s,padding .2s}#mn nav button:hover,#mn nav button:focus-visible{color:var(--or);padding-inline-start:14px}[dir=rtl] #mn nav button{letter-spacing:0;line-height:1.4}
.mnf{display:flex;flex-wrap:wrap;gap:8px 22px;padding-top:18px;border-top:1px solid var(--line)}.mnf a{color:var(--fg);font-weight:600;text-decoration:none}
#cur{position:fixed;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;z-index:200;transition:width .2s,height .2s,left .2s,top .2s}#cur.big{width:46px;height:46px;left:-23px;top:-23px}
#ct{position:fixed;inset:0;z-index:80;background:var(--or);transform:translateY(100%);pointer-events:none}#ct.go{animation:ct .7s cubic-bezier(.7,0,.2,1)}@keyframes ct{0%{transform:translateY(100%)}45%,55%{transform:none}100%{transform:translateY(-100%)}}
@media (max-width:760px){.hero2{grid-template-columns:1fr}.coin3{order:-1;min-height:200px}.coin{width:min(46vw,190px)}}
@media (max-width:560px){#mb{margin-inline-start:auto}#mb+.hx{margin-inline-start:0}.cov{grid-template-columns:1fr 1fr;gap:10px}.cv{padding:8px 8px 12px}.cv b{font-size:14px}}
@media (prefers-reduced-motion:reduce){.coin,.fl,.mq div,#ct.go,#mn{animation:none!important}}
.mnl{display:flex;flex-wrap:wrap;gap:8px;padding:16px 0}.mnl button{font:600 14px var(--body);padding:8px 14px;border-radius:99px;border:1.5px solid var(--line);background:none;color:var(--fg);cursor:pointer}.mnl .on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
@media (max-width:560px){#lg{display:none}#mb+.hx{margin-inline-start:0}#mb~#th{margin-inline-start:0}}
#intro{background:#060A18}#intro::before{display:none}.sc{position:fixed;inset:0;width:100%;height:100%}
.ib{margin:0 auto auto;padding-top:clamp(8px,4vh,48px);text-shadow:0 2px 18px #060A18}.ib .in1{color:#F08A45}.ib svg{filter:drop-shadow(0 6px 22px #0008)}
.sc *{transform-box:fill-box}.shp{animation:sail var(--d) linear infinite}@keyframes sail{0%{transform:translate(var(--x0),598px);opacity:0}5%,95%{opacity:1}100%{transform:translate(var(--x1),598px);opacity:0}}
.bob{animation:bob 4.5s ease-in-out infinite alternate;transform-origin:center}@keyframes bob{from{transform:translateY(-3px) rotate(-.6deg)}to{transform:translateY(4px) rotate(.6deg)}}
.shp2{animation:sail2 90s linear infinite}@keyframes sail2{from{transform:translate(1500px,672px)}to{transform:translate(-200px,672px)}}
.wv{animation:wv 9s linear infinite}.wv.b{animation-duration:6.5s;animation-direction:reverse}.wv.c{animation-duration:5s}@keyframes wv{to{transform:translateX(200px)}}
.crn{animation:crn 7s ease-in-out infinite alternate}@keyframes crn{to{transform:translateY(96px)}}
.rt{stroke-dasharray:10 14;animation:rt 3s linear infinite}.rt.r2{animation-duration:4s}.rt.r3{animation-duration:5s}@keyframes rt{to{stroke-dashoffset:-48}}
.glb{animation:glb 5s ease-in-out infinite alternate}@keyframes glb{to{opacity:.75}}
.meet{display:block;border-radius:18px;max-width:100%;height:auto;margin:6px 0 4px}
@media (prefers-reduced-motion:reduce){.sc *{animation:none!important}.shp{transform:translate(520px,598px)}.shp2{transform:translate(1100px,672px)}}
.sc.pt{top:auto;bottom:0;height:auto;aspect-ratio:800/650;-webkit-mask-image:linear-gradient(transparent,#000 24%);mask-image:linear-gradient(transparent,#000 24%)}.sc.pt .glb{display:none}
#cur{display:none}
#gal{margin-top:36px}.gt{padding-bottom:14px}
.gv{aspect-ratio:16/7.2;overflow:hidden;border-radius:22px;background:#fff;border:1px solid var(--line)}.gv.sm{margin-bottom:16px}.gv img{width:100%;height:100%;object-fit:cover;display:block}.gv img.ctn{object-fit:contain}
.kb{animation:kb 13s ease-in-out infinite alternate,gfd .7s ease-out}@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.17) translate(-2.5%,-1.5%)}}@keyframes gfd{from{opacity:0}}
.kb.ctn{animation:kbc 6s ease-in-out infinite alternate,gfd .7s ease-out}@keyframes kbc{from{transform:scale(.9) translateY(4px)}to{transform:scale(.98) translateY(-6px)}}
.adv .ai{display:block;aspect-ratio:16/9.5;overflow:hidden;border-radius:12px;margin-bottom:12px;background:#fff}.adv .ai img{width:100%;height:100%;object-fit:cover;animation:kb 16s ease-in-out infinite alternate}.adv li:nth-child(even) .ai img{animation-direction:alternate-reverse}.adv li:hover .ai img{animation-play-state:paused}
@media (max-width:560px){.gv{aspect-ratio:16/10}}
@media (prefers-reduced-motion:reduce){.kb,.adv .ai img{animation:none!important}}
.gv{aspect-ratio:auto;border:0;background:radial-gradient(120% 90% at 20% 0%,var(--blue-soft),transparent 60%),var(--soft);perspective:1300px;display:grid;place-items:center;padding:clamp(20px,4.5vw,56px);min-height:clamp(240px,34vw,460px)}
.gv img,.gv img.ctn{width:auto;max-width:100%;height:auto;object-fit:contain;border-radius:16px;background:#fff;box-shadow:0 34px 70px #0004,0 0 0 1px #0001}
.kb,.kb.ctn{animation:g3 8s ease-in-out infinite alternate,gfd .7s ease-out}@keyframes g3{from{transform:rotateY(-13deg) rotateX(5deg)}to{transform:rotateY(13deg) rotateX(-3deg) translateZ(34px)}}
.adv .ai{aspect-ratio:auto;overflow:visible;background:none;perspective:700px;padding:4px 0 6px}.adv .ai img{height:auto;object-fit:contain;border-radius:12px;box-shadow:0 14px 28px #0003;animation:g3s 7s ease-in-out infinite alternate;transition:transform .3s}@keyframes g3s{from{transform:rotateY(-9deg) rotateX(4deg)}to{transform:rotateY(9deg) rotateX(-2deg)}}
.adv li:nth-child(even) .ai img{animation-direction:alternate-reverse}
@media (max-width:560px){.gv{aspect-ratio:auto}}
.gv{padding:0;min-height:0;aspect-ratio:16/7.4;perspective:none;background:var(--soft);display:block}
.gv img,.gv img.ctn{width:100%;max-width:none!important;height:100%;object-fit:cover;border-radius:0;box-shadow:none}
.kb,.kb.ctn{animation:kb 18s ease-in-out infinite alternate,gfd .8s ease-out}
.aic{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:var(--fg);color:var(--bg);margin-bottom:14px}.aic svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.adv li:nth-child(even) .aic{background:var(--or);color:#fff}
@media (max-width:560px){.gv{aspect-ratio:4/3}}
/* ---- Build Your Shop + mascot ---- */
.logo{align-items:center;gap:2px;overflow:visible}.hcd{width:42px;height:42px;flex:none;overflow:visible}
.hcd .dh{transform-origin:32px 40px;animation:dgt 3.6s ease-in-out infinite}.hcd .e1{transform-origin:18px 17px;animation:dge 3.6s ease-in-out infinite}.hcd .e2{transform-origin:46px 17px;animation:dge 3.6s ease-in-out infinite reverse}.hcd .ey{transform-origin:32px 25px;animation:dgb 4.8s infinite}.hcd .tg{transform-origin:32px 38px;animation:dgg 1.2s ease-in-out infinite}
@keyframes dgt{0%,55%,100%{transform:rotate(0)}65%{transform:rotate(-13deg)}78%{transform:rotate(11deg)}90%{transform:rotate(-4deg)}}
@keyframes dge{0%,55%,100%{transform:rotate(0)}68%{transform:rotate(14deg)}82%{transform:rotate(-10deg)}}
@keyframes dgb{0%,94%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}
@keyframes dgg{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.72)}}
.logo:hover .hcd .dh{animation-duration:1.1s}
.idog{display:flex;justify-content:center;margin:-4px 0}.idog .hcd{width:64px;height:64px}
.ib .in5 .gsh{background:#fff;color:#1B1B1B;border:0;font-weight:700}
.shd{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.shd .hcd{width:clamp(72px,10vw,128px);height:clamp(72px,10vw,128px);margin-bottom:18px}.shd .eyebrow{margin:clamp(56px,8vw,110px) 0 0}.shd .sh{margin-top:8px}
.shst{margin:18px 0 0}.shw{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:start}.shp{display:grid;grid-template-columns:1fr 1fr;gap:12px}.shp img{background:#fff;aspect-ratio:4/5;object-fit:contain}
.shc{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 34px}.shc a{text-decoration:none;display:inline-flex;align-items:center;color:var(--bg)}.shc a.b2{color:var(--fg)}.shc a.b2:hover{color:var(--bg)}
.shn{font-size:15px!important;color:var(--muted)!important;margin-bottom:18px!important}
.spg{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.sp{all:unset;cursor:zoom-in;display:block;position:relative;border-radius:16px;overflow:hidden;background:var(--soft);border:1px solid var(--line)}.sp img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.sp:hover img{transform:scale(1.05)}.sp:focus-visible{outline:3px solid var(--or);outline-offset:2px}
.sp span{position:absolute;inset-inline-start:10px;bottom:10px;background:rgba(255,255,255,.94);color:#1B1B1B;font:600 12.5px var(--body);padding:5px 10px;border-radius:99px;direction:ltr}
#slb{position:fixed;inset:0;z-index:300;background:rgba(10,10,10,.9);display:flex;align-items:center;justify-content:center;gap:8px;padding:16px}#slb[hidden]{display:none}
#slb figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;max-width:min(1200px,100%)}#slb img{max-width:100%;max-height:74vh;border-radius:12px;background:#fff}#slb figcaption{color:#fff;font:600 15px var(--body);direction:ltr}#slb a{text-decoration:none;background:#1E8449;color:#fff}
#slb .lx,#slb .ln{all:unset;cursor:pointer;color:#fff;font-size:30px;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);text-align:center;line-height:46px;flex:none}#slb .lx{position:absolute;top:14px;inset-inline-end:14px;font-size:20px}
[dir=rtl] #slb{direction:ltr}
@media (max-width:760px){.shw{grid-template-columns:1fr}.spg{grid-template-columns:1fr 1fr;gap:8px}.sp span{font-size:10.5px;padding:3px 7px;inset-inline-start:6px;bottom:6px}#slb .ln{position:absolute;bottom:14px}#slb .lp{left:24%}#slb .lnx{right:24%}#slb{padding:10px 10px 70px}}
@media (max-width:560px){.hcd{width:34px;height:34px}.logo .lg{width:112px}}
@media (prefers-reduced-motion:reduce){.hcd *{animation:none!important}}
.shst dt{line-height:1.12;padding-bottom:6px}
.ib .in5{max-width:760px}
/* ---- photo hero + journey ---- */
body{overflow-x:clip}
.hero2{position:relative;margin-inline:calc(50% - 50vw);padding:clamp(40px,7vw,96px) max(20px,calc(50vw - 50%)) clamp(48px,7vw,96px);min-height:min(78vh,760px);color:#fff;background:linear-gradient(90deg,rgba(12,14,16,.88) 0%,rgba(12,14,16,.64) 44%,rgba(12,14,16,.14) 80%),linear-gradient(0deg,rgba(12,14,16,.55),transparent 42%),url(port.webp) center/cover no-repeat;isolation:isolate}
[dir=rtl] .hero2{background:linear-gradient(270deg,rgba(12,14,16,.88) 0%,rgba(12,14,16,.64) 44%,rgba(12,14,16,.14) 80%),linear-gradient(0deg,rgba(12,14,16,.55),transparent 42%),url(port.webp) center/cover no-repeat}
.hero2 .eyebrow{color:#F5A873}.hero2 .big{color:#fff;font-size:clamp(38px,6.4vw,92px)}.hero2 .hl{color:#fff;opacity:.92}
.hero2 .cta{display:flex;flex-wrap:wrap;gap:12px}.hero2 .b1{background:#E06B27;color:#fff}.hero2 .b1:hover{background:#fff;color:#1B1B1B}.hero2 .b2{background:#fff;color:#1B1B1B;box-shadow:none}.hero2 .b2:hover{background:#E06B27;color:#fff}.hero2 .bsh{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px #fff}
.hero2 .coin{filter:drop-shadow(0 34px 44px rgba(0,0,0,.5))}.hero2 .fl{opacity:.9}
.jey{margin:clamp(48px,7vw,90px) 0 0}.sx .jh{margin-top:8px}
.jr{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.jc{margin:0;position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3.2;background:var(--soft)}.jc img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.jc:hover img{transform:scale(1.07)}
.jc:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.74),transparent 55%);pointer-events:none}
.jc figcaption{position:absolute;z-index:1;inset-inline:18px;bottom:16px;color:#fff;font:600 clamp(15px,1.5vw,19px) var(--display)}
.jc i{position:absolute;z-index:1;inset-inline-start:16px;top:16px;font:700 13px var(--body);font-style:normal;background:#E06B27;color:#fff;width:34px;height:34px;border-radius:50%;text-align:center;line-height:34px}
@media (max-width:900px){.jr{grid-template-columns:1fr 1fr;gap:10px}}
@media (max-width:760px){.hero2{min-height:0;background-position:70% center}.hero2,[dir=rtl] .hero2{background-image:linear-gradient(0deg,rgba(12,14,16,.9) 0%,rgba(12,14,16,.6) 55%,rgba(12,14,16,.25) 100%),url(port.webp)}}