/* Storefront v2 — overrides and new components on top of styles.css */
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:12px;top:8px;z-index:99;background:var(--card);padding:8px 12px;border-radius:8px}
#view{max-width:1200px;margin:0 auto;padding:8px 16px 24px;outline:none;min-height:60vh}
.hide-m{}
.top-inner{flex-wrap:nowrap}
.search{position:relative}
.suggest{position:absolute;top:calc(100% + 6px);inset-inline:0;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.12);padding:6px;z-index:30}
.suggest a{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:6px 8px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:14px}
.suggest a:hover{background:var(--bg)}.suggest img{width:40px;height:40px;object-fit:contain;background:#fff;border-radius:8px}.suggest p{padding:8px;margin:0}
.flag-s{margin-inline-end:4px}
.catbar{max-width:1200px;margin:0 auto;display:flex;gap:4px;overflow-x:auto;padding:0 12px 8px;scrollbar-width:none}.catbar::-webkit-scrollbar{display:none}
.catbar a{white-space:nowrap;padding:6px 12px;border-radius:999px;color:var(--ink2);text-decoration:none;font-size:14px}
.catbar a.on,.catbar a:hover{background:var(--ink);color:var(--bg)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;min-height:44px}
.btn.ghost{background:var(--bg);border:1px solid var(--line);color:var(--ink)}
.hero{margin:12px 0 28px}.hero .btn{margin:0 0 16px}
.hero-img{display:block;background:#fff;border-radius:24px;box-shadow:var(--shadow);aspect-ratio:1;padding:6%}
.hero-img img{width:100%;height:100%;object-fit:contain}
.section-head a{color:var(--brand);text-decoration:none;font-weight:600;font-size:14px}
.cat-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:28px}
.cat-tile{background:var(--card);border-radius:18px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);text-align:center;padding:12px 10px 14px;font-weight:600}
.cat-tile img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:12px;padding:6%;margin-bottom:8px}
.rail{margin-bottom:28px}
.rail-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(180px,210px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:thin}
.rail-track .card{scroll-snap-align:start}
/* product card: image always square, contained on white, never cropped or stretched */
.card{position:relative}
.card-img{display:block;aspect-ratio:1;background:#fff;padding:7%;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:contain;transition:transform .3s}
.card:hover .card-img img{transform:scale(1.04)}
.tag.out{top:auto;bottom:10px;background:var(--muted)}
.heart{position:absolute;top:8px;inset-inline-end:8px;width:34px;height:34px;border-radius:50%;border:0;background:color-mix(in srgb,var(--card) 85%,transparent);color:var(--line);font-size:16px;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.heart.on{color:#d1453b}
.card-name{font-size:14px;font-weight:550;color:var(--ink);text-decoration:none;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted);margin:8px 0}.crumbs a{color:var(--ink2);text-decoration:none}
.page-title{font-size:26px;margin:4px 0 12px}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:14px}
.tools select{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:6px 8px;margin-inline-start:4px}
.toggle{display:flex;align-items:center;gap:6px}.toggle input{width:auto}
.empty{text-align:center;color:var(--ink2);padding:48px 12px}
/* product page */
.pdp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:start;margin-bottom:32px}
.gallery{position:sticky;top:120px}
.g-main{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:24px;background:#fff;box-shadow:var(--shadow);scrollbar-width:none}
.g-main::-webkit-scrollbar{display:none}
.g-slide{flex:0 0 100%;scroll-snap-align:center;border:0;padding:6%;background:#fff;aspect-ratio:1;cursor:zoom-in}
.g-slide img{width:100%;height:100%;object-fit:contain}
.g-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto}
.g-thumbs button{flex:0 0 72px;height:72px;border:2px solid transparent;border-radius:12px;background:#fff;padding:4px}
.g-thumbs button.on{border-color:var(--brand)}.g-thumbs img{width:100%;height:100%;object-fit:contain}
.pd-info h1{font-size:clamp(22px,3vw,32px);line-height:1.2;margin:4px 0}
.pd-price{font-size:28px;font-weight:700;margin:10px 0 4px}
.stock{font-size:14px;font-weight:600;margin:0 0 14px}.stock.ok{color:var(--ok)}.stock.low{color:var(--warn)}.stock.none{color:var(--muted)}
.buy{display:flex;gap:10px;align-items:center;margin-bottom:12px}.grow{flex:1}
.stepper.lg button{width:40px;height:40px;font-size:18px}.stepper.lg span{min-width:24px;text-align:center}
.pd-actions{display:flex;gap:8px;margin-bottom:16px}.chip.on{border-color:#d1453b;color:#d1453b}
.facts{list-style:none;padding:14px 16px;margin:0 0 16px;background:var(--card);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;font-size:14px}
.desc{color:var(--ink2);line-height:1.8}
.sticky-buy{display:none}
.lightbox{position:fixed;inset:0;z-index:80;background:rgba(10,8,6,.92);display:grid;place-items:center;padding:16px}
.lightbox img{max-width:min(92vw,1000px);max-height:88vh;width:auto;height:auto;object-fit:contain;background:#fff;border-radius:12px}
.lightbox .x{background:#fff;color:#000}
/* cart extras */
.coupon{display:flex;gap:8px;margin-top:8px}.coupon input{flex:1}
.lines a img{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:10px}
.lines li{grid-template-columns:64px 1fr auto}
.order-no{font-size:22px;font-weight:700;letter-spacing:.5px}
.err{color:#b42318!important}
/* footer */
.site-foot{border-top:1px solid var(--line);margin-top:24px;padding:28px 16px calc(28px + 64px)}
.foot-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1.3fr .7fr;gap:24px}
.foot-grid h3{margin:0 0 10px;font-size:16px}.site-foot>p{max-width:1200px;margin:16px auto 0}
.wholesale{display:flex;flex-direction:column;gap:8px}.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.links{list-style:none;margin:0;padding:0}.links li{padding:6px 0}.links a{color:var(--ink2)}
/* tracking */
.narrow{max-width:560px}.stack{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.track-card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:16px;margin-top:12px}
.steps{display:flex;list-style:none;padding:0;margin:12px 0;gap:6px}.steps li{flex:1;text-align:center;font-size:12.5px;padding-top:12px;border-top:4px solid var(--line);color:var(--muted)}
.steps li.done{border-color:var(--brand);color:var(--ink)}
.pill{display:inline-block;border-radius:999px;padding:2px 10px;font-size:13px;background:var(--bg)}.pill.warn{background:#fff4e0;color:#9a5b00}
.country-grid button.on{border-color:var(--brand);background:var(--brand-soft)}
/* bottom nav icons */
.bottom-nav svg{width:22px;height:22px;display:block;margin:0 auto 2px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.bottom-nav .on{color:var(--brand)!important}.bottom-nav button{position:relative}
.bottom-nav .cart-count{position:absolute;top:2px;inset-inline-end:22%}
@media (max-width:760px){
  .hide-m{display:none!important}
  .top-inner{flex-wrap:wrap}.search{order:3;flex-basis:100%}
  .catbar{padding-bottom:6px}
  .cat-tiles{grid-template-columns:repeat(3,1fr);gap:8px}.cat-tile{padding:8px;font-size:13px}
  .rail-track{grid-auto-columns:44%}
  .pdp{grid-template-columns:1fr;gap:16px}.gallery{position:static;margin-inline:-16px}.g-main{border-radius:0}
  .g-thumbs{padding:0 16px}
  .sticky-buy{display:flex;position:fixed;inset-inline:0;bottom:calc(60px + env(safe-area-inset-bottom));z-index:25;background:var(--card);border-top:1px solid var(--line);padding:10px 16px;justify-content:space-between;align-items:center;gap:12px}
  .sticky-buy .btn{flex:1}
  .foot-grid{grid-template-columns:1fr}.two{grid-template-columns:1fr}
  .site-foot{padding-bottom:calc(28px + 72px)}
}
.toast{top:calc(84px + env(safe-area-inset-top));bottom:auto;transform:translate(-50%,-10px)}.toast.on{transform:translate(-50%,0)}
.cat-tile img{height:auto}
@media (max-width:760px){.hero-img{display:none}}
.fallback{object-fit:contain;padding:22%;opacity:.35}
.was{color:var(--muted);font-size:13px;font-weight:400;margin-inline-start:6px}
.prices{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 4px}
.tag.sale{background:#c2410c;color:#fff}
.packs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.pack{border:1.5px solid var(--line);background:var(--card);border-radius:14px;padding:8px 14px;display:flex;flex-direction:column;align-items:center;min-width:92px;line-height:1.3}
.pack span{font-size:13px;color:var(--ink2)}.pack.on{border-color:var(--brand);background:var(--brand-soft)}.pack.na{opacity:.45}
.fld{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--ink2)}.fld select{border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:11px 12px}
.pay{justify-content:flex-start}.pay span{flex:1}.pay b{font-weight:600}
.gift{border:1px dashed var(--line);border-radius:12px;padding:8px 12px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.wa-fab{position:fixed;bottom:20px;inset-inline-start:20px;width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.2);z-index:35}
@media (max-width:760px){.wa-fab{bottom:calc(76px + env(safe-area-inset-bottom));inset-inline-start:14px;width:50px;height:50px}}
@media (max-width:760px){.on-pdp .wa-fab{bottom:calc(140px + env(safe-area-inset-bottom))}.on-pdp .cart-fab{display:none}} /* the product page's own buy bar replaces the floating cart: two fixed layers, not three */
.trust{margin:8px 0 0;font-size:13px;color:var(--ink2)}.trust a{color:var(--green);font-weight:700;text-decoration:none}
/* ===== Holistic Corner theme (colours, fonts and sections from holistic-corner.com, redesigned) ===== */
h1,h2,h3{color:var(--ink);font-weight:700}
a{color:var(--green)}
.btn.primary{background:var(--green);color:#fff}.btn.primary:hover{background:#365c48}
.btn.ghost{border:1px solid var(--brand);color:var(--brand);background:transparent}.btn.ghost:hover{background:var(--cream)}
.add{background:var(--green)}
.tag{background:var(--green)}.tag.sale{background:var(--green)}.tag.out{background:var(--warn)}
.eyebrow{color:var(--brand)!important;font-weight:700;letter-spacing:.3px;text-transform:uppercase;font-size:13px}
.topbar{background:var(--cream);border-bottom:1px solid var(--brand);font-size:13px}
.tb-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:6px 16px}
.tb-mail{color:var(--ink);font-weight:700;text-decoration:none}.tb-ann{flex:1;text-align:center;margin:0;color:var(--brand);font-weight:700}
.tb-end{display:flex;align-items:center;gap:8px}
.tb-ws{background:var(--brand);color:#fff!important;text-decoration:none;border-radius:999px;padding:5px 14px;font-weight:700;white-space:nowrap}
.tb-social,.f-social,.m-social{display:flex;gap:6px}
.soc{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--brand);color:var(--brand)}.soc:hover{background:var(--brand);color:#fff}
.topbar .chip{background:#fff;border-color:var(--line);padding:4px 10px;font-size:13px}
.top{background:var(--cream);border-bottom:1px solid var(--line);backdrop-filter:none}
.top-inner{max-width:1280px;gap:18px;padding:8px 16px}
.brand img{border-radius:0;background:none;width:150px;height:auto}
.burger{display:none}
.mainnav{display:flex;align-items:center;gap:2px}
.mainnav>a,.dd-t{color:var(--ink);text-decoration:none;font-weight:700;font-size:14.5px;padding:10px 10px;border-radius:10px;white-space:nowrap;text-transform:uppercase}
.mainnav>a:hover,.dd-t:hover,.mainnav a.on{color:var(--brand)}
.dd{position:relative}.dd-m{display:none;position:absolute;top:100%;inset-inline-start:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;min-width:200px;z-index:40}
.dd:hover .dd-m,.dd:focus-within .dd-m{display:grid}.dd-m a{padding:8px 12px;border-radius:8px;color:var(--ink);text-decoration:none}.dd-m a:hover{background:var(--cream);color:var(--brand)}
.search{max-width:280px}.search input{background:#fff}
.menu-drawer{position:fixed;z-index:50;top:0;bottom:0;inset-inline-start:0;width:min(340px,88%);background:#fff;overflow:auto;padding:16px;transform:translateX(-100%);transition:transform .25s}
[dir=rtl] .menu-drawer{transform:translateX(100%)}.menu-drawer.open{transform:none}
.mnav{display:grid;margin:12px 0}.mnav a{padding:12px 4px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:700}.mnav a.sub{font-weight:400;padding-inline-start:18px;font-size:14px}.mnav a.ws{color:var(--brand)}
#view{max-width:1280px}
/* slider: the artwork carries its own text, so it is shown whole and never cropped */
.slider{position:relative;margin:0 -16px 18px;overflow:hidden;background:var(--cream,#f6efe4)}
/* the slides side by side, the row moved sideways (owner, 4 Nov 2026): no fade, so the page never shows between two pictures */
.slides{display:flex;touch-action:pan-y;will-change:transform}.slides.anim{transition:transform .6s cubic-bezier(.22,.8,.3,1)}
.slide{flex:0 0 100%;min-width:0;display:block;position:relative}.slide img{display:block;user-select:none;-webkit-user-drag:none;background:var(--cream,#f6efe4)}
@media (prefers-reduced-motion:reduce){.slides.anim{transition:none}}
.slide img{width:100%;height:auto;aspect-ratio:1920/700;object-fit:cover}
.slide-txt{position:absolute;inset-block-end:12%;inset-inline-start:6%;max-width:46%;display:grid;gap:10px;background:rgba(255,253,249,.88);padding:22px;border-radius:18px}.slide-txt b{font-size:clamp(20px,3vw,38px);color:var(--ink)}
.dots{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:8px}.dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(48,48,48,.3);padding:0}.dots button.on{background:var(--brand);width:26px;border-radius:6px}
.promo-banner{display:grid;grid-template-columns:1fr;position:relative;border-radius:22px;overflow:hidden;margin:0 0 28px;text-decoration:none;background:var(--cream)}
.promo-banner img{width:100%;height:auto}.pb-txt{position:absolute;inset-block:0;inset-inline-start:0;width:48%;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:4%;color:var(--ink)}
.pb-txt small{color:var(--brand);font-weight:700;font-size:clamp(13px,1.4vw,18px)}.pb-txt b{font-size:clamp(20px,3vw,40px);line-height:1.15}.pb-txt span{color:var(--ink2);font-size:clamp(12px,1.2vw,16px)}
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:0 0 30px}
.cat-card{background:var(--cream);border-radius:20px;padding:22px 12px;text-align:center;text-decoration:none;color:var(--ink);display:grid;justify-items:center;gap:6px;border:1px solid transparent;transition:.2s}
.cat-card:hover{border-color:var(--brand);transform:translateY(-3px)}.cat-card img{width:84px;height:84px}.cat-card b{font-size:17px}.cat-card small{color:var(--muted)}
.wide-img{margin:0 0 30px;border-radius:22px;overflow:hidden}.wide-img img{width:100%;height:auto}
.sec-title{text-align:center;max-width:820px;margin:34px auto 18px}.sec-title .lead{font-size:clamp(16px,1.7vw,20px);color:var(--ink);margin:6px 0 0;font-weight:500}
.rail-track.feat{margin-bottom:30px}
.hotdeals{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;background-size:cover;background-position:center;background-color:var(--cream);border-radius:26px;padding:34px;margin:36px 0}
.hd-img{width:100%;height:auto;border-radius:18px}.hd-txt h2{font-size:clamp(20px,2.4vw,30px);margin:0 0 8px;color:var(--brand)}.hd-txt h3{color:var(--green);font-size:17px}
.hd-list{list-style:none;padding:0;margin:16px 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.hd-list li{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px}
.tabs-sec{margin:0 0 30px}.tabbar{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.tabbar button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 20px;font-weight:700}.tabbar button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.center{text-align:center;margin:16px 0}
.certs{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:14px;align-items:center;background:var(--cream);border-radius:22px;padding:22px;margin:30px 0}
.certs figure{margin:0;text-align:center}.certs img{width:100%;max-width:110px;margin:0 auto;aspect-ratio:1;object-fit:contain;filter:saturate(.9)}.certs figcaption{font-size:11px;color:var(--muted);margin-top:4px}
.reviews{grid-auto-columns:minmax(260px,320px)}.review{background:var(--cream);border:1px solid var(--brand);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:10px;scroll-snap-align:start}
.review p{margin:0;flex:1;font-size:14.5px}.stars{color:#b07c00;letter-spacing:2px}.review footer{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px}
.review footer a{flex-basis:100%;color:var(--green);text-decoration:none}.av{width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700}
.review footer small{color:var(--green)}
.greviews{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.review.g{background:#fff;border-color:var(--line)}.g-head{display:flex;align-items:center;gap:8px}.g-head b{color:#4285f4;font-size:20px}
.site-foot{background:var(--cream);border-top:1px solid var(--brand);margin-top:40px;padding:34px 16px 0}
.foot-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.4fr;gap:26px}
.foot-grid h3{font-size:15px;text-transform:uppercase;margin:0 0 12px}.f-about p{color:var(--ink2);font-size:14px}.f-about h3{text-transform:none;font-size:17px}
.links{list-style:none;padding:0;margin:0;display:grid;gap:8px}.links a{color:var(--ink2);text-decoration:none;font-size:14px}.links a:hover{color:var(--brand)}
.news{margin-top:16px}.news-row{display:flex;gap:6px}.news-row input{background:#fff}
.foot-bottom{max-width:1280px;margin:26px auto 0;padding:14px 0 calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.foot-bottom img{height:24px;width:auto}
.page-hero{background:var(--cream) url(/media/Page_Title_2025.webp) center/cover;border-radius:22px;padding:42px 20px;text-align:center;margin:14px 0 24px}.page-hero h1{margin:0;font-size:clamp(24px,3.4vw,38px)}
.page-body{max-width:900px;margin:0 auto 30px;font-size:16px}.page-body img{max-width:100%;height:auto;border-radius:14px;margin:12px auto;display:inline-block}
.page-body h2{color:var(--brand);margin-top:28px}.page-body h3{margin-top:22px}.page-body div{margin:18px 0}
.posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}.post-card{background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:var(--ink)}
.post-card img{width:100%;aspect-ratio:16/10;object-fit:cover}.post-card div{padding:14px 16px}.post-card h2{font-size:18px;margin:4px 0}.post-card p{color:var(--ink2);font-size:14px;margin:0}.more{color:var(--green);font-weight:700;font-size:14px}
.post{max-width:860px;margin:0 auto}.post-hero img{width:100%;border-radius:20px;max-height:460px;object-fit:cover;margin-top:14px}
.card-form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:12px}.card-form label{display:grid;gap:6px;font-size:14px;color:var(--ink2)}
.narrow{max-width:640px;margin:0 auto}.stack{display:grid;gap:10px}
.row-btns{display:flex;gap:8px;flex-wrap:wrap}
.checks{display:flex;flex-wrap:wrap;gap:4px 16px}
.lab{margin-top:14px;border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--cream)}.lab summary{cursor:pointer;font-weight:700}.lab-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}.lab-list a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;background:var(--bg,#fff);border:1px solid var(--line);font-weight:600;text-decoration:none}
.fsbar{background:var(--cream);border-radius:12px;padding:10px 12px;margin:10px 0;font-size:13.5px}.fsbar p{margin:0}.fsbar progress{width:100%;height:8px;accent-color:var(--green)}.fsbar.ok{color:var(--green);font-weight:700}
.promo .promo-card{position:relative;max-width:460px;width:100%;border-radius:24px;background:var(--cream);overflow:hidden;text-align:center;display:grid;gap:12px;justify-items:center;padding:0 0 24px}
.pp-art{width:100%;aspect-ratio:16/9;background:#2b2520 center/cover;display:grid;place-items:center}.pp-art .pt{max-width:70%;max-height:70%;object-fit:contain}
.promo .pp-txt{padding:0 22px;color:var(--ink)}.promo .x{z-index:2;background:#fff}
.promo .pt{max-width:80%;height:auto}.pp-txt p{margin:2px 0;font-weight:700;font-size:16px}
.auth .tabs{display:flex;gap:4px;background:var(--cream);border-radius:999px;padding:4px;margin:14px 0}.auth .tabs a{flex:1;text-align:center;padding:8px;border-radius:999px;text-decoration:none;color:var(--ink);font-weight:700;font-size:14px}.auth .tabs a.on{background:#fff;color:var(--brand);box-shadow:var(--shadow)}
.acc-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.points-card{display:inline-grid;grid-template-columns:auto auto;align-items:end;gap:2px 10px;background:linear-gradient(135deg,var(--brand),#c98a5d);color:#fff;border-radius:20px;padding:18px 22px;margin:10px 0 18px;min-width:240px}
.points-card span{grid-column:1/-1;font-weight:700;opacity:.9}.points-card b{font-size:38px;line-height:1}.points-card a{grid-column:1/-1;color:#fff;font-size:13px}
.hist{list-style:none;padding:0;display:grid;gap:8px}.hist li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px}.pos{color:var(--green)}.neg{color:var(--warn)}
.ws-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px 18px;max-height:420px;overflow:auto}.ws-list label{display:flex!important;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding:6px 0}.ws-list span{display:flex;align-items:center;gap:8px}.ws-list .qty{width:90px}
.doc{display:grid;grid-template-columns:300px 1fr;gap:28px;align-items:center;background:var(--cream);border-radius:26px;padding:28px;margin:16px 0 26px}.doc img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:22px}.doc h1{margin:4px 0}.bio{color:var(--ink2)}
.plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.plan-card{display:grid;gap:6px;border:2px solid var(--line);border-radius:18px;padding:16px;background:#fff;cursor:pointer}.plan-card:has(input:checked){border-color:var(--brand);background:var(--cream)}
.plan-card input,.slot input{position:absolute;opacity:0}.plan-card .price{color:var(--brand);font-weight:700;font-size:18px}
.slot-grid{display:flex;flex-wrap:wrap;gap:8px}.slot span{display:block;border:1px solid var(--line);border-radius:999px;padding:8px 14px;background:#fff;cursor:pointer;font-size:14px}.slot:has(input:checked) span{background:var(--green);color:#fff;border-color:var(--green)}
.book{display:grid;gap:12px}.rules{display:grid;gap:8px;padding:0;list-style:none}.rules li{background:var(--cream);border-radius:12px;padding:12px 16px;font-weight:700}.rules li::before{content:"★ ";color:var(--gold)}
.rw-hero{background:var(--cream);border-radius:26px;padding:28px;margin:16px 0 20px}
.form-msg.err{color:var(--warn)}
@media (max-width:1100px){.mainnav{display:none}.burger{display:block}.foot-grid{grid-template-columns:1fr 1fr}.search{max-width:none}}
@media (max-width:760px){
  /* owner: the same details on every screen size — country, social links, e-mail — only arranged in two rows */
  .tb-inner{position:relative;padding:6px 12px;flex-wrap:wrap;row-gap:6px;justify-content:space-between}.tb-end{display:contents}
  #countryBtn{order:1;max-width:calc(100% - 90px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#langBtn{order:2}.tb-inner::before{content:"";order:3;flex-basis:100%;height:0}
  .tb-ann{order:4;flex-basis:100%;text-align:center;font-size:12px}.tb-ann:empty{display:none}.tb-social{order:5}.tb-mail{order:6;font-size:12px}
  .tb-social a{width:28px;height:28px}.tb-social svg{width:14px;height:14px}.topbar .chip{padding:4px 9px;font-size:12px}
  .brand img{width:120px}.slider{margin:0 -16px 14px}.slide img{aspect-ratio:auto}
  .pb-txt{position:static;width:auto;padding:16px}.cat-grid{grid-template-columns:repeat(2,1fr)}.cat-card:first-child{grid-column:1/-1}
  .hotdeals{grid-template-columns:1fr;padding:18px}.certs{grid-template-columns:repeat(3,1fr)}.greviews{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}.doc{grid-template-columns:1fr}.slide-txt{position:static;max-width:none}
}
.hero-row{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin:16px 0 26px;align-items:stretch}
.hero-row .slider{margin:0;border-radius:22px}.hero-row .slide img{aspect-ratio:1332/592}
.hero-row .promo-banner{margin:0;display:flex;flex-direction:column;justify-content:flex-start}
.hero-row .promo-banner img{width:100%;max-height:62%;object-fit:contain}
.hero-row .pb-txt{position:static;width:auto;padding:4px 20px 20px;text-align:center;align-items:center}.hero-row .pb-txt b{font-size:26px}
.wide-img{text-align:center;border-radius:0}.wide-img img{width:auto;max-width:100%;display:inline-block}
.brand img{width:auto;height:64px}
@media (max-width:760px){.hero-row{grid-template-columns:1fr}.hero-row .slide img{aspect-ratio:986/1373}.brand img{height:48px}}
@media (min-width:761px){.hero-row .slides,.hero-row .slide,.hero-row picture{height:100%}.hero-row .slide img{height:100%;aspect-ratio:auto;object-fit:cover;object-position:right center}
.hero-row .promo-banner img{max-height:none;flex:1;object-fit:cover;min-height:0}}
.card{position:relative}
.qa{position:absolute;inset:auto 0 0 0;z-index:5;background:#fff;border-top:2px solid var(--green);border-radius:16px 16px var(--radius) var(--radius);box-shadow:0 -8px 24px rgba(48,48,48,.12);padding:14px 12px 12px;display:grid;gap:8px;animation:qa .18s ease-out}
@keyframes qa{from{transform:translateY(12px);opacity:0}}
.qa-x{position:absolute;top:6px;inset-inline-end:6px;width:28px;height:28px;border:0;border-radius:50%;background:var(--cream);font-size:18px;line-height:1}
.qa-l{margin:0;font-size:12px;color:var(--muted)}.qa-packs{display:flex;gap:6px;flex-wrap:wrap}
.qa-packs button{flex:1;min-width:52px;min-height:36px;border:1px solid var(--line);background:#fff;border-radius:10px;font-weight:700;font-size:13px}
.qa-packs button.on{border-color:var(--green);background:#eef5f0;color:var(--green)}.qa-packs button:disabled{opacity:.4;text-decoration:line-through}
.qa-price{margin:0;display:flex;gap:6px;align-items:baseline}.qa-price b{font-size:17px}
.qa-step{justify-content:space-between;width:100%}.qa-step button{width:36px;height:36px;font-size:18px}.qa-step button:disabled{opacity:.35}.qa-step span{font-weight:700;font-size:16px}
.qa .btn{min-height:42px}
.stepper.lg button{width:40px;height:40px}
.slider{margin:16px 0 24px;border-radius:22px}.slide img{aspect-ratio:1332/592;object-fit:cover}
@media (max-width:760px){.slider{margin:10px 0 16px;border-radius:16px}.slide img{aspect-ratio:986/1373}}
/* in-cart state on product cards */
.card.in-cart{box-shadow:0 0 0 2px var(--green),var(--shadow)}
.card-step{display:flex;align-items:center;gap:2px;background:var(--green);border-radius:999px;padding:3px;color:#fff}
.card-step button{width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:#fff;font-size:18px;line-height:1}.card-step button:hover{background:rgba(255,255,255,.18)}
.card-step span{min-width:22px;text-align:center;font-weight:700}
.incart-note{margin:0;font-size:12.5px;font-weight:700;color:var(--green)}
/* free-shipping progress (always visible under the header) */
.fs-top{background:#fff;border-top:1px solid var(--line)}
.fs{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:7px 16px;font-size:13.5px;font-weight:700;color:var(--ink)}
.fs-msg{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fs-track{display:flex;justify-content:flex-start;flex:1;min-width:80px;height:8px;background:var(--cream);border-radius:999px;overflow:hidden}
.fs-track i{display:block;flex:none;height:100%;width:0;background:linear-gradient(90deg,var(--green),#6ba180);border-radius:999px;transition:width .6s ease}
[dir=rtl] .fs-track i{margin-inline-start:0}.fs.done{color:var(--green)}.fs.done .fs-track i{background:var(--green)}
.fs.compact{padding:8px 0;flex-wrap:wrap}.fs.compact .fs-msg{white-space:normal;flex-basis:calc(100% - 30px)}.fs.compact .fs-track{flex-basis:100%}
/* added-to-cart confirmation */
.added-panel{position:fixed;z-index:65;top:84px;inset-inline-end:18px;width:min(380px,calc(100% - 24px));background:#fff;border-radius:18px;box-shadow:0 18px 48px rgba(48,48,48,.22);padding:14px 16px;display:grid;gap:10px;opacity:0;transform:translateY(-8px);transition:.2s}
.added-panel.on{opacity:1;transform:none}.ap-head{display:flex;justify-content:space-between;align-items:center;color:var(--green)}.ap-head .x{position:static}
.ap-item{display:grid;grid-template-columns:64px 1fr;gap:10px;align-items:center}.ap-item img{width:64px;height:64px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:10px}.ap-item div{display:grid;font-size:14px}
.ap-sub{display:flex;justify-content:space-between;margin:0;border-top:1px solid var(--line);padding-top:8px}
.ap-btns{display:grid;grid-template-columns:1fr 1.3fr;gap:8px}.ap-btns .btn{min-height:42px;padding:8px 10px;font-size:14px}
@media (max-width:760px){.added-panel{top:auto;bottom:calc(74px + env(safe-area-inset-bottom));inset-inline:12px;width:auto}.fs{padding:6px 12px;font-size:12.5px}}
.fs-top{transition:opacity .3s,transform .3s}.fs-top.out{opacity:0;transform:translateY(-6px)}
/* checkout steps */
.co-steps{list-style:none;display:flex;gap:6px;padding:0;margin:12px 0 14px}
.co-steps li{flex:1;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--muted);padding-bottom:8px;border-bottom:3px solid var(--line)}
.co-steps li span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--line);color:var(--ink);font-size:12px;flex:none}
.co-steps li.on{color:var(--ink);border-color:var(--green)}.co-steps li.on span{background:var(--green);color:#fff}
.co-steps li.done{color:var(--green);border-color:var(--green)}.co-steps li.done span{background:#e3efe7;color:var(--green)}
.lines-head{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.link{border:0;background:none;color:var(--green);font-weight:700;padding:4px 0;cursor:pointer}.link.danger{color:var(--warn)}
.lines li{grid-template-columns:64px 1fr auto}.lines li div{gap:2px}.line-tot{font-size:15px}
.line-ctl{display:grid!important;justify-items:center;gap:4px}
.points-box{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--cream);border:1px dashed var(--brand);border-radius:14px;padding:12px 14px;margin:8px 0}
.points-box.on{border-style:solid;border-color:var(--green);background:#eef5f0}.points-box div{display:grid;gap:2px}.points-box.guest{display:block;font-size:14px}
.switch-row{display:flex;align-items:center;gap:8px;font-weight:700;white-space:nowrap}.switch-row input{width:20px;height:20px;accent-color:var(--green)}
.pay.opt{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:6px 0}.pay.opt:has(input:checked){border-color:var(--green);background:#eef5f0}.pay.opt b{margin-inline-start:auto}
fieldset{border:0;padding:0}legend{font-weight:700;color:var(--ink);padding:0;margin-bottom:4px}
.co-nav{display:grid;grid-template-columns:1fr 2fr;gap:8px;margin-top:6px}
/* «تأكيد الطلب · المبلغ» on one clean line, or the amount deliberately on a second line (owner, 9 Nov 2026) */
.co-nav{grid-template-columns:minmax(0,auto) minmax(0,1fr)}.co-nav>.btn{min-width:0;padding-inline:14px}
.co-place{white-space:nowrap;flex-wrap:nowrap;gap:0;overflow:hidden;line-height:1.2}.co-place .cp-l,.co-place .cp-a{white-space:nowrap}.co-place .cp-sep{white-space:pre}
.co-place.cp-two{flex-direction:column;padding-block:6px;gap:1px}.co-place.cp-two .cp-sep{display:none}.co-place.cp-two .cp-a{font-size:.88em;font-weight:500;opacity:.95}
.recap{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;background:var(--cream);border-radius:14px;padding:12px 14px}
.empty-cart{text-align:center;padding:40px 0;display:grid;gap:10px;justify-items:center}
.checkout textarea{resize:vertical}.testpay .tp-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tp-note{background:#fff3cd;color:#7a5200;border:1px dashed #d9a400;border-radius:12px;padding:10px 12px;font-size:14px;margin:0}
/* page heroes: readable title over the site's artwork */
.page-hero{background:linear-gradient(rgba(249,242,229,.9),rgba(249,242,229,.9)),url(/media/Page_Title_2025.webp) center/cover;border:1px solid var(--line)}
.page-hero h1{color:var(--ink)}
/* wholesale page: the main site's Wholesale page and its customer information form (owner, 29 Oct 2026) */
.ws-hero{background:var(--cream);border-radius:26px;padding:34px;margin:18px 0 8px;display:grid;gap:14px}
.ws-hero h1{font-size:clamp(28px,3.6vw,44px);margin:0;color:var(--brand)}.ws-hero .lead{font-size:clamp(16px,1.8vw,20px);font-weight:700;margin:0;color:var(--ink)}
.ws-notice{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-inline-start:4px solid var(--brand);border-radius:16px;padding:16px 18px}
.ws-horn{font-size:26px;line-height:1.2}.ws-notice p{margin:0 0 6px;color:var(--ink2)}.ws-notice a{color:var(--green);font-weight:700;text-decoration:none;white-space:nowrap}
.ws-notice ul{margin:8px 0 0;padding-inline-start:18px;display:grid;gap:4px;color:var(--ink2)}.ws-notice b{color:var(--brand)}
.sec-title h2{margin:0;color:var(--brand);font-size:clamp(22px,2.8vw,32px)}
.ws-table-wrap{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}
.ws-table{width:100%;border-collapse:collapse;table-layout:fixed}
.ws-table th,.ws-table td{padding:14px 12px;text-align:center;vertical-align:top;border-bottom:1px solid var(--line);font-size:14px;overflow-wrap:anywhere}
.ws-table thead th{background:var(--brand);color:#fff;font-size:15px;vertical-align:middle}.ws-table thead th small{display:block;font-weight:400;font-size:12px;opacity:.9}
.ws-table tbody th{background:var(--cream);color:var(--brand);text-align:start;width:17%}.ws-table tbody tr:last-child>*{border-bottom:0}
.ws-table td b{display:block;color:var(--ink)}.ws-table td small{display:block;color:var(--ink2);font-size:12.5px;margin-top:2px}
.ws-table td ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;text-align:start}.ws-table td li b{display:inline}
.ws-r-qty td b{font-size:18px;color:var(--green)}.ws-r-disc td>div>b{color:var(--green)}.ws-aud{display:none}
.perks{list-style:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 6px}.perks li{background:var(--cream);border-radius:999px;padding:8px 16px;font-weight:700;color:var(--green)}
.ws-banner{text-align:center;color:var(--ink2);font-weight:600;margin:6px 0 0}
.ws-duo{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin:30px 0 0;align-items:stretch}
.ws-ask{background:var(--cream);border-radius:26px;padding:30px;display:grid;gap:12px;align-content:center}.ws-ask h2{font-size:clamp(18px,2.2vw,24px);margin:0;line-height:1.45}
.ws-cat{background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px;display:grid;gap:10px;align-content:start;text-align:center}
.ws-cat img{width:100%;max-width:260px;height:auto;margin:0 auto;border-radius:14px}.ws-cat h2{font-size:15px;font-weight:500;line-height:1.6;margin:0;color:var(--ink2)}
.cat-btns{display:grid;gap:8px}.cat-btns .btn{justify-content:space-between}.cat-btns small{font-weight:400;opacity:.85;font-size:12px}
.ws-form{max-width:780px;margin:34px auto 0;scroll-margin-top:140px}.ws-form h2{text-align:center;font-size:clamp(18px,2.2vw,24px);color:var(--brand)}
.ws-intro{background:var(--cream);border-inline-start:4px solid var(--brand);border-radius:12px;padding:14px 18px;margin:0 0 18px;color:var(--ink)}
.wsform{display:grid;gap:14px}.wsform>.btn{justify-self:start;min-width:200px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ws-q{display:grid;gap:8px;align-content:start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin:0;min-width:0;font-weight:600;color:var(--ink)}
fieldset.ws-q>legend{float:left;width:100%;padding:0;margin:0 0 4px;font-size:inherit;color:var(--ink)}
.ws-l{display:block}.ws-q input,.ws-q textarea{font-weight:400}.ws-q .req{color:var(--warn)}.ws-q .hint{display:block;font-weight:400;font-size:13px;color:var(--muted);margin-top:2px}
.ws-opts{display:grid;gap:2px}.ws-q label.pay{font-weight:400;padding:5px 0;align-items:flex-start}.ws-q label.pay input{margin-top:5px;flex:none}
.ws-q.ws-consent{display:flex;align-items:flex-start;gap:10px;font-weight:400}.ws-consent input{width:auto;margin-top:5px;flex:none}
.ws-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.ws-search{flex:1 1 200px;min-width:0}
.ws-count{background:var(--green);color:#fff;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:700;white-space:nowrap}
.ws-chips{display:flex;flex-wrap:wrap;gap:6px}.ws-chips:empty{display:none}
.ws-chip{display:inline-flex;align-items:center;gap:6px;background:#edf3ef;border:1px solid #cfe0d5;border-radius:999px;padding:3px 6px 3px 10px;font-size:13px;font-weight:400}[dir=rtl] .ws-chip{padding:3px 10px 3px 6px}
.ws-chip button{border:0;background:none;font-size:17px;line-height:1;padding:0 4px;color:var(--green)}
.ws-plist{max-height:300px;overflow-y:auto;overflow-x:hidden;border-top:1px solid var(--line);padding-top:6px}.ws-plist.off{opacity:.45;pointer-events:none}
.ws-glabel{font-size:12px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.06em;margin:12px 0 4px}.ws-grp:first-child .ws-glabel{margin-top:0}
.ws-opt,.ws-all{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 8px;border-radius:8px}.ws-opt:hover{background:var(--cream)}
.ws-pk{display:flex;align-items:flex-start;gap:8px;flex:1 1 12em;min-width:0;overflow-wrap:anywhere;font-weight:400;cursor:pointer}.ws-pk input{width:auto;margin-top:5px;flex:none}
.ws-q .ws-qty{flex:0 0 96px;width:96px;padding:6px 8px;text-align:center;border-radius:8px}.ws-q .ws-qty.low{border-color:var(--warn);background:#fbf1ef}
.ws-all{border:1px solid var(--line);background:var(--cream);padding:8px 10px}.ws-all .ws-pk{font-weight:700}.ws-allcap{font-weight:400;font-size:13px;color:var(--ink2)}
.ws-empty{margin:8px 6px;color:var(--muted);font-size:14px;font-weight:400}
/* the wholesale customer information form served by the store (ws-form.js, 7 Nov 2026): the server's message under its field, the product's size, yes / no on one line */
.ws-err{margin:2px 0 0;color:var(--warn);font-size:13.5px;font-weight:600}.ws-q.bad{border-color:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 12%,transparent)}
.ws-optional{font-weight:400;color:var(--muted);font-size:13px}.ws-size{color:var(--muted);font-size:13px;white-space:nowrap;unicode-bidi:isolate}.ws-inline .ws-opts{display:flex;gap:4px 22px;flex-wrap:wrap}
#wsFull .ws-q.ws-consent{display:grid;gap:6px}#wsFull .ws-consent label.pay{display:flex;align-items:flex-start;gap:10px}
#wsFull .ws-q input[type=text],#wsFull .ws-q input[type=tel],#wsFull .ws-q input[type=email],#wsFull .ws-q textarea{width:100%;min-width:0}
@media (max-width:900px){.ws-duo{grid-template-columns:1fr}}
@media (max-width:820px){ /* the table stacks row by row, each value with its audience, as on the main site */
  .ws-table,.ws-table tbody,.ws-table tr,.ws-table th,.ws-table td{display:block;width:auto}.ws-table thead{display:none}
  .ws-table tbody tr{border-bottom:1px solid var(--line)}.ws-table tbody tr:last-child{border-bottom:0}.ws-table tbody th{width:auto;border-bottom:0}
  .ws-table td{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;text-align:end;padding:10px 14px}.ws-table td>div{min-width:0}
  .ws-table td ul{text-align:end}.ws-aud{display:block;flex:0 0 38%;font-weight:700;color:var(--brand);text-align:start}}
@media (max-width:600px){.grid2{grid-template-columns:1fr}.ws-hero,.ws-ask{padding:22px}.ws-notice{padding:14px}}
.co-steps li{flex-direction:column;justify-content:center;text-align:center;gap:4px}
.card-form label.pay{display:flex;align-items:center;gap:10px;color:var(--ink)}.card-form label.pay input{width:auto;flex:none}
/* ===== product card v3 (marketplace style, Holistic colours) ===== */
.card{border:1px solid var(--line);box-shadow:none;border-radius:16px;transition:box-shadow .2s,border-color .2s}
.card:hover{transform:none;box-shadow:0 10px 28px rgba(48,48,48,.10);border-color:#e2d5bf}
.card.in-cart{box-shadow:0 0 0 2px var(--green);border-color:var(--green)}
.card-media{position:relative;background:#fff;border-radius:16px 16px 0 0;overflow:hidden}
.card-media .card-img{display:block;aspect-ratio:1;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0}
.card-media .card-img::-webkit-scrollbar{display:none}
.cm-track{display:flex;height:100%}.cm-track img{flex:0 0 100%;width:100%;height:100%;object-fit:contain;padding:8%;scroll-snap-align:center;background:#fff}
.card:hover .card-img img{transform:none}
.cm-nav{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:0;background:rgba(255,255,255,.95);box-shadow:0 2px 8px rgba(0,0,0,.15);font-size:20px;line-height:1;color:var(--ink);opacity:0;transition:.2s;z-index:2}
.cm-nav.prev{inset-inline-start:8px}.cm-nav.next{inset-inline-end:8px}.card:hover .cm-nav{opacity:1}
.cm-dots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:4px}.cm-dots i{width:6px;height:6px;border-radius:50%;background:rgba(48,48,48,.25)}.cm-dots i.on{background:var(--brand);width:14px;border-radius:4px}
.tags{position:absolute;top:8px;inset-inline-start:8px;display:grid;gap:4px;justify-items:start;z-index:2}
.tags .tag{position:static;font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;color:#fff;background:var(--ink)}
.tag.t-best{background:var(--brand)}.tag.t-new{background:var(--green)}.tag.t-low{background:#b54708}.tag.t-out{background:#5f5952}
.heart{top:8px;inset-inline-end:8px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.14);z-index:2;font-size:0}
.heart svg{fill:none;transition:transform .2s}.heart:hover{color:#d1453b}.heart.on{color:#d1453b}.heart.on svg{fill:#d1453b}
.heart.pop svg{animation:hpop .35s}@keyframes hpop{50%{transform:scale(1.3)}}
.cm-cart{position:absolute;bottom:10px;inset-inline-end:10px;z-index:3}
.cm-cart .add{width:40px;height:40px;display:grid;place-items:center;background:#fff;color:var(--green);border:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.14)}
.cm-cart .add:hover{background:var(--green);color:#fff}
.cm-cart .card-step{box-shadow:0 2px 10px rgba(0,0,0,.18)}.card-step button{display:grid;place-items:center}
.card.is-out .cm-track img{opacity:.55}
.card-body{gap:5px;padding:10px 12px 12px}
.rating{display:flex;align-items:center;gap:6px}.r-badge{display:inline-flex;align-items:center;gap:3px;background:var(--green);color:#fff;font-size:12px;font-weight:700;border-radius:6px;padding:2px 6px}
.price-line{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.price-line .now{font-size:17px;color:var(--ink)}.price-line .was{font-size:13px;color:var(--muted)}.pct{font-size:12px;font-weight:800;color:var(--green)}
.packs-line{font-size:12px}
.qa{border-radius:16px}
/* photo strip scrolls left-to-right in both languages (consistent swipe and dots) */
.card-media .card-img,.cm-dots{direction:ltr}.cm-nav.l{left:8px;right:auto}.cm-nav.r{right:8px;left:auto}
/* add to cart under the product details: a "+" that turns into − n + */
.card-body .cm-cart{position:static;margin-top:4px}
.add-plus{width:100%;min-height:40px;border:1.5px solid var(--green);background:#fff;color:var(--green);border-radius:999px;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;gap:6px;transition:.15s}
.add-plus span{font-size:14px}.add-plus:hover{background:var(--green);color:#fff}
.card-body .card-step{width:100%;justify-content:space-between;min-height:40px;box-shadow:none}
.card-body .card-step button{width:38px;height:34px}.card-body .card-step span{font-size:16px}
.incart-note{font-size:12px;line-height:1.4}
.line-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}.sum .save{color:var(--green);font-weight:700}
.pack-chips{display:flex;flex-wrap:wrap;gap:4px}.pack-chips span{font-size:11.5px;background:var(--cream);border-radius:6px;padding:2px 7px;color:var(--ink2);white-space:nowrap}.pack-chips b{color:var(--ink)}
@media (hover:none){.cm-nav{display:none}}
.buy-again{background:var(--cream);border-radius:22px;padding:18px 18px 8px;margin:0 0 26px}.buy-again .section-head{margin-top:0}.buy-again p{margin:-6px 0 12px}
/* home promo cards: no price, no wishlist, no cart */
.prail{grid-auto-columns:minmax(220px,250px)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.pcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);scroll-snap-align:start;transition:box-shadow .2s,transform .2s}
.pcard:hover{box-shadow:0 12px 30px rgba(48,48,48,.10);transform:translateY(-2px)}
.pcard-img{position:relative;display:block;aspect-ratio:1;background:#fff}.pcard-img img{width:100%;height:100%;object-fit:contain;padding:9%}
.pcard-img .tag{position:absolute;top:10px;inset-inline-start:10px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;color:#fff}
.pcard-body{display:flex;flex-direction:column;gap:7px;padding:12px 14px 14px;flex:1;border-top:1px solid var(--line);background:linear-gradient(#fff,#fffdf9)}
.pcard-name{font-size:15px;line-height:1.35}.pcard-txt{font-size:13.5px;color:var(--ink2);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.pcard-cta{color:var(--green);font-weight:800;font-size:14px}
/* shop: category side list */
.shop{display:grid;grid-template-columns:230px 1fr;gap:24px;align-items:start}
.shop-side{position:sticky;top:110px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px}
.shop-side h2{font-size:15px;margin:2px 6px 10px;color:var(--brand)}.shop-side nav{display:grid;gap:2px}
.shop-side a{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:8px;padding:8px 8px;border-radius:12px;color:var(--ink);text-decoration:none;font-weight:700;font-size:14.5px}
.shop-side a img{width:28px;height:28px}.shop-side a .ic{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:var(--cream);color:var(--brand);font-weight:800}
.shop-side a small{color:var(--muted);font-weight:400}.shop-side a:hover{background:var(--cream)}
.shop-side a.on{background:var(--brand);color:#fff}.shop-side a.on small{color:#fff}.shop-side a.on img{filter:brightness(0) invert(1)}.shop-side a.on .ic{background:rgba(255,255,255,.2);color:#fff}
.shop-main .page-title{margin-top:0}
@media (max-width:900px){.shop{grid-template-columns:1fr;gap:10px}.shop-side{position:static;padding:8px;border-radius:14px;overflow-x:auto}.shop-side h2{display:none}
  .shop-side nav{display:flex;gap:6px}.shop-side a{grid-template-columns:auto auto auto;white-space:nowrap;padding:8px 12px;border:1px solid var(--line);border-radius:999px}.shop-side a img,.shop-side a .ic{width:22px;height:22px}}
@media (hover:none){.shop-side a:hover{background:transparent}.shop-side a.on:hover{background:var(--brand)}}
/* floating cart (corner opposite WhatsApp) */
.cart-fab{position:fixed;bottom:20px;inset-inline-end:20px;z-index:36;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:0;border-radius:999px;background:#fff;color:var(--brand);box-shadow:0 10px 30px rgba(48,48,48,.22);text-align:start;cursor:pointer}
[dir=rtl] .cart-fab{padding:8px 8px 8px 14px}
.cf-icon{position:relative;width:52px;height:52px;border-radius:50%;background:var(--cream);display:grid;place-items:center;flex:none}
.cf-fill{fill:var(--green);opacity:.85;transition:y .6s cubic-bezier(.3,1.4,.5,1)}.cart-fab.full .cf-fill{fill:var(--green);opacity:1}
.cf-count{position:absolute;top:-4px;inset-inline-end:-4px;min-width:22px;height:22px;border-radius:999px;background:var(--brand);color:#fff;font-size:12px;display:grid;place-items:center;padding:0 5px;border:2px solid #fff}
.cf-info{display:grid;gap:3px;min-width:120px}.cf-total{font-size:16px;color:var(--ink)}
.cf-bar{display:flex;height:6px;background:var(--cream);border-radius:999px;overflow:hidden}.cf-bar i{display:block;height:100%;width:0;background:var(--green);border-radius:999px;transition:width .6s ease}
.cf-msg{font-size:11.5px;font-weight:700;color:var(--green);white-space:nowrap}
.cart-fab.bump .cf-icon{animation:cfbump .5s cubic-bezier(.3,1.6,.5,1)}@keyframes cfbump{30%{transform:scale(1.18) rotate(-8deg)}60%{transform:scale(.95) rotate(4deg)}}
.cart-fab.bump .cf-count{animation:cfpop .5s}@keyframes cfpop{40%{transform:scale(1.4)}}
.fly{position:fixed;z-index:80;object-fit:contain;background:#fff;border-radius:14px;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,.2)}
@media (max-width:760px){.cart-fab{bottom:calc(76px + env(safe-area-inset-bottom));inset-inline-end:12px;padding:6px 12px 6px 6px}[dir=rtl] .cart-fab{padding:6px 6px 6px 12px}.cf-icon{width:44px;height:44px}.cf-info{min-width:100px}.cf-total{font-size:14px}}
@media (max-width:760px){.on-pdp .cart-fab{bottom:calc(140px + env(safe-area-inset-bottom))}}
.ship-note{margin:0;background:#eef5f0;border:1px solid var(--green);border-radius:12px;padding:10px 12px;font-size:13.5px;color:var(--ink)}
.checkout select{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff}
.tel{display:flex;align-items:stretch;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.tel .cc{display:flex;align-items:center;gap:4px;padding:0 12px;background:var(--cream);font-weight:700;white-space:nowrap;border-inline-end:1px solid var(--line)}
.tel input{border:0;border-radius:0;background:transparent}.tel:focus-within{border-color:var(--brand)}
.tel:has(input.bad){border-color:var(--warn)}.tel:has(input.good){border-color:var(--green)}
.tel-msg{font-size:12.5px;min-height:1.2em}.tel-msg .num,bdi.num{unicode-bidi:isolate;white-space:nowrap}.tel-msg.ok{color:var(--green)}.tel-msg.err{color:var(--warn)}
.fld{display:grid;gap:6px;font-size:14px;color:var(--ink2)}
.tel{direction:ltr}
.combo{position:relative}.combo input{width:100%;background:#fff}
.combo-list{position:absolute;z-index:5;top:calc(100% + 4px);inset-inline:0;max-height:280px;overflow:auto;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(48,48,48,.16)}
.combo-list li{display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;column-gap:8px;padding:8px 10px;border-radius:10px;cursor:pointer}
.combo-list li .flag-s{grid-row:span 2;font-size:20px;align-self:center}.combo-list li small{color:var(--muted)}
.combo-list li:hover,.combo-list li.on{background:var(--cream)}.combo-list li.none{display:block;color:var(--muted);cursor:default}
.country-q{width:100%;margin:0 0 12px;background:#fff}.country-grid .none{grid-column:1/-1;color:var(--muted)}
.payopt .pl{display:grid;gap:2px;flex:1}.pi{margin-inline-start:auto;font-size:11px;font-weight:800;border-radius:6px;padding:4px 8px;white-space:nowrap;direction:ltr}
.pi-test{background:#fff3cd;color:#7a5200;border:1px dashed #d9a400}.pi-apple,.pi-s{background:#000;color:#fff}.pi-g{background:#fff;color:#3c4043;border:1px solid #dadce0}.pi-tabby{background:#3bffc1;color:#292929}.pi-tamara{background:#f4e9df;color:#000}.pi-card{background:#eef2ff;color:#1a1f71}
.payopt .pi{flex:none;width:auto}.payopt{align-items:center}
/* numbers and contact lines in pages */
.ltr{unicode-bidi:isolate;direction:ltr;display:inline-block}
.page-body .agent{display:grid;grid-template-columns:minmax(120px,1fr) auto auto;align-items:center;gap:12px;padding:10px 14px;margin:6px 0;background:#fff;border:1px solid var(--line);border-radius:14px}
.ag-name{font-weight:700}.ag-num{color:var(--ink);text-decoration:none;font-weight:700;font-variant-numeric:tabular-nums}
.ag-act{display:flex;gap:6px}.ag-act a{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff}
.ag-wa{background:#25d366}.ag-call{background:var(--green)}.ag-mail{background:var(--brand)}
.ag-act a:hover{filter:brightness(.92)}
@media (max-width:600px){.page-body .agent{grid-template-columns:1fr auto}.ag-num{grid-column:1;grid-row:2;font-size:14px}.ag-act{grid-row:span 2}}
.ag-num{justify-self:start}
.logo-sq{width:72px;height:72px;object-fit:contain;border-radius:50%}.f-about .logo-sq{width:96px;height:96px}
.brand img{width:64px;height:64px;object-fit:contain}.modal-card img{object-fit:contain}
@media (max-width:760px){.brand img{width:48px;height:48px}}
.pack small{display:block;font-size:11px;color:var(--muted);margin-top:2px}.pack small em{color:var(--green);font-style:normal;font-weight:700}
.alert-form{background:var(--cream);border-radius:14px;padding:12px 14px;margin:10px 0}.alert-form p{margin:0 0 8px}
.pdp-reviews{margin:30px 0}.rv-sum{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:14px}
.rv-avg{display:grid;justify-items:center;gap:2px}.rv-avg b{font-size:40px;line-height:1}.rv-bars{display:grid;gap:4px}.rv-bars div{display:grid;grid-template-columns:34px 1fr 40px;align-items:center;gap:8px;font-size:13px}
.rv-bars i{display:block;height:8px;background:var(--cream);border-radius:999px;overflow:hidden}.rv-bars i b{display:block;height:100%;background:#b07c00;border-radius:999px;width:0}
.rv-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:16px}
.rate-pick{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}/* DOM 5→1 so checked ~ later siblings = the lower stars */.rate-pick label{position:relative}.rate-pick input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}/* inside its star: a full-width hidden radio widened the page and shifted it sideways on phones */.rate-pick span{font-size:28px;color:#ddd;cursor:pointer}
.rate-pick label:has(input:checked) span,.rate-pick label:has(input:checked)~label span{color:#b07c00}
.saved-addr{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.addr-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font-size:13px}
.addr-li{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tb-end{position:relative}.lang-menu{position:absolute;top:calc(100% + 6px);inset-inline-end:0;z-index:60;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);padding:6px;display:grid;min-width:150px}
.lang-menu button{border:0;background:none;text-align:start;padding:9px 12px;border-radius:8px;font-weight:700;color:var(--ink)}.lang-menu button:hover,.lang-menu button.on{background:var(--cream);color:var(--brand)}

/* ---------- reels: Instagram-style story circles, the full-screen viewer and the reels grid */
.stories{display:none;gap:14px;overflow-x:auto;scrollbar-width:none;padding:6px 2px 14px;margin:0 0 6px;scroll-snap-type:x proximity}
.stories::-webkit-scrollbar{display:none}
.story{flex:0 0 auto;width:76px;display:flex;flex-direction:column;align-items:center;gap:6px;border:0;background:none;padding:0;color:var(--ink);text-decoration:none;cursor:pointer;scroll-snap-align:start}
.story .ring{width:72px;height:72px;border-radius:50%;padding:3px;background:var(--line);display:grid;place-items:center}
.story.new .ring{background:conic-gradient(from 210deg,#c79a3b,var(--brand),#b5651d,var(--green),#c79a3b)}
.story.seen .ring{background:color-mix(in srgb,var(--brand) 30%,var(--line))}
.story .ring img{width:100%;height:100%;border-radius:50%;object-fit:contain;background:var(--cream);border:3px solid var(--bg,#fff);padding:6px}
.story b{font-size:12px;font-weight:600;line-height:1.25;text-align:center;max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.story:focus-visible .ring{outline:2px solid var(--brand);outline-offset:2px}
@media (max-width:760px){.stories{display:flex}.cat-grid{display:none!important}}
.page-hero + .stories{display:flex;justify-content:center;flex-wrap:wrap}
/* up to five sections in ONE row on any phone (owner, 5 Nov 2026): each circle takes a fifth of the width (at most its usual 72px), the name below it;
   six or more stay one row that scrolls sideways */
.page-hero + .stories{flex-wrap:nowrap;justify-content:center}
.page-hero + .stories:not(:has(> :nth-child(6))){gap:8px;overflow:visible;justify-content:space-evenly}
.page-hero + .stories:not(:has(> :nth-child(6))) > .story{flex:1 1 0;min-width:0;width:auto;max-width:76px}
.page-hero + .stories:not(:has(> :nth-child(6))) > .story .ring{width:100%;height:auto;aspect-ratio:1/1;max-width:72px}
.page-hero + .stories:not(:has(> :nth-child(6))) > .story b{max-width:100%;font-size:11px}
.watch-btn{margin:10px 0}
.reel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px;margin:6px 0 30px}
.reel-tile{position:relative;aspect-ratio:9/16;border:0;padding:0;border-radius:10px;overflow:hidden;background:var(--cream);cursor:pointer}
.reel-tile img{width:100%;height:100%;object-fit:cover}
.reel-tile .play{position:absolute;inset:auto auto 10px 10px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:13px;background:rgba(40,28,18,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.reel-tile small{position:absolute;inset:auto 0 0;padding:28px 10px 10px;color:#fff;font-size:12px;font-weight:600;text-align:start;background:linear-gradient(transparent,rgba(40,28,18,.7))}
[dir=rtl] .reel-tile .play{inset:auto 10px 10px auto}
.reels-modal{position:fixed;inset:0;z-index:80;background:#1f1610}
body.reels-open{overflow:hidden}
.reels-modal[data-leave]{transition:transform .18s ease-in}.reels-modal[data-leave=l]{transform:translateX(-100%)}.reels-modal[data-leave=r]{transform:translateX(100%)} /* a sideways swipe in the reels tab: the videos go with the finger, the bar's next tab comes */
.reels-track{height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior:contain}
.reels-track::-webkit-scrollbar{display:none}
.reel{position:relative;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center}
.reel video{width:100%;height:100%;max-width:min(100%,calc(100dvh * 9 / 16));object-fit:contain;background:#1f1610}
.reel-embed{width:min(100%,420px);height:calc(100dvh - 150px);margin-top:-40px}
.reel-embed iframe{width:100%;height:100%;border:0;border-radius:14px;background:#fff}
.reels-top{position:fixed;top:0;inset-inline:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;color:#fff;pointer-events:none}
.reels-top b{font-size:15px;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.reels-top button{pointer-events:auto;width:42px;height:42px;font-size:22px;line-height:1;color:#fff;border-radius:50%}
.reel-info{position:absolute;inset:auto 0 0;padding:40px 16px calc(18px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(31,22,16,.75));color:#fff;max-width:min(100%,calc(100dvh * 9 / 16));margin:0 auto}
.reel-info .cap{margin:0 0 10px;font-size:14px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.reel-actions{display:flex;gap:8px;flex-wrap:wrap}
.glass{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(18px) saturate(1.8);-webkit-backdrop-filter:blur(18px) saturate(1.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 20px rgba(0,0,0,.18);cursor:pointer}
.rchip{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;color:#fff;text-decoration:none;font-size:13px;font-weight:700}
.rchip img{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--cream)}
.rchip small{display:block;font-weight:400;font-size:11.5px;opacity:.85}
.rchip.insta{padding:9px 14px}
[dir=rtl] .rchip{padding:6px 6px 6px 14px}
@media (prefers-reduced-transparency:reduce){.glass{background:rgba(60,42,28,.85);backdrop-filter:none;-webkit-backdrop-filter:none}}

/* ---------- liquid-glass bottom bar (phones and the app), as in iOS WhatsApp/Instagram */
@media (max-width:760px){
  .bottom-nav{grid-template-columns:repeat(6,1fr);left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom));padding:5px;border-radius:30px;
    background:linear-gradient(180deg,rgba(255,253,249,.62),rgba(249,242,229,.5));border:1px solid rgba(255,255,255,.75);
    backdrop-filter:blur(24px) saturate(1.9);-webkit-backdrop-filter:blur(24px) saturate(1.9);
    box-shadow:0 10px 34px rgba(90,58,30,.18),inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(143,90,53,.08)}
  .bottom-nav a,.bottom-nav button{font-size:10.5px;padding:7px 0 5px;border-radius:24px;transition:background .2s,color .2s}
  .bottom-nav svg{width:21px;height:21px}
  .bottom-nav .on{background:rgba(143,90,53,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){@media (max-width:760px){.bottom-nav{background:var(--card)}}}
/* in a phone's browser (owner, 3 Nov 2026): Safari's own floating bar is under the page's, so the floating bar stood above it with the page showing
   through the gap: here the bar sits on the screen's bottom edge, solid, and the browser's bar lies over its lower part (the home-screen app keeps it floating) */
@media (max-width:760px) and (display-mode:browser){
  .bottom-nav{left:0;right:0;bottom:0;border-radius:22px 22px 0 0;border-bottom:0;padding:5px 8px calc(5px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(255,253,249,.94),rgba(249,242,229,.96));box-shadow:0 -6px 24px rgba(90,58,30,.12),inset 0 1px 0 rgba(255,255,255,.9)}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .sticky-buy{bottom:calc(66px + env(safe-area-inset-bottom))} /* above the bar's top edge, never under it */
}
@media (prefers-reduced-transparency:reduce){@media (max-width:760px){.bottom-nav{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none}}}
.reels-top button{display:grid;place-items:center}.reels-top svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.reels-top .rsp{width:42px}
.rx{font-weight:300}
@media (max-width:760px){.reel-grid{grid-template-columns:repeat(3,1fr);gap:3px}.reel-tile{border-radius:6px}}

/* ---------- offer cards */
.offers{display:grid;gap:18px;margin:10px 0 30px}
.offer-card{background:var(--card,#fff);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.offer-img{width:100%;max-height:260px;object-fit:cover;display:block}
.offer-body{padding:18px 20px}
.offer-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.offer-pct{background:var(--brand);color:#fff;border-radius:999px;padding:4px 12px;font-weight:800;font-size:14px}
.offer-when{background:var(--cream);color:var(--brand);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}
.offer-body h2{margin:6px 0 8px;font-size:21px}
.offer-terms{margin:0 0 12px;padding-inline-start:18px;color:var(--ink2,#444);line-height:1.8}
.offer-code{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0}
.code-chip{display:inline-flex;flex-direction:column;align-items:center;gap:2px;border:2px dashed var(--brand);background:var(--brand-soft,#f7ece2);color:var(--brand);border-radius:14px;padding:10px 22px;cursor:pointer}
.code-chip b{font-size:22px;letter-spacing:2px;font-family:ui-monospace,Menlo,monospace}
.code-chip small{font-size:12px;color:var(--ink2,#555)}
.code-chip:hover,.code-chip:focus-visible{background:#fff}
.offer-how{margin-top:6px;font-size:14px}.offer-how summary{cursor:pointer;font-weight:700;color:var(--green)}
.offer-how ol{margin:6px 0 0;padding-inline-start:20px;line-height:1.8}
.offer-prods{padding:0 20px 16px}.offer-prods h3{font-size:15px;margin:0 0 8px}
@media (min-width:900px){.offer-card:has(.offer-img){display:grid;grid-template-columns:minmax(260px,38%) 1fr}.offer-card:has(.offer-img) .offer-img{max-height:none;height:100%}.offer-prods{grid-column:1/-1}}
/* owner: one layout for every product card — the same rows in the same place, with or without 3/6-pack prices,
   so the add-to-cart button always sits at the bottom of the card */
.card-body .rating{min-height:26px}
.card-body .price-line{min-height:46px;align-content:flex-start}
.card-body .pack-chips{flex-direction:column;align-items:flex-start;min-height:52px}
.card-body .cm-cart{margin-top:auto;padding-top:6px}
.card-body .card-name{min-height:2.9em}
/* owner: the "✓ in the cart" line keeps its row even while hidden, so the button never jumps when it appears */
.card-body .incart-note{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px}.card-body .incart-note[hidden]{display:-webkit-box!important;visibility:hidden}

/* owner (Android test): an Instagram-like bottom bar — icons only, the active tab in brand colour with a bolder icon,
   no grey/white flash on tap; the cart opens above the bar so the bar never disappears */
a,button,[role=button]{-webkit-tap-highlight-color:transparent}
@media (max-width:760px){
  .bottom-nav a,.bottom-nav button{padding:11px 0 9px;background:none!important;box-shadow:none!important;color:var(--ink2);transition:color .15s,transform .1s}
  .bottom-nav a:active,.bottom-nav button:active{transform:scale(.9)}
  .bottom-nav span:not(.cart-count){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .bottom-nav svg{width:26px;height:26px;margin:0 auto;stroke-width:1.7}
  .bottom-nav .on{color:var(--brand)!important}.bottom-nav .on svg{stroke-width:2.5}
  .bottom-nav .cart-count{top:4px;inset-inline-end:calc(50% - 22px);min-width:18px;height:18px;line-height:18px;padding:0 5px;font-size:10.5px}
  .bottom-nav{z-index:55}
  .drawer{bottom:calc(80px + env(safe-area-inset-bottom));border-radius:0 0 22px 22px}
}
#countryBtn.locked{cursor:default;opacity:1}
.geo-credit{color:inherit;opacity:.6;font-size:11px}
/* customer payment page (phone orders) */
.pay-page{max-width:640px;margin:20px auto 40px;padding:0 4px}.pay-page h1{font-size:22px;margin-bottom:4px}
.pay-items{background:var(--card,#fff);border:1px solid var(--line);border-radius:16px;padding:12px 14px;margin:14px 0}.pay-items h2{font-size:15px;margin:0 0 6px}
.pay-line{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}.pay-line:last-child{border-bottom:0}
.pay-line img{border-radius:8px;object-fit:contain;background:#faf6ef}.pay-line span{flex:1}
.pay-total{white-space:nowrap}.pill.big{display:block;padding:14px;font-size:15px;line-height:1.7;border-radius:14px}

.lightbox{cursor:zoom-out}.lightbox .x{position:fixed;top:14px;inset-inline-end:14px;z-index:2;width:44px;height:44px;border-radius:50%;font-size:26px;cursor:pointer}

/* an open cart or menu drawer is never covered by the cookie banner: it waits, unanswered, until the drawer closes (owner, 9 Nov 2026: site QA) */
.drawer.open~.consent,.menu-drawer.open~.consent{display:none}
div.consent{position:fixed;inset-inline:12px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:90;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 30px rgba(0,0,0,.16);padding:12px 14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;max-width:560px;margin-inline:auto}.consent p{margin:0;font-size:13px;flex:1 1 240px}.consent div{display:flex;gap:8px}
.cart-wait{display:grid;gap:12px;padding:16px}.cart-wait span{height:64px;border-radius:12px;background:linear-gradient(90deg,#f3ece0,#faf6ef,#f3ece0);background-size:200% 100%;animation:cw 1s linear infinite}@keyframes cw{to{background-position:-200% 0}}

/* after-sales: tracking line, self-cancel, "rate your product" */
.ship-info{background:var(--cream2,#f1e4cf);border-radius:12px;padding:8px 12px}
.rv-prod{display:flex;gap:14px;align-items:center;margin:8px 0 14px}.rv-prod img{border-radius:12px;object-fit:cover}
.stars-in{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px;font-size:34px;line-height:1}.stars-in input{position:absolute;opacity:0;width:0;height:0}
.stars-in label{color:#cbbda6;cursor:pointer}.stars-in input:checked ~ label,.stars-in label:hover,.stars-in label:hover ~ label{color:#e0a100}
.link.danger{color:#a33;background:none;border:0;cursor:pointer;font:inherit;text-decoration:underline}

/* server-rendered first content (replaced by the app as soon as it starts) */
.ssr{padding:12px 16px;max-width:1100px;margin:0 auto}
/* the home's list for search engines is not the home people see (slider first): hidden from visitors so the page does not jump on loading (owner, 6 Nov 2026); without JavaScript /ssr-show.css shows it */
.ssr-home{display:none}.ssr-grid{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.ssr-grid a{display:block;text-decoration:none;color:inherit}.ssr-grid img{width:100%;height:auto;border-radius:14px;background:#fff}.ssr-grid span{display:block;margin-top:6px;font-size:.9rem}

.intl-note{background:var(--cream2,#f1e4cf);border-bottom:1px solid #e6d7bd;padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:center;font-size:14px}.intl-note p{margin:0}.intl-note div{display:flex;gap:8px}
.pd-rating{display:inline-flex;gap:6px;align-items:center;color:var(--ink2);text-decoration:none;font-size:14px;margin:2px 0 6px}.pd-rating .stars{color:#e0a100;letter-spacing:1px}

/* sign-up consents and the assistant */
.consent{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.5}.consent input{margin-top:4px;flex:none;width:18px;height:18px}.consent a{color:var(--green);font-weight:700}
.as-fab{position:fixed;bottom:20px;inset-inline-end:20px;width:56px;height:56px;border-radius:50%;background:var(--brand);color:#fff;border:0;display:grid;place-items:center;box-shadow:0 6px 18px rgba(92,58,35,.3);z-index:36;cursor:pointer}
@media (max-width:760px){.as-fab{bottom:calc(146px + env(safe-area-inset-bottom));inset-inline-end:14px;width:48px;height:48px}.on-pdp .as-fab{bottom:calc(140px + env(safe-area-inset-bottom))}}
.as-panel{position:fixed;bottom:88px;inset-inline-end:20px;width:min(380px,calc(100vw - 28px));height:min(560px,calc(100vh - 140px));background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 50px rgba(48,48,48,.18);z-index:60;display:flex;flex-direction:column;overflow:hidden}
@media (max-width:760px){.as-panel{inset:auto 8px calc(8px + env(safe-area-inset-bottom)) 8px;width:auto;height:min(78vh,620px)}}
.as-panel header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:var(--cream);color:var(--brand)}.as-panel #asNew{margin-inline-start:auto;margin-inline-end:8px;font-size:12px}.as-panel .x{background:none;border:0;font-size:24px;cursor:pointer;color:var(--brand)}
.as-log{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px}.as-msg{max-width:88%;padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.6}.as-msg p{margin:0}
.as-msg.me{align-self:flex-end;background:var(--green);color:#fff;border-end-end-radius:4px}.as-msg.bot{align-self:flex-start;background:var(--cream);border-end-start-radius:4px}
.as-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.as-chip{font-size:12px}.as-prods{display:flex;flex-direction:column;gap:6px;margin-top:8px}.as-prods a{display:flex;gap:8px;align-items:center;text-decoration:none;color:inherit;background:#fff;border-radius:10px;padding:4px}.as-prods img{border-radius:8px}
#asForm{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}#asForm input{flex:1;min-width:0}.as-note{margin:0;padding:0 12px 8px;font-size:11px;color:var(--muted)}
/* the complaint form inside the chat (owner, 29 Oct 2026): the bubble takes the panel's width; fields of 16px, so a phone does not zoom in on them */
.as-msg.has-cmp{max-width:100%;width:100%}
.as-cmp{display:grid;gap:9px;margin-top:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}
.as-cmp-h{color:var(--brand);font-size:15px;line-height:1.4}
.as-cmp label{display:grid;gap:4px;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.as-cmp input,.as-cmp textarea,.as-cmp select{width:100%;min-width:0;font:inherit;font-size:16px;line-height:1.45;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.as-cmp input:focus,.as-cmp textarea:focus,.as-cmp select:focus{border-color:var(--brand);outline:none}
.as-cmp textarea{resize:vertical;min-height:76px}
.as-cmp .btn{justify-self:stretch;padding:11px 18px}.as-cmp .btn:disabled{opacity:.6}
.as-cmp-note{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.as-cmp-msg{margin:0;font-size:13.5px;line-height:1.5;color:var(--warn)}.as-cmp-msg:empty{display:none}
.as-cmp-done{margin:10px 0 0;font-weight:700;color:var(--green)}
.as-num{white-space:nowrap;unicode-bidi:isolate}
/* the conversation shown again (owner, 29 Oct 2026): the last two exchanges under «المحادثات السابقة»; the older ones load above it as the customer
   scrolls up, the page keeping its place by itself (no browser anchoring on top of it) */
.as-log{overflow-anchor:none}
.as-older{display:flex;flex-direction:column;gap:10px}.as-older:empty{display:none}
.as-prev{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.4;color:var(--muted)}
.as-prev::before,.as-prev::after{content:"";flex:1;height:1px;background:var(--line)}
.as-prev span{display:inline-flex;align-items:center;gap:6px}
.as-prev button{display:inline-flex;align-items:center;gap:6px;font:inherit;font-weight:700;color:var(--brand);background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:5px 12px;cursor:pointer}
.as-prev button:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.as-prev.busy button{animation:asprev 1s ease-in-out infinite}@keyframes asprev{50%{opacity:.45}}
#curMenu{max-height:60vh;overflow:auto;min-width:200px}#curMenu b{display:inline-block;min-width:42px}.pay-cur{margin:6px 0 0;font-size:13px;color:var(--muted);text-align:end}
/* courses, the community, notifications and the account's own data — the app's screens on the site (owner, 28 Oct 2026) */
.c-stats{display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(90deg,var(--green),var(--brand));color:#fff;border-radius:18px;padding:14px 6px;margin:8px 0 14px;text-align:center}
.c-stats div+div{border-inline-start:1px solid rgba(255,255,255,.3)}.c-stats b{display:block;font-size:24px;font-weight:900}.c-stats span{font-size:12px;opacity:.92}
.c-team{background:var(--cream);border-radius:18px;padding:14px 16px;margin-bottom:14px}.c-team h2{margin:0 0 10px;color:var(--brand);font-size:20px}
.c-who{display:flex;gap:12px;align-items:flex-start}.c-who img{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid #f1e4cf}.c-who b{display:block;font-size:17px;color:var(--brand)}.c-who span{color:var(--green);font-size:13px;font-weight:700}
.c-who ul{list-style:none;padding:0;margin:6px 0 0;font-size:13px;color:var(--ink2)}.c-who li::before{content:'✓ ';color:var(--green);font-weight:900}
.c-bio{font-size:14px;line-height:1.7;margin:10px 0 4px}.c-bio.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.link{background:none;border:0;padding:0;color:var(--green);font-weight:700;cursor:pointer;font:inherit}
.c-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr))}
.c-card{display:flex;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;color:var(--ink);text-decoration:none}.c-card:hover{border-color:var(--green)}
.c-card img{width:96px;height:96px;border-radius:12px;object-fit:cover;flex:none}.c-card>div{flex:1;min-width:0}.c-card h3{margin:0 0 4px;font-size:16px;color:var(--brand)}
.c-row{display:flex;justify-content:space-between;align-items:center;margin:6px 0 0}.c-row b{color:var(--green);font-size:16px}.c-row small{color:var(--muted)}
.c-seats b{font-size:12px}.c-seats.ok b{color:var(--green)}.c-seats.gold b{color:#a87b12}.c-seats.warn b{color:var(--warn)}
.c-seats i{display:block;height:6px;border-radius:9px;background:#f1e4cf;margin-top:4px;overflow:hidden}.c-seats i span{display:block;height:100%;background:var(--green);border-radius:9px}.c-seats.warn i span{background:var(--warn)}
.c-past{list-style:none;padding:0;display:grid;gap:10px}.c-past li{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
.c-past img{width:56px;height:56px;border-radius:12px;object-fit:cover;filter:saturate(.6)}.c-past div{flex:1}.c-past b{display:block;color:var(--brand)}.c-past small{color:var(--muted)}.c-ppl{text-align:center}.c-ppl b{color:var(--green);font-size:18px}
.c-steps{list-style:none;display:flex;gap:6px;padding:0;margin:6px 0 14px;align-items:center}.c-steps li{display:flex;align-items:center;gap:6px;flex:1;color:var(--muted);font-size:13px}
.c-steps li b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#f1e4cf;color:var(--muted);flex:none}.c-steps li.on b{background:var(--green);color:#fff}.c-steps li.on{color:var(--brand)}.c-steps li.now{font-weight:800}
.c-steps li:not(:last-child)::after{content:'';flex:1;height:2px;background:var(--line);border-radius:2px}.c-steps li.on:not(.now)::after{background:var(--green)}
.c-hero{width:100%;max-height:300px;object-fit:cover;border-radius:16px}.c-meta{list-style:none;padding:0;display:grid;gap:6px;color:var(--ink2)}.c-meta img{width:28px;height:28px;border-radius:50%;vertical-align:middle;object-fit:cover}
.c-info{background:var(--cream);border-radius:14px;padding:12px 14px;margin:10px 0}.c-info h3{margin:0 0 6px;color:var(--brand);font-size:15px}.c-info p{margin:0;line-height:1.7}
.c-terms{margin:10px 0}.c-terms summary{font-weight:800;color:var(--brand);cursor:pointer}.c-total{display:flex;justify-content:space-between;align-items:center;margin:12px 0}.c-total b{font-size:22px;color:var(--brand)}
.btn.wide{width:100%}.c-sub{color:var(--green);font-weight:800;margin:0}.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.c-sum{display:grid;gap:4px}.c-sum h3{margin:0;color:var(--brand)}.c-test{background:var(--cream)}.warn-t{color:var(--warn);font-weight:800;margin:0 0 6px}.c-done{font-size:20px;font-weight:900;color:var(--green)}
.community .seg{display:flex;gap:6px;align-items:center;justify-content:center;margin:6px 0 14px;position:relative}
.community .seg a{padding:8px 16px;border-radius:999px;background:var(--cream);color:var(--ink);text-decoration:none;font-weight:700}.community .seg a.on{background:var(--green);color:#fff}
.notes-panel{position:absolute;top:48px;inset-inline-end:0;z-index:60;width:min(360px,92vw);max-height:70vh;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 34px rgba(59,42,30,.18);padding:12px}
.notes-panel h3{margin:0 0 8px;color:var(--brand)}.notes-panel ul{list-style:none;padding:0;margin:0}.notes-panel li a{display:grid;gap:2px;padding:8px;border-radius:10px;color:var(--ink);text-decoration:none}.notes-panel li.new a{background:var(--cream)}
.notes-panel li span{font-size:13px;color:var(--ink2)}.notes-panel li small{color:var(--muted);font-size:11px}
.earn-hint{background:var(--cream);border-radius:12px;padding:8px 12px;font-size:13px}.wtopics{display:flex;gap:6px;overflow-x:auto;margin:8px 0 12px}.wtopics .chip.on{background:var(--green);color:#fff}
.btn.file{cursor:pointer}.wall-list{display:grid;gap:12px;margin-top:12px}
.wpost{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 14px}.wpost header{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.wpost header small{margin-inline-start:auto}
.wpost .av{width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:800}
.wpost>img{width:100%;max-height:420px;object-fit:cover;border-radius:12px}.wpost footer{display:flex;gap:14px;margin-top:6px}.wpost footer button{background:none;border:0;cursor:pointer;color:var(--ink2);font:inherit;min-height:36px}.wpost .wl.on{color:#c0392b}
.wreplies{border-top:1px solid var(--line);margin-top:8px;padding-top:8px;display:grid;gap:8px}.wreply p{margin:2px 0 0}.wreply-form,.rc-form{display:flex;gap:6px}.wreply-form input,.rc-form input{flex:1}
.reel-rail{position:absolute;right:10px;bottom:150px;z-index:3;display:grid;gap:12px}.reel-rail button{width:50px;height:50px;border-radius:50%;color:#fff;font-size:20px;display:grid;place-items:center;cursor:pointer;line-height:1}
.reel-rail small{display:block;font-size:11px;font-weight:700}.reel-rail .on{color:#ff6b6b}
.rcom-sheet{position:absolute;inset:auto 0 0;max-height:65vh;z-index:5;background:#fff;background-color:var(--card,#fff);opacity:1;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate;color:var(--ink);border-radius:20px 20px 0 0;padding:12px 14px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column}
.rcom-sheet header{display:flex;justify-content:space-between;align-items:center}.rcom-sheet .x{background:none;border:0;font-size:26px;cursor:pointer}.rc-list{overflow:auto;flex:1;display:grid;gap:10px;padding:6px 0}
.rc p{margin:2px 0}.rc small{color:var(--muted)}.rc-kids{padding-inline-start:18px;border-inline-start:2px solid var(--line);display:grid;gap:8px}.rc-to{display:block;color:var(--green);font-weight:700}.rc-form{flex-wrap:wrap}
.acc-links{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.acc-links a{flex:1;min-width:140px;text-align:center;background:var(--cream);border-radius:12px;padding:10px;color:var(--brand);font-weight:800;text-decoration:none}
.btn.danger{color:var(--warn);border-color:var(--warn)}
/* reels as in the app (owner, 28 Oct 2026): plain white icons with a shadow and their label, the product as a cream pill */
.reel-rail{gap:18px;bottom:160px}
.reel-rail button{width:auto;height:auto;background:none;border:0;padding:0;display:grid;justify-items:center;gap:4px;color:#fff;cursor:pointer}
.reel-rail svg{width:32px;height:32px;fill:currentColor;filter:drop-shadow(0 1px 4px rgba(0,0,0,.5))}
.reel-rail small{font-size:13px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.reel-rail .on{color:#e5484d}
.rpill{display:inline-flex;align-items:center;gap:8px;max-width:min(290px,72vw);padding:5px;border-radius:999px;background:rgba(249,242,229,.96);box-shadow:0 3px 10px rgba(0,0,0,.25)}
.rpill a{display:flex;align-items:center;gap:8px;min-width:0;text-decoration:none}
.rpill img{width:36px;height:36px;border-radius:50%;object-fit:contain;background:#fff;padding:4px;box-sizing:border-box;flex:none} /* the product inside a circle (owner, 2 Nov 2026, as the apps) */
.rpill b{display:block;font-size:13px;color:#5c3a23;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rpill small{display:block;font-size:12px;font-weight:800;color:var(--green)}
.rbasket{width:34px;height:34px;border-radius:50%;border:0;background:var(--green);color:#fff;display:grid;place-items:center;flex:none;cursor:pointer}
.rbasket svg{width:17px;height:17px}
/* the assistant: easier to read (owner), and room between "new conversation" and closing */
.as-msg{font-size:16px;line-height:1.75}
.as-chip{font-size:14px}.as-prods a{font-size:14px}
#asForm input{font-size:16px}
.as-note{font-size:12px}
.as-panel header b{font-size:17px}
.as-acts{display:flex;align-items:center;gap:12px}
.as-panel #asNew{margin:0;font-size:13px;padding:6px 12px}
.as-panel .x,.rcom-sheet .x{position:static;flex:none}
.as-panel .x{width:36px;height:36px;border-radius:50%;background:#fff;display:grid;place-items:center;line-height:1}
/* ---------- phones: the site looks like the app (owner, 28 Oct 2026) */
.app-head{display:none}
@media (max-width:760px){
  .topbar{display:none}
  .top-inner .burger,.top-inner .brand,.top-inner .actions{display:none}
  .top-inner{padding-top:0}
  header.top{background:var(--bg);box-shadow:0 4px 6px rgba(92,58,35,.06)}
  .app-head{display:flex;align-items:center;gap:8px;padding:calc(8px + env(safe-area-inset-top)) 16px 2px;box-sizing:border-box;min-height:calc(54px + env(safe-area-inset-top))}/* its place kept before the script fills it: the page no longer jumps on a slow line (live check, 8 Nov 2026) */
  .ah-brand{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-decoration:none}
  .ah-brand img{width:42px;height:42px;border-radius:50%;flex:none}
  .ah-brand b{display:block;font-family:"Merriweather Sans",Tajawal,serif;font-size:18px;font-weight:800;color:#5c3a23;white-space:nowrap}
  .ah-brand span{min-width:0;flex:1}/* the slogan wraps inside the brand, never widening the page (English) or cut mid-word (Arabic) */
  .ah-brand small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:10.5px;line-height:1.3;color:var(--green)}
  .ah-btn{width:44px;height:44px;border-radius:50%;background:var(--cream);border:0;display:grid;place-items:center;color:var(--brand);flex:none}
  .ah-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round}
  .ah-chip{display:flex;align-items:center;gap:4px;border:0;border-radius:999px;background:var(--cream);padding:8px 10px;color:#5c3a23;font-weight:800;font-size:13px;flex:none}
  .search input{border-radius:999px}
  .app-home{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;padding-bottom:20px}.app-home>*,.app-sec{min-width:0}
  .app-intl{background:var(--cream2,#f1e4cf);border-radius:14px;padding:12px;text-align:center;margin:0}
  .slider.app-slider{margin:4px 0 0;border-radius:18px}
  .app-slider .slide img{aspect-ratio:2.25;width:100%;object-fit:cover;border-radius:18px}
  .app-cats{display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;padding:0 2px}.app-cats::-webkit-scrollbar{display:none}
  .app-cats a{display:grid;justify-items:center;gap:6px;text-decoration:none;color:var(--ink);font-size:12px;flex:none;width:66px;text-align:center}
  .app-cats span{width:64px;height:64px;border-radius:50%;background:#f1e4cf;display:grid;place-items:center}.app-cats img{width:38px;height:38px;object-fit:contain}
  .app-cats b{font-weight:500}
  .app-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
  .app-title h2{margin:0;font-size:22px;color:#5c3a23;font-weight:800}.app-title a{color:var(--green);font-weight:800;font-size:14px;text-decoration:none}
  .app-rail{display:grid;grid-auto-flow:column;grid-auto-columns:164px;gap:12px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 8px}.app-rail::-webkit-scrollbar{display:none}
  .app-rail .card .add,.app-rail .card .qa,.app-rail .card [data-add],.app-rail .card .stepper{display:none!important}
  .app-offers{grid-auto-columns:284px}.app-courses{grid-auto-columns:300px}
  .app-offer{background:#fff;border-radius:16px;padding:12px;box-shadow:0 6px 12px rgba(143,90,53,.08);display:grid;gap:6px;align-content:start}
  .app-offer img{width:100%;height:120px;object-fit:cover;border-radius:12px}.app-offer b{color:#5c3a23}.app-offer p{margin:0;font-size:12px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .app-code{justify-self:start;border:0;border-radius:999px;background:var(--cream);color:var(--green);font-weight:800;padding:6px 12px;font-size:13px}
  .bottom-nav span:not(.cart-count){position:static;width:auto;height:auto;clip:auto;overflow:visible;display:block;font-size:10.5px;font-weight:600}
  .app-sheet{position:fixed;inset:0;z-index:80;background:rgba(48,48,48,.35);display:flex;align-items:flex-end}
  .app-sheet .as-card{position:relative;width:100%;background:var(--bg);border-radius:20px 20px 0 0;padding:16px 16px calc(20px + env(safe-area-inset-bottom));display:grid;gap:10px}
  .app-sheet h3{margin:4px 0 0;font-size:14px}.app-sheet .as-row{display:flex;flex-wrap:wrap;gap:8px}.app-sheet .chip.on{background:var(--green);color:#fff}
}
@media (max-width:760px){
  .app-card{display:grid;gap:6px;align-content:start;background:#fff;border-radius:16px;padding:8px;box-shadow:0 6px 12px rgba(143,90,53,.08);text-decoration:none;color:var(--ink)}
  .ac-img{position:relative;display:block}.ac-img img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:14px;background:#f1e4cf}
  .ac-tags{position:absolute;top:6px;inset-inline-start:6px;display:flex;gap:4px}.ac-tags i{font-style:normal;font-size:11px;font-weight:800;color:#fff;border-radius:999px;padding:3px 7px}
  .ac-tags .g{background:var(--green)}.ac-tags .w{background:var(--warn)}.ac-tags .m{background:var(--muted)}
  .app-card>b{font-size:14px;font-weight:500;line-height:1.35;height:38px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .ac-rate{height:14px;font-size:11px;color:var(--muted)}.ac-rate .st{color:var(--gold);letter-spacing:-1px}
  .ac-price{display:flex;gap:6px;align-items:baseline;height:22px}.ac-price b{font-size:15px;color:#5c3a23;font-weight:800}.ac-price s{font-size:12px;color:var(--muted)}
}
/* sign-in with Google, Apple or an e-mailed code (owner, 28 Oct) */
.auth .oauth{display:grid;gap:10px;margin:14px 0}
.auth .oauth .btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 16px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none}
.auth .oauth-g{background:#fff;color:var(--ink);border:1px solid #e6d9c6}
.auth .oauth-a{background:#fff;color:var(--ink);border:1px solid #e6d9c6}
.auth .or{display:flex;align-items:center;gap:10px;color:var(--muted,#7a6a5a);font-size:13px;margin:6px 0}
.auth .or::before,.auth .or::after{content:"";flex:1;height:1px;background:#e6d9c6}
.auth .center{text-align:center}
.auth .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.auth select{padding:12px 14px;border:1px solid #e6d9c6;border-radius:12px;font-size:16px;background:#fff;color:var(--ink)}
.prof-nudge{display:block;text-decoration:none;color:var(--brand);font-weight:700}
/* the smart search's corrected word («هل تقصد») */
.did-mean{margin:4px 0 12px;font-size:15px;color:var(--muted)}.did-mean a{color:var(--green);font-weight:800}
#suggest p.did-mean{display:block;margin:8px 12px 4px;font-size:13px}#suggest p.did-mean a{display:inline;padding:0;border:0;background:none;gap:0}
/* «حائط الحب» (owner, 29–30 Oct 2026): one card per person and conversation, the messages as a short chat; the cards in soft tints of the
   brand's colours (cream, green, sand brown, grey, rose brick; store.js keeps neighbours apart), text in the brand's near-black, every text at least 4.5:1
   on its tint (tests/love2.test.mjs measures it); a sprig of olive, bay, mint or sage in a top corner, in its own band above the words */
.love-strip .love-sub{margin:-4px 16px 4px}.love-red{color:#d93a40}.love-desk{max-width:1200px;margin:10px auto}
.love-rail{display:flex;align-items:flex-start;gap:14px;overflow-x:auto;padding:12px 16px 18px;scroll-snap-type:x proximity;scrollbar-width:none}.love-rail::-webkit-scrollbar{display:none}
.love-rail>.lv-card{flex:0 0 252px;scroll-snap-align:start}
.lv-card{--lv-bg:#F8F1E4;--lv-deep:#7A4A2B;--lv-edge:rgba(165,107,67,.22);--lv-leaf:#5E8A6B;--lv-stem:#A56B43;--lv-fruit:#985850;--lv-max:250px;
  position:relative;display:flex;flex-direction:column;gap:8px;min-width:0;padding:12px 12px 10px;border-radius:20px;background:var(--lv-bg);border:1px solid var(--lv-edge);box-shadow:0 1px 2px rgba(42,37,34,.05);overflow:hidden;color:#2A2522}
.lv-t-green{--lv-bg:#DCE4DA;--lv-deep:#3D6650;--lv-edge:rgba(80,130,99,.26);--lv-stem:#7A4A2B;--lv-fruit:#7D4038}
.lv-t-brown{--lv-bg:#E4D1BD;--lv-deep:#7A4A2B;--lv-edge:rgba(165,107,67,.26)}
.lv-t-brick{--lv-bg:#E8D3D0;--lv-deep:#7D4038;--lv-edge:rgba(152,88,80,.26);--lv-stem:#985850;--lv-fruit:#7D4038}
.lv-t-grey{--lv-bg:#E7E6E2;--lv-deep:#4F4F4F;--lv-edge:rgba(123,123,123,.28);--lv-stem:#7B7B7B}
.lv-sprig{display:block;flex:none;width:min(62%,132px);height:auto;margin:-12px auto -4px -12px;color:var(--lv-leaf);stroke:var(--lv-stem);fill:var(--lv-fruit);opacity:.8;pointer-events:none}
.lv-sprig.at-r{margin:-12px -12px -4px auto;transform:scaleX(-1)}
.lv-sprig.lv-olive{--lv-leaf:#6E8B74}.lv-sprig.lv-bay{--lv-leaf:#4F7C60}.lv-sprig.lv-mint{--lv-leaf:#5E9470}.lv-sprig.lv-sage{--lv-leaf:#7D9182}
.lv-t-green .lv-sprig{--lv-leaf:#A56B43}
.lv-sprite{position:absolute;width:0;height:0;overflow:hidden}
.lv-convo{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.lv-b{max-width:100%;padding:7px 11px 8px;border-radius:16px;border-start-start-radius:6px;border-end-start-radius:6px;background:rgba(255,255,255,.72)}
.lv-b:first-child{border-start-start-radius:3px}
.lv-b p{margin:0;font-size:14.5px;line-height:1.7;color:#2A2522;overflow-wrap:anywhere}
.lv-pic{margin:0;width:100%;border-radius:14px;overflow:hidden;background:#fff}
.lv-pic img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.lv-pic figcaption{padding:6px 10px 8px;font-size:14px;line-height:1.6;color:#2A2522}
.lv-trans{align-self:flex-start;margin:2px 0 0;padding:2px 4px;border:0;background:none;font:inherit;font-size:12px;line-height:1.5;color:#6B625C;cursor:pointer}
.lv-trans u{text-underline-offset:2px}
.lv-trans:hover u,.lv-trans:focus-visible u{color:#2A2522}
.lv-clamp .lv-convo{max-height:var(--lv-max);overflow:hidden;-webkit-mask-image:linear-gradient(#000 76%,transparent);mask-image:linear-gradient(#000 76%,transparent)}
.lv-more{align-self:flex-start;border:0;background:none;padding:0;margin-top:-2px;color:var(--lv-deep);font:inherit;font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lv-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
.lv-who{min-width:0;font-size:13px;font-weight:700;line-height:1.35;color:var(--lv-deep);overflow-wrap:anywhere}
.love-heart{flex:none;display:inline-flex;align-items:center;gap:4px;border:0;border-radius:999px;padding:4px 10px;background:rgba(255,255,255,.72);color:#2A2522;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.love-heart span{font-size:15px;color:#7a6a60;transition:transform .22s cubic-bezier(.3,1.6,.5,1)}.love-heart.on span{color:#d93a40}.love-heart.pop span{transform:scale(1.4)}
.love-prods{display:flex;flex-wrap:wrap;gap:6px}.love-prods a{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.85);color:var(--green);font-size:11px;font-weight:700;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.love-prods img{flex:none;width:20px;height:20px;border-radius:50%;object-fit:cover}.love-prods span{min-width:0;overflow:hidden;text-overflow:ellipsis}.love-under{min-width:0;max-width:100%;overflow:hidden}
.love-page{padding:12px 0 50px}
.love-head{max-width:560px;margin:8px auto 26px;text-align:center}.love-head .love-red{font-size:32px}.love-head h1{margin:2px 0 6px}.love-head p{color:var(--ink2);margin:0}
.love-count{display:inline-block;margin-top:10px;padding:5px 12px;border-radius:999px;background:rgba(68,113,90,.10);color:var(--green);font-size:12px;font-weight:700}.love-count:empty{display:none}
.love-wall{max-width:1200px;margin:0 auto;display:flex;align-items:flex-start;gap:12px}
.lv-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:12px}
.love-wall .lv-card{--lv-max:440px}
@media (min-width:760px){.love-wall,.lv-col{gap:18px}}
.love-under .love-rail{padding-inline:2px}.love-under .app-title{padding-inline:0}
@media (prefers-reduced-motion:reduce){.love-heart span{transition:none}}
/* the product page's columns never grow past the screen (a wide row inside made phones scroll sideways) */
.pdp>*{min-width:0}
/* certificates (owner, 29 Oct 2026): their page, the About page section, the strip under a product's price and the footer link */
.certs-page{max-width:1100px;margin:0 auto 30px}.certs-lead{max-width:760px;margin:0 auto 10px;text-align:center;color:var(--ink2)}
.certs-page h2{color:var(--brand);margin:28px 0 12px;font-size:clamp(20px,2.4vw,26px)}
.cert-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:14px}
.cert-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px}
.cert-card>img{width:96px;height:96px;object-fit:contain;background:var(--cream);border-radius:16px;padding:8px}
.cert-card h3{margin:0 0 8px;font-size:17px;line-height:1.35;color:var(--ink)}
.cert-card dl{margin:0 0 12px;display:grid;gap:1px;font-size:13.5px}.cert-card dt{color:var(--brand);font-weight:700;font-size:12.5px;margin-top:6px}.cert-card dt:first-child{margin-top:0}
.cert-card dd{margin:0;color:var(--ink2);overflow-wrap:anywhere}.cert-card .btn{min-height:38px;padding:8px 16px;font-size:14px}
.about-certs{max-width:900px;margin:10px auto 34px;background:var(--cream);border-radius:22px;padding:24px}.about-certs h2{color:var(--brand);margin:0 0 6px}.about-certs h3{margin:18px 0 10px;font-size:16px}
.cert-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.cert-row a{display:grid;justify-items:center;align-content:start;gap:6px;background:#fff;border-radius:16px;padding:12px;text-align:center;text-decoration:none;color:var(--ink);font-size:13px;font-weight:600;line-height:1.35}
.cert-row img{width:72px;height:72px;object-fit:contain}
.cert-strip{display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;margin:4px 0 12px;padding:7px 12px;background:var(--cream);border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--green);font-size:14px}
.cert-badges{display:inline-flex;gap:6px;flex:none}.cert-badges img{width:34px;height:34px;object-fit:contain}.cert-go{font-size:18px;line-height:1;color:var(--brand)}[dir=rtl] .cert-go{transform:scaleX(-1)}
.f-certs{display:inline-flex;align-items:center;gap:10px;margin-top:12px;padding:6px 14px 6px 8px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--green);font-weight:700;font-size:13px;text-decoration:none}
[dir=rtl] .f-certs{padding:6px 8px 6px 14px}.f-certs .cert-badges img{width:28px;height:28px}
a.certs{text-decoration:none;color:inherit}
@media (max-width:600px){.cert-card{grid-template-columns:64px minmax(0,1fr);gap:12px;padding:14px}.cert-card>img{width:64px;height:64px;padding:6px}}
/* every search box and text field starts where its language reads from (owner, 30 Oct 2026: «حافظ على تنسيق تواجد الكلام باختلاف اللغة يمين ويسار»):
   right in Arabic, left in English, Turkish and French, the words and the hint alike, on every page and screen; an e-mail, a code or a number typed
   left to right keeps its own order. The phone box beside its country code reads as one left-to-right number (🇦🇪 +971 | 50 123 4567) */
[dir=rtl] :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=number]),textarea),[dir=rtl] :is(input:not([type=number]),textarea)::placeholder{text-align:right}
[dir=ltr] :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=number]),textarea),[dir=ltr] :is(input:not([type=number]),textarea)::placeholder{text-align:left}
:is([dir=rtl],[dir=ltr]) .tel input,:is([dir=rtl],[dir=ltr]) .tel input::placeholder{text-align:left}
input[type=search]{-webkit-appearance:none;appearance:none}input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
/* the search box's hint changes softly from one product's name to the next */
#q{text-overflow:ellipsis}#q::placeholder{opacity:1;transition:opacity .26s ease}#q.ph-out::placeholder{opacity:0}
@media (prefers-reduced-motion:reduce){#q::placeholder{transition:none}}
bdi[dir=ltr]{white-space:nowrap} /* a number set apart in Arabic stays on one line (a test card, a range, a date) */
/* the reels follow the finger sideways and go back softly when it lets go short of the way */
.reels-modal.snap{transition:transform .2s ease-out}
@media (prefers-reduced-motion:reduce){.reels-modal[data-leave],.reels-modal.snap{transition:none}}
/* the desktop header on two rows (owner, 30 Oct 2026: in English the long menu left the logo and the search box 0 px wide at 1366 and 1600 px):
   the logo, the search box and the icons above, the menu below on its own row, in every language */
@media (min-width:1101px){
  .top-inner{flex-wrap:wrap;row-gap:2px;padding-bottom:4px}
  .top-inner .brand{flex:none;order:1}
  .top-inner .search{order:2;flex:1 1 320px;max-width:560px;min-width:240px;margin-inline:auto}
  .top-inner .actions{order:3;flex:none}
  .mainnav{order:4;flex:1 1 100%;justify-content:center;flex-wrap:wrap;min-width:0;border-top:1px solid var(--line);padding-top:2px}
}
@media (min-width:1101px) and (max-width:1279px){.mainnav>a,.dd-t{font-size:13.5px;padding:10px 7px}} /* the menu stays on one row on a smaller desktop */
/* a link on the page (a page's contents, the reviews, the lab results) brings its part to just under the sticky header */
.page-body :is(h2,h3,h4)[id],.pdp-reviews,.lab{scroll-margin-top:150px}
@media (max-width:760px){.page-body :is(h2,h3,h4)[id],.pdp-reviews,.lab{scroll-margin-top:136px}}
/* «تواصل معنا» to world standards (owner, 30 Oct 2026): the title and how the team answers; the country's ways to reach its team as cards (each
   number in its own order); a form with a label over every field and its check under it, fields and buttons of 48 px and more, 16 px text in the
   fields (no zoom on a phone), borders and focus that can be seen (3:1 and more), the page's own text below */
.cu{max-width:1080px;margin:0 auto}
.cu-hero{background:var(--cream);border:1px solid var(--line);border-radius:24px;padding:22px 20px;margin:8px 0 18px;text-align:center}
.cu-hero h1{margin:0 0 6px;font-size:clamp(26px,5.4vw,34px);line-height:1.25;color:#5c3a23}
.cu-lead{margin:0 auto;max-width:58ch;color:var(--ink2);font-size:15.5px;line-height:1.7;text-wrap:balance}.cu-lead span{display:block}
.cu-grid{display:grid;gap:22px;align-items:start}
@media (min-width:900px){.cu-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px}.cu-ways{position:sticky;top:150px}}
.cu h2{font-size:19px;margin:0 0 12px;color:var(--brand);scroll-margin-top:150px}
@media (max-width:760px){.cu h2{scroll-margin-top:136px}}
.cu-cards{display:grid;gap:10px}
.cu-card{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:18px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:border-color .15s}
.cu-card:hover{border-color:var(--brand)}
.cu-ic{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff}.cu-ic svg{width:24px;height:24px}
.cu-card.wa .cu-ic{background:#25d366}.cu-card.call .cu-ic{background:var(--green)}.cu-card.mail .cu-ic{background:var(--brand)}
.cu-txt{flex:1;min-width:0;display:grid;gap:2px;justify-items:start;line-height:1.4}
.cu-txt b{font-size:15px;color:#5c3a23}.cu-txt small{font-size:12.5px;font-weight:700;color:var(--green)}
.cu-num{font-size:17px;font-weight:800;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;unicode-bidi:isolate}
.cu-mail{max-width:100%;font-size:14.5px;font-weight:700;color:var(--ink);overflow-wrap:anywhere;unicode-bidi:isolate}
.cu-go,.ar-go{flex:none;display:grid;color:var(--brand)}
[dir=rtl] :is(.cu-go,.ar-go) svg,[dir=rtl] svg.flip{transform:scaleX(-1)}
.cu-meta{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px;font-size:14.5px;color:var(--ink2)}
.cu-meta li{display:flex;gap:8px;align-items:flex-start;background:var(--cream);border-radius:12px;padding:10px 12px}
.cu-box{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px 18px 22px;box-shadow:var(--shadow)}
.cu-note{margin:-6px 0 14px;font-size:13px;color:var(--muted)}
.cu-form{display:grid;gap:16px}.cu-f{display:grid;gap:6px}
.cu-f label{font-size:14.5px;font-weight:700;color:var(--ink)}.cu-f .req{color:var(--warn)}.cu-f .opt{font-size:13px;font-weight:400;color:var(--muted)}
.cu-form :is(input,select,textarea){min-height:48px;font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1px solid #a08a6e;border-radius:12px}
.cu-form select{width:100%;padding:12px 14px;padding-inline-end:42px;-webkit-appearance:none;appearance:none;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238f5a35' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px}
[dir=rtl] .cu-form select{background-position:left 14px center}
.cu-form textarea{min-height:132px;resize:vertical;line-height:1.6}
.cu-form .tel{border-color:#a08a6e}.cu-form .tel input{border:0;min-height:46px}.cu-form .tel .cc{font-size:15px}
.cu-form :is(input,select,textarea):focus,.cu-form .tel:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 26%,transparent)}
.cu-form .tel input:focus{box-shadow:none}
.cu-form [aria-invalid=true],.cu-form .tel:has(input[aria-invalid=true]){border-color:var(--warn);box-shadow:0 0 0 3px color-mix(in srgb,var(--warn) 16%,transparent)}
.cu-form .tel [aria-invalid=true]{box-shadow:none}.cu-form [aria-invalid=true]:focus{border-color:var(--warn)}
.cu-err{position:relative;margin:0;padding-inline-start:24px;color:var(--warn);font-size:13.5px;font-weight:700;line-height:1.5}.cu-err:empty{display:none}
.cu-err::before{content:"!";position:absolute;inset-inline-start:0;top:1px;width:18px;height:18px;border-radius:50%;background:var(--warn);color:#fff;font-size:12px;line-height:18px;text-align:center}
.cu-hint{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}.cu-hint.ok{color:var(--green);font-weight:700}.cu-hint a{color:var(--green);font-weight:700}
.cu-privacy{margin:0;display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--cream);font-size:13.5px;color:var(--ink2)}.cu-privacy a{color:var(--green);font-weight:700}
.cu-send{width:100%;min-height:52px;font-size:16.5px;font-weight:800}.cu-send:disabled{cursor:progress;opacity:.92}
.cu-send[aria-busy=true]::before{content:"";width:18px;height:18px;border:2.5px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:cuspin .8s linear infinite}
@keyframes cuspin{to{transform:rotate(360deg)}}
.cu-more{margin-top:30px;padding-top:6px;border-top:1px solid var(--line)}
:is(.cu a,.cu button,.acc-row,.notice .btn):focus-visible{outline:3px solid var(--green);outline-offset:2px}
/* the rows «تتبع طلبي», «تواصل معنا» and «طلبات الجملة» under the sign-in and on the account page: the apps' icons in a soft green circle */
.acc-rows{display:grid;margin:16px 0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.account .acc-rows{max-width:640px}
.acc-row{display:flex;align-items:center;gap:14px;min-height:64px;padding:10px 16px;color:var(--ink);text-decoration:none}
.acc-row+.acc-row{border-top:1px solid var(--line)}.acc-row:hover{background:var(--cream)}
.ar-ic{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--green) 12%,#fff);color:var(--green)}
.ar-t{flex:1;min-width:0;display:grid;gap:1px}.ar-t b{font-size:15px;color:#5c3a23}.ar-t small{font-size:12.5px;line-height:1.45;color:var(--ink2)}
/* the clear message in the middle of the screen: a check mark on green when the message went, a warning on the brand's red-brown when it did not */
.notice{width:min(400px,calc(100vw - 32px));max-width:none;padding:0;border:0;background:transparent;color:var(--ink);overflow:visible}
.notice::backdrop{background:rgba(58,36,20,.55)}
.nt-card{display:grid;gap:10px;justify-items:center;padding:28px 22px 20px;border-radius:24px;background:#fff;text-align:center;box-shadow:0 24px 64px rgba(92,58,35,.28)}
.nt-ic{width:76px;height:76px;margin-bottom:4px;border-radius:50%;display:grid;place-items:center;color:#fff}
.notice.ok .nt-ic{background:var(--green);box-shadow:0 0 0 8px color-mix(in srgb,var(--green) 14%,#fff)}
.notice.err .nt-ic{background:var(--warn);box-shadow:0 0 0 8px color-mix(in srgb,var(--warn) 14%,#fff)}
.nt-card h2{margin:6px 0 0;font-size:21px;line-height:1.35;color:#5c3a23}.nt-card p{margin:0;font-size:15.5px;line-height:1.7;color:var(--ink2);text-wrap:balance}
.nt-num{white-space:nowrap} /* a request's number on one line (HC-C-0012) */
.nt-btns{display:grid;gap:8px;width:100%;margin-top:10px}.nt-btns .btn{width:100%;min-height:50px;font-size:16px}.nt-btns .btn.ghost svg{color:#25d366}
html.nt-open{overflow:hidden}
.notice[open]{animation:ntin .2s ease-out}.notice[open]::backdrop{animation:ntfade .2s ease-out}
.notice.ok[open] .nt-ic path{stroke-dasharray:24;stroke-dashoffset:24;animation:ntdraw .35s .12s ease-out forwards}
@keyframes ntin{from{opacity:0;transform:translateY(10px) scale(.96)}}@keyframes ntfade{from{opacity:0}}@keyframes ntdraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.notice[open],.notice[open]::backdrop,.cu-send[aria-busy=true]::before{animation:none}.notice.ok[open] .nt-ic path{stroke-dasharray:none;stroke-dashoffset:0;animation:none}}
/* ---------- the free health consultation (owner, 30 Oct 2026: «الاستشارة الصحية هي استشارة مجانية يجب ان لا تتعدى الفين حرف…»): the doctor's card with
   «مجانية», how it works in three steps, the question with its counter (red near the end), the ways to be reached, the consent; the customer's requests
   and where they stand, on the page and in «حسابي». The form is the contact page's: a label over every field, 48 px and more, 16 px text */
.cs-wrap{max-width:1080px;margin:0 auto}
.cs-grid{display:grid;gap:18px;align-items:start}
@media (min-width:900px){.cs-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px}.cs-side{position:sticky;top:150px}}
.cs-hero{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:center;background:var(--cream);border:1px solid var(--line);border-radius:24px;padding:18px;margin:8px 0 0}
.cs-photo{width:104px;height:104px;border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 0 0 4px #fff,0 8px 18px rgba(92,58,35,.16)}
.cs-who{min-width:0}
.cs-eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 4px;color:var(--brand);font-weight:800;font-size:13.5px;line-height:1.5}
.cs-free{display:inline-block;background:var(--green);color:#fff;border-radius:999px;padding:2px 12px;font-size:13px;font-weight:800}
.cs-hero h1{margin:0;font-size:clamp(22px,5.6vw,30px);line-height:1.25;color:#5c3a23}
.cs-title{margin:2px 0 0;color:var(--green);font-weight:700;font-size:14.5px}
.cs-bio{grid-column:1/-1;margin:10px 0 0;color:var(--ink2);font-size:15px;line-height:1.75}
.cs-how{margin:18px 0 0}.cs :is(.cs-how,.cs-box,.cs-mine) h2{font-size:19px;margin:0 0 12px;color:var(--brand)}
.cs-steps{list-style:none;margin:0;padding:0}
.cs-steps li{position:relative;display:flex;gap:12px;align-items:flex-start;padding:0 0 16px}
.cs-steps li:not(:last-child)::after{content:"";position:absolute;inset-inline-start:17px;top:40px;bottom:4px;border-inline-start:2px dashed #d6bd9c}
.cs-n{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-weight:800;font-size:16px}
.cs-st{display:grid;gap:2px;padding-top:5px}.cs-st b{font-size:15.5px;color:#5c3a23;line-height:1.45}.cs-st small{font-size:13.5px;line-height:1.6;color:var(--ink2)}
.cs-form fieldset{border:0;margin:0;padding:0;min-width:0}
.cs-form legend{padding:0;margin:0 0 8px;font-size:14.5px;font-weight:700;color:var(--ink)}.cs-form legend .req{color:var(--warn)}
.cs-chips{display:flex;flex-wrap:wrap;gap:8px}
.cs-chip,.cs-way{position:relative}
.cs-form .cs-chip input,.cs-form .cs-way input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;margin:0;pointer-events:none}
.cu-f .cs-chip{font-weight:400}.cs-chip span{display:flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid #a08a6e;border-radius:999px;background:var(--bg);font-size:15px;line-height:1.35;color:var(--ink);cursor:pointer}
.cs-chip input:checked+span{background:var(--green);border-color:var(--green);color:#fff;font-weight:700}
.cs-chip input[aria-invalid=true]+span{border-color:var(--warn)}
.cs-wayrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cs-way{display:grid;justify-items:center;align-content:center;gap:6px;min-height:84px;padding:10px 6px;border:1px solid #a08a6e;border-radius:16px;background:var(--bg);cursor:pointer;text-align:center;font-size:14.5px;font-weight:700;line-height:1.3;color:var(--ink)}
.cs-way:has(input:checked){border-color:var(--green);background:color-mix(in srgb,var(--green) 9%,#fff);box-shadow:inset 0 0 0 2px var(--green)}
.cs-wic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff}.cs-wic svg{width:19px;height:19px}
.cs-way.whatsapp .cs-wic{background:#25d366}.cs-way.call .cs-wic{background:var(--green)}.cs-way.email .cs-wic{background:var(--brand)}
:is(.cs-chip,.cs-way):has(input:focus-visible){outline:3px solid var(--green);outline-offset:2px;border-radius:16px}
.cs-under{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.cs-count{margin:0;flex:none;font-size:13.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;unicode-bidi:isolate}
.cs-count.near{color:#b3261e}.cs-count.full{font-weight:800}
.cs-mailto{margin:0;padding:10px 12px;border-radius:12px;background:var(--cream);font-size:14px;line-height:1.6;color:var(--ink2);overflow-wrap:anywhere}
.cu-f .cs-consent{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:12px;background:var(--cream);font-size:14px;font-weight:400;line-height:1.65;color:var(--ink2);cursor:pointer}
.cs-form .cs-consent input{flex:none;width:22px;height:22px;min-height:0;margin:1px 0 0;border:0;accent-color:var(--green)}
.cs-consent a{color:var(--green);font-weight:700}.cs-consent:has(input[aria-invalid=true]){box-shadow:inset 0 0 0 2px var(--warn)}
.cs-after{margin:-6px 0 0;font-size:13px;line-height:1.6;color:var(--muted);text-align:center}
a.cu-send.cs-login{display:flex;align-items:center;justify-content:center;text-decoration:none;text-align:center}
.cs-staff{margin:0;padding:12px;border-radius:12px;background:var(--cream);font-size:14px;line-height:1.6}.cs-staff a{color:var(--green);font-weight:700}
.cs :is(a,button):focus-visible{outline:3px solid var(--green);outline-offset:2px}
.cs-mine{margin:24px 0 0}
.cs-reqs{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:8px;max-width:640px}
.cs-req{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:14px}
.cs-rn{font-weight:800;color:#5c3a23;font-variant-numeric:tabular-nums;white-space:nowrap;unicode-bidi:isolate}
.cs-rt{font-size:13.5px;line-height:1.5;color:var(--ink2);min-width:0}
.cs-rs{font-size:12.5px;font-weight:800;border-radius:999px;padding:3px 10px;background:var(--cream);color:#5c3a23;white-space:nowrap}
.cs-rs.contacted{background:#e6efe8;color:#2f5b45}.cs-rs.scheduled{background:var(--green);color:#fff}.cs-rs.done{background:#edf1ec;color:#36624c}.cs-rs.cancelled{background:#f6e8e6;color:#87423a}
.cs-rw{grid-column:1/-1;font-size:13px;line-height:1.5;color:var(--green);font-weight:700}
@media (max-width:420px){.cs-hero{padding:16px}.cs-photo{width:88px;height:88px}.cs-way{min-height:80px;font-size:13.5px}}
/* the bell in the site's top bar on every page for a signed-in customer (owner, 30 Oct 2026: «لماذا لا تكون بالصفحة الرئيسية»): beside the search on a
   phone, with the account's icons on a computer; the unread count in red (99+); the panel opens under it */
.bell-btn{position:relative;color:var(--ink)}
.bell-n{position:absolute;top:-3px;inset-inline-end:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#c62828;color:#fff;font-size:11px;font-weight:800;line-height:19px;text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 0 0 2px var(--cream)}
.bell-m{display:none}
@media (max-width:760px){
  .top-inner .bell-m:not([hidden]){display:grid;place-items:center;order:4;flex:none;position:relative;width:46px;height:46px;padding:0;border:0;border-radius:50%;background:var(--cream);color:var(--brand);cursor:pointer}
  .top-inner .bell-m svg{width:22px;height:22px}
  .top-inner:has(.bell-m:not([hidden])) .search{flex:1 1 0;min-width:0}
  .bell-m .bell-n{top:-2px;inset-inline-end:-3px;box-shadow:0 0 0 2px var(--bg)}
}
:is(.bell-btn,.bell-m):focus-visible{outline:3px solid var(--green);outline-offset:2px}
.notes-panel{position:fixed;z-index:70;inset-inline-end:auto}
/* the reels' product cards (owner, 30 Oct 2026: «السلة … يجب ان تكون ثابتة على اليسار مع اختلاف حجم او طول اسم المنتج»): one width for every card (the
   overlay's, clear of the like, comment and share column on the right), the basket pinned at the card's end (the left in Arabic, the right in the other
   languages), a long name on two lines at most, cut before the basket */
.reel-info{padding-right:76px}
.reel-actions{display:grid;gap:8px;max-width:380px}
.reel-actions .rchip{justify-self:start}
.rpill{display:flex;width:100%;max-width:none;min-height:50px;gap:8px}
.rpill a{flex:1;min-width:0}.rpill a>span{flex:1;min-width:0}
.rpill b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;overflow-wrap:anywhere}
.rbasket{margin-inline-start:auto;width:38px;height:38px}
/* a video about the store itself (owner, 30 Oct 2026: «لماذا لا نضيف ايقونة المتجر بدل منتج بعينه في هذه الحالات»): one card of the product cards' width
   and look, the whole card a link to the shop: the round emblem, the store's name and its line, «تسوّق الآن» where the basket stands */
a.rstore{text-decoration:none;color:inherit;cursor:pointer}
.rstore img{border-radius:50%;object-fit:cover;padding:0} /* the emblem fills its circle, no white ring (owner, 2 Nov 2026, as the apps) */
.rstore .rs-txt{flex:1;min-width:0}
.rstore small{font-size:12px;font-weight:600;color:#7a5a43;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rstore .rshop{margin-inline-start:auto;flex:none;display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:999px;background:var(--green);color:#fff;font-size:13px;font-weight:800;white-space:nowrap}
a.rstore:focus-visible{outline:3px solid #fff;outline-offset:2px}
/* its tile on the reels page: the video's own title, as the apps write it, in two lines at most (the words clipped, not the gradient behind them) */
.reel-tile small.rt-title>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;overflow-wrap:anywhere}
/* the five category circles on the home page in the middle of the screen (owner, 30 Oct 2026: «يجب ان تكون منتصف الشاشة الاحظ وجود فرق بسيط من جهة
   اليسار»): each takes an equal share of the row, so both sides keep the same space, at every phone width and in both directions */
@media (max-width:760px){
  .app-cats.fit{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;overflow:visible;padding:0}
  .app-cats.fit a{width:auto;min-width:0;grid-template-columns:minmax(0,1fr)} /* its one track is the column itself: the circle sits in its middle */
  .app-cats.fit b{max-width:100%;overflow-wrap:anywhere}
  .app-cats.fit span{width:min(64px,100%);height:auto;aspect-ratio:1}
}
/* «حسابي», «ملفي» and «الإعدادات» (owner, 31 Oct 2026): one column as in the apps; the person's round icon beside the greeting, rows of 64 px, fields of 48 px */
.acc2{max-width:720px;margin:0 auto}.acc2 .acc-rows{max-width:none}
.acc-hero{display:flex;align-items:center;gap:14px;min-height:84px;margin:10px 0 14px;padding:14px 18px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);color:var(--ink);text-decoration:none}
.acc-hero:hover{background:var(--cream)}.acc-hero:focus-visible,.acc-out:focus-visible,.back-link:focus-visible,.set-opt:focus-visible,.set-country:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.ah-av{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--cream);color:var(--brand);border:2px solid #e3cdb8}.ah-av svg{width:32px;height:32px}
.ah-t{flex:1;min-width:0;display:grid;gap:2px}.ah-t b{font-size:20px;line-height:1.3;font-weight:800;color:#5c3a23;overflow-wrap:anywhere}.ah-t small{font-size:13.5px;line-height:1.45;color:var(--ink2);overflow-wrap:anywhere}
[dir=rtl] .ah-t small[dir=ltr],[dir=rtl] .sec-v[dir=ltr],[dir=rtl] .sec-note[dir=ltr]{text-align:right}
.acc2 h2{font-size:17px;margin:22px 0 8px;color:#5c3a23}
.acc2 .points-card{display:grid;grid-template-columns:auto 1fr;width:100%;min-width:0;margin:0 0 12px}
.acc-rows.nudge .acc-row{background:#fdf3dc}.acc-rows.nudge .ar-ic{background:#fff;color:var(--brand)}
.acc-out{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;margin:14px 0 6px;background:#fff;border:1px solid var(--line);border-radius:18px;color:var(--warn);font:inherit;font-weight:800;font-size:15px}
.acc-out:hover{background:#f8e6e4}
.back-link{display:inline-flex;align-items:center;gap:4px;min-height:44px;color:var(--brand);font-weight:800;text-decoration:none}
.back-link svg{transform:scaleX(-1)}[dir=rtl] .back-link svg{transform:none}
.acc-sub .page-title{margin-top:0}
.prof-sec{margin:18px 0}.acc2 .prof-sec>h2{font-size:15px;color:var(--brand);margin:0 0 8px}
.prof-need{display:block;margin:4px 0 10px}
.prof-form label,.sec-form label{display:grid;gap:6px;font-size:14px;font-weight:700;color:var(--ink2)}
.prof-form :is(input,select),.sec-form input{min-height:48px;font:inherit;font-size:16px;font-weight:400;border:1px solid #c9b59b;background:#fff;border-radius:12px;padding:10px 12px;color:var(--ink);width:100%}
.prof-form :is(input,select):focus,.sec-form input:focus{border-color:var(--brand);outline:2px solid #e8d5c2;outline-offset:0}
.prof-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.prof-form>.btn{justify-self:start;min-width:160px}
.sec-list{gap:0;padding:4px 18px}
.sec-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;padding:14px 0}.sec-row+.sec-row{border-top:1px solid var(--line)}
.sec-kv{display:grid;gap:2px;min-width:0}.sec-k{font-size:13px;font-weight:700;color:var(--ink2)}.sec-v{font-size:15.5px;font-weight:700;color:var(--ink);overflow-wrap:anywhere}
.sec-note{font-size:12.5px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.sec-row .btn.sm{min-height:44px;padding:8px 16px;font-size:14px;white-space:nowrap}
.sec-form{grid-column:1/-1;display:grid;gap:10px;margin-top:4px;padding:14px;background:var(--cream);border-radius:14px}.sec-form p{margin:0}
.sec-btns{display:flex;flex-wrap:wrap;gap:8px}.sec-btns .btn{min-height:46px}
.sec-msg{grid-column:1/-1}.sec-msg:empty{display:none}.sec-msg bdi{font-weight:700}
.sec-linked .sec-kv{gap:6px}.sec-staff{margin:12px 0}
.linked{list-style:none;margin:2px 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.linked li{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:14px;color:var(--ink)}
.linked li span{color:var(--muted);font-size:13px}.linked li.on{border-color:#b7cfbf;background:#f2f7f3}.linked li.on span{color:var(--green);font-weight:800}
.sw-row{display:flex;align-items:center;gap:14px;min-height:72px;cursor:pointer;position:relative}
.sw-t{flex:1;min-width:0;display:grid;gap:2px}.sw-t b{font-size:15px;color:var(--ink)}.sw-t small{font-size:13px;line-height:1.5;color:var(--ink2)}
.sw-in{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.sw{flex:none;position:relative;width:52px;height:32px;border-radius:999px;background:#cbb79d;transition:background .2s}
.sw::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(92,58,35,.35);transition:transform .2s}
.sw-in:checked+.sw{background:var(--green)}.sw-in:checked+.sw::after{transform:translateX(20px)}[dir=rtl] .sw-in:checked+.sw::after{transform:translateX(-20px)}
.sw-in:focus-visible+.sw{outline:3px solid var(--green);outline-offset:2px}
.data-box{justify-items:start}.del-box{width:100%}
.del-box summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--warn);font-weight:700}
.del-box form{display:grid;gap:10px;margin-top:6px}.del-box form .btn{justify-self:start}
.set-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.set-opt{min-height:48px;padding:8px 12px;border:1px solid var(--line);border-radius:14px;background:#fff;font:inherit;font-weight:700;color:var(--ink);text-align:center}
.set-opt small{font-weight:400;color:var(--ink2)}.set-opt.on{border-color:var(--green);background:#eef5f0;color:#2f5240;box-shadow:inset 0 0 0 1px var(--green)}
.set-country{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;font:inherit;font-weight:700;font-size:15px;color:var(--ink)}
.set-country b{flex:1;text-align:start}.set-country .ar-go{color:var(--brand)}
.set-fixed{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0;padding:12px 16px;background:#fff;border:1px solid var(--line);border-radius:16px}.set-fixed small{flex-basis:100%;color:var(--muted)}
@media (max-width:520px){.sec-row{grid-template-columns:1fr}.sec-row>.btn.sm{justify-self:start}.prof-form>.btn{justify-self:stretch}.ah-t b{font-size:18px}}
@media (prefers-reduced-motion:reduce){.sw,.sw::after{transition:none}}
/* pack chips, batch 1 (owner, 1 Nov 2026): on the cards and the product page every chip of a product is one width and one height, its price, and the
   real saving under the 3- and 6-pack («وفّر 6%»); the single pack keeps an empty line; a chip sets the product's quantity in the cart */
.pack-chips.pk-2,.pack-chips.pk-3,.pack-chips.pk-4{display:grid;gap:6px;align-items:stretch}
.pack-chips.pk-2{grid-template-columns:repeat(2,minmax(0,1fr))}.pack-chips.pk-3{grid-template-columns:repeat(3,minmax(0,1fr))}.pack-chips.pk-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card-body .pack-chips.pk-2,.card-body .pack-chips.pk-3,.card-body .pack-chips.pk-4{display:grid;align-items:stretch}
.pack-chips .pk{display:grid;grid-template-rows:auto 1fr auto;justify-items:center;align-items:center;gap:2px;margin:0;padding:6px 3px;min-width:0;min-height:62px;
  border:1.5px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink2);font:inherit;font-size:11px;line-height:1.25;text-align:center;white-space:normal}
.pack-chips button.pk{cursor:pointer;transition:border-color .15s,background .15s}
.pack-chips button.pk:hover{border-color:var(--brand)}
.pack-chips .pk.on{border-color:var(--brand);background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand);color:var(--ink)}
.pack-chips .pk:disabled{opacity:.45;cursor:not-allowed}
.pack-chips .pk-n{font-weight:700;white-space:nowrap}
.pack-chips .pk-p{font-size:11.5px;color:var(--ink);font-weight:800;overflow-wrap:anywhere}
.pack-chips .pk-s{min-height:1.25em;font-size:10.5px;font-weight:800;color:var(--green)}
.pack-chips span.pk{background:var(--cream);border-color:transparent}
.pd-info .pack-chips{gap:10px;margin:6px 0 12px;max-width:460px}
.pd-info .pack-chips .pk{min-height:84px;padding:10px 6px;border-radius:14px;font-size:14px}
.pd-info .pack-chips .pk-p{font-size:15px}.pd-info .pack-chips .pk-s{font-size:12.5px}
.pd-incart{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px}.pd-incart[hidden]{display:none}
.pd-incart .cm-cart{position:static}.pd-incart .incart-note{margin:0}
/* checkout, batch 1 (owner, 1 Nov 2026): every field a real box like the contact page's, «المدينة / المنطقة» too (its chevron, «اختر المدينة / المنطقة»
   inside); a short label on one line over its box, the rest as the box's hint; a wrong field red with its reason under it; no silent buttons */
.co-form{gap:14px}
.co-form div.cu-f>label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.co-form :is(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%;padding:12px 14px}
.co-form textarea{min-height:76px}
.co-form .tel input{padding:12px 14px;min-height:46px}
.co-form select:invalid,.co-form select:has(option[value=""]:checked){color:var(--muted)}
.co-form select option{color:var(--ink)}
.co-form .cu-hint{margin:0;font-size:12.5px;color:var(--muted)}
.co-form .tel-msg:empty{display:none}
.co-form fieldset.cu-f{margin:0}
.co-form fieldset.cu-f[aria-invalid=true] .pay.opt{border-color:var(--warn)}
.co-flash{animation:coflash .9s ease}@keyframes coflash{0%,100%{background:transparent}30%{background:color-mix(in srgb,var(--warn) 12%,transparent)}}
.co-flash{border-radius:12px}
.co-alert{margin:0;background:#f8ece9;border:1px solid var(--warn);color:var(--warn);border-radius:12px;padding:10px 12px;font-size:14px;font-weight:700;line-height:1.55}
.co-alert[hidden]{display:none}
.ws-big{display:grid;gap:10px;background:var(--cream);border-color:var(--brand);color:var(--ink);font-weight:600}.ws-big p{margin:0}
.co-note{margin:6px 0 0;background:var(--cream);border-radius:12px;padding:9px 12px;font-size:13.5px;color:var(--ink);line-height:1.55}
.co-code{display:grid;gap:10px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}
.co-code h3{margin:0;font-size:16px;color:var(--ink)}.co-code p{margin:0}
.co-code .code-in{font-size:22px;letter-spacing:.35em;text-align:center;font-variant-numeric:tabular-nums;max-width:220px;justify-self:center}
.co-code .cu-f{justify-items:stretch}
.co-code-acts{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.co-terms a{color:var(--brand)}
.stepper button.at-max{opacity:.4}
/* a narrow card (a phone's two columns): the chips one under the other, each of one width and one height, the pack, its price, its saving on one line */
.card-body{container-type:inline-size}
@container (max-width:240px){
  .card-body .pack-chips.pk-2,.card-body .pack-chips.pk-3,.card-body .pack-chips.pk-4{grid-template-columns:1fr;gap:4px}
  .card-body .pack-chips .pk{grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n p" "s p";justify-items:start;min-height:38px;padding:4px 8px;column-gap:6px;row-gap:0;text-align:start}
  .card-body .pack-chips .pk-n{grid-area:n}.card-body .pack-chips .pk-s{grid-area:s;min-height:1.2em;white-space:nowrap}
  .card-body .pack-chips .pk-p{grid-area:p;align-self:center;white-space:nowrap}
}
.pack-chips .pk span{background:none;padding:0;border-radius:0;font-size:inherit;color:inherit}
.co-mail{unicode-bidi:isolate;overflow-wrap:anywhere;font-weight:700}
.co-form input:is([type=checkbox],[type=radio]){min-height:0;width:20px;height:20px;padding:0;margin:0;flex:none;accent-color:var(--green)}
/* batch 2 (owner, 1 Nov 2026): shipping abroad, gifts, the map pin, the saved addresses */
.b2-abroad{border-color:var(--brown,#a56b43);background:#fbf3ea;font-weight:700}
.b2-prices{border:1px solid var(--line)}.b2-prices ul{margin:6px 0 0;padding-inline-start:18px}.b2-prices li{margin:2px 0}
.b2-addr-list{display:grid;gap:8px;width:100%}
.addr-card{display:flex;gap:10px;align-items:flex-start;text-align:start;width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);cursor:pointer;min-height:44px}
.addr-card:hover,.addr-card:focus-visible{border-color:var(--green)}
.addr-card.other{border-style:dashed}.addr-card .ac-flag{font-size:22px;line-height:1.2}
.addr-card .ac-body{display:flex;flex-direction:column;gap:2px;min-width:0}.addr-card .ac-line{color:var(--muted,#6b625a);font-size:13px;overflow-wrap:anywhere}
.ac-label{display:inline-block;background:#eef5f0;color:#2f5b45;border-radius:999px;padding:0 8px;font-size:12px;font-weight:700}
.b2-gift-tg{display:flex;align-items:center;gap:10px;border:1px solid #c8963e;background:#fbf6ea;border-radius:14px;padding:12px;cursor:pointer;min-height:44px}
.b2-who{border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin:0;display:grid;gap:10px}.b2-who legend{font-weight:800;padding:0 6px}
.b2-sub{margin:4px 0 0;font-size:15px}.b2-giftto{color:#7a4b12;font-weight:800}
.b2-pin{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px}.b2-pin .pin-on{color:#2f5b45;font-weight:700}.b2-pin-btn{width:100%}
.pinmap{position:fixed;inset:0;z-index:1000;background:rgba(20,14,8,.55);display:grid;place-items:center;padding:16px}
.pinmap-box{background:#fff;border-radius:18px;width:min(640px,100%);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;gap:8px;padding:14px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.pinmap-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.pinmap-head h2{margin:0;font-size:18px}.pinmap-head .x{width:44px;height:44px;font-size:24px;border-radius:50%;border:0;background:var(--cream,#f9f2e5);cursor:pointer}
.pinmap-box p{margin:0}.pinmap-map{height:min(60dvh,440px);min-height:260px;border-radius:12px;overflow:hidden;background:#e8e2d6}
.pinmap-acts{display:flex;gap:8px;justify-content:space-between;flex-wrap:wrap}.pinmap-acts .btn{min-height:44px;flex:1}
.pin-ico span{display:block;font-size:34px;line-height:40px;text-align:center;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
.addr-card .ac-head{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
/* the UAE dirham's and the Saudi riyal's official signs (public/money.js, owner 1 Nov 2026): the digits' height on their baseline, the price's colour;
   in a bold price the sign is drawn as heavy as its digits (a stroke in its own grid's units) */
.money{white-space:nowrap;unicode-bidi:isolate}
.cur-sign{display:inline-block;vertical-align:baseline;overflow:visible;stroke:currentColor;stroke-width:0;stroke-linejoin:round}
:is(b,strong,h1,h2,h3,th,.tot,.now,.pk-p,.line-tot,.order-no) .cur-sign[data-c=AED]{stroke-width:5}
:is(b,strong,h1,h2,h3,th,.tot,.now,.pk-p,.line-tot,.order-no) .cur-sign[data-c=SAR]{stroke-width:22}
/* batch 3 (owner, 1 Nov 2026): «القسائم», the conditional offers, the points lines; the floating cart never over the page */
.vouch{margin:14px 0 8px;padding:12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.vouch h3{margin:0 0 8px;font-size:15px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}.vouch h3 small{font-weight:400;color:var(--muted);font-size:12.5px}
.vouch-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.vc{display:grid;grid-template-columns:86px 1fr auto;gap:10px;align-items:center;padding:8px;border:1px dashed #d9c3a4;border-radius:12px;background:var(--cream)}
.vc.on{border-style:solid;border-color:var(--green);background:#eef5f0}.vc.off{opacity:.62}
.vc-v{display:grid;gap:4px;justify-items:center;text-align:center;color:var(--brand);font-size:15px;line-height:1.25}.vc-tag{font-size:11px;background:var(--brand);color:#fff;border-radius:999px;padding:1px 8px}
.vc-b{display:grid;gap:2px;min-width:0}.vc-t{font-size:14px}.vc-code{font-weight:800;letter-spacing:.5px;font-size:13px;color:var(--ink)}.vc-b small{color:var(--ink2);font-size:12px}
.vc-why{color:var(--warn)!important;font-weight:700}.vc-act{white-space:nowrap}.vc-ok{color:var(--green);font-weight:700;font-size:13px;display:block}
.btn.sm{padding:7px 14px;font-size:13px}.btn[disabled]{cursor:not-allowed}
.gift-lines li{background:#f3f8f4;border-radius:12px}.gift-ic{width:64px;height:64px;display:grid;place-items:center;font-size:30px}
.ao-cart{list-style:none;margin:10px 0;padding:0;display:grid;gap:8px}.ao-cart li{display:grid;gap:4px;padding:8px 10px;border-radius:12px;background:var(--cream);font-size:13px}
.ao-cart li.done{background:#eef5f0;color:var(--green)}.ao-msg{font-weight:700;color:var(--green)}
.earn-line,.exp-line{font-size:13px;margin:8px 0;color:var(--ink2)}.exp-line{color:var(--warn);font-weight:700}.points-card .exp-line{grid-column:1/-1;color:#fff;font-weight:600}
.ao-sec{margin:22px 0}.ao-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.ao-card{display:grid;grid-template-columns:84px 1fr;gap:14px;padding:14px;border-radius:var(--radius);background:linear-gradient(135deg,var(--cream),#fff);border:1px solid var(--line);box-shadow:var(--shadow)}
.ao-card.met{border-color:var(--green)}.ao-img img{width:84px;height:84px;object-fit:cover;border-radius:12px;display:block}.ao-ic{width:84px;height:84px;border-radius:12px;background:var(--card);display:grid;place-items:center;font-size:36px}
.ao-body{display:grid;gap:6px;min-width:0}.ao-body h3{margin:0;font-size:16px;color:var(--brand)}.ao-d,.ao-cond,.ao-when{margin:0;font-size:13px;color:var(--ink2)}.ao-cond{font-weight:700;color:var(--ink)}
.ao-rw{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.ao-rw li{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:12.5px}
.ao-prog{display:grid;gap:4px;margin:2px 0 0;font-size:12.5px}.ao-prog.done .ao-msg{color:var(--green)}.ao-start{color:var(--brand);font-weight:700}
.rw-sec{margin:18px 0}.rw-sec h2{font-size:18px;color:var(--brand)}.rw-faq details{border-bottom:1px solid var(--line);padding:10px 0}.rw-faq summary{font-weight:700;cursor:pointer}.rw-me{display:inline-grid}
.f-loyal{margin:0 0 10px}.sec-h{margin-top:26px}
body.fab-on{padding-bottom:96px}
@media (max-width:760px){.cart-fab{display:none!important}body.fab-on{padding-bottom:0}.vc{grid-template-columns:70px 1fr;}.vc-act{grid-column:1/-1;justify-self:end}.ao-list{grid-template-columns:1fr}.ao-card{grid-template-columns:64px 1fr}.ao-img img,.ao-ic{width:64px;height:64px}
  .bottom-nav .cart-count.bump{animation:cfpop .5s}}
/* batch 8 (owner, 1 Nov 2026): photos beside people's words, the account's photo, the crop circle, the big heart of a double tap, the new-video button */
.av.has{background:none;overflow:hidden}.av.has img{width:100%;height:100%;object-fit:cover;border-radius:50%}.av.sm{width:24px;height:24px;font-size:.75rem;display:inline-grid;vertical-align:middle;margin-inline-end:6px}
.rc .av,.wreply .av{display:inline-grid}
.ah-av.has{overflow:hidden;border-color:var(--brand)}.ah-av.has img{width:100%;height:100%;object-fit:cover}
.photo-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.ph-big{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:2rem;font-weight:800;overflow:hidden;flex:none}
.ph-big img{width:100%;height:100%;object-fit:cover}.ph-btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.photo-row .muted{flex-basis:100%;margin:0}
.crop-dlg{position:fixed;inset:auto 0 0 0;z-index:90;background:var(--paper,#fffdf9);padding:16px;border-radius:18px 18px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.2);display:grid;gap:10px;justify-items:center;max-width:420px;margin:0 auto}
.crop-box{position:relative;width:280px;height:280px;touch-action:none}.crop-box canvas{width:280px;height:280px;border-radius:12px;cursor:grab;background:#eee}
.crop-ring{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 999px rgba(0,0,0,.45);pointer-events:none;outline:2px solid #fff}.crop-box{overflow:hidden;border-radius:12px}.crop-dlg input[type=range]{width:220px}
.reel video{touch-action:manipulation}.big-heart{position:absolute;width:110px;height:110px;margin:-55px 0 0 -55px;color:#ff3b5c;pointer-events:none;z-index:5;animation:bigHeart .9s ease-out forwards}
.big-heart svg{width:100%;height:100%;fill:currentColor;filter:drop-shadow(0 4px 14px rgba(0,0,0,.35))}
@keyframes bigHeart{0%{transform:scale(.3);opacity:0}15%{transform:scale(1.15);opacity:1}30%{transform:scale(.95)}70%{transform:scale(1);opacity:1}100%{transform:scale(1.3) translateY(-30px);opacity:0}}
.b8-sub{margin-top:8px}.b8-sub.on{background:var(--green);color:#fff;border-color:var(--green)}
/* batch 10: the team's badge (the brand's emblem with a check, the writer's role), the team's reply under a review, «فريقنا» */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hc-team{display:inline-flex;align-items:center;gap:5px;margin-inline-start:6px;padding:2px 8px 2px 3px;border-radius:999px;background:var(--cream);border:1px solid var(--line);color:var(--brand);font-size:12px;font-weight:700;line-height:1.3;vertical-align:middle;max-width:100%}
.hc-mark{position:relative;flex:none;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line)}.hc-mark img{width:18px;height:18px;border-radius:50%;display:block}
.hc-mark i{position:absolute;inset-inline-end:-4px;bottom:-3px;width:11px;height:11px;border-radius:50%;background:var(--green);color:#fff;font-size:8px;font-style:normal;display:grid;place-items:center;box-shadow:0 0 0 1.5px #fff}
.hc-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-reply{margin:10px 0 0;padding:10px 12px;border-inline-start:3px solid var(--green);background:var(--cream);border-radius:10px}.rv-reply header{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.rv-reply p{margin:6px 0 0}
.team-page{max-width:1100px;margin:0 auto;padding:0 16px 40px}.tm-head{text-align:center;margin:8px auto 20px;max-width:640px}
.tm-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.tm-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 16px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.tm-card h2{margin:4px 0 0;font-size:19px}.tm-card p{margin:0;color:var(--ink2);font-size:14.5px;line-height:1.7}.tm-card .hc-team{margin:0}
.tm-photo img,.tm-photo .av{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--cream)}.tm-photo .av{font-size:44px;display:grid;place-items:center;color:#fff}
.tm-card h2 a{color:inherit;text-decoration:none}
.tm-profile{padding-bottom:40px}.tmp-head{text-align:center;margin:8px 0 18px}.tmp-head h1{margin:10px 0 4px;font-size:24px}.tmp-head .hc-team{justify-content:center}
.tmp-photo{border:0;padding:0;background:none;cursor:zoom-in;border-radius:50%}.tmp-photo img{width:180px;height:180px;border-radius:50%;object-fit:cover;border:4px solid var(--cream);box-shadow:0 4px 18px rgba(0,0,0,.12)}.tmp-photo.logo img{object-fit:contain;background:#fff}
.tmp-acts{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:12px}
.tmp-like{border:1px solid var(--line,#ddd);background:#fff;border-radius:999px;padding:6px 14px;font-size:16px;cursor:pointer;color:var(--ink2)}.tmp-like span{color:#d93a40;font-size:18px}.tmp-like.on{border-color:#d93a40}
.tmp-bio{text-align:center;line-height:1.8;color:var(--ink2);white-space:pre-line}.tm-profile h2{font-size:18px;margin:22px 0 10px}
.tmp-items{list-style:none;margin:0;padding:0;display:grid;gap:10px}.tmp-items a{display:flex;gap:12px;align-items:flex-start;padding:10px;border-radius:12px;background:#fff;border:1px solid var(--line,#eee);color:inherit;text-decoration:none}
.tmp-items img{width:64px;height:64px;border-radius:10px;object-fit:cover;flex:none}.tmp-items a>span{display:flex;flex-direction:column;gap:4px;min-width:0}.tmp-items a>span>span{overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tmp-zoom{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.88);display:grid;place-items:center;padding:16px;cursor:zoom-out}.tmp-zoom img{max-width:100%;max-height:90vh;border-radius:12px}.tmp-zoom .x{position:absolute;top:14px;inset-inline-end:14px;background:none;border:0;color:#fff;font-size:34px;cursor:pointer}
.team-link{text-align:center;margin:20px 0}.cu-to{margin:0 0 8px;padding:8px 12px;border-radius:10px;background:var(--cream);color:var(--brand);font-weight:700}

/* a recorded course's lessons and player (1 Nov 2026) */
.c-lessons { padding-inline-start: 1.2em; }
.c-lessons li { margin: 6px 0; }
.c-lessons button[disabled] { opacity: .6; cursor: default; }
.c-video { width: 100%; border-radius: 14px; background: var(--ink); margin-top: 10px; }

/* the phone's home page as the app's (owner, 1 Nov 2026): the newest videos, what people say, the consultation and traders' tiles, the blog, the store's pages */
.app-reels{grid-auto-columns:104px}
.app-reel{position:relative;width:104px;height:168px;border:0;padding:0;border-radius:14px;overflow:hidden;background:var(--cream2);cursor:pointer}
.app-reel img{width:100%;height:100%;object-fit:cover}
.app-reel span{position:absolute;inset-block-start:8px;inset-inline-start:8px;color:#fff;font-size:13px;text-shadow:0 1px 3px rgba(60,40,20,.6)}
.app-reel small{position:absolute;inset-inline:0;bottom:0;padding:18px 6px 6px;font-size:11px;font-weight:700;color:#fff;background:linear-gradient(transparent,rgba(74,46,26,.8));line-height:1.3;max-height:3.9em;overflow:hidden}
.app-tile{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 14px;margin:0 16px;background:#fff;border:1px solid var(--line);border-radius:18px;color:var(--ink);text-decoration:none}
.app-sec .app-tile{margin:0}
.app-tile .at-ic{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--cream);font-size:22px;flex:none}
.app-tile b{display:block;color:var(--brand-deep,var(--ink));font-size:15px}.app-tile small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}
.app-tile .at-go{margin-inline-start:auto;color:var(--muted);font-size:22px}
.app-posts{grid-auto-columns:220px}
.app-post{display:block;color:var(--ink);text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.app-post img{width:100%;height:130px;object-fit:cover}.app-post b{display:block;padding:8px 10px 10px;font-size:13.5px;line-height:1.4}
.app-wall{grid-auto-columns:240px}
.app-wallcard{display:block;min-height:110px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:16px;color:var(--ink);text-decoration:none}
.app-wallcard b{color:var(--brand-deep,var(--ink));font-size:14px}.app-wallcard p{margin:6px 0 0;font-size:13px;line-height:1.5;color:var(--ink2,var(--ink))}
.app-links{display:flex;gap:10px;margin:18px 16px 6px}.app-links a{flex:1;display:grid;place-items:center;min-height:48px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--brand);font-weight:700;text-decoration:none}

/* the videos page (owner, 1 Nov 2026): a frame on the bell's card over the white page, the circles pictured by their first video */
.reels-hero{border:2px solid var(--brand);border-radius:22px}
.stories.hl .ring img.hl-img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:50%;padding:0}
/* a story's picture is always a circle the size of its ring (owner, 5 Nov 2026: a 9:16 video cover grew taller than the ring — an oval over a half ring, its name on top of it) */
.story .ring{overflow:hidden}.story .ring img{aspect-ratio:1/1;height:auto;min-height:0}

/* a cart line swiped toward its end shows «حذف» (1 Nov 2026) */
.lines > li{position:relative;overflow:hidden;transition:transform .2s}
.lines > li .swipe-rm{position:absolute;inset-block:0;inset-inline-end:0;width:88px;border:0;background:var(--warn,#B3261E);color:#fff;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transform:translateX(100%);transition:transform .2s;border-radius:0 14px 14px 0}
[dir=rtl] .lines > li .swipe-rm{transform:translateX(-100%);border-radius:14px 0 0 14px}
.lines > li.swiped .swipe-rm{transform:none}
.lines > li .swipe-rm svg{width:20px;height:20px}
.lines > li.hint .swipe-rm{animation:swipeHint 1.2s ease-in-out}
@keyframes swipeHint{0%,100%{transform:translateX(100%)}35%,60%{transform:translateX(30%)}}
[dir=rtl] .lines > li.hint .swipe-rm{animation-name:swipeHintRtl}
@keyframes swipeHintRtl{0%,100%{transform:translateX(-100%)}35%,60%{transform:translateX(-30%)}}
/* a slim videos card (owner, 1 Nov 2026: «البطاقة اخذت مكان كبير من الشاشة»): the title and its line beside a small bell */
.reels-hero{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;padding:10px 14px!important;margin-block:8px!important;text-align:start;border-width:1.5px;border-radius:18px}
.reels-hero h1{font-size:20px;margin:0;grid-column:1}
.reels-hero p{font-size:12.5px;margin:0;grid-column:1}
.reels-hero .b8-sub{grid-column:2;grid-row:1/span 2;font-size:12px;padding:6px 12px;min-height:36px}
/* batch 14 (owner, 2 Nov 2026): the consultation's nutritionist, the private thread of «استشاراتي», the nutritionists, «عن هولستك كورنر», the address and mobile at checkout */
.cs-nutri .cu-hint{margin:0 0 8px}
.cs-nlist{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.cs-ncard{position:relative;display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #a08a6e;border-radius:16px;background:var(--bg);cursor:pointer;min-width:0}
.cs-ncard.flat{border-color:var(--line);cursor:default;margin:8px 0 0}
.cs-ncard input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;margin:0;pointer-events:none}
.cs-ncard:has(input:checked){border-color:var(--green);background:color-mix(in srgb,var(--green) 9%,#fff);box-shadow:inset 0 0 0 2px var(--green)}
.cs-ncard:has(input:focus-visible){outline:3px solid var(--green);outline-offset:2px}
.cs-nav{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:var(--cream);color:var(--green);font-size:20px}
.cs-nt{display:grid;gap:2px;min-width:0}.cs-nt b{font-size:15px;color:var(--ink)}.cs-nt small{font-size:12.5px;line-height:1.45;color:var(--ink2)}.cs-nt .cs-nsp{color:var(--muted)}
.cqt-re .cs-ncard{cursor:default;flex-wrap:wrap}.cqt-re .cs-ncard .btn{margin-inline-start:auto}
.cs-req:has(>.cs-ra){display:block;padding:0}
.cs-ra{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:12px 14px;color:inherit;text-decoration:none;border-radius:14px}
.cs-ra:hover{background:var(--cream)}.cs-ra:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.cs-new{grid-column:1/-1;justify-self:start;font-size:12px;font-weight:800;border-radius:999px;padding:2px 10px;background:var(--green);color:#fff}
.cq-count{position:absolute;top:0;inset-inline-start:58%;min-width:18px;height:18px;line-height:18px;padding:0 5px;border-radius:999px;background:var(--green);color:#fff;font-size:10.5px;font-weight:800;text-align:center}
#accBtn,[data-nav="account"]{position:relative}
.cqt{display:grid;gap:14px}.cqt-head h1{margin:6px 0 4px;font-size:22px}.cqt-meta{margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--ink2);font-size:14px}
.cqt-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cqt-m{max-width:min(560px,92%);padding:10px 14px;border-radius:16px;border:1px solid var(--line);background:var(--card)}
.cqt-m.me{justify-self:end;background:color-mix(in srgb,var(--green) 8%,#fff);border-color:color-mix(in srgb,var(--green) 30%,#fff)}
.cqt-m.team{justify-self:start}
.cqt-who{margin:0 0 4px;font-size:12.5px;color:var(--muted)}.cqt-who b{color:var(--ink)}
.cqt-t{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;color:var(--ink)}
.cqt-files{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.cqt-files img{width:96px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--line);display:block}
.cqt-pdf{display:inline-flex;gap:6px;align-items:center;padding:8px 12px;border-radius:10px;background:var(--cream);color:var(--ink);text-decoration:none;font-size:13.5px;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cqt-wait{margin:0;padding:10px 12px;border-radius:12px;background:var(--cream);font-size:14px;color:var(--ink2)}
.cqt-form{display:grid;gap:8px}.cqt-form textarea{width:100%;min-height:96px}
.cqt-attach{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cqt-pending{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.cqt-pending li{display:inline-flex;gap:6px;align-items:center;padding:4px 10px;border-radius:999px;background:var(--cream);font-size:13px;max-width:100%}
.cqt-re h2{font-size:16px;margin:0 0 8px}.cqt-closed{margin:0}
.nu-filter{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}.nu-filter .chip.on{background:var(--green);border-color:var(--green);color:#fff}
.nu-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.nu-card .nu-title{margin:0;color:var(--ink2);font-size:14px}.nu-specs{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin:6px 0}.nu-specs .chip{font-size:12px;padding:3px 9px}
.nu-refund{text-align:start;font-size:13.5px;color:var(--ink2);width:100%}.nu-join-link{margin:20px 0 0}
.nu-form{display:grid;gap:10px}.nu-form h2{font-size:17px;margin:14px 0 0}.nu-form .row2{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.nu-terms{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card)}.nu-terms summary{cursor:pointer;font-weight:700}
.nu-terms-body{max-height:420px;overflow:auto;font-size:14px;line-height:1.7;color:var(--ink2)}
.nu-st{display:inline-block;margin:0 0 10px}
.about-hub{display:grid;gap:14px}.about-hub h2{font-size:17px;margin:8px 0 0}
.ab-faces{display:flex;gap:6px;flex-wrap:wrap;text-decoration:none}.ab-faces img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--card);box-shadow:var(--shadow)}
.tel select.cc{appearance:none;-webkit-appearance:none;border:0;border-inline-end:1px solid var(--line);border-radius:0;min-height:46px;padding:0 12px;font:inherit;font-weight:700;color:var(--ink);cursor:pointer}
@media (max-width:560px){.cqt-m{max-width:100%}.cs-nlist{grid-template-columns:1fr}}
/* batch 15 (owner, 2 Nov 2026): what goes with the cart, a card that slides up from the bottom when the cart opens; the cart stays seen and usable above it */
.cmp-sheet{position:fixed;z-index:66;bottom:0;inset-inline-end:0;width:min(440px,100%);max-height:38vh;display:flex;flex-direction:column;gap:8px;background:var(--card);border:1px solid var(--line);border-bottom:0;border-radius:20px 20px 0 0;box-shadow:0 -10px 30px rgba(48,36,24,.18);padding:8px 14px calc(12px + env(safe-area-inset-bottom));transform:translateY(105%);transition:transform .26s ease;outline:none}
.cmp-sheet.on{transform:none}
.cmp-grip{width:40px;height:4px;border-radius:4px;background:var(--line);margin:0 auto}
.cmp-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.cmp-head h3{margin:0;font-size:16px}
.cmp-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(120px,136px);gap:10px;overflow-x:auto;overflow-y:hidden;padding:2px 2px 6px;scrollbar-width:thin;min-height:0}
.cmp-card{display:flex;flex-direction:column;gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:8px}
.cmp-card a{display:flex;flex-direction:column;gap:4px;color:var(--ink);text-decoration:none;font-size:13px}
.cmp-card img{width:100%;height:64px;object-fit:contain;background:#fff;border-radius:10px}
.cmp-card a b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600;line-height:1.3}
.cmp-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;font-size:13px}
.cmp-add{min-width:36px;min-height:36px;border-radius:50%;border:0;background:var(--brand);color:var(--brand-ink);font-size:20px;line-height:1;cursor:pointer}
.cmp-skip{align-self:center;min-height:40px;padding:0 22px}
.drawer.cmp-pad{padding-bottom:40vh}
@media (max-width:760px){.cmp-sheet{width:100%;inset-inline:0;bottom:calc(80px + env(safe-area-inset-bottom));padding-bottom:12px;border-radius:20px;border-bottom:1px solid var(--line);max-height:40vh}.cmp-sheet:not(.on){transform:translateY(calc(105% + 90px))}}
@media (prefers-reduced-motion:reduce){.cmp-sheet{transition:none}}

/* «مراكز خدمة العملاء» on the contact page and the points history inside the loyalty card (owner, 3 Nov 2026) */
.cu-dir{margin-top:22px}.cu-dir h2{font-size:19px;margin:0 0 12px;color:var(--brand)}
.cu-dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.cu-dir-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:0 6px 18px rgba(143,90,53,.08)}
.cu-dir-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}.cu-dir-card h3{font-size:16.5px;margin:0;color:var(--deep,#5b3a22);line-height:1.4}
.cu-flag{font-size:44px;line-height:1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.15))}
.cu-flags{font-size:28px;line-height:1;letter-spacing:1px;white-space:nowrap}.cu-flags small{font-size:13px;color:var(--muted);margin-inline-start:4px}
.cu-dir-ways{display:flex;align-items:center;gap:12px;margin:0;flex-wrap:wrap}.cu-dir-ways .cu-num{margin-inline-start:auto;font-weight:700;font-size:13.5px;color:var(--ink2,#4a3f36)}
.cu-dot{width:48px;height:48px;border-radius:50%;display:inline-grid;place-items:center;color:#fff}.cu-dot svg{width:24px;height:24px}
.cu-dot.wa{background:#25d366}.cu-dot.call{background:var(--green)}.cu-dot.mail{background:var(--brand)}
.pts-hist{margin-top:10px;border-top:1px solid rgba(255,255,255,.35);padding-top:8px;text-align:start}.pts-hist summary{cursor:pointer;font-weight:700;min-height:36px;display:flex;align-items:center}
.pts-hist .hist{margin:6px 0 0;max-height:280px;overflow:auto}
.points-card .pts-hist{grid-column:1/-1}.points-card .pts-hist .hist li{color:#fff;border-color:rgba(255,255,255,.25)}.points-card .pts-hist .hist .neg{color:#ffd9d2}

/* a bundle's contents on its page (owner, 3 Nov 2026) */
.bundle-box{margin:14px 0;border:1px solid var(--line);border-radius:16px;padding:12px 14px;background:#fff}.bundle-box h3{margin:0 0 8px;font-size:16px;color:var(--brand)}
.bundle-box ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.bundle-box li a{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;min-height:48px}
.bundle-box li img{width:48px;height:48px;object-fit:cover;border-radius:10px;background:var(--cream)}.bundle-box li span{flex:1}.bundle-box li b{color:var(--muted)}
.bundle-was{margin:10px 0 0;color:var(--muted)}.bundle-was s{margin-inline-end:6px}
/* the courses: by specialist / all courses / a specialist's page (owner approved the design, 3 Nov 2026) */
.c-seg{display:grid;grid-template-columns:1fr 1fr;background:var(--cream);border-radius:999px;padding:4px;margin:4px 0 14px;max-width:460px}.c-seg button{border:0;background:none;border-radius:999px;padding:10px 0;font:inherit;font-weight:700;color:var(--muted);cursor:pointer;min-height:44px}.c-seg button.on{background:#fff;color:var(--brand);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.c-sps{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}
.c-sp{background:var(--card,#fff);border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:0 8px 22px rgba(143,90,53,.08);min-width:0}
.c-sph{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none}.c-av{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 18%;border:3px solid var(--cream);flex:none}.c-sp h2{font-size:17px;margin:0;color:var(--brand)}
.c-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.c-chips .chip{font-size:12px;background:var(--cream);color:var(--brand);border-radius:999px;padding:3px 10px;font-weight:700;border:0}.c-chips .chip.g{background:#e4efe8;color:#2f5b40}.c-center{justify-content:center}
.c-meta2{display:flex;gap:14px;font-size:13px;color:var(--muted);margin:10px 0 8px}.c-meta2 b{color:var(--ink)}
.c-rowx{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-overflow-scrolling:touch}.c-mini{flex:0 0 140px;scroll-snap-align:start;color:inherit;text-decoration:none}.c-mini img{width:140px;height:92px;object-fit:cover;border-radius:12px;display:block}.c-mini p{font-size:13px;margin:4px 0 0;font-weight:700;line-height:1.35;max-height:2.7em;overflow:hidden}.c-mini small{color:var(--green);font-weight:800}
.c-more{display:block;text-align:center;margin-top:10px;font-weight:800;color:var(--brand);border:1.5px solid var(--line);border-radius:999px;padding:9px;text-decoration:none;min-height:44px}
.c-chiprow{display:flex;gap:7px;overflow-x:auto;margin:0 0 10px;padding-bottom:2px}.c-chip{white-space:nowrap;font:inherit;font-size:13px;border:1.5px solid var(--line);border-radius:999px;padding:7px 12px;font-weight:700;color:var(--brand);background:#fff;cursor:pointer;min-height:40px}.c-chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.c-grid2{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.c-card2{background:var(--card,#fff);border:1px solid var(--line);border-radius:20px;overflow:hidden;color:var(--ink);text-decoration:none;box-shadow:0 6px 18px rgba(143,90,53,.07)}.c-card2:hover{border-color:var(--green)}
.c-im{position:relative}.c-im img{width:100%;height:160px;object-fit:cover;display:block}.c-badge{position:absolute;top:10px;inset-inline-start:10px;background:#d8a24a;color:#3a2a10;font-size:12px;font-weight:900;border-radius:999px;padding:3px 10px}.c-badge.s{background:#fff;color:var(--green)}
.c-b{padding:10px 12px 12px}.c-b h3{font-size:15.5px;margin:0 0 6px;line-height:1.45}.c-by{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--muted);margin:0}.c-by img{width:26px;height:26px;border-radius:50%;object-fit:cover;object-position:50% 18%}
.c-hero{text-align:center}.c-hero img{display:block;margin:0 auto;width:118px;height:118px;border-radius:50%;object-fit:cover;object-position:50% 18%;border:4px solid #fff;box-shadow:0 10px 24px rgba(91,58,34,.2)}.c-hero h1{margin:10px 0 2px;font-size:22px;color:var(--brand)}
.c-quals{list-style:none;padding:0;margin:0 0 12px}.c-quals li{padding:6px 0;border-bottom:1px solid var(--line);font-size:14px}
.c-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 18px}.c-btns .btn{text-align:center;min-height:44px}
/* the photos wall (owner, 3 Nov 2026): one picture at a time, swiped */
.ph-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:8px;overscroll-behavior-x:contain}
.ph-card{flex:0 0 min(100%,520px);scroll-snap-align:center;background:var(--card,#fff);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.ph-card img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;background:var(--cream)}
.ph-bar{display:flex;gap:10px;padding:10px 12px}.ph-bar button{border:0;background:var(--cream);border-radius:999px;padding:8px 14px;font:inherit;font-weight:700;color:var(--brand);min-height:44px;cursor:pointer}
.ph-like.on{background:#fde7ea;color:#c2334d}.ph-cap{margin:0 12px 10px;font-size:14px;line-height:1.6;white-space:pre-line}.ph-cap.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ph-coms{border-top:1px solid var(--line);padding:10px 12px}.ph-c{margin:0 0 8px;font-size:14px}.ph-form{display:flex;gap:8px}.ph-form input{flex:1;min-height:44px}
.ph-prods{display:flex;flex-direction:column;gap:6px;padding:0 12px 10px}.ph-prod{display:flex;align-items:center;gap:10px;background:var(--cream);border-radius:14px;padding:6px 10px;color:var(--ink);text-decoration:none;min-height:52px}
.ph-prod img{width:40px;height:40px;border-radius:10px;object-fit:cover}.ph-prod span{flex:1;font-weight:700;font-size:14px}.ph-prod b{color:var(--green);font-size:13px}
.p-photos{margin:18px 0}.ph-strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory}.ph-strip a{flex:0 0 160px;scroll-snap-align:start}.ph-strip img{width:160px;height:200px;object-fit:cover;border-radius:16px;display:block}
.as-prod{display:flex;align-items:center;gap:6px}.as-prod a{flex:1;min-width:0}.as-add{flex:none;border:0;border-radius:999px;background:var(--green);color:#fff;font:inherit;font-weight:800;min-width:48px;min-height:44px;padding:0 12px;cursor:pointer}
.ph-card{position:relative}.ph-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain}.ph-slides img{flex:0 0 100%;scroll-snap-align:center;width:100%;aspect-ratio:4/5;object-fit:cover}
.ph-n{position:absolute;top:10px;inset-inline-end:10px;background:rgba(0,0,0,.55);color:#fff;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:700}
.ph-hm{position:relative;display:block}.ph-hm .ph-n{top:8px;inset-inline-end:8px}
.ph-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.ph-cell{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--cream)}.ph-cell img{width:100%;height:100%;object-fit:cover;display:block}
.ph-many{position:absolute;top:6px;inset-inline-end:6px;color:#fff;font-size:16px;text-shadow:0 1px 3px rgba(0,0,0,.6)}
@media (min-width:900px){.ph-grid{grid-template-columns:repeat(4,1fr);gap:6px}}

/* comments of a video or a photo (owner, 4 Nov 2026): a solid sheet; the photo beside the name, the date, the words in their own direction, a heart
   with its count, «رد» and report/block under each; the photos page opens it fixed at the bottom of the window */
.rcom-sheet.rcom-fixed{position:fixed;inset:auto 0 0;z-index:90;max-width:640px;margin-inline:auto;max-height:min(72vh,640px);box-shadow:0 -12px 32px rgba(48,32,20,.28)}
.rc{display:flex;gap:10px;align-items:flex-start}.rc>.av{flex:none}.rc-body{flex:1;min-width:0}.rc-head{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}
.rc-text{margin:2px 0;overflow-wrap:anywhere}.rc-text span{display:block}.rc-acts{margin:2px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px}
.rc-like{border:0;background:none;padding:2px 4px;min-height:32px;cursor:pointer;color:var(--muted);font:inherit;display:inline-flex;gap:4px;align-items:center}
.rc-like span{font-size:16px;line-height:1}.rc-like.on{color:#d93a40}.rc-like b{font-weight:600}
/* the home page on a computer (owner, 4 Nov 2026): the phone's sections in the same order, laid out for the width */
@media (min-width:761px){
  .home-desk{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;padding-bottom:24px}.home-desk>*{min-width:0}
  .home-desk .app-sec,.home-desk .slider,.home-desk .buy-again{margin:0}
  .home-desk .app-intl{background:var(--cream2,#f1e4cf);border-radius:14px;padding:12px;text-align:center;margin:0}
  .home-desk .app-rail{display:grid;grid-auto-flow:column;grid-auto-columns:200px;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:thin}
  .home-desk .app-rail>*{scroll-snap-align:start}
  .home-desk .app-reels{grid-auto-columns:150px}.home-desk .app-reel{width:auto;height:auto;position:relative;border:0;padding:0;border-radius:16px;overflow:hidden;background:#1f1610;cursor:pointer;color:#fff}
  .home-desk .app-reel img{width:100%;aspect-ratio:9/16;height:auto;object-fit:cover;display:block}.home-desk .app-reel>span{position:absolute;inset:0;display:grid;place-items:center;font-size:26px;text-shadow:0 2px 8px rgba(0,0,0,.5)}
  .home-desk .app-reel small{position:absolute;inset:auto 0 0;padding:18px 8px 8px;background:linear-gradient(transparent,rgba(0,0,0,.65));font-size:12px;text-align:start}
  .home-desk .app-offers{grid-auto-columns:320px}.home-desk .app-offer{background:var(--card,#fff);border:1px solid var(--line);border-radius:16px;padding:14px;display:grid;gap:6px;align-content:start}
  .home-desk .app-offer img{width:100%;height:150px;object-fit:cover;border-radius:12px}.home-desk .app-offer p{margin:0;font-size:13px;color:var(--ink2)}
  .home-desk .app-code{justify-self:start;border:0;border-radius:999px;background:var(--cream);color:var(--green);font-weight:800;padding:6px 12px;font-size:13px;cursor:pointer}
  .home-desk .app-courses{grid-auto-columns:360px}
  .home-desk .app-posts{grid-auto-columns:260px}.home-desk .app-post{display:grid;gap:8px;text-decoration:none;color:var(--ink)}.home-desk .app-post img{width:100%;aspect-ratio:16/10;height:auto;object-fit:cover;border-radius:14px}
  .home-desk .app-tile{margin:0;display:flex;align-items:center;gap:14px;background:var(--card,#fff);border:1px solid var(--line);border-radius:18px;padding:16px 20px;text-decoration:none;color:var(--ink)}
  .home-desk .app-tile:hover{border-color:var(--green)}.home-desk .app-tile small{display:block;color:var(--muted)}.home-desk .at-ic{font-size:26px}.home-desk .at-go{margin-inline-start:auto;font-size:22px;color:var(--green)}
  .home-desk .app-links{display:flex;gap:18px;justify-content:center}.home-desk .app-links a{color:var(--green);font-weight:700;text-decoration:none}
  .home-desk .ph-strip a{flex-basis:200px}.home-desk .ph-strip img{width:200px;height:250px}
  .home-desk .app-wall{grid-auto-columns:300px}.home-desk .app-wallcard{display:grid;gap:6px;background:var(--card,#fff);border:1px solid var(--line);border-radius:16px;padding:14px;text-decoration:none;color:var(--ink)}
  .home-desk .app-wallcard p{margin:0;font-size:14px}
}
/* the nutritionists' spaces (6 Nov 2026, space-page.js) */
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.sp-card{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line,#e7dfd4);border-radius:14px;text-decoration:none;color:inherit;background:var(--card,#fff)}
.sp-card img,.sp-cover{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:10px}
.sp-course{border:1px solid var(--line,#e7dfd4);border-radius:12px;padding:10px 14px;margin:10px 0}
.sp-course progress{width:100%;height:6px}
.sp-video{width:100%;max-height:70vh;border-radius:12px;background:var(--ink,#2b2420)}
.sp-body{line-height:1.8}
.sp-lock{font-size:18px;padding:16px;border-radius:12px;background:var(--soft,#f6f1ea)}
/* Apple Pay / Google Pay rows and Stripe's own wallet button in place of «تأكيد الطلب» (owner, 6 Nov 2026, like Talabat) */
.co-wallet{width:100%;min-height:55px;margin-top:10px}.co-wallet[hidden]{display:none}.co-nav.wal{grid-template-columns:auto;justify-content:start}
.wl-mark{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;font-size:13px;font-weight:600;letter-spacing:0;padding:4px 9px}
.wl-or{text-align:center;margin:10px 0 2px}.st-pay .co-wallet{margin:6px 0 4px}
.wl-probe{position:fixed;top:0;inset-inline-start:0;width:320px;height:56px;opacity:0;pointer-events:none;z-index:-1;overflow:hidden}

/* the birthday on «ملفي» (owner, 6 Nov 2026) */
.bd-row{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.bd-row legend{font-weight:600;padding:0;margin-bottom:2px}.bd-gift{margin:0}.bd-hint{display:block}.bday-note{margin:6px 0;color:#3d6b4a}

/* Turkey's address form (owner, 6 Nov 2026: «the government forms»): the map with its pin on top, its note, the lists typed to filter, Bina No · Kat · Daire No in one row */
.af-map{display:grid;gap:6px}.af-mini{position:relative;display:block;width:100%;height:150px;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#e8efe9;cursor:pointer;font:inherit;color:var(--ink)}
.af-mini-map{position:absolute;inset:0;display:block}.af-mini-map .leaflet-control-attribution{font-size:9px}
.af-mini-tap{position:absolute;inset-inline:8px;bottom:8px;z-index:500;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.92);font-size:13px;font-weight:700;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.af-mini-none{display:grid;place-items:center;align-content:center;gap:4px;background:repeating-linear-gradient(45deg,#eef3ee 0 14px,#e6ede7 14px 28px)}.af-mini-none b{font-size:15px;padding:0 12px}
.af-note{margin:0;font-size:13px;line-height:1.6;color:var(--ink2);background:var(--cream);border-radius:10px;padding:8px 10px}
.af-sec{margin-top:6px;padding-bottom:4px;border-bottom:1px solid var(--line)}
.af-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:end}.af-row .cu-f label,.co-form .af-row div.cu-f>label{font-size:13px;line-height:1.3;white-space:normal}
.af-combo input:disabled{background:#f4f1ec;color:var(--muted)}
.af-list li{display:block;padding:10px 12px;font-size:15px}.af-list li.act{background:var(--cream);outline:2px solid #c9b79c}.af-list li bdi{unicode-bidi:isolate}
.af-ed{overflow:auto}.af-ed .af-mini{height:130px}
/* «تحويل بنكي (Havale/EFT)» (7 Nov 2026): the account card after the order, in «طلباتي» and on a payment link */
.bt-how{display:block;margin-top:4px;line-height:1.55}
.bt-box{margin:12px 0;background:var(--cream);border-radius:14px;padding:10px 14px;text-align:start}
.bt-box summary{cursor:pointer;font-weight:700}
.bt-ref{margin:8px 0 4px}
.bt-acc{background:var(--bg);border-radius:12px;padding:10px 12px;margin:8px 0;border:1px solid transparent}
.bt-acc.on{border-color:var(--green,#44715a)}
.bt-acc .bt-h{display:flex;justify-content:space-between;align-items:center;gap:8px}
.bt-acc dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;margin:6px 0 0;font-size:14px}
.bt-acc dt{color:var(--muted,#7a6a5a);white-space:nowrap}.bt-acc dd{margin:0;overflow-wrap:anywhere}
.bt-iban,bdi[dir=ltr].bt-iban{font-family:ui-monospace,Menlo,monospace;letter-spacing:.02em;white-space:normal;overflow-wrap:anywhere}
.bt-mind{margin:4px 0 0;padding-inline-start:18px}
.hl-one{outline:2px solid var(--green,#44715a);outline-offset:2px;border-radius:10px;transition:outline-color .6s}
/* the order's note at checkout (7 Nov 2026) */
.co-notes .chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}.co-notes .chip{cursor:pointer;user-select:none}.co-notes .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.co-notes textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:56px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* courses and consultations hidden until approved (owner, 7 Nov 2026): any link left to them goes too */
.health-off a[href^="/consultations"], .health-off a[href^="/courses"], .health-off a[href^="/nutritionists"], .health-off a[href^="/account/consults"], .health-off a[href*="page=consult"] { display: none !important; }
.hoff { padding: 48px 16px; } .hoff .btn { margin-top: 16px; }
/* management review bugs (7 Nov 2026): a team member's photo keeps the face — a portrait is cropped from its top part, not its middle (it cut the
   head off on «فريقنا»'s cards and the member's page) */
.tm-photo img,.tmp-photo img,.tm-card img.av-img{object-position:50% 18%}
/* a long category name under its circle: two lines at most, whole words, never cut to one line with «…» */
.story b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;word-break:normal;min-height:2.5em}
.app-cats b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;line-height:1.3;max-width:100%}
/* the reel's long words: the caption wraps inside the screen (a long link or hashtag broke out of it) and opens whole on a tap, scrolling within
   at most 45% of the screen, so the video behind it keeps its size; a product card with a long name keeps its picture */
.reel-info{box-sizing:border-box;width:100%;min-width:0}
.reel-info .cap{overflow-wrap:anywhere;word-break:normal;cursor:pointer}
.reel-info .cap.open{-webkit-line-clamp:unset;display:block;max-height:45dvh;overflow-y:auto;overscroll-behavior:contain}
.reel-actions{min-width:0}.rpill a{min-width:0}.rpill img{flex:none}
.rpill b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.reel video{flex:none}
/* «أسباب الإلغاء» and «عدّل طلبك» (owner, 7 Nov 2026): a sheet from the bottom on a phone, centred on a computer */
.mg-dlg{position:fixed;inset:0;z-index:95;background:rgba(31,22,16,.45);display:flex;align-items:flex-end;justify-content:center}
.mg-box{background:var(--paper,#fffdf9);width:100%;max-width:480px;max-height:88dvh;overflow-y:auto;border-radius:18px 18px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));box-sizing:border-box;display:grid;gap:10px}
@media (min-width:761px){.mg-dlg{align-items:center}.mg-box{border-radius:18px}}
.mg-box h2{margin:0;font-size:18px}.mg-reasons{display:grid;gap:8px}.mg-r{display:flex;gap:8px;align-items:center;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:12px}
.mg-reasons textarea{width:100%;box-sizing:border-box}.mg-edit-hint{margin:0}
.mg-lines{list-style:none;margin:0;padding:0;display:grid;gap:8px}.mg-lines li{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:8px}
.mg-lines li>span:first-child{min-width:0;overflow-wrap:anywhere;flex:1 1 140px}.mg-q{display:flex;align-items:center;gap:6px}.mg-q button[data-q]{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff}
.mg-add{display:grid;gap:4px;font-size:14px}.mg-add select{min-height:44px;max-width:100%}.mg-sum{margin:0}
/* the gift chosen by the cart's value (owner, 7 Nov 2026) */
.gt-cart{margin:10px 0;padding:12px;border:1px dashed var(--line);border-radius:14px;background:var(--cream,#f8f1e6)}.gt-cart h3{margin:0 0 8px;font-size:15px}
.gt-list{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.gt-g{flex:0 0 108px;display:grid;justify-items:center;gap:4px;padding:8px;border:2px solid var(--line);border-radius:12px;background:#fff;font-size:12px;text-align:center}
.gt-g b{font-weight:600;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.gt-g img{width:56px;height:56px;object-fit:contain}.gt-g.on{border-color:var(--brand)}.gt-g[disabled]{opacity:.5}
.gt-next{margin:8px 0 4px;font-size:13px}.cx-note{margin:4px 0}
.reel-tile .rt-star{position:absolute;top:8px;inset-inline-start:8px;z-index:1;font-size:16px;background:rgba(255,253,249,.9);border-radius:999px;padding:2px 6px} /* «مميّز ⭐» (7 Nov 2026) */
/* «قصص» (owner, 7 Nov 2026): the circles at the top of the home page, every width; the viewer full screen */
.st-row .st-stories{display:flex;justify-content:flex-start;margin:4px 0 0;padding-bottom:6px} /* tighter under the circles (final audit, 7 Nov 2026) */
.st-modal{position:fixed;inset:0;z-index:96;background:#1f1610;display:grid;place-items:center}.st-media{width:100%;height:100dvh;display:grid;place-items:center}
.st-media img,.st-media video{max-width:min(100%,calc(100dvh * 9 / 16));max-height:100dvh;width:100%;height:100%;object-fit:contain}
.st-bars{position:absolute;top:calc(8px + env(safe-area-inset-top));inset-inline:10px;display:flex;gap:4px;z-index:2}.st-bars i{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.35);overflow:hidden}
.st-bars i.done b,.st-bars i.on b{display:block;height:100%;background:#fff}.st-bars i.on b{animation:stbar 5s linear forwards}@keyframes stbar{from{width:0}to{width:100%}}.st-bars i.done b{width:100%}
.st-x{position:absolute;top:calc(20px + env(safe-area-inset-top));inset-inline-end:12px;z-index:2;width:40px;height:40px;border-radius:50%;color:#fff;font-size:22px;border:0}

/* owner, 9 Nov 2026: footer — on phones (≤ 700 px) about a third of the old height: the three menus side by side, every block folds under its
   title (closed on phones, always open on wider screens, see footFold in store.js), the about text in two lines with «المزيد», the contact
   numbers as small icon buttons in one row. Wider screens keep the five columns. */
.f-cols{display:contents}
.f-blk>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:default}
.f-blk>summary::-webkit-details-marker{display:none}
.f-blk>summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
.f-chev{display:none}.f-more{display:none}
.f-btns{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 6px}
.f-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;min-height:36px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);text-decoration:none;font-size:13px;font-weight:600}
.f-btn svg{color:var(--green);flex:none}.f-btn:hover{border-color:var(--brand)}.f-btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (max-width:700px){
  .site-foot{padding-top:20px;margin-top:28px}
  .foot-grid{grid-template-columns:1fr 1fr;gap:0 16px;align-items:start}.f-help{display:contents}
  .f-about,.f-btns,.f-help .contact-list,.news{grid-column:1/-1}.f-about{margin-bottom:12px}
  .f-brand{display:flex;align-items:center;gap:12px}.f-about .logo-sq{width:52px;height:52px;flex:none}
  .f-brand .eyebrow{margin:0 0 2px}.f-brand h3{margin:0;font-size:15px}
  .f-about .f-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:8px 0 0}
  .f-about .f-text.open{display:block}
  .f-more{display:inline-block;background:none;border:0;padding:4px 0;min-height:32px;color:var(--brand);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
  .f-more:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
  .f-about .f-social{margin-top:6px}
  .f-blk{border-top:1px solid var(--line)}
  .f-blk>summary{cursor:pointer;padding:10px 0;min-height:44px}
  .f-blk>summary h3{margin:0;font-size:14px}
  .f-chev{display:inline-flex;transform:rotate(90deg);transition:transform .2s;color:var(--muted)}
  .f-blk[open] .f-chev{transform:rotate(-90deg)}
  .f-blk .links{gap:6px;padding-bottom:12px}.f-blk .f-loyal:last-child{margin-bottom:12px}
  .f-btns{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;margin:10px 0 4px}
  .f-btn{flex-direction:column;justify-content:center;gap:3px;padding:7px 4px;border-radius:12px;font-size:12px;text-align:center;line-height:1.2}
  .f-help .contact-list li{padding:6px 0;font-size:13px}
  .news{margin-top:10px}.news h3{font-size:14px;margin:0 0 8px}.news-row input,.news-row .btn{min-height:44px;padding-top:8px;padding-bottom:8px}
  .foot-bottom{margin-top:14px}
}
@media (max-width:700px) and (prefers-reduced-motion:reduce){.f-chev{transition:none}}

/* the assistant writes its answer word by word, as the apps (owner, 9 Nov 2026): the cursor, what waits for the text, the thinking dots; the price on a suggested product */
.as-cur{display:inline-block;margin-inline-start:2px;opacity:.7;animation:asBlink 1s steps(2) infinite}@keyframes asBlink{50%{opacity:.15}}
.as-msg .as-wait{display:none!important}
.as-think{display:flex;gap:5px;align-items:center;padding:14px}.as-think i{width:7px;height:7px;border-radius:50%;background:var(--green);opacity:.35;animation:asDot 1s ease-in-out infinite}.as-think i:nth-child(2){animation-delay:.16s}.as-think i:nth-child(3){animation-delay:.32s}
@keyframes asDot{50%{opacity:.9;transform:scale(1.15)}}
.as-prods a>span{display:flex;flex-direction:column;min-width:0}.as-price{font-size:13px;display:flex;gap:6px;align-items:baseline}.as-price b{font-weight:700}.as-price s{opacity:.6;font-size:12px}
@media (prefers-reduced-motion: reduce){.as-cur,.as-think i{animation:none}.as-think i{opacity:.7}}

/* «الصور» as the app (owner, 9 Nov 2026): an opened post at its own shape, nothing cropped; the grid's cells keep their 4:5 shape with a shimmer until the thumbnail comes */
.ph-card img,.ph-slides img{aspect-ratio:var(--ph-r,.8);object-fit:contain}
.ph-skel{pointer-events:none}.ph-more{height:1px}
.sk{background:linear-gradient(100deg,var(--cream) 30%,#fbf6ee 50%,var(--cream) 70%) 0 0/300% 100%;animation:skMove 1.3s linear infinite}
@keyframes skMove{to{background-position:-150% 0}}
.ph-cell img{opacity:1;transition:opacity .2s}.ph-cell.sk img{opacity:0}
@media (prefers-reduced-motion: reduce){.sk{animation:none;background:var(--cream)}.ph-cell img{transition:none}}

/* a picture still loading shows a soft shimmer in its own place (owner, 9 Nov 2026: product cards, reels, blog, photos); store.js takes .sk off on load or error */
img.sk{background:linear-gradient(100deg,var(--cream) 30%,#fbf6ee 50%,var(--cream) 70%) 0 0/300% 100%;animation:skMove 1.3s linear infinite}
.post-hero img{aspect-ratio:16/9}
@media (prefers-reduced-motion: reduce){img.sk{animation:none;background:var(--cream)}}

/* no jump while the page draws (speed audit, 9 Nov 2026: CLS 0.24 on every phone page): the footer waits for the first page, the bottom bar's labels
   are in the page from the start (index.html), the desktop header keeps its rows' height */
html:not(.hc-ready) .site-foot{display:none}
#view{min-height:100vh;min-height:100svh} /* a page whose words come later (a post, an account page) grows below the screen's fold, so the footer never jumps in view */
.bottom-nav span:not(.cart-count){min-height:1.2em}
@media (min-width:1101px){.mainnav{min-height:44px}}

/* «طلباتي» as the app's cards (parity audit, 9 Nov 2026) */
.ord-chips{display:flex;gap:8px;margin:0 0 10px}.ord-chips .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.pill.ord-st{display:inline-block;border-radius:999px;padding:1px 10px;font-size:13px;font-weight:700;color:#fff}.ord-st.ok{background:var(--green)}.ord-st.way{background:#6f9a7f}.ord-st.off{background:#9a948c}.ord-st.us{background:var(--brand)}
.ord-th{display:flex;float:inline-end;margin-inline-start:8px}.ord-th img,.ord-th i{width:44px;height:44px;border-radius:12px;object-fit:cover;border:2px solid #fff;margin-left:-12px;background:var(--cream)}.ord-th>:first-child{margin-left:0}
.ord-th i{display:grid;place-items:center;font-style:normal;font-weight:800;font-size:13px;color:var(--brand)}
.ord-blocked{margin-top:6px}.ord-blocked p{margin:0 0 6px}.ord-help{display:flex;gap:8px;flex-wrap:wrap}
.rc-kids[hidden]{display:none}.rc-more{font-size:13px;font-weight:700;color:var(--muted);margin:-2px 0 4px;padding-inline-start:44px;text-align:start}
/* «طلباتي» as in the apps (parity, 9 Nov 2026; order-tools.js): the cancel steps, the address and mobile, the rating */
.cf{display:grid;gap:10px}.cf-head{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:6px}.cf-head h2{text-align:center;font-size:17px;margin:0}
.cf-head .icon-btn{width:40px;height:40px;font-size:22px;line-height:1;border:0;background:transparent;color:var(--muted);cursor:pointer}
[dir=rtl] .cf-back{transform:scaleX(-1)}
.cf-step{justify-self:start;font-size:12px;font-weight:700;color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);border-radius:999px;padding:3px 10px}
.cf-q{margin:0;font-size:19px;color:var(--brand-deep,var(--brand))}.cf-sub{margin:0}.cf-wait{text-align:center;padding:40px 0;color:var(--muted)}
.cf-reasons{display:grid;gap:8px}.cf-r{display:flex;align-items:center;gap:10px;min-height:50px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;font:inherit;font-size:15px;text-align:start;cursor:pointer;color:inherit}
.cf-r i{flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--green)}.cf-r.on i{box-shadow:inset 0 0 0 3px #fff;background:var(--green)}.cf-r span{flex:1}.cf-r b{color:var(--muted);font-size:18px}[dir=rtl] .cf-r b{transform:scaleX(-1)}
.cf-r.on{border-color:var(--green)}.cf-note{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;padding:10px;font:inherit}
.cf-edit{display:flex;gap:10px;align-items:flex-start;margin:0;padding:14px;border-radius:14px;line-height:1.6}.cf-edit>span:first-child{font-size:20px}
.cf-edit.ok{background:color-mix(in srgb,var(--green) 9%,transparent)}.cf-edit.info{background:color-mix(in srgb,var(--brand) 9%,transparent)}
.cf-keep{justify-self:center;color:var(--muted);font-weight:700}
.cf-card{border:1px solid var(--line);border-radius:16px;padding:14px;display:grid;gap:10px;background:#fff}.cf-row{display:flex;justify-content:space-between;gap:10px;align-items:center}.cf-row b{font-size:16px;color:var(--brand-deep,var(--brand))}
.cf-money{border-top:1px solid var(--line);padding-top:10px}.cf-money p{margin:4px 0 0;line-height:1.6}
.cf-done{display:grid;gap:8px;justify-items:center;text-align:center;padding:10px 0}.cf-done p{margin:0;line-height:1.6}.cf-done h3{margin:4px 0;font-size:20px}
.cf-tick{display:grid;place-items:center;width:78px;height:78px;border-radius:50%;background:var(--green);color:#fff;font-size:36px;font-weight:800;box-shadow:0 0 0 9px color-mix(in srgb,var(--green) 14%,transparent)}
.cf-fail{display:grid;gap:8px;justify-items:start}.cf-fail p{margin:0;line-height:1.6}.cf-err{color:#a33}.cf-help-t{font-weight:700;color:var(--muted);font-size:13px}
.cf-addr{display:grid;gap:10px}.cf-addr .field{display:grid;gap:4px;font-size:14px;font-weight:600}.cf-addr input,.cf-addr select,.cf-addr textarea{font:inherit;font-weight:400;padding:10px;border:1px solid var(--line);border-radius:12px;min-height:44px;box-sizing:border-box;width:100%}
.cf-addr [aria-invalid=true]{border-color:#c44}
.cf-rate-p{display:flex;gap:10px;align-items:center}.cf-rate-p img{border-radius:12px;object-fit:cover}.rt-count.ok{color:var(--green)}
.ord-rate{margin-inline-start:auto;font-weight:700;color:var(--green)}.ord-items li{display:flex;gap:8px;align-items:center}
.ord-rate-all{margin-top:8px;display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:#fffaf2;border-radius:12px;padding:8px 12px;font:inherit;font-weight:700;cursor:pointer;color:inherit}.ord-rate-all span{color:#c9a227;letter-spacing:2px}
.cf .btn.danger{background:#b5523b;color:#fff;border-color:#b5523b}.cf .btn.danger[disabled]{opacity:.7}
.ord-sum{margin:8px 0;display:grid;gap:4px;font-size:14px}.ord-sum>div{display:flex;justify-content:space-between;gap:10px}.ord-sum dt{color:var(--ink2)}.ord-sum dd{margin:0;font-weight:700}.ord-sum-t{border-top:1px solid var(--line);padding-top:6px;font-size:15px}
picture.wp{display:contents}
.ord-due{margin:8px 0;padding:10px 12px;border-radius:12px;background:#fff6e9;border:1px solid var(--line)}.ord-due .btn{margin-inline-start:8px}
/* the exhibition's gift and the launch's double points (owner, 10 Nov 2026; expo-gift.mjs) */
.gift-page .eg-lead{font-size:18px;font-weight:600;margin:6px 0}.gift-page .eg-acts{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.eg-card small{grid-column:1/-1;font-size:13px;opacity:.95}.eg-card bdi{font-variant-numeric:tabular-nums;font-weight:700}
.eg-terms{margin:16px 0}.eg-terms .rules li{margin:4px 0}
.eg-cart{background:var(--cream);border-radius:14px;padding:8px 12px;margin:10px 0}.eg-cart p{margin:4px 0}
.rw-camp{background:#fff4e5;border:1px solid #f0c27b;border-radius:14px;padding:10px 14px;margin:10px 0}.rw-camp p{margin:4px 0 0}