/* ===== Fekra v2 layer: cream + pastel, scalloped edges, striped footer ===== */
:root{--cream:#fff8e7;--pk:#f9b4c4;--coral:#ff7f8f;--lil:#dcd4f3;--but:#ffe08a;--sky:#cfe3ee;--mint:#cdd3a0;--red:#d94a3d;--ink:#4a2a1c;--bg:#fff8e7}
body{background:var(--cream);font-family:Jost,Cairo,sans-serif;color:var(--ink)}
h1,h2,h3,.fh{font-family:Fraunces,Cairo,serif}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.ann{background:var(--coral);color:#fff;text-align:center;font:600 13px Cairo;padding:9px 12px;position:relative}
.ann:after,.scal:after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:14px;z-index:3;background:radial-gradient(circle at 14px 0,var(--coral) 13px,transparent 14px) 0 0/28px 14px repeat-x}
.scal{position:relative}.scal:after{background:radial-gradient(circle at 14px 0,var(--c,var(--lil)) 13px,transparent 14px) 0 0/28px 14px repeat-x;bottom:auto;top:100%;margin-top:-1px}
.nav2{background:var(--cream);position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid #ecd9bd}
.nav2 .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:66px}
.nav2 .logo{font:800 28px Fraunces,serif;color:var(--red);text-decoration:none;letter-spacing:1px}.nav2 .logo i{font-style:normal;color:var(--coral);margin-inline-start:4px}
.nav2 nav{display:flex;gap:22px}.nav2 nav a{font:600 14px Cairo;color:var(--ink);text-decoration:none;padding:6px 2px;border-bottom:2px solid transparent}.nav2 nav a:hover,.nav2 nav a.on{border-color:var(--coral)}
.nav2 .acts{display:flex;gap:8px;align-items:center}
.b2{display:inline-block;background:var(--red);color:#fff;border:2px solid var(--red);border-radius:999px;padding:11px 24px;font:700 14px Cairo;text-decoration:none;cursor:pointer;transition:.2s}.b2:hover{transform:translateY(-2px);box-shadow:0 6px 0 rgba(74,42,28,.15)}
.b2.gh{background:transparent;color:var(--red)}.b2.sm{padding:7px 16px;font-size:13px}
@media(max-width:820px){.nav2 nav{position:fixed;bottom:0;left:0;right:0;background:var(--cream);justify-content:space-around;padding:10px 6px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid #ecd9bd;gap:0;z-index:30}.nav2 nav a{font-size:12px}body{padding-bottom:64px}.nav2 .logo{font-size:23px}}
/* hero */
.hero2{background:var(--pk);padding:46px 0 56px}.hero2 .wrap{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.hero2 h1{font-size:clamp(38px,6vw,72px);line-height:1.1;margin:10px 0 14px;color:var(--red)}.hero2 p{font-size:17px;max-width:460px;margin:0 0 24px}
.eb{display:inline-block;background:#fff;border-radius:999px;padding:5px 14px;font:700 12px Jost;letter-spacing:1.5px;text-transform:uppercase}
.hero2 .pic{background:var(--cream);border-radius:28px;padding:14px;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink);transform:rotate(2deg)}.hero2 .pic img{width:100%;border-radius:18px;display:block;aspect-ratio:4/5;object-fit:cover}
@media(max-width:820px){.hero2 .wrap{grid-template-columns:1fr;text-align:center}.hero2 p{margin-inline:auto}.hero2 .pic{order:-1;max-width:320px;margin:0 auto}}
.mq2{background:var(--but);border-block:2px solid var(--ink);overflow:hidden;white-space:nowrap;padding:11px 0;margin-top:14px}.mq2 div{display:inline-block;animation:mq 30s linear infinite;font:800 13px Jost;letter-spacing:2px}.mq2 span{margin:0 18px}
@keyframes mq{to{transform:translateX(-50%)}}[dir=rtl] .mq2 div{animation-name:mqr}@keyframes mqr{to{transform:translateX(50%)}}
.sec2{padding:56px 0}.sh2{text-align:center;margin-bottom:30px}.sh2 h2{font-size:clamp(26px,4vw,40px);margin:8px 0 6px;color:var(--red)}.sh2 p{color:#8a7266;margin:0}
/* categories */
.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}.cat{text-align:center;text-decoration:none;color:var(--ink);font:700 15px Cairo}
.cat .ci{aspect-ratio:1;border-radius:50%;overflow:hidden;border:3px solid var(--ink);margin-bottom:10px;transition:.25s}.cat .ci img{width:100%;height:100%;object-fit:cover}.cat:hover .ci{transform:rotate(-4deg) scale(1.04)}
@media(max-width:820px){.cats{grid-template-columns:repeat(3,1fr);gap:12px}.cat{font-size:13px}}
/* product cards */
.pg2{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}@media(max-width:980px){.pg2{grid-template-columns:repeat(2,1fr);gap:14px}}
.pc{background:#fff;border:2px solid var(--ink);border-radius:22px;overflow:hidden;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;transition:.2s}.pc:hover{transform:translateY(-4px);box-shadow:0 8px 0 var(--ink)}
.pc .im{aspect-ratio:1;position:relative;overflow:hidden}.pc .im img{width:100%;height:100%;object-fit:cover}
.pc .bd{position:absolute;top:10px;inset-inline-start:10px;background:var(--red);color:#fff;border-radius:999px;padding:3px 11px;font:700 11px Cairo}.pc .bd.st{background:var(--ink)}
.pc .tx{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}.pc h3{font-size:16px;margin:0}.pc .pr{font:800 17px Cairo;color:var(--red)}.pc .go{margin-top:auto;border:2px solid var(--ink);border-radius:999px;text-align:center;padding:7px;font:700 13px Cairo}
.fil{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:26px}.fil button{border:2px solid var(--ink);background:#fff;border-radius:999px;padding:8px 18px;font:700 14px Cairo;color:var(--ink);cursor:pointer}.fil button.on{background:var(--pk)}
/* showcase strip (mockups) */
.show{background:var(--lil);padding:56px 0 64px;--c:var(--lil)}.strip{display:flex;gap:18px;overflow-x:auto;padding:6px 20px 18px;scroll-snap-type:x mandatory}.strip figure{margin:0;flex:0 0 230px;scroll-snap-align:start;text-align:center;font:700 13px Cairo}
.strip img{width:100%;border-radius:16px;border:2px solid var(--ink);background:#fff;display:block;margin-bottom:8px}
/* steps + promo + footer */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}@media(max-width:820px){.steps{grid-template-columns:repeat(2,1fr)}}
.steps div{background:#fff;border:2px solid var(--ink);border-radius:20px;padding:20px;text-align:center}.steps i{display:block;font:800 30px Fraunces;color:var(--coral);font-style:normal}.steps h3{margin:6px 0;font-size:17px}.steps p{margin:0;font-size:14px;color:#8a7266}
.promo{margin:10px 0 50px;border:14px solid transparent;border-image:repeating-linear-gradient(90deg,var(--but) 0 34px,var(--cream) 34px 68px) 14}.promo div{background:var(--lil);border-radius:22px;padding:38px 20px;text-align:center}.promo h2{font-size:clamp(28px,5vw,48px);margin:0 0 8px}.promo p{margin:0 0 20px}
.ftr{background:var(--cream);margin-top:30px}.ftr .stp{height:46px;background:repeating-linear-gradient(135deg,var(--pk) 0 16px,var(--cream) 16px 32px)}
.ftr .in{padding:34px 20px;display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px}.ftr h4{font:800 16px Fraunces;margin:0 0 10px}.ftr a{display:block;color:var(--ink);text-decoration:none;font:500 14px Cairo;margin:6px 0}.ftr .lg{font:800 40px Fraunces;color:var(--red)}
.ftr .cp{background:var(--but);text-align:center;padding:10px;font:600 12px Cairo}@media(max-width:700px){.ftr .in{grid-template-columns:1fr}}
/* product page */
.pp{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;padding:34px 0}@media(max-width:820px){.pp{grid-template-columns:1fr;gap:20px}}
.gal .main{position:relative;border:2px solid var(--ink);border-radius:24px;overflow:hidden;background:#fff;aspect-ratio:1}.gal .main img{width:100%;height:100%;object-fit:contain}
.gal .ar{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:2px solid var(--ink);background:var(--pk);cursor:pointer;font-size:18px}.gal .ar.p{left:10px}.gal .ar.n{right:10px}
.thumbs{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding-bottom:6px}.thumbs img{width:74px;height:74px;object-fit:cover;border-radius:12px;border:2px solid transparent;cursor:pointer;background:#fff;flex:0 0 auto}.thumbs img.on{border-color:var(--ink)}
.pp h1{font-size:clamp(26px,4vw,38px);margin:0 0 8px}.pp .pr{font:800 28px Cairo;color:var(--red);margin:6px 0 14px}.crumb{font:500 13px Cairo;color:#8a7266;padding-top:20px}.crumb a{color:inherit}
.tabs{display:flex;gap:8px;margin:22px 0 0}.tabs button{border:2px solid var(--ink);border-bottom:0;border-radius:14px 14px 0 0;background:var(--lil);padding:8px 16px;font:700 13px Cairo;cursor:pointer;color:var(--ink)}.tabs button.on{background:var(--pk)}
.tabp{background:var(--pk);border:2px solid var(--ink);border-radius:0 18px 18px 18px;padding:18px 20px;font-size:15px}.tabp ul{margin:0;padding-inline-start:20px}
.wafab{z-index:25}
.pp>*{min-width:0}.thumbs{max-width:100%}.tabs{flex-wrap:wrap}

.nav2 .logo img{height:50px;width:auto;display:block}
.flogo{width:110px;height:110px;border-radius:50%;display:block;margin-bottom:10px}
.phx{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:repeating-linear-gradient(135deg,#fde4ea 0 12px,#fff3f6 12px 24px);color:var(--coral);font:800 26px Fraunces,serif}
.pc .im .phx,.gal .main .phx,.gal .main #gm{width:100%;height:100%}.gal .main .phx{min-height:300px}
.hero2 .pic .phx{aspect-ratio:4/5;border-radius:18px}.cat .ci .phx{border-radius:50%}
.strip .phx{aspect-ratio:3/4;height:auto;border-radius:16px;border:2px solid var(--ink);margin-bottom:8px}
.thumbs .th{flex:0 0 74px;width:74px;height:74px;border-radius:12px;overflow:hidden;border:2px solid transparent;cursor:pointer;background:#fff;display:block}.thumbs .th.on{border-color:var(--ink)}.thumbs .th img,.thumbs .th .phx{width:100%;height:100%;object-fit:cover;font-size:16px}
.gal .main img{width:100%;height:100%;object-fit:contain;display:block}
.hero2 .pic.lg{transform:rotate(0);background:#f7f2ea;padding:18px}.hero2 .pic.lg img{aspect-ratio:1;object-fit:contain;border-radius:50%}.strip figure{flex:0 0 220px}.strip{justify-content:flex-start}

.logo-hero{width:min(400px,78vw);aspect-ratio:1;margin:0 auto;border-radius:50%;border:8px solid #fff;box-shadow:0 20px 44px rgba(74,42,28,.18);background:#fff}
.logo-hero img{display:block;width:100%;height:100%;border-radius:50%}
.hero2{padding:56px 0 64px}

.pc .bd.so{background:#8a8a8a}

/* ===== Order Book slider ===== */
.obs{background:var(--ob-bg,#5b1020);border:2px solid var(--ink);border-radius:28px;box-shadow:10px 10px 0 var(--ob-sh,var(--pk));padding:34px 0 26px;color:var(--ob-fg,#f6ead8);overflow:hidden}
.obs-hd{text-align:center;padding:0 20px;margin-bottom:22px}.obs-eb{font:600 13px Jost,sans-serif;letter-spacing:2px;text-transform:uppercase;color:var(--ob-ac,#e2b97a)}
.obs-hd h2{font:800 clamp(24px,4vw,38px)/1.2 Cairo,Fraunces,serif;margin:8px 0 6px;color:var(--ob-fg,#fff3e0)}.obs-hd p{margin:0;opacity:.8;font:500 15px Cairo,sans-serif}
.obs-vp{position:relative;direction:ltr;margin:0 54px;padding:6px 0}
.obs-tr{display:flex;transition:transform .55s cubic-bezier(.4,.1,.2,1);will-change:transform;touch-action:pan-y}
.obs-sl{margin:0;text-align:center;min-width:0}
.obs-pg{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.obs-sl img{width:100%;aspect-ratio:var(--ar,419/595);object-fit:cover;display:block;border-radius:10px;background:#f4ede0;box-shadow:0 10px 24px rgba(0,0,0,.35);transition:transform .25s;user-select:none;-webkit-user-drag:none}
.obs-pg:hover img{transform:translateY(-4px)}
.obs-sl figcaption{margin-top:10px;font:600 13px Cairo,Jost,sans-serif;color:var(--ob-fg,#f6ead8)}
.obs-ar{position:absolute;top:calc(50% - 20px);z-index:2;width:40px;height:40px;border-radius:50%;border:2px solid var(--ink);background:var(--ob-btn,#fff3e0);color:var(--ink);font:700 24px/1 Jost,sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 0 3px}
.obs-ar.prv{left:8px}.obs-ar.nxt{right:8px}.obs-ar:hover{background:var(--but)}
.obs-vp{margin:0;padding:6px 54px;overflow:visible}.obs-clip{overflow:hidden;padding:6px 0 4px}.obs-ar{direction:ltr;unicode-bidi:isolate}
.obs-dots{display:flex;gap:7px;justify-content:center;margin-top:16px;flex-wrap:wrap;padding:0 20px}.obs-dots i{width:8px;height:8px;border-radius:50%;background:var(--ob-fg,#fff3e0);opacity:.35;cursor:pointer;transition:.2s}.obs-dots i.on{opacity:1;background:var(--ob-ac,#e2b97a);width:22px;border-radius:99px}
.obs-cta{text-align:center;margin-top:20px;padding:0 20px}.obs-cta .b2{background:var(--ob-fg,#fff3e0);color:var(--ob-bg,#5b1020);border-color:var(--ob-fg,#fff3e0)}.obs-cta .b2.gh{background:transparent;color:var(--ob-fg,#fff3e0);border-color:var(--ob-fg,#fff3e0)}.obs-cta .b2.gh:hover{background:var(--ob-fg,#fff3e0);color:var(--ob-bg,#5b1020)}
.obs-home{margin:0}
.obs-sec{padding:40px 0 10px}
.obs-lb{position:fixed;inset:0;z-index:100;background:rgba(30,6,10,.88);display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;direction:ltr}
.obs-lb figure{margin:0;text-align:center;max-height:100%}.obs-lb img{max-height:82vh;max-width:min(88vw,var(--lbw,560px));border-radius:10px;display:block;margin:auto}.obs-lb figcaption{color:#fff3e0;font:600 14px Cairo,sans-serif;margin-top:10px}
.obs-lb .a,.obs-lb .x{border:2px solid var(--ink);background:#fff3e0;color:var(--ink);border-radius:50%;width:42px;height:42px;font:700 26px/1 Jost,sans-serif;cursor:pointer;flex:none;padding:0 0 3px}.obs-lb .x{position:absolute;top:16px;right:16px}
@media(max-width:560px){.obs{border-radius:20px;box-shadow:6px 6px 0 var(--pk);padding-top:26px}.obs-vp{padding:6px 14px}.obs-ar{display:none}.obs-lb .a{width:34px;height:34px}}
/* CSS-drawn chevrons (immune to RTL glyph mirroring) */
.obs-ar,.obs-lb .a{font-size:0!important;position:absolute}.obs-lb .a{position:static}
.obs-ar::before,.obs-lb .a::before{content:"";display:block;width:9px;height:9px;border:solid var(--ink);border-width:0 0 3px 3px;margin:auto}
.obs-ar.prv::before,.obs-lb .a.p::before{transform:rotate(45deg);margin-left:15px}
.obs-ar.nxt::before,.obs-lb .a.n::before{transform:rotate(-135deg);margin-left:11px}
.obs-lb .a.p::before{margin-left:15px}.obs-lb .a.n::before{margin-left:11px}
.obs-ar{display:block}
@media(max-width:560px){.obs-ar{display:none!important}}

/* ===== Home: stacked product sliders + jump chips ===== */
.obs-stack .obs-sec{padding:26px 0 14px}.obs-stack .obs-sec:first-child{padding-top:34px}
.obs-sec .obs{scroll-margin-top:84px}
.obs-sl img{border:0}
.obs-still .obs-tr{justify-content:center}
.jump{display:flex;flex-direction:column;gap:12px;padding:26px 20px 0;max-width:980px;margin:0 auto}.jrow{display:flex;gap:12px;align-items:flex-start}.jrow b{flex:0 0 170px;font:800 14px Cairo;color:var(--red);padding-top:7px}.jc{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.grp-hd{padding:34px 20px 0;max-width:1100px;margin:0 auto}.grp-hd h2{font:800 clamp(22px,3vw,30px) Cairo;color:var(--ink);margin:0;padding-bottom:8px;border-bottom:3px solid var(--ink)}.obs-stack .obs-sec:first-child{padding-top:26px}
.jump a{border:2px solid var(--ink);background:#fff;border-radius:999px;padding:7px 16px;font:700 13px Cairo;color:var(--ink);text-decoration:none;transition:.2s}
.jump a:hover{background:var(--pk);transform:translateY(-2px)}
@media(max-width:560px){.jrow{flex-direction:column;gap:6px}.jrow b{flex:none;padding-top:0}.obs-stack .obs-sec{padding:18px 0 8px}.jump{padding-top:18px;gap:6px}.jump a{padding:6px 12px;font-size:12px}}
