:root{--brown:#57443d;--brown-d:#3d3027;--gold:#ddbe71;--text:#1a1a1a;--muted:#6b6b6b;--beige:#efedea;--red:#ba463a;--line:#e6e1dc;--sans:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--body:Nunito,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.lang-ar{--sans:"Tajawal",system-ui,sans-serif;--body:"Tajawal",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/22.5px var(--body);color:var(--text);background:#fff}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--sans);font-weight:400}
[hidden]{display:none!important}
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:8px;top:8px;z-index:99;background:#fff;padding:8px}
.only-desktop{display:none}
@media(min-width:1000px){.only-desktop{display:flex}.only-mobile{display:none!important}}
.wrap{max-width:1280px;margin:0 auto;padding:0 16px}.narrow{max-width:760px}
.center{text-align:center}.muted{color:var(--muted)}.ok{color:#2b7a3d}
.preview-bar{background:#c06a00;color:#fff;text-align:center;padding:6px;font-size:13px}

/* announcement */
.announce{background:var(--brown);color:#fff;display:flex;align-items:center;min-height:50px;font:300 10px/1.5 "Instrument Sans",var(--sans);letter-spacing:.28em;text-transform:uppercase}
@media(min-width:992px){.announce{min-height:40px}}
@media(min-width:992px){.announce{font-size:10.8px}}
.lang-ar .announce{font:400 12px/1.6 "Tajawal",sans-serif;letter-spacing:0}
.announce-track{flex:1;min-width:0;text-align:center;padding:4px 20px 0}.announce-track p{margin:0;display:none;line-height:22.5px}.announce-track p.on{display:block}
.announce-track a{text-decoration:none}
.announce{position:relative}
.announce-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;background:transparent;border:0;padding:8px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.7;cursor:pointer;transition:opacity .3s ease}
.announce-arrow:hover{opacity:1}
.announce-arrow::before{content:"";display:block;width:9px;height:9px;transform:rotate(45deg)}
.announce-arrow.prev{inset-inline-start:29%}.announce-arrow.next{inset-inline-end:29%}
.announce-arrow.prev::before{border-bottom:1.5px solid #e8e4de;border-left:1.5px solid #e8e4de}
.announce-arrow.next::before{border-top:1.5px solid #e8e4de;border-right:1.5px solid #e8e4de}
.lang-ar .announce-arrow.prev::before{border:0;border-top:1.5px solid #e8e4de;border-right:1.5px solid #e8e4de}.lang-ar .announce-arrow.next::before{border:0;border-bottom:1.5px solid #e8e4de;border-left:1.5px solid #e8e4de}
@media(max-width:768px){.announce-arrow.prev{inset-inline-start:5%}.announce-arrow.next{inset-inline-end:5%}}
@media(max-width:480px){.announce-arrow.prev{inset-inline-start:2%}.announce-arrow.next{inset-inline-end:2%}}

/* header (desktop: logo left, menu centred, icons right; phone: menu button, centred logo, icons) */
.header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid #e8e4de}
.header-in{display:flex;align-items:center;gap:8px;height:60px;padding:0 12px}
.logo{flex:1;display:flex;justify-content:center;text-decoration:none;font:500 28px/1 "Cormorant Garamond",serif;color:var(--brown);letter-spacing:.04em}
.logo img{height:25px;width:auto}
.icon-btn{background:none;border:0;padding:8px;color:var(--brown-d);display:inline-flex;position:relative;cursor:pointer}
.header-tools{display:flex;align-items:center}
.lang-switch{font:500 12px var(--sans);color:var(--brown);text-decoration:none;padding:8px;letter-spacing:.05em}
.cart-count{position:absolute;top:2px;inset-inline-end:0;background:var(--brown);color:#fff;border-radius:10px;font-size:10px;min-width:16px;height:16px;line-height:16px;text-align:center}
.nav{justify-content:center;align-self:stretch}
.nav-link{display:flex;align-items:center;height:100%;font:400 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brown);text-decoration:none;padding:0 20px;white-space:nowrap}
.nav-group{display:flex}

.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid #e8e4de;box-shadow:0 12px 48px rgba(0,0,0,.07);padding:36px 60px;z-index:40;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,visibility 0s linear .18s}
.nav-group:hover .mega,.nav-group:focus-within .mega{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .18s}
.mega-in{display:flex;gap:20px;justify-content:space-between}
.mega-col{flex:1 1 0;min-width:100px}
.mega-h{font:400 10px var(--sans);letter-spacing:.28em;text-transform:uppercase;color:#888;margin:0 0 24px}
.lang-ar .mega-h{letter-spacing:0;font-size:12px}
.mega a{display:block;padding:6px 0;font:300 13px var(--sans);letter-spacing:.02em;color:#888;text-decoration:none;opacity:0;transform:translateY(10px)}
.mega a:hover{color:var(--brown)}
.nav-group:hover .mega a,.nav-group:focus-within .mega a{animation:mega-in .35s cubic-bezier(.22,1,.36,1) forwards}
.mega-col:nth-child(2) a{animation-delay:.05s!important}.mega-col:nth-child(3) a{animation-delay:.1s!important}.mega-col:nth-child(4) a{animation-delay:.15s!important}.mega-col:nth-child(5) a{animation-delay:.2s!important}
@keyframes mega-in{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.mega a{opacity:1;transform:none;animation:none!important}}
@media(min-width:1000px){.header-in{height:75px;padding:0 40px}.logo{flex:0 0 auto;margin-inline-end:32px}.logo img{height:36px}.nav{flex:1}}
@media(min-width:1000px) and (max-width:1279px){.header-in{padding:0 16px}.logo{margin-inline-end:12px}.logo img{height:32px}.nav-link{padding:0 9px;letter-spacing:.06em}}

/* drawer (phone menu) and filter sheet */
.drawer,.sheet{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:60}
.cart-drawer{background:rgba(15,23,42,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.drawer-panel,.sheet-panel{background:#fff;height:100%;width:min(78vw,360px);overflow:auto;animation:slide-in .25s ease}
.sheet-panel{margin-inline-start:auto;width:min(86vw,360px);padding-bottom:24px}
@keyframes slide-in{from{transform:translateX(-100%)}to{transform:none}}
.lang-ar .drawer-panel{animation-name:slide-in-rtl}@keyframes slide-in-rtl{from{transform:translateX(100%)}to{transform:none}}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:8px 8px 8px 16px;border-bottom:1px solid var(--line)}

/* buttons */
.btn-gold,.btn-dark,.btn-wa{display:inline-block;border:0;border-radius:50px;padding:10.08px 28.8px;font:400 13px/24px var(--body);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;text-align:center}
.btn-gold{background:var(--gold);color:#000}
@media(min-width:768px) and (max-width:991px){.ptabs .btn-gold{padding:5.375px 15.36px}}
@media(max-width:767px){.ptabs .btn-gold{padding:10.08px 19.5px}}.btn-dark{background:var(--brown);color:#fff}.btn-wa{background:#1d7f3f;color:#fff;letter-spacing:.05em}
.btn-dark:disabled{opacity:.6}.block{display:block;width:100%}
.link{background:none;border:0;padding:0;color:var(--brown);text-decoration:underline;cursor:pointer;font-size:13px}

/* hero */
.hero{position:relative;background:#111;width:100%;height:620px;overflow:hidden;margin:0 0 16px}

.hero-poster,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-video{opacity:0;transition:opacity .6s}.hero-video.on{opacity:1}
.hero-buttons{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.hero-btn{background:#fff;color:#000;border-radius:50px;padding:14px 32px;width:auto;text-align:center;font:500 12px/18px var(--body);letter-spacing:.18em;text-decoration:none;text-transform:uppercase}
.hero-btn:hover{color:#222}
@media(min-width:768px){.hero-buttons{flex-direction:row}.hero-btn{width:230px}}

/* text block */
.sec-title{font:400 22px/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--brown);margin:0 0 12px}
.lang-ar .sec-title,.lang-ar .tab,.lang-ar .card-title,.lang-ar .nav-link{letter-spacing:0}
.text-block{padding:60px 135px}.text-block .sec-title{font-size:22.4px;line-height:29.12px;margin-bottom:22.4px}.text-block p{margin:0;font:400 14px/16.8px var(--body);letter-spacing:.08em;color:var(--brown)}
@media(max-width:767px){.text-block{padding:0 5%}.text-block .sec-title{font-size:17px;line-height:22.1px}}
/* centred white block (live "Jewelry for every occasion" / "Gifts for him & her" headings) */
.text-block.center:not(.beige){padding:45px 20px 0}.text-block.center .sec-title{color:#444;line-height:33.6px}
@media(max-width:767px){.text-block.center:not(.beige) .sec-title{font-size:15px;line-height:28.5px}.text-block.center:not(.beige) p{font-weight:100}}.text-block.center p{font-size:14.25px;line-height:21.375px;letter-spacing:normal}
.text-block.center{text-align:center}.text-block.beige{background:#f0efee;padding:60px 20px 0}
.text-block.beige .sec-title{font:400 24px/36px var(--body);letter-spacing:.1em;color:#2c1f0e;opacity:.9;margin:0}
@media(max-width:767px){.text-block.beige{padding:50px 20px 0}.text-block.beige .sec-title{font-size:17px;line-height:25.5px}.text-block p.eyebrow{line-height:15px}}
/* beige left block = live "Gifts for him & her": padding 4% 3% 2%, title 25px w100 1px #444, text #222 */
.text-block.beige:not(.center){padding:0 3%}
@media(max-width:767px){.text-block.beige:not(.center) .sec-title{font-size:17px!important;line-height:25.5px!important;padding-top:10%!important}.text-block.beige:not(.center) p{font-weight:100!important;letter-spacing:.03em!important}}.text-block.beige:not(.center) .sec-title{padding-top:4%}.text-block.beige:not(.center) p{padding-bottom:2%}.text-block.beige:not(.center) .sec-title{font:100 25px/37.5px var(--sans);letter-spacing:1px;color:#444;opacity:1;text-transform:uppercase;margin:0 0 19px}.text-block.beige:not(.center) p{color:#222;font-size:14px;line-height:21px;letter-spacing:normal;max-width:700px}
.text-block p.eyebrow,.eyebrow{font:500 11px/16.5px var(--body);letter-spacing:.22em;text-transform:uppercase;color:#2c1f0e;margin-bottom:12px!important}
@media(max-width:767px){.text-block p.eyebrow,.eyebrow{font-size:10px;line-height:15px;letter-spacing:.19em}}

/* product tabs + rails */
.ptabs{padding:16px 0 24px}
.ptabs .sec-title{padding:0 16px}
.tab-list{display:flex;gap:40px;overflow-x:auto;padding:0 16px 4px;scrollbar-width:none;justify-content:flex-start;margin-bottom:24px}
@media(min-width:1000px){.tab-list{justify-content:center}}
.tab{position:relative;background:none;border:0;padding:5.6px 0;font:400 14.1px/21.15px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--brown);white-space:nowrap;cursor:pointer}
.tab::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:#222;transform:scaleX(0);transition:transform .3s ease}
.tab.on::after{transform:scaleX(1)}

.rail{display:grid;grid-auto-flow:column;grid-auto-columns:63.4%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding:16px;scrollbar-width:none}
.rail>*{scroll-snap-align:start}
@media(min-width:768px){.rail{grid-auto-columns:46%}}
@media(min-width:992px){.rail{grid-auto-columns:calc((100% - 3 * 10px) / 4)}}
@media(min-width:1200px){.rail{grid-auto-columns:calc((100% - 4 * 10px) / 5)}}
.rail::-webkit-scrollbar,.tab-list::-webkit-scrollbar{display:none}
.rail-wrap{position:relative}
.rail-arrow{position:absolute;top:calc(50% - 40px);z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:#333;box-shadow:0 2px 10px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .25s}
.rail-arrow.prev{inset-inline-start:10px}.rail-arrow.next{inset-inline-end:10px}
.rail-arrow.prev svg,.lang-ar .rail-arrow.next svg{transform:scaleX(-1)}.lang-ar .rail-arrow.prev svg{transform:none}
.rail-wrap:hover .rail-arrow:not(:disabled),.rail-arrow:focus-visible{opacity:1}
.rail-arrow:disabled{pointer-events:none}
@media(hover:none){.rail-arrow{display:none}}

/* product card */
.card{display:flex;flex-direction:column;text-align:center;min-width:0}
.card-img{position:relative;display:block;aspect-ratio:1;background:#fafafa;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:contain}
.card-img .alt{position:absolute;inset:0;opacity:0;transition:opacity .3s;background:#fafafa}
@media(hover:hover){.card:hover .card-img .alt{opacity:1}}
.badge{position:absolute;top:8px;inset-inline-start:0;z-index:1;background:var(--red);color:#fff;font:100 11px/16.5px var(--body);letter-spacing:.2em;padding:3px 8px;text-transform:uppercase;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.badge.inline{position:static;display:inline-block;vertical-align:middle}
.card-body{text-decoration:none;padding:16px 8px 20px}
.card-brand{font:100 10px/12px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brown);margin:0 0 6px}
.card-title{font:100 11px/14.3px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brown);margin:0 0 8px}
.card-price{font:400 9.6px/12.48px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#888;margin:0}
.card-price s,.pprice s{color:#c5312d;margin-inline-start:6px}.card-price s{font-weight:300;line-height:14.4px;opacity:.6;text-transform:none}
.card-media{position:relative}
/* quick add: a plus that springs up over the photo on hover (as on the live store) */
.card-add{position:absolute;bottom:10px;inset-inline-end:10px;z-index:3;width:35px;height:35px;border:0;border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;opacity:0;transform:translateY(12px);transition:opacity .28s,transform 2s cubic-bezier(.34,1.4,.64,1)}
.card-add::before{content:"";width:13px;height:13px;background:url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%232c1f0e' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;transition:transform .32s cubic-bezier(.34,1.56,.64,1)}
.card-add:hover::before{transform:rotate(90deg)}
.card:hover .card-add,.card-add:focus-visible{opacity:1;transform:none}
@media(hover:none){.card-add{opacity:1;transform:none;background:rgba(255,255,255,.8)}}

.card-sold{margin:auto 0 0;font-size:11px;color:var(--muted)}

/* banner & cards */
.banner{margin:16px 0}.banner img{width:100%;height:auto}
.cards{background:#f0efee;padding:40px 60px 70px;margin:0}
@media(max-width:991px){.cards{padding:32px 20px 50px}}
.cards-grid{display:grid;gap:0 40px;max-width:1700px;margin:0 auto}
@media(min-width:761px){.cards-grid{grid-template-columns:repeat(2,1fr)}}
.pcard{text-align:center}.pcard img{width:100%;aspect-ratio:1;object-fit:cover}
.cards-feature .pcard img{width:300px;height:360px;aspect-ratio:auto;object-fit:contain;margin:0 auto}
.pcard h3{font:400 17.6px/26.4px var(--sans);letter-spacing:.2em;text-transform:uppercase;margin:28px 0 30px;color:#1c1c1c}
.pcard p{margin:0 0 18px;font:400 14px/1.65 var(--body);letter-spacing:.025em;color:#1c1c1c}
.cards .btn-gold{font:500 14px/21px var(--body);letter-spacing:normal;padding:13px 32px;margin-bottom:25px}
.cards-brand{background:#f0efee;padding:20px 60px 70px}.cards-brand .cards-grid{grid-template-columns:repeat(2,1fr);gap:0 24px}

@media(min-width:1000px){.cards-brand .cards-grid{grid-template-columns:repeat(4,1fr)}}
.cards-brand .pcard img{aspect-ratio:2/3}
@media(min-width:992px){.cards-brand .pcard img{height:480px;aspect-ratio:auto}}
/* below 992px the live brand cards are one sideways-scrolling row: 176px cards 70px apart on phones, 346px at 768 */
@media(max-width:991px){.cards-brand{padding:20px 0 30px 20px}.cards-brand .cards-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:346px;gap:0 24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.cards-brand .pcard{scroll-snap-align:start}
.cards.cards-brand .pcard h3{font-size:14px;line-height:21px;letter-spacing:.14em}.cards.cards-brand .pcard p{font-size:11px;line-height:16.5px;margin:10px 0}.cards.cards-brand .btn-gold{font-size:8.85px;line-height:13.275px;padding:10px 20px}}
@media(max-width:767px){.cards-brand .cards-grid{grid-auto-columns:176px;gap:0 70px}}
.cards-brand .pcard h3{font:400 17.6px/26.4px var(--body);letter-spacing:.22em}.cards-brand .pcard p{font-weight:100;letter-spacing:.02em}.cards-brand .btn-gold{padding:13px 28px}
/* "Jewelry for every occasion": tall tile, two stacked, tall tile; titles in gold pills (as on the live store) */
.cards-tile{background:#fff}.cards-tile .cards-grid{--tw:calc(64vw + 33px);grid-template-columns:minmax(0,var(--tw));justify-content:center;gap:40px}
.cards-tile .tile{aspect-ratio:auto;height:280px}
/* live: one column on phones, then 3 columns (tall, two stacked, tall) whose width and height change by screen size */
@media(min-width:768px){.cards-tile .cards-grid{--tw:157px;--th:299.5px;grid-template-columns:repeat(3,var(--tw));grid-auto-rows:var(--th)}.cards-tile .tile{height:auto}
.cards-tile .tile:nth-child(1){grid-column:1;grid-row:1/3}.cards-tile .tile:nth-child(2){grid-column:2;grid-row:1}.cards-tile .tile:nth-child(3){grid-column:2;grid-row:2}.cards-tile .tile:nth-child(4){grid-column:3;grid-row:1/3}}
@media(min-width:992px){.cards-tile .cards-grid{--tw:21.6vw;--th:296px}}
@media(min-width:1200px){.cards-tile .cards-grid{--tw:calc(26vw - 27px);--th:290px}}
.tile{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;text-decoration:none}
.tile img{width:100%;height:100%;object-fit:cover}
.tile span{position:absolute;left:50%;bottom:33px;transform:translateX(-50%);max-width:calc(100% - 24px);padding:13px 22px;border-radius:50px;background:var(--gold);color:#000;font:500 14px/1 var(--body);letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.reviews{padding:24px 0}.reviews .sec-title{padding:0 16px;text-align:center;font-size:18px;line-height:27px;letter-spacing:.14em}
@media(max-width:767px){.reviews .sec-title{font-size:16px;line-height:24px}}

.reviews-rail{grid-auto-columns:calc(100% / 1.6);gap:14px}
@media(min-width:481px){.reviews-rail{grid-auto-columns:calc(100% / 2.5)}}
@media(min-width:769px){.reviews-rail{grid-auto-columns:calc((100% - 2 * 14px) / 3)}}
@media(min-width:1025px){.reviews-rail{grid-auto-columns:calc((100% - 3 * 14px) / 4)}}
@media(min-width:1401px){.reviews-rail{grid-auto-columns:calc(100% / 5.05)}}
/* review row: arrows stay visible on phones (no hover), dots sit over the bottom of the videos */
.reviews .rail-arrow{top:calc(50% - 19px)}
@media(hover:none),(max-width:760px){.reviews .rail-arrow{display:flex;opacity:1;width:32px;height:32px;top:calc(50% - 16px)}.reviews .rail-arrow:disabled{opacity:0}}
.rail-dots{position:absolute;bottom:22px;inset-inline-start:16px;width:calc((100% - 32px) / 1.6);display:flex;justify-content:center;pointer-events:none;z-index:2}
@media(min-width:481px){.rail-dots{width:calc((100% - 32px) / 2.5)}}
@media(min-width:769px){.rail-dots{width:calc((100% - 32px - 28px) / 3)}}
/* 24px tap area, 8px dot */
.rail-dots button{pointer-events:auto;width:16px;height:24px;padding:0;border:0;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center}
.rail-dots button::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;opacity:.7;box-shadow:0 0 3px rgba(0,0,0,.35);transition:transform .2s,opacity .2s}
.rail-dots button.on::before{opacity:1;transform:scale(1.4)}
@media(min-width:1025px){.rail-dots{display:none}}
.vs-card{display:block;text-decoration:none;color:#fff}
.vs-thumb{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;border-radius:14px;background:#111}
.vs-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.vs-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(0,0,0,0);transition:background .3s ease}
.vs-overlay>*{opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease}
.vs-overlay svg{width:44px;height:44px}
.vs-watch{font-size:13px;font-weight:500;letter-spacing:.03em}.vs-label{font-size:13px;font-weight:600}
.vs-card:hover .vs-media,.vs-card:focus-visible .vs-media{transform:scale(1.04)}
.vs-card:hover .vs-overlay,.vs-card:focus-visible .vs-overlay{background:rgba(0,0,0,.52)}
.vs-card:hover .vs-overlay>*,.vs-card:focus-visible .vs-overlay>*{opacity:1;transform:none}

/* listing */
.page-title{font:400 22px/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--brown);margin:28px 0 12px}
.page-band{background:#57443d;padding:48px 20px 52px;text-align:center}.page-band h1{margin:0;font:400 32px/48px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#fff}
.lang-ar .page-band h1{letter-spacing:0}
.lang-ar .page-title{letter-spacing:0}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 12px}
@media(min-width:761px){.grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1200px){.grid{grid-template-columns:repeat(4,1fr)}}
.empty{padding:40px 0;text-align:center;color:var(--muted)}

/* product page */
.product{display:grid;gap:20px;padding-top:16px}@media(min-width:900px){.product{grid-template-columns:1fr 1fr;gap:48px;padding-top:32px}}
.gallery-main{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:#fff;border-radius:4px}
.gallery-main img{padding:20px;background:#fff;border-radius:4px;height:392px}
@media(min-width:992px){.gallery{display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:start}.gallery-stage{grid-column:2;grid-row:1}.gallery .thumbs{grid-column:1;grid-row:1;flex-direction:column;margin:0}.gallery-main img{padding:50px;height:480px}}
.gallery-main img{flex:0 0 100%;scroll-snap-align:center;aspect-ratio:1;object-fit:contain;cursor:zoom-in}
.thumbs{display:flex;gap:8px;margin-top:8px;overflow-x:auto}.thumbs button{border:1px solid transparent;padding:0;background:#fafafa;cursor:pointer}.thumbs button.on{border-color:var(--brown)}
.thumbs img{width:72px;height:72px;padding:10px;object-fit:contain}
.thumbs button{border-radius:4px}.thumbs button.on{border-color:#57443d}
.pinfo .card-brand{font:400 9.6px/14.4px var(--sans);letter-spacing:.2em;padding-bottom:15px;margin:0}
.ptitle{font:400 17.6px/22.88px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brown);margin:0 0 20px}
@media(max-width:767px){.ptitle{margin-bottom:16px}}
.pprice{font:100 15px/22.5px var(--sans);letter-spacing:.04em;color:#888;padding:7px 0;margin:0}.pprice.sale{color:#ba463a}.pinfo .pprice s{font:400 12px/18px Poppins,sans-serif;color:#8d99a6;margin-inline-start:4px}
@media(min-width:992px){.pinfo{max-width:509px}}
.buy{display:flex;margin:16px 0 10px}.buy .btn-dark{flex:1;font:600 13px/19.5px var(--body);letter-spacing:.14em;padding:16px 32px;border-radius:50px}
.qty{display:inline-flex;border:1px solid var(--line);border-radius:30px;overflow:hidden;align-items:stretch}
.qty button{background:none;border:0;width:38px;font-size:18px;cursor:pointer}.qty input{width:40px;border:0;text-align:center;-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.pdesc{margin:13px 0;border-top:1px solid #e8e4de;padding:13px 0;color:#1a1a1a;font-size:15px;line-height:22.5px}

/* cart / checkout / order */
.cart-lines{list-style:none;padding:0;margin:0}.cart-line{display:grid;grid-template-columns:80px 1fr auto;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);align-items:center}
.cart-line img{width:80px;height:80px;object-fit:contain;background:#fafafa}.cart-line p{margin:2px 0 8px}.cart-line a{text-decoration:none;font:13px var(--sans);letter-spacing:.05em;text-transform:uppercase}
.cart-line-end{text-align:end;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.cart-total{padding:20px 0;display:grid;gap:12px;text-align:center}.cart-total p{display:flex;justify-content:space-between;margin:0;font-size:16px}
.empty-cart{text-align:center;padding:40px 0}
.checkout-grid{display:grid;gap:24px}@media(min-width:900px){.checkout-grid{grid-template-columns:1.3fr 1fr;gap:48px}}
.h-sub{font:500 14px var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--brown);margin:20px 0 10px}
.field{display:block;margin-bottom:14px}.field span{display:block;font-size:13px;margin-bottom:4px}
.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid #cfc8c2;border-radius:6px;font-size:16px;background:#fff}
.field small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.err{display:block;color:var(--red);font-style:normal;font-size:13px;margin-top:4px}.err:empty{display:none}
.err-box{background:#fbeceb;color:var(--red);padding:12px;border-radius:6px}
.pay-opt{display:flex;gap:10px;border:1px solid var(--brown);border-radius:6px;padding:12px}.pay-opt small{display:block;color:var(--muted)}
.summary{background:var(--beige);padding:16px;border-radius:8px;align-self:start}
.lines{list-style:none;padding:0;margin:0 0 10px}.lines li{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:6px 0;font-size:14px}
.lines li img{width:48px;height:48px;object-fit:contain;background:#fff}.lines li span:first-of-type{flex:1}
.row{display:flex;justify-content:space-between;margin:6px 0}.row.total{font-size:18px;border-top:1px solid var(--line);padding-top:10px}
.summary .btn-dark{margin-top:14px}
.notice{background:var(--beige);padding:4px 16px 12px;border-radius:8px;margin-top:20px}
.order-no{font-size:18px}
.steps{display:flex;list-style:none;padding:0;margin:16px 0;gap:4px;counter-reset:s}.steps li{flex:1;text-align:center;font-size:11px;padding-top:28px;position:relative;color:var(--muted)}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:50%;transform:translateX(-50%);width:22px;height:22px;border-radius:50%;background:var(--line);line-height:22px;color:#fff;font-size:11px}
.steps li.done{color:var(--brown-d)}.steps li.done::before{background:var(--brown)}
.status{padding:2px 10px;border-radius:12px;background:var(--beige)}
.track-form{max-width:420px}

/* content */
.content{padding-bottom:40px}.content h2{font:500 16px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brown);margin:28px 0 8px}
.faq-q{font:600 15px var(--body);margin:18px 0 4px}
.branches{display:grid;gap:14px}@media(min-width:761px){.branches{grid-template-columns:1fr 1fr}}
.branch{border:1px solid var(--line);border-radius:8px;padding:4px 16px}.branch h3{font:500 15px var(--sans);letter-spacing:.1em;text-transform:uppercase}
.contact-box{background:var(--beige);padding:4px 16px;border-radius:8px;margin:20px 0}

/* footer */
.footer{background:var(--brown);color:rgba(255,255,255,.75);padding:64px 0}
@media(max-width:767px){.footer{padding:15px 0 45px}}
/* live footer: logo column, then 170px columns 40px apart; headings Instrument Sans 10px/15px 300 .22em; links Nunito 13px/19.5px 300 .04em at .65 white */
.footer-in{display:grid;grid-template-columns:1fr;gap:24px 40px;padding:0 25px}
@media(min-width:768px){.footer-in{grid-template-columns:310px repeat(auto-fill,170px)}}
.f-brand{display:flex;flex-direction:column;align-items:center}
.f-logo{width:196px;height:140px;object-fit:contain;padding-top:20px;margin-bottom:28px}
.copy .flag{display:inline-block;vertical-align:-2px;margin-inline-end:8px}
/* phones: social icons move below the columns, centred */
.footer .socials-bottom{display:none}
@media(max-width:767px){.f-brand .socials{display:none}.footer .socials-bottom{display:flex;justify-content:center;margin:40px 0 50px}.copy{gap:14px}}
.f-col a,.f-col p{display:block;color:rgba(255,255,255,.65);text-decoration:none;font:300 13px/19.5px var(--body);letter-spacing:.04em;margin:0 0 12px}
.f-col a:hover{color:#f9f7f4}
.f-h{font:300 10px/15px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#fff;padding:0 0 5px;margin:0 0 18px}
.lang-ar .f-h{font-size:12px;letter-spacing:0}
.f-col:not(.f-brand){padding-top:24px}
.socials{display:flex;gap:12px;margin:24px 0 30px}.socials a{display:inline-flex;width:40px;height:40px;margin:0;border-radius:50%;align-items:center;justify-content:center;color:#999}
.socials a:hover{color:#fff}
.copy{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:0 15px;font:400 12px/18px var(--body);color:rgba(255,255,255,.5);margin:0}
.copy-note{letter-spacing:.17em}.copy-c{letter-spacing:.06em;text-align:center}
@media(max-width:767px){.copy{grid-template-columns:1fr;text-align:center}}
.toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%,20px);background:var(--brown-d);color:#fff;padding:10px 18px;border-radius:24px;font-size:14px;opacity:0;transition:.25s;pointer-events:none;z-index:70}
.toast.on{opacity:1;transform:translate(-50%,0)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* product gallery: arrows + enlarge button */
.gallery-stage{position:relative}
.gallery-stage:hover .rail-arrow:not(:disabled){opacity:1}
.g-zoom{position:absolute;bottom:10px;inset-inline-end:10px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.9);color:#333;box-shadow:0 2px 10px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;cursor:pointer}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(15,12,10,.94);display:flex;align-items:center;justify-content:center;touch-action:none}
.lb-stage{width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.lb-stage img{max-width:min(92vw,1100px);max-height:86vh;width:auto;height:auto;object-fit:contain;transition:transform .25s ease;user-select:none;-webkit-user-drag:none;background:#fff}
.lb-stage.zoomed{cursor:grab}.lb-stage.zoomed img{transition:none}
.lb-close,.lb-nav{position:absolute;z-index:2;border:0;border-radius:50%;width:46px;height:46px;background:rgba(0,0,0,.55);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.lb-close{top:14px;inset-inline-end:14px}
.lb-nav{top:calc(50% - 23px)}.lb-prev{inset-inline-start:14px}.lb-next{inset-inline-end:14px}
.lb-nav svg{width:22px;height:22px}.lb-prev svg,.lang-ar .lb-next svg{transform:scaleX(-1)}.lang-ar .lb-prev svg{transform:none}
.lb-close:hover,.lb-nav:hover{background:rgba(0,0,0,.8)}
.lb-count{position:absolute;z-index:2;bottom:14px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.55);color:#fff;font-size:13px;margin:0;padding:3px 10px;border-radius:12px}
/* "Buying a gift?" block */
.gift{max-width:1100px;margin:48px auto 0;padding:0 16px 24px;display:grid;gap:28px;align-items:center}
@media(min-width:900px){.gift{grid-template-columns:auto 1fr;gap:40px}}
.gift-images{position:relative;width:min(100%,450px);padding-bottom:60px;padding-inline-end:100px;margin:0 auto}
.gift-main{width:100%;aspect-ratio:1;object-fit:cover}
.gift-over{position:absolute;bottom:0;inset-inline-end:0;width:65%;aspect-ratio:1;object-fit:cover;z-index:2;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.gift-text h2{font:400 20px/24px Montserrat,var(--sans);letter-spacing:1px;color:var(--brown);text-transform:uppercase;margin:0 0 24px;opacity:.9}
@media(max-width:991px){.gift-text h2{font-size:16px;line-height:19.2px;letter-spacing:.8px;margin-bottom:16px}}
.gift-text p{font:300 14px/23.8px var(--body);color:#888;margin:0}
@media(max-width:991px){.gift-text p{font-size:15px;line-height:25.5px}}
/* Chat button: hover (or tap) shows Instagram and WhatsApp */
.chat{position:fixed;bottom:18px;inset-inline-end:18px;z-index:50;display:flex;flex-direction:column;align-items:center;gap:8px}
.chat-links{display:flex;flex-direction:column;gap:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .2s,transform .2s,visibility .2s}
.chat:hover .chat-links,.chat:focus-within .chat-links,.chat.open .chat-links{opacity:1;visibility:visible;transform:none}
.chat-links a{display:block;width:50px;height:50px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.2);transition:transform .15s}
.chat-links a:hover{transform:scale(1.08)}
.chat-wa{background:#25d366;color:#fff;display:flex!important;align-items:center;justify-content:center}
.chat-btn{position:relative;display:flex;align-items:center;gap:0;height:60px;padding:0 22px 0 0;border:0;border-radius:16px;background:#000;color:#fff;font:600 24px/32px Nunito,system-ui,sans-serif;box-shadow:0 0 5px rgba(0,0,0,.15);cursor:pointer}
.chat-badge{position:absolute;top:-8px;inset-inline-end:-6px;width:22px;height:22px;border-radius:50%;background:#ee2f53;color:#fff;font-size:12px;font-weight:700;line-height:22px;text-align:center}

/* slide-in cart (left in English, right in Arabic) */
.cart-panel{width:415px;max-width:100vw;display:flex;flex-direction:column;box-shadow:-12px 0 60px rgba(15,23,42,.22)}
.cart-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:73px;padding:18px 16px;border-bottom:1px solid #e8e4de;font:500 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--brown-d)}
.lang-ar .cart-head{letter-spacing:0;font-size:14px}
.cart-head span{font:600 13px/15.6px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#57443d}
@media(max-width:767px){.cart-head{padding:16px 14px}.cart-head span{font-size:15px;line-height:18px}}
.cart-back{background:none;border:0;padding:6px;width:36px;height:36px;border-radius:50%;color:#2c1f0e;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cart-back:hover{background:#f9f7f4}
@media(max-width:767px){.cart-back{width:44px;height:44px}}
/* empty cart: 82px white badge with the Font Awesome basket (32px glyph), Cormorant Garamond title, light grey text */
.sc-empty{padding:64px 32px;text-align:center}
.sc-empty-icon{display:flex;width:82px;height:82px;border-radius:50%;background:#fff;align-items:center;justify-content:center;color:#57443d;box-shadow:0 8px 24px rgba(87,68,61,.12);margin:0 auto 14px}
.sc-empty-title{font:700 18px/27px "Cormorant Garamond",serif;letter-spacing:.04em;color:#1a1a1a;margin:0 0 14px}
.sc-empty-desc{font:300 13.5px/21.6px var(--body);color:#888;margin:0}

.cart-body{flex:1;overflow:auto;padding:0 16px;display:flex;flex-direction:column}.cart-body .cart-lines{flex:1}.cart-body .empty-cart{margin:auto 0}
.cart-foot{position:sticky;bottom:0;background:#fff;border-top:1px solid #eee;padding:16px 0;display:grid;gap:10px;text-align:center}
.cart-foot p{display:flex;justify-content:space-between;margin:0;font-size:15px}
/* cart lines, as on the live store: photo | name, price, quantity box + gold "Remove" pill + note icon */
.cart-lines .cart-line{display:grid;grid-template-columns:80px 1fr;column-gap:20px;row-gap:6px;padding:14px 0;border-bottom:1px solid #e8e4de;align-items:start}
.cart-lines .cl-img{grid-column:1;grid-row:1/span 3;align-self:center;width:80px;height:80px;display:block}
.cart-lines .cl-img img{width:80px;height:80px;object-fit:contain;background:#fff}
.cart-lines .cl-name{grid-column:2;font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text);text-decoration:none;align-self:end}
.lang-ar .cart-lines .cl-name{letter-spacing:0;font-size:13px}
.cart-lines .cl-price{grid-column:2;margin:0;font:400 13px var(--sans);color:#888}
.cart-lines .cl-line{color:var(--brown)}
.cart-lines .cl-row{grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.cart-lines .qty{border:1px solid #e8e4de;border-radius:0;height:32px}
.cart-lines .qty button{width:30px;font-size:14px;color:#2c1f0e}
.cart-lines .qty input{width:24px;font-size:13px;color:#2c1f0e;background:transparent}
.cl-actions{display:inline-flex;align-items:center}
.cl-remove{background:var(--gold);border:0;border-radius:50px;padding:11px 22px;font:500 11px/1 var(--body);letter-spacing:.04em;color:#2c1f0e;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s}
.cl-remove:hover{background:var(--brown);color:#fff}
.cl-note-btn{background:none;border:0;padding:6px;margin-inline-start:4px;color:var(--brown);cursor:pointer;display:flex}
.cl-note-btn[aria-expanded="true"]{color:var(--gold)}
.cl-note{grid-column:1/-1}
.cl-note textarea,.order-note textarea{width:100%;font:400 13px var(--body);color:var(--text);background:#fff;border:1px solid #e8e4de;border-radius:0;padding:10px 12px;resize:vertical;transition:border-color .25s}
.cl-note textarea:focus,.order-note textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(221,190,113,.18);outline:none}
.cl-note textarea::placeholder,.order-note textarea::placeholder{color:#999;font-size:12px;letter-spacing:.04em}
.order-note{display:block;text-align:start}
.order-note span{display:block;font:500 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--brown);margin-bottom:6px}
.lang-ar .order-note span{letter-spacing:0;font-size:13px}
.cart-foot p,.cart-total p{border-top:1px solid #e8e4de;border-bottom:1px solid #e8e4de;padding:10px 0;color:var(--brown)}
.cart-foot p span,.cart-total p span{font-size:13px}
.cart-foot p strong,.cart-total p strong{font:300 16px var(--sans);color:var(--brown)}
.line-note{display:block;color:#888;font-size:12px;font-style:italic}
/* desktop product picture box keeps the live 480px height (after the base gallery rule) */
.gallery-main img{aspect-ratio:auto}
/* live collection pages span the full width with 20px sides */
.wrap.listing{max-width:none;padding:0 20px}

/* collection page (live values) */
.grid .card-price{color:#57443d}
.grid{grid-template-columns:repeat(2,1fr);gap:24px 12px}
@media(min-width:761px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.grid{grid-template-columns:repeat(4,1fr);gap:40px 32px}}
@media(max-width:991px){.page-band h1{font-size:23.04px;line-height:34.56px}}
@media(max-width:767px){.page-band h1{font-size:22.4px;line-height:33.6px}}
/* product page (live values): gallery column 744px + info 509px on desktop; 27px side margins for the picture below 992px */
@media(min-width:992px){.wrap.product{max-width:none;padding:32px 16px 0;grid-template-columns:minmax(0,744px) 509px;gap:40px}}
@media(max-width:991px){.gallery{padding:0 27px}}
.thumbs button{border:0;padding:0;background:none}.thumbs img{border:1px solid transparent;border-radius:4px}.thumbs button.on img{border-color:#57443d}
.socials svg{width:18px;height:18px}

/* shopper accounts (live login page: 328px form, 43px fields, brown pill button, 12px uppercase links) */
.acc{padding:40px 16px 60px}
.acc-form{width:328px;max-width:100%;margin:0 auto}
.acc-wide{max-width:760px;margin:0 auto}
.acc-title{font:400 14px/21px var(--body);letter-spacing:.19em;text-transform:uppercase;color:#36414c;margin:0 0 28px}
.lang-ar .acc-title{letter-spacing:0;font-size:16px}
.acc-field{display:block;margin-bottom:10px}
.acc-field input{width:100%;height:43px;padding:10px 16px;border:1px solid #e8e4de;border-radius:4px;font:400 14px var(--body);color:#57443d;background:#fff}
.acc-field input:focus{border-color:#ddbe71;outline:none;box-shadow:0 0 0 3px rgba(201,168,76,.12)}
.acc-field input::placeholder{color:#888;font-size:13px}
.acc-pw{position:relative;display:block}.acc-pw input{padding-inline-end:44px}
.acc-eye{position:absolute;top:50%;inset-inline-end:10px;transform:translateY(-50%);background:none;border:0;padding:4px;color:#8d99a6;cursor:pointer;display:flex}
.acc-btn{display:block;width:100%;margin:20px 0 0;padding:13px 32px;border:0;border-radius:50px;background:#57443d;color:#fff;font:600 10px/15px var(--body);letter-spacing:.18em;text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer}
.acc-btn.ghost{background:transparent;color:#1a1a1a;border:1px solid #e8e4de;margin-top:12px}
.acc-links{display:flex;flex-direction:column;align-items:center;gap:20px;margin:40px 0 0}
.acc-links a{font:700 12px/16px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#57443d;text-decoration:none;text-align:center}
.lang-ar .acc-links a{letter-spacing:0}
.acc-text{font:300 14px/22px var(--body);color:#555}
.acc-nav{display:flex;gap:24px;align-items:center;border-bottom:1px solid #e8e4de;margin:0 0 28px}
.acc-nav a{padding:10px 0;font:500 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#888;text-decoration:none;border-bottom:1px solid transparent;margin-bottom:-1px}
.acc-nav a.on{color:#57443d;border-color:#57443d}
.acc-nav form{margin-inline-start:auto}
.acc-wide .acc-form{margin:0;width:100%;max-width:420px}
.acc-email{color:#888;font-size:14px;margin:0 0 16px}
.acc-sub{font:500 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#57443d;margin:28px 0 12px}
.notice-ok{background:#e7f4ea;color:#1e6b31;padding:10px 14px;border-radius:4px}
.acc-orders{width:100%;border-collapse:collapse;font-size:14px}.acc-orders th,.acc-orders td{padding:12px 8px;border-bottom:1px solid #e8e4de;text-align:start}
.acc-orders th{font:500 10px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#888}
.cart-back svg{width:16px;height:16px}.cart-back svg path{stroke-width:3}
@media(min-width:768px){.copy{padding:0 50px}}
@media(max-width:999px){.icon-btn.only-desktop{display:none}}
/* live login page details: label 14px #36414c (LOGIN is uppercase .19em, the other forms are normal case),
   30px gaps, SMS outline button Nunito 11px 500 .15em, grey back links 12px 700 */
.acc-title{letter-spacing:normal;text-transform:none;margin-bottom:30px}
.acc-title.upper{letter-spacing:.19em;text-transform:uppercase}
.acc .acc-btn{margin-top:30px}
.acc .acc-btn.ghost{margin-top:30px;padding:12px 28px;font:500 11px/17px var(--body);letter-spacing:.15em;color:#1a1a1a;border:1px solid #e8e4de;background:transparent}
.acc-back{text-align:center;margin:40px 0 0}.acc-back a{font:700 12px/16px var(--body);color:#8d99a6;text-decoration:none}

.pay-badges{display:flex;gap:6px;justify-content:flex-end}.pay-badges svg{border-radius:4px;display:block}
@media(max-width:767px){.pay-badges{justify-content:center}}

.acc{padding-top:20px}.acc-form:has(.upper){padding-top:10px}
.acc-card{border:1px solid #e6e6e6;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.06);padding:0 15px 15px}
.acc-form{width:360px}.acc-card .acc-title{margin:0 -15px 15px;padding:12px 15px;border-bottom:1px solid #e6e6e6}
.acc .acc-links,.acc .acc-back{margin-top:28px}

/* collection filters (live values) */
.lbar{display:flex;align-items:stretch;height:50px;border-bottom:1px solid #ccc;margin:0 -20px 45px}
.lbar-grid{align-items:center;gap:2px;padding:0 20px;border-inline-end:1px solid #ccc}
.grid-btn{background:none;border:0;padding:4px 5px;color:#ccc;cursor:pointer;display:flex}.grid-btn svg{width:17px;height:17px}
.listing[data-d="3"] [data-grid="3"],.listing[data-d="4"] [data-grid="4"],.listing[data-d="6"] [data-grid="6"],.listing[data-m="1"] [data-mgrid="1"],.listing[data-m="2"] [data-mgrid="2"]{color:#57443d}
.lbar-sort{position:relative;margin-inline-start:auto;align-items:center;padding:0 35px 0 20px;border-inline-start:1px solid #ccc}
.lbar-sort-btn{background:none;border:0;padding:1px 6px;font:300 12px/18px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#57443d;cursor:pointer;display:flex;align-items:center;gap:12px}
.lbar-sort-btn::after{content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-4px;transition:transform .28s cubic-bezier(.4,0,.2,1)}
.lbar-sort-btn[aria-expanded="true"]::after{transform:rotate(-135deg);margin-top:3px}
.sort-dd{position:absolute;top:43px;inset-inline-end:20px;width:190px;background:#fff;border:1px solid #e8e4de;box-shadow:0 8px 24px rgba(0,0,0,.1);padding:8px 0;z-index:200}
.dsort-opt{display:block;padding:10px 20px;font:12px/18px var(--body);letter-spacing:.08em;text-transform:uppercase;color:#888;text-decoration:none;text-align:start}
.dsort-opt:hover{background:#f9f7f4;color:#57443d}
.ftags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 21px;padding-top:15px}.ftags:empty{display:none}
.ftag{display:inline-flex;align-items:center;gap:5px;padding:6px 8px 6px 12px;border:1px solid #e8e4de;border-radius:2px;font:300 10px/15px var(--body);letter-spacing:.12em;text-transform:uppercase;color:#888;text-decoration:none}
.ftag-x{font:18px/18px var(--body);padding:0 2px;letter-spacing:0}
.ftag-clear{padding:7px 15px;border-radius:50px;background:#ddbe71;color:#000;font:14px/21px var(--body);text-decoration:none}
.listing-grid{display:block}@media(min-width:1000px){.listing-grid{display:grid;grid-template-columns:265px 1fr;gap:56px;align-items:start}}
.side{flex-direction:column;position:sticky;top:80px;max-height:calc(100vh - 90px);overflow:auto}
.fg{border-bottom:1px solid #e8e4de;padding:0 19px;max-height:400px;overflow:auto}.fg:last-child{border-bottom:0}
.fg-head{display:flex;width:100%;justify-content:space-between;align-items:center;background:none;border:0;padding:20px 0;font:100 10px/10px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#57443d;cursor:pointer;text-align:start}
.fg-head::after{content:"";width:6px;height:6px;border-right:1px solid #57443d;border-bottom:1px solid #57443d;transform:rotate(-135deg);margin-top:3px;transition:transform .28s cubic-bezier(.4,0,.2,1)}
.fg.collapsed .fg-head::after{transform:rotate(45deg);margin-top:-3px}
.fg-body{padding:0 0 12px}.fg.collapsed .fg-body{display:none}
.lang-ar .fg-head{letter-spacing:0;font-size:13px;font-weight:400}
.fo-list{padding-inline-start:16px}
.fo{position:relative;display:block;padding:3px 0;margin:0 0 6px;font:11.5px/16.1px var(--body);letter-spacing:.02em;text-transform:uppercase;color:#888;text-decoration:none}
.fo:hover{color:#57443d;font-weight:500}
.fo.on{color:#57443d;font-weight:700}.fo.on::before{content:"•";position:absolute;inset-inline-start:-11px;top:3px}
.stock-sw{display:flex;align-items:center;gap:8px;padding:4px 0 4px 4px;font:500 11px/16.5px var(--body);letter-spacing:.12em;text-transform:uppercase;color:#888;text-decoration:none}
.stock-slider{position:relative;width:40px;height:20px;border-radius:999px;background:#c7ced6;flex:none;transition:background .2s}
.stock-slider::after{content:"";position:absolute;top:2px;inset-inline-start:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .2s}
.stock-sw.on .stock-slider{background:#57443d}.stock-sw.on .stock-slider::after{transform:translateX(20px)}.lang-ar .stock-sw.on .stock-slider::after{transform:translateX(-20px)}
.pr-slider{position:relative;height:26px;margin-bottom:8px}
.pr-track,.pr-fill{position:absolute;top:12px;height:3px;border-radius:2px;background:#e8e4de;left:0;right:0}.pr-fill{background:#57443d}
.pr-slider input{position:absolute;left:0;top:0;width:100%;height:26px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}
.pr-slider input::-webkit-slider-runnable-track{background:none;height:26px}
.pr-slider input::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:14px;height:14px;border-radius:50%;background:#57443d;border:0;margin-top:6px;cursor:pointer}
.pr-slider input::-moz-range-thumb{pointer-events:auto;width:14px;height:14px;border-radius:50%;background:#57443d;border:0;cursor:pointer}
.pr-nums{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pr-nums input{width:94px;min-width:0;padding:10px 16px;border:1px solid #e8e4de;border-radius:0;font:14px/21px var(--body);color:#57443d;text-align:center;-moz-appearance:textfield}
.pr-nums input::-webkit-outer-spin-button,.pr-nums input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pr-nums span{font-size:10.5px;color:#6c757d}
@media(min-width:1000px){.listing[data-d="3"] .grid{grid-template-columns:repeat(3,1fr)}.listing[data-d="6"] .grid{grid-template-columns:repeat(6,1fr);gap:40px 20px}}
@media(max-width:999px){
  .lbar{height:42px;border-top:1px solid #ebecf1;border-bottom:1px solid #ebecf1;margin-bottom:16px}
  .lbar-m{flex:1;background:none;border:0;border-inline-end:1px solid #ebecf1;font:12px/18px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#57443d;cursor:pointer}
  .lbar-mgrid{display:flex;width:89px}.lbar-mgrid .grid-btn{width:44px;justify-content:center;align-items:center}.lbar-mgrid svg{width:14px;height:14px}
  .ftags{padding-top:0;margin-inline-start:-15px}
  .listing[data-m="1"] .grid{grid-template-columns:1fr}
}
.bsheet{background:rgba(0,0,0,.45);z-index:1060}
.bsheet-panel{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:16px 16px 0 0;box-shadow:0 -4px 40px rgba(0,0,0,.1);display:flex;flex-direction:column;max-height:88vh;animation:sheet-up .32s cubic-bezier(.4,0,.2,1)}
.bsheet-panel.tall{height:88vh}
@keyframes sheet-up{from{transform:translateY(100%)}to{transform:none}}
.bs-handle{width:40px;height:4px;border-radius:2px;background:#e8e4de;margin:12px auto 0}
.bs-head{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;font:700 11px/16.5px var(--body);letter-spacing:.24em;text-transform:uppercase;color:#57443d}
#sort-sheet .bs-head{border-bottom:1px solid #e8e4de;padding:18px 24px}
.bs-x{background:none;border:0;padding:4px;color:#888;cursor:pointer;display:flex}.bs-x svg{width:16px;height:16px}
.bs-body{flex:1;overflow:auto;padding:0 16px}.bs-body .fg{max-height:none;overflow:visible}
.bs-foot{padding:12px 16px;border-top:1px solid #eee}
.bs-view{width:100%;padding:13px;border:0;border-radius:8px;background:#5c3d2e;color:#fff;font:14px/21px var(--body);letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.bs-list{padding:8px 0 24px}.sbs-opt{display:block;padding:13px 24px;font:14px/21px var(--body);color:#888;text-decoration:none}.sbs-opt.on{color:#57443d;font-weight:600}
.lang-ar .lbar-sort-btn,.lang-ar .lbar-m,.lang-ar .bs-head,.lang-ar .ftag,.lang-ar .fo,.lang-ar .stock-sw,.lang-ar .dsort-opt{letter-spacing:0}
/* header icons: live outline set, black, 44px apart on desktop */
.header-tools .icon-btn{color:#000}
@media(min-width:1000px){.header-tools .icon-btn{padding:8px 10px}}
.side .fg{flex:none}
.lbar-grid{padding:0 10px 0 20px}
.bs-body .pr-nums{gap:0}.bs-body .pr-nums input{flex:0 0 141px;width:141px}

/* phone menu (live drawer values) */
#drawer{background:rgba(0,0,0,.45)}
.drw{position:relative;width:min(75vw,360px);overflow:hidden}
.dp{position:absolute;inset:0;padding-top:70px;background:#fff;display:flex;flex-direction:column;transition:transform .34s cubic-bezier(.4,0,.2,1),visibility 0s linear .34s}
.dp[data-dp="root"]{z-index:1}.dp.pushed{transform:translateX(-28%)}
.dp-sub{z-index:2;transform:translateX(100%);visibility:hidden}.dp-sub.on{transform:none;visibility:visible;transition:transform .34s cubic-bezier(.4,0,.2,1)}
.lang-ar .dp.pushed{transform:translateX(28%)}.lang-ar .dp-sub{transform:translateX(-100%)}.lang-ar .dp-sub.on{transform:none}
.drw-head{display:flex;align-items:center;gap:4px;height:58px;min-height:58px;padding:0 18px;border-bottom:1px solid #e8e4de}
.drw-close{display:flex;align-items:center;justify-content:center;width:15px;height:15px;flex-shrink:0;margin-inline-start:auto;padding:0;background:none;border:0;color:#2c1f0e;cursor:pointer;transition:color .2s}
.drw-close:hover,.drw-back:hover{color:#ddbe71}
.drw-list{list-style:none;margin:0;padding:4px 0;overflow-y:auto;flex:.8;min-height:0}
.drw-list li{border-bottom:1px solid #f0ede8}.drw-list li:last-child{border-bottom:0}
.drw-link{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 20px;background:none;border:0;font:100 10px/15px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#2c1f0e;text-decoration:none;text-align:start;cursor:pointer;transition:color .2s,background .2s}
.drw-link:hover,.drw-link:active{color:#57443d;background:#faf8f5}
.drw-chev{opacity:.35;flex-shrink:0;transition:opacity .2s}.drw-link:hover .drw-chev{opacity:.8}
.lang-ar .drw-chev,.lang-ar .drw-back svg{transform:scaleX(-1)}
.drw-foot{margin-top:auto;border-top:1px solid #e8e4de;padding:16px 20px;flex-shrink:0}
.drw-foot-link{display:flex;align-items:center;gap:10px;padding:8px 0;font:500 11px/16.5px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#2c1f0e;text-decoration:none;transition:color .2s}
.drw-foot-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;color:#2c1f0e}.drw-foot-icon svg{width:20px;height:20px}
.drw-back{display:flex;align-items:center;gap:15px;flex:1;padding:0;background:none;border:0;font:500 11px/16.5px var(--body);letter-spacing:.2em;text-transform:uppercase;color:#2c1f0e;cursor:pointer;transition:color .2s;text-align:start}
.drw-acc-wrap{overflow-y:auto;flex:1}
.drw-acc{border-bottom:1px solid #f0ede8}
.drw-acc-h{display:flex;align-items:center;justify-content:space-between;width:100%;padding:16px 20px;background:none;border:0;font:300 10px/15px var(--body);letter-spacing:.2em;text-transform:uppercase;color:#1a1a1a;cursor:pointer;text-align:start;transition:color .2s}
.drw-acc-h:hover,.drw-acc.open .drw-acc-h{color:#57443d}
.drw-acc-i{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;font-size:1.2rem;font-weight:300;line-height:1;color:#aaa;transition:transform .28s ease,color .2s}
.drw-acc.open .drw-acc-i{transform:rotate(45deg);color:#ddbe71}
.drw-acc-b{list-style:none;margin:0;padding:0;max-height:0;overflow:hidden;transition:max-height .34s ease;background:#fff}
.drw-acc.open .drw-acc-b{max-height:600px}
.drw-acc-b a{display:block;padding:11px 20px 11px 26px;font:300 12.5px/18px var(--body);letter-spacing:.06em;color:#888;text-decoration:none;border-bottom:1px solid #f0ede8;transition:all .2s}
.drw-acc-b li:last-child a{border-bottom:0}
.drw-acc-b a:hover{color:#57443d;padding-inline-start:30px}
.drw-plain{border-bottom:1px solid #f0ede8}.drw-plain a{display:block;padding:16px 20px;font:10px/15px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#1a1a1a;text-decoration:none}
.lang-ar .drw-link,.lang-ar .drw-foot-link,.lang-ar .drw-back,.lang-ar .drw-acc-h,.lang-ar .drw-plain a{letter-spacing:0;font-size:13px;font-weight:400}
/* drawers slide back out when closed */
.drawer.closing{animation:fade-out .34s forwards}.drawer.closing .drawer-panel{animation:slide-out .34s cubic-bezier(.4,0,.2,1) forwards}
.lang-ar .drawer.closing .drawer-panel{animation-name:slide-out-rtl}
@keyframes fade-out{to{background:transparent}}@keyframes slide-out{to{transform:translateX(-100%)}}@keyframes slide-out-rtl{to{transform:translateX(100%)}}
#drawer .drawer-panel{animation-duration:.38s;animation-timing-function:cubic-bezier(.4,0,.2,1)}

/* page loader while the next page loads (live store's spinner, theme colours) */
#page-loader{position:fixed;inset:0;z-index:100000;background:#fff}
.loader-container{position:fixed;inset:0;display:flex;justify-content:center;align-items:center}
.balls-containers{position:relative;width:400px;height:400px}
.ball-1,.ball-2,.ball-3{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center}
.ball-1,.ball-2{justify-content:space-between;border-radius:50%;border:1px solid #57443d;border-right-color:#fff;border-bottom:0;border-left:0;opacity:.9}
.ball-1{width:100px;height:100px;animation:rotation-1 2s linear infinite}
.ball-2{width:50px;height:50px;animation:rotation-2 2s linear infinite}
.ball-3{width:20px;height:20px;justify-content:center}
.ball{display:block;position:relative;width:10px;height:10px;border-radius:50%;background:#57443d;opacity:.9}
@keyframes rotation-1{0%{transform:translate(-50%,-50%) rotate(1turn)}to{transform:translate(-50%,-50%) rotate(0)}}
@keyframes rotation-2{0%{transform:translate(-50%,-50%) rotate(-1turn)}to{transform:translate(-50%,-50%) rotate(0)}}

/* scrollbar (live) */
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:#f0ede8}::-webkit-scrollbar-thumb{background:#ddbe71;border-radius:3px}
.side,.fg{scrollbar-width:none}.side::-webkit-scrollbar,.fg::-webkit-scrollbar{display:none}
.bs-body{scrollbar-width:thin;scrollbar-color:rgba(87,68,61,.2) transparent}.bs-body::-webkit-scrollbar{width:2px}.bs-body::-webkit-scrollbar-thumb{background:rgba(87,68,61,.2);border-radius:2px}

/* mega menu opens from the top link only (JS adds .open), closes shortly after leaving */
.nav-group:hover .mega{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,visibility 0s linear .18s}
.nav-group.open .mega,.nav-group:focus-within .mega{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .18s ease}
.nav-group:hover .mega a{animation:none}
.nav-group.open .mega a,.nav-group:focus-within .mega a{animation:mega-in .35s cubic-bezier(.22,1,.36,1) forwards}
.mega-in{justify-content:flex-start}
.mega-col{flex:0 0 275px;min-width:0;padding-inline-end:32px;box-sizing:border-box}
.mega-col:has(> a:nth-of-type(14)){flex:1 1 auto;padding-inline-end:0;column-count:2;column-gap:24px}
.mega-col:has(> a:nth-of-type(14)) .mega-h{column-span:all}
.mega-h{font:400 10px/14px var(--sans);padding-bottom:12px;margin-bottom:12px}
.mega a{line-height:18.2px;break-inside:avoid}

/* listing cards (live sizes): fixed photo height, 10% inner padding, 30px gutters */
.listing .card-img{aspect-ratio:auto;height:320px;background:#fff}
.listing .card-img img{padding:10%;box-sizing:border-box}.listing .card-img .alt{background:#fff}
.listing .grid{gap:30px 30px}
@media(min-width:1000px){.listing-grid{gap:67px}.wrap.listing{padding-inline-end:14px}}
@media(max-width:991px){.listing .card-img{height:315px}}
@media(max-width:999px){.wrap.listing{padding:0 15px 0 17px}.lang-ar .wrap.listing{padding:0 17px 0 15px}}
@media(max-width:575px){.listing .card-img{height:220px}.listing .card-body{padding:12px 6px 16px}}
/* footer spacing (live): socials right under the logo, columns end 30px above a 40px gap, tighter phone stack */
.f-brand .socials{margin-top:0}
@media(min-width:768px){.copy{margin-top:58px;padding:0 65px 0 50px}}
@media(max-width:767px){.footer-in{row-gap:22px}.f-col:not(.f-brand){padding-top:6px}.footer .socials-bottom{margin:52px 0 53px}}

/* search panel under the header (live values) */
.srch{position:absolute;left:0;right:0;top:100%;z-index:51;display:flex;align-items:center;padding:25px 40px;background:#fff;border-bottom:1px solid #e8e4de;box-shadow:0 4px 20px rgba(0,0,0,.08);animation:srch-in .2s ease}
.srch[hidden]{display:none}
@keyframes srch-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.srch-icon{display:flex;margin-inline-end:14px;opacity:.35;flex-shrink:0;color:#2c1f0e}.srch-icon svg{width:20px;height:20px}
.srch-form{display:flex;flex:1;margin:0}
.srch-form input{flex:1;width:100%;padding:0;border:0;outline:0;background:transparent;font:14px/21px var(--sans);letter-spacing:.28em;text-transform:uppercase;color:#57443d}
.srch-form input::placeholder{color:#888;font-size:13px}
.srch-close{display:flex;align-items:center;justify-content:center;margin-inline-start:16px;padding:4px;background:none;border:0;color:#2c1f0e;opacity:.4;cursor:pointer;flex-shrink:0;transition:opacity .2s}.srch-close:hover{opacity:1}.srch-close svg{width:14px;height:14px}
.srch-backdrop{position:fixed;left:0;right:0;bottom:0;top:115px;z-index:29;background:rgba(0,0,0,.35)}
.srch-dd{position:absolute;left:0;top:100%;width:100%;box-sizing:border-box;background:#fff;border:1px solid #e0e0e0;padding:14px}
.srch-track{display:flex;gap:10px}
.srch-card{flex:1;display:block;min-width:0;background:#fff;text-decoration:none;color:inherit;overflow:hidden}
.srch-card img{display:block;width:100%;height:300px;object-fit:contain}
.srch-body{padding:6px 8px;text-align:center}
.srch-brand{margin:0 0 2px;font:14px/21px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#57443d}
.srch-name{margin:0 0 3px;font:600 11px/16.5px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#57443d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srch-price{font:11px/16.5px var(--body);color:#888}
.srch-msg{width:100%;padding:18px 0;text-align:center;font-size:13px;color:#aaa}
.srch-foot{margin-top:10px;padding-top:8px;text-align:center}
.srch-all{display:inline-block;padding:10px 20px;border:1px solid #57443d;border-radius:800px;background:#57443d;color:#fff;font:15px/22.5px var(--body);letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
.lang-ar .srch-form input,.lang-ar .srch-brand,.lang-ar .srch-name,.lang-ar .srch-all{letter-spacing:0}
@media(max-width:767px){
  .srch{padding:16px}
  .srch-dd{padding:0}
  .srch-track{flex-direction:column;gap:0}
  .srch-card{display:flex;align-items:center;gap:16px;padding:14px 20px}
  .srch-card img{width:60px;height:60px;padding:6px;box-sizing:border-box;flex-shrink:0}
  .srch-body{display:flex;flex-direction:column;gap:4px;padding:0;flex:1;min-width:0;text-align:start}
  .srch-brand{font-size:9px;line-height:13.5px}
  .srch-name{font-weight:100;font-size:10px;line-height:15px}
  .srch-price{font-family:var(--sans);letter-spacing:.1em}
  .srch-foot{padding:16px 20px}
  .srch-all{display:block}
}

/* pagination (live): current page, the next one and arrows, underlined */
.pager{display:inline-flex;align-items:center;border-bottom:1px solid #e8e4de;margin:20px 0 50px 40px}
.pg-num{padding:10px 20px;border-bottom:2px solid transparent;margin-bottom:-1px;font:9.6px/14.4px var(--body);color:#57443d;text-decoration:none}.pg-num.on{font-weight:600;border-bottom-color:#3d3027}
.pg-arrow{padding:4px 10px;font:20.8px/20.8px var(--body);color:#3d3027;text-decoration:none}
@media(max-width:999px){.pager{margin:20px 0 40px}}
/* mega menu never wider than the screen (menus with 5 groups) */
.mega{overflow:hidden}.mega-in{min-width:0}.mega-col{flex-shrink:1}.mega-col:has(> a:nth-of-type(14)){min-width:0}
/* the bar spans the full width without causing sideways scroll */
.lbar{margin-inline:-20px -14px}
@media(max-width:999px){.lbar{margin-inline:-17px -15px}}
/* product carousels (live slider sizes): 10px gaps, photos with 10% inner padding */
.rail.prail{padding:0 5px;scroll-padding-inline:5px;margin:0 16px;grid-auto-columns:58.2vw}
.prail .card-img{background:#fff}.prail .card-img img{padding:10%;box-sizing:border-box}.prail .card-img .alt{background:#fff}
@media(max-width:575px){.rail.prail{margin:0 16px 0 20px}.prail .card-body{padding:12px 6px 16px}}
@media(min-width:576px){.rail.prail{margin:0 40px;grid-auto-columns:44.1vw}.prail .card-img{aspect-ratio:auto;height:315px}}
@media(min-width:992px){.rail.prail{margin:0 48px;grid-auto-columns:18vw}.prail .card-img{height:220px}}
@media(min-width:1200px){.rail.prail{margin:0 16px;grid-auto-columns:19.44vw}.prail .card-img{aspect-ratio:1;height:auto}}
/* wide text block (live: watches sections) */
@media(min-width:768px){.text-block.wide{padding:45px 75px}}
/* phone header is 60px including its bottom line (live) */
@media(max-width:999px){.header-in{height:59px}}
/* hero buttons sit a little below centre (live, measured per width) */
.hero-buttons{padding-top:16px}
@media(min-width:768px){.hero-buttons{padding-top:30px}}
@media(min-width:992px){.hero-buttons{padding-top:40px}}
@media(min-width:1200px){.hero-buttons{padding-top:58px}}
.hero{margin-bottom:24px}
@media(min-width:1000px){.header-in{height:74px}}
/* product carousels: space above and before "View all" (live) */
.rail.prail{padding-top:12px;padding-bottom:51px}
@media(min-width:768px){.rail.prail{padding-bottom:37px}}
.card-body{display:flex;flex-direction:column;gap:5px} /* live: 5px between brand, title and price */
/* home sections: space under the full-width banner and under "View all" (live) */
.banner{margin:29px 0 24px}
/* home spacing measured against the live store at 1440 */
.ptabs{padding-bottom:53px}.banner{margin-top:0}
@media(min-width:992px){.cards.cards-feature{padding-top:10px;padding-bottom:94px}.cards-feature .pcard h3{margin:-2px 0 24px}}
@media(min-width:992px){.cards.cards-tile{padding-top:50px;padding-bottom:21px}.cards-brand .pcard h3{margin-bottom:8px}.reviews .sec-title{margin-bottom:2px}}

@media(min-width:992px){.cards.cards-brand{padding-top:28px;padding-bottom:77px}}
@media(max-width:991px){.cards.cards-feature{padding-top:3px;padding-bottom:74px}.cards-feature .pcard h3{margin:-2px 0 24px}.cards-feature .pcard+.pcard{margin-top:-30px}}
@media(max-width:991px){.cards.cards-brand .pcard h3{margin:14px 0 8px}}
@media(max-width:480px){.reviews-rail{grid-auto-columns:58.7vw;padding-inline:20px;scroll-padding-inline:20px}}
@media(max-width:991px){.cards.cards-tile{padding-top:36px;padding-bottom:5px}.reviews .sec-title{margin-bottom:2px}}
/* review videos: live slide widths and side spacing per screen size */
@media(min-width:481px){.reviews-rail{grid-auto-columns:42.9vw;padding-inline:38px;scroll-padding-inline:38px}}
@media(min-width:768px){.reviews-rail{grid-auto-columns:337px;padding-inline:calc((100vw - 688px) / 2);scroll-padding-inline:calc((100vw - 688px) / 2)}}
@media(min-width:992px){.reviews-rail{grid-auto-columns:17.8vw;padding-inline:calc((100vw - 928px) / 2);scroll-padding-inline:calc((100vw - 928px) / 2)}}
@media(min-width:1200px){.reviews-rail{grid-auto-columns:calc(20vw - 11px);padding-inline:16px;scroll-padding-inline:16px}}
/* footer on tablets (live): logo and icons centred, then link columns two by two */
@media(min-width:768px) and (max-width:991px){
  .footer-in{grid-template-columns:repeat(2,344px);column-gap:0;row-gap:22px}
  .f-brand{grid-column:1/-1;text-align:center}.f-brand .f-logo{display:block;margin-inline:auto}.f-brand .socials{justify-content:center}
  .f-col:not(.f-brand){padding-top:6px}
}
/* footer on small laptops (live): narrow logo column and five 109px link columns */
@media(min-width:992px) and (max-width:1199px){
  .footer-in{grid-template-columns:191px repeat(5,109px);column-gap:40px;padding:0 35px}
  .f-logo{width:180px}
}
@media(min-width:768px) and (max-width:991px){.f-brand .socials{margin-bottom:14px}.copy{margin-top:68px}.pay-badges{flex-wrap:wrap;max-width:170px;margin-inline-start:auto;row-gap:6px}}
@media(min-width:992px) and (max-width:1199px){.f-brand{align-items:flex-start}.f-brand .socials{max-width:180px;flex-wrap:wrap}.copy{margin-top:64px}}
/* ---------- product page (live layout and values) ---------- */
.pp{display:grid;grid-template-columns:minmax(0,1fr);padding:16px 16px 0;gap:0;max-width:none}
.pp .gallery{display:flex;flex-direction:column;gap:10px;margin:0}
.pp .thumbs{order:-1;margin:0;padding:0 16px}
.pp .thumbs img{width:72px;height:72px;padding:10px}
.pp .gallery-main{border-radius:4px}
.pp .gallery-main img{height:360px;padding:20px}
.pp .pinfo{padding:24px 15px 0}
.pp-short{margin-top:14px;padding-top:14px;border-top:1px solid #e8e4de;font:400 15px/24.75px var(--sans);color:#57443d}
.pp .pdesc{position:relative;max-height:110px;overflow:hidden;margin:16px 0;padding:13px 0;border-top:1px solid #e8e4de;font:15px/22.5px var(--body);color:#1a1a1a}
.pp .pdesc.open{max-height:none}.pp .pdesc p{margin:0}
.pp-more{display:inline-block;padding:6px 0 0;margin:0 0 16px;border:0;background:none;font:400 13px/19.5px var(--sans);letter-spacing:.03em;color:#57443d;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pp-add{display:block;width:calc(100% + 15px);margin-inline-start:-15px;padding:16px 32px;border:0;border-radius:50px;background:#57443d;color:#fff;font:600 13px/19.5px var(--body);letter-spacing:.14em;text-transform:uppercase;text-align:center;cursor:pointer}
.pp-add.sold{background:#ccc;color:#888;cursor:not-allowed}
.pp-notice{display:flex;align-items:center;gap:9px;margin:23px 0 14px;font:13px/18.2px var(--body);color:#2c2c2c}.pp-notice .flag{width:22px;height:auto;flex-shrink:0;border-radius:2px}.pp-notice strong{font-weight:500;color:#2c1f0e}
.pp-badges{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pp-badges li{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #57443d;color:#57443d}.pp-badges svg{flex-shrink:0;width:20px}
.pp-badges span{font:500 11px/14.3px var(--body);letter-spacing:.01em}
.pp-acc{margin:48px 2px 0}
.pp-acc-item{border-top:1px solid #e0ddd8}.pp-acc-item:last-child{border-bottom:1px solid #e0ddd8}
.pp-acc-item summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;list-style:none;cursor:pointer}
.pp-acc-item summary::-webkit-details-marker{display:none}
.pp-acc-l{display:flex;align-items:center;gap:14px;font:400 10px/17px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#57443d}.pp-acc-l svg{width:22px;flex-shrink:0}
.pp-plus::before{content:"+";font:300 24px/24px var(--body);color:#57443d}.pp-acc-item[open] .pp-plus::before{content:"−"}
.pp-acc-body{padding:4px 0 32px 36px}.lang-ar .pp-acc-body{padding:4px 36px 32px 0}
.pp-line{margin:0 0 18px;font:400 14px/1.6 var(--body);color:#2c2c2c}.pp-line:last-child{margin-bottom:0}
.pp-ship{margin:0;padding-inline-start:18px;list-style:disc}.pp-ship li{margin:0 0 10px;font:14px/1.6 var(--body);color:#2c2c2c}.pp-ship li::marker{color:#57443d}
.lang-ar .pp-short,.lang-ar .pp-acc-l,.lang-ar .pp-more{letter-spacing:0}
/* phone: ADD TO CART floats at the bottom once the page is scrolled */
.pp-float{position:fixed;bottom:24px;left:50%;z-index:999;width:calc(100% - 48px);padding:16px 32px;border:0;border-radius:50px;background:#57443d;color:#fff;font:600 11px/16.5px var(--sans);letter-spacing:.18em;text-transform:uppercase;box-shadow:0 4px 24px rgba(0,0,0,.22);transform:translate(-50%,150%);transition:transform .35s cubic-bezier(.4,0,.2,1);cursor:pointer}
.pp-float.visible{transform:translate(-50%,0)}
@media(min-width:992px){
  .pp{grid-template-columns:53.47% 34.3%;column-gap:2.08%;grid-template-areas:"media info" "acc info";align-items:start;padding:64px 0 0}
  .pp .gallery{grid-area:media;flex-direction:row}.pp .pinfo{grid-area:info;padding:0}.pp-acc{grid-area:acc;margin:24px 12.5% 0}
  .pp .thumbs{flex-direction:column;padding:8px 0 0 16px;gap:8px}
  .pp .gallery-stage{flex:1;min-width:0}.pp .gallery-main img{height:480px;padding:78px 50px 50px}
  .pp-acc-item summary{padding:22px 0}
  .pp-float{display:none}
}
.lang-ar .pp .thumbs{padding-inline:16px 0}
/* "Buying a gift?" block (live values) */
.gift{display:flex;flex-direction:column;gap:40px;align-items:stretch;max-width:1400px;margin:30px auto 0;padding:25px 20px 0;border-top:1px solid #e0ddd8}
.gift-images{position:relative;width:100%;min-height:400px;padding:0;margin:0}
.gift-main{width:330px;height:330px;object-fit:cover}
.gift-over{position:absolute;width:220px;height:220px;top:60%;left:30%;right:auto;bottom:auto;transform:translateY(-50%);object-fit:cover;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.lang-ar .gift-over{left:auto;right:30%}
.gift-text{margin-top:-40px;text-align:start}.gift-text h2{font:400 16px/1.2 var(--sans);letter-spacing:.05em;color:#57443d;opacity:.9;margin:0 0 16px;text-transform:uppercase}.gift-text p{font:300 15px/1.7 var(--body);color:#888;margin:0}
@media(min-width:992px){
  .gift{flex-direction:row;align-items:center;gap:80px;margin-top:63px;padding:70px 9% 0;border-top:1px solid #e0ddd8}
  .gift-images{flex:1;min-height:500px}.gift-main{width:450px;height:450px}
  .gift-over{width:310px;height:310px;top:50%;left:auto;right:-100px}.lang-ar .gift-over{right:auto;left:-100px}
  .gift-text{flex:0 0 450px;margin:0;padding-inline-start:40px}.gift-text h2{font-size:20px;margin-bottom:24px}.gift-text p{font-size:14px}
}
/* product page: measured corrections */
.pp{padding:52px 14px 0 18px}.pp .thumbs{padding:0 0 0 16px;justify-content:flex-start}.lang-ar .pp .thumbs{padding:0 16px 0 0}
.pp .gallery-stage{margin:0;width:100%}.pp .gallery-main img{width:100%}
.pp .pinfo{padding:24px 15px 0}.pp-add{margin-top:24px}.pp-acc-item summary{margin-bottom:6px}
.gift{margin:30px 0 0 10px;padding:25px 20px 0}
@media(min-width:992px){
  .pp{grid-template-rows:auto 1fr;padding:96px 0 0}.pp .thumbs{padding:8px 0 0 16px}.pp .gallery{gap:26px}
  .pp .pinfo{padding:0}.pp-add{margin-top:0}.pp-acc-item summary{margin-bottom:0}
  .gift{margin:63px auto 0;padding:70px 9% 0}
}
.wrap.pp{padding:52px 14px 0 18px;gap:0}.pp .gallery{align-items:stretch}
@media(min-width:992px){.wrap.pp{grid-template-columns:53.47% 34.3%;grid-template-rows:auto 1fr;column-gap:2.08%;row-gap:0;padding:96px 0 0;max-width:none}}
.pp .gallery{padding:0}.pp-acc-item summary{margin-bottom:6px}.pp-acc{padding:0 12.8px}
@media(min-width:992px){.wrap.pp{padding-top:64px}}
@media(max-width:991px){.pp-acc{padding:0}}
/* listing card titles stop at two lines (live) */
.listing .card-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

/* Slide-in cart checkout, measured on the live store: full-width subtotal bar, delivery address, order summary,
   payment, order note, gift wrap, policies, Complete Order. Phones (<768px) get 14px fields with 12px padding. */
.cart-body .sc-sub,.cart-body .sc-form{margin:0 -16px}
.sc-sub{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-top:1px solid #e8e4de;border-bottom:1px solid #e8e4de;background:#fff}
.sc-sub span{font:700 13px/19.5px var(--body);letter-spacing:1.3px;text-transform:uppercase;color:#57443d}
.sc-sub strong{font:100 18px/27px var(--sans);letter-spacing:-.3px;color:#57443d}
.sc-form{background:#fff;padding-bottom:20px}
.sc-title{display:flex;align-items:center;margin:0;padding:14px 16px 8px;font:500 14px/21px var(--sans);letter-spacing:1.1px;text-transform:uppercase;color:#57443d}
.sc-title svg{width:11.25px;height:15px;flex:none;margin-inline-end:8.75px}
.sc-fields{display:flex;flex-wrap:wrap;padding:2px 8px 6px}
.sc-f{width:50%;padding:0 15px;margin-bottom:8px}.sc-f.full{width:100%}
.sc-in{display:block;width:100%;height:40.56px;padding:10px 13px;border:1px solid #e8e4de;border-radius:0;background:#fff;font:400 13px/18.57px var(--sans);color:#57443d;outline:0;-webkit-appearance:none;appearance:none}
.sc-in::placeholder{color:#888;opacity:1}
.sc-in:focus{border-color:#57443d}
select.sc-in{padding-inline-end:30px;text-overflow:ellipsis;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center/16px 12px}
.lang-ar select.sc-in{background-position:left 13px center}
.sc-f .err{display:block;font-size:12px}
.sc-totals{width:calc(100% - 30px);margin:0 15px;border:1px solid #e8e4de;border-collapse:collapse;background:#fff}
.sc-totals td{padding:0;vertical-align:top;font:300 13px/19.5px Poppins,var(--body);color:#57443d}
.sc-totals tr:first-child span{display:block}.sc-totals tr:first-child span:first-child{padding-bottom:8px}
.sc-totals td:last-child span{font:400 13px/19.5px var(--sans)}
.sc-totals tr + tr td{padding-top:12px}
.sc-totals td:last-child{text-align:end}
.sc-totals strong{font:500 15px/22.5px var(--sans);letter-spacing:-.3px}
.sc-pay{margin:18px 12px 0;padding:10px 12px;border:1px solid #e8e4de;background:#fff}
.sc-pay-opt{display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid #e8e4de;border-radius:4px;cursor:pointer}
.sc-pay-opt input,.sc-check input{width:15px;height:15px;margin:0;accent-color:#57443d;flex:none}
.sc-pay-opt span{font:500 11px/16.5px var(--body);letter-spacing:1.1px;text-transform:uppercase;color:#57443d}
.sc-note-title{margin-top:16px;border-top:1px solid #e8e4de;font:700 10.5px/15.75px var(--sans);color:#888}
.sc-note{display:block;width:100%;height:85px;padding:12px 14px 0 12px;border:1px solid #e8e4de;border-radius:0;font:400 13px/19.5px var(--body);color:#1a1a1a;resize:vertical;outline:0}
.sc-note::placeholder{color:#aaa}
.sc-check{display:flex;align-items:flex-start;gap:8px}
.sc-check input{margin-top:2px}
.sc-gift{margin:11px 12px 0;padding:14px 16px;border:1px solid #e8e4de;background:#fff}
.sc-gift label{font:700 12px/18.6px var(--body);letter-spacing:1.44px;text-transform:uppercase;color:#57443d;cursor:pointer}
.sc-policy{margin-top:16px;padding:2px 12px 0;border-top:1px solid #e8e4de}
.sc-policy label{font:700 10px/15.5px Montserrat,var(--body);letter-spacing:1.2px;text-transform:uppercase;color:#888;cursor:pointer}
.sc-req{display:flex;align-items:center;gap:6px;margin:5px 0 0 20px;color:#c0392b;font:500 11.5px var(--body)}
.sc-req[hidden]{display:none}.sc-req svg{width:11px;height:11px}
.sc-form > .err{display:block;margin:6px 12px 0}
.sc-complete{display:flex;align-items:center;justify-content:center;gap:7px;width:calc(100% - 21px);height:44px;margin:12px 12px 14px;padding:14px 32px;border:0;border-radius:50px;background:#57443d;color:#fff;font:600 12px/15.6px var(--body);letter-spacing:1.8px;text-transform:uppercase;cursor:pointer}
.sc-complete svg{width:12px;height:12px;flex:none}
.sc-complete:disabled{opacity:.7;cursor:wait}
.lang-ar .sc-sub span,.lang-ar .sc-title,.lang-ar .sc-pay-opt span,.lang-ar .sc-gift label,.lang-ar .sc-policy label,.lang-ar .sc-complete{letter-spacing:0}
@media(max-width:767px){
  .sc-in{height:45.6px;padding:12px 13px;font-size:14px;line-height:20px}
  .sc-policy{padding-top:0}
}
/* the item card in the slide-in cart, as on the live store: name on one line, item code, 114x38 quantity box */
.cart-lines .cl-sku{grid-column:2;margin:2px 0 0;font:400 11px/16.5px var(--body);color:#858686}
.cart-body .cart-lines{flex:none;margin:24px -4px 27px}
.cart-body .cart-line{column-gap:35px;row-gap:0;padding:12px;border:0;border-radius:4px;background:#fff}
.cart-body .cl-img{grid-row:1/span 4}
.cart-body .cl-name{display:block;line-height:15.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:start}
.cart-body .cl-price{margin-top:8px;line-height:19.5px}
.cart-body .cl-row{margin-top:7px;flex-wrap:nowrap}
.cart-body .qty{height:38px;padding:2px;border:1px solid #e8e4de}
.cart-body .qty button{width:32px;height:32px;border-radius:50%;font:700 14px/1 var(--body);color:#2c1f0e}
.cart-body .qty input{width:44px;height:32px;font:600 13px/32px var(--body)}
.cart-body .cl-actions{margin-inline:auto 4px}
.cart-body .cl-remove{width:80px;height:36px;padding:0;letter-spacing:.44px}
.cart-body .cl-note-btn{width:32px;height:32px;padding:6px;border-radius:4px;align-items:center;justify-content:center}
.cart-body .sc-f .err:empty{display:none}
@media(max-width:767px){
  .cart-body .cart-line{column-gap:9px}
  .cart-body .qty button{width:30px}.cart-body .qty input{width:20px}
  .cart-body .cl-actions{margin-inline-end:2px}
  .cart-body .cl-note-btn{width:36px;height:36px}
}
/* the floating Add to cart button stays under an open drawer, as on the live store */
body:has(.drawer:not([hidden])) .pp-float{display:none}
.lang-ar .sc-in[dir="ltr"]:placeholder-shown{text-align:right}