:root{
  --bg:#0e0904; --bg2:#150e07; --card:#1c130a; --card2:#241810; --line:rgba(217,164,65,.22);
  --gold:#d9a441; --gold2:#f0cd85; --amber:#b87a1a; --cream:#f6ebd3; --text:#e9dcc0; --muted:#b4a281; --olive:#9bb06a;
  --radius:22px; --f-body:"Tajawal","Segoe UI",Tahoma,Arial,sans-serif; --f-head:"Amiri","Tajawal","Traditional Arabic",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--f-body);line-height:1.9;font-size:17px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
.hidden{display:none!important}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold);color:#1a0f05}

/* ---------- top bar & nav ---------- */
.topbar{background:linear-gradient(90deg,#1a1006,#2a1a0a,#1a1006);color:var(--gold2);text-align:center;font-size:14px;padding:8px 12px;display:flex;justify-content:center;align-items:center;gap:10px;white-space:nowrap;overflow:hidden;border-bottom:1px solid var(--line)}
.topbar .sep{opacity:.45}
.sale-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#ffd77a;transition:.2s}
.sale-link:hover{color:#fff}
.sale-link .dot{width:8px;height:8px;border-radius:50%;background:#ff7a3d;box-shadow:0 0 0 0 rgba(255,122,61,.7);animation:pulse 1.8s infinite}
.sale-link .arrow{transition:transform .2s}
.sale-link:hover .arrow{transform:translateX(-4px)}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(255,122,61,0)}100%{box-shadow:0 0 0 0 rgba(255,122,61,0)}}

.nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 6vw;background:rgba(14,9,4,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
.nav.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.5)}
.nav nav{display:flex;gap:28px}
.nav nav a{font-weight:500;color:var(--text);position:relative;padding:4px 0;transition:color .2s}
.nav nav a:hover{color:var(--gold2)}
.nav nav a::after{content:"";position:absolute;inset-inline:0;bottom:-2px;height:2px;background:var(--gold);transform:scaleX(0);transition:.25s}
.nav nav a:hover::after{transform:scaleX(1)}
.nav nav a.nav-sale{color:#ff9a5c;font-weight:800}
.nav nav a{white-space:nowrap}
@media (min-width:901px) and (max-width:1150px){.nav{gap:12px;padding-inline:3vw}.nav nav{gap:14px}.nav nav a{font-size:15px}.nav .btn{padding:8px 16px;font-size:15px}.logo{font-size:30px}}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--f-head);font-size:34px;font-weight:700;color:var(--gold2);line-height:1}
.logo svg{width:38px;height:38px}
.logo.small{font-size:28px}.logo.small svg{width:28px;height:28px}
.burger{display:none;background:none;border:0;width:42px;height:42px;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;align-items:center}
.burger span{display:block;width:24px;height:2px;background:var(--gold2);transition:.25s}

/* ---------- buttons ---------- */
.btn{display:inline-block;background:linear-gradient(135deg,#f0cd85,#d9a441 55%,#b87a1a);color:#1a0f05;padding:10px 26px;border-radius:99px;font-weight:800;border:0;transition:.25s;cursor:pointer;font-family:inherit;font-size:16px;line-height:1.6;white-space:nowrap;box-shadow:0 6px 18px rgba(217,164,65,.22)}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(217,164,65,.38);filter:brightness(1.06)}
.btn.big{padding:14px 34px;font-size:18px}
.btn.ghost{background:transparent;color:var(--gold2);box-shadow:inset 0 0 0 1.5px var(--gold)}
.btn.ghost:hover{background:rgba(217,164,65,.14);box-shadow:inset 0 0 0 1.5px var(--gold2)}
.btn.light{background:#fff4d8;color:#2a1a0a}
.btn.soon{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1.5px var(--line);cursor:default;pointer-events:none}
.eyebrow{display:inline-block;color:var(--gold);font-weight:700;font-size:14px;letter-spacing:.6px;padding:3px 16px;border-radius:99px;border:1px solid var(--line);background:rgba(217,164,65,.07)}
.eyebrow.light{color:var(--gold2)}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding:78px 6vw 96px;overflow:hidden;
  background:radial-gradient(ellipse at 78% 55%,rgba(217,164,65,.28) 0,transparent 55%),radial-gradient(ellipse at 10% 0,rgba(184,122,26,.18) 0,transparent 50%),linear-gradient(180deg,#120b05,#0e0904)}
.hero::before{content:"";position:absolute;inset:0;opacity:.07;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='104'%3E%3Cpolygon points='45,4 85,27 85,77 45,100 5,77 5,27' fill='none' stroke='%23d9a441' stroke-width='1.5'/%3E%3C/svg%3E");pointer-events:none}
.hero::after{content:"";position:absolute;inset-inline:0;top:0;height:90px;pointer-events:none;opacity:.9;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 90' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V10C1180 10 1170 14 1166 34C1162 54 1156 66 1148 66C1140 66 1134 54 1130 34C1126 14 1110 10 1090 10C1030 10 1010 14 1004 40C1000 62 994 80 984 80C974 80 968 62 964 40C960 14 940 10 900 10C820 10 800 12 796 28C792 44 788 52 782 52C776 52 772 44 768 28C764 12 740 10 700 10C620 10 590 12 584 36C580 56 574 70 566 70C558 70 552 56 548 36C544 12 520 10 480 10C400 10 380 14 374 32C370 48 364 58 358 58C352 58 346 48 342 32C338 14 320 10 280 10C220 10 200 12 196 30C192 50 186 62 178 62C170 62 164 50 160 30C156 12 130 10 90 10C50 10 20 10 0 10Z' fill='%23b87a1a'/%3E%3C/svg%3E") center top/100% 100% no-repeat}
.hero-text{position:relative;z-index:1}
.hero h1{font-family:var(--f-head);font-size:clamp(32px,3.6vw,60px);line-height:1.38;margin:18px 0;color:var(--cream);font-weight:700;text-wrap:balance}
.hero h1 .gold{color:var(--gold2);text-shadow:0 0 30px rgba(217,164,65,.35)}
@media (min-width:901px){.hero h1{white-space:nowrap}}
.hero-text p{max-width:540px;font-size:20px;color:var(--text);margin:0;text-wrap:pretty}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0 32px}
.trust{display:flex;gap:30px;flex-wrap:wrap;list-style:none;padding:0;margin:0;color:var(--muted);font-weight:500}
.trust b{font-family:var(--f-head);font-size:28px;color:var(--gold);margin-inline-end:4px}
.hero-art{position:relative;height:470px;z-index:1}
.orb{position:absolute;inset:8% 6% 6% 6%;border-radius:50%;background:radial-gradient(circle at 42% 38%,rgba(255,225,150,.55),rgba(217,164,65,.28) 55%,transparent 72%);filter:blur(6px)}
.hexbg{position:absolute;width:340px;inset-inline-end:-30px;top:-20px;opacity:.9}
.hero-art svg:not(.hexbg){position:absolute;filter:drop-shadow(0 24px 26px rgba(0,0,0,.65))}
.h-jar{width:215px;height:269px;bottom:12px;inset-inline-start:23%;z-index:2;animation:float 6s ease-in-out infinite}
.h-jar2{width:152px;height:190px;bottom:8px;inset-inline-end:6%;z-index:1;animation:float 7s ease-in-out -2s infinite}
.h-candle{width:132px;height:165px;bottom:10px;inset-inline-start:2%;z-index:1;animation:float 8s ease-in-out -4s infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ---------- showcase ---------- */
.showcase{background:var(--bg2);border-block:1px solid var(--line);padding:84px 6vw}
.show-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.45fr 1fr;gap:48px;align-items:center}
.show-fig{margin:0;border-radius:26px;overflow:hidden;border:1px solid var(--gold);box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 60px rgba(217,164,65,.14)}
.show-fig{position:relative}
.show-note{position:absolute;inset-inline-start:14px;bottom:12px;background:rgba(14,9,4,.72);color:var(--gold2);font-size:13px;padding:3px 14px;border-radius:99px;backdrop-filter:blur(6px);border:1px solid var(--line)}
.show-fig img{display:block;width:100%;height:auto;transition:transform .8s ease}
.show-fig:hover img{transform:scale(1.04)}
.show-text h2{font-family:var(--f-head);font-size:clamp(30px,3.6vw,46px);color:var(--cream);line-height:1.4;margin:14px 0 10px}
.show-text p{color:var(--text);font-size:18px;margin:0 0 24px}
@media (max-width:900px){.show-inner{grid-template-columns:1fr;gap:28px;text-align:center}.showcase{padding:60px 6vw}}

/* ---------- sections ---------- */
.sec{padding:96px 6vw;text-align:center;background:var(--bg)}
.sec.alt{background:var(--bg2);border-block:1px solid var(--line)}
.head{max-width:700px;margin:0 auto 52px}
.sec h2,.gift h2{font-family:var(--f-head);font-size:clamp(32px,4.2vw,50px);margin:12px 0 8px;color:var(--cream);line-height:1.4}
.sec h2::after{content:"";display:block;width:64px;height:3px;border-radius:3px;margin:14px auto 0;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.sub{color:var(--muted);margin:0;font-size:18px}

/* ---------- products ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:26px;max-width:1260px;margin:0 auto}
.card{background:linear-gradient(180deg,var(--card2),var(--card));border-radius:var(--radius);padding:22px 22px 28px;transition:.35s;display:flex;flex-direction:column;border:1px solid var(--line);position:relative}
.card:hover{transform:translateY(-8px);border-color:var(--gold);box-shadow:0 20px 44px rgba(0,0,0,.55),0 0 0 1px rgba(217,164,65,.25),0 0 40px rgba(217,164,65,.12)}
.pimg{position:relative;height:240px;border-radius:16px;margin-bottom:20px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(240,205,133,.32) 0,rgba(217,164,65,.08) 52%,#120c06 90%);border:1px solid rgba(217,164,65,.12)}
.pimg svg{height:200px;width:auto;filter:drop-shadow(0 16px 18px rgba(0,0,0,.6));transition:.4s}
.pimg img{width:100%;height:100%;object-fit:cover;transition:.4s}
.pimg:has(img){height:auto;aspect-ratio:1}
.card:hover .pimg img{transform:scale(1.04)}
.pimg .chip{z-index:1}
.card:hover .pimg svg{transform:translateY(-6px) scale(1.06)}
.chip{position:absolute;top:12px;inset-inline-start:12px;background:var(--gold);color:#1a0f05;font-size:13px;font-weight:800;padding:2px 12px;border-radius:99px;z-index:1}
.chip.new{background:var(--olive)}
.jar-sidr{--ha:#d4952a;--hb:#f3cf7a}
.jar-samar{--ha:#1e0f05;--hb:#4a260b}
.jar-talh{--ha:#e8c062;--hb:#faebb8}
.jar-wax{--ha:#d99a2b;--hb:#f4cf74}
.card h3{font-family:var(--f-head);margin:0;font-size:30px;color:var(--cream)}
.tagline{margin:0 0 8px;color:var(--gold);font-weight:700;font-size:15px}
.card p{color:var(--text);margin:0 0 12px;font-size:16px;line-height:1.85;opacity:.92}
.notes{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.notes li{font-size:13px;border:1px solid var(--line);color:var(--gold2);padding:1px 11px;border-radius:99px}
.card .btn{margin-top:auto;align-self:center}

/* ---------- story ---------- */
.steps{list-style:none;padding:0;margin:0 auto;max-width:1120px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:34px 22px 28px;position:relative;margin-top:28px}
.steps b{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#f0cd85,#b87a1a);color:#1a0f05;font-family:var(--f-head);font-size:30px;display:grid;place-items:center;margin:-62px auto 14px;border:5px solid var(--bg2)}
.steps h3{font-family:var(--f-head);margin:0 0 4px;font-size:26px;color:var(--cream)}
.steps p{margin:0;font-size:16px;color:var(--muted)}

/* ---------- enjoy ---------- */
.ideas{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:22px;max-width:1120px;margin:0 auto}
.idea{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px 22px;transition:.3s}
.idea:hover{border-color:var(--gold);transform:translateY(-5px);background:var(--card2)}
.idea span{font-size:40px;display:inline-block;filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}
.idea h3{font-family:var(--f-head);margin:6px 0 4px;font-size:26px;color:var(--cream)}
.idea p{margin:0;font-size:16px;color:var(--muted)}

/* ---------- gifts ---------- */
.gift{position:relative;overflow:hidden;padding:96px 6vw;background:linear-gradient(135deg,#2b1a09,#4a2d0e 60%,#2b1a09);border-block:1px solid var(--line)}
.gift::before{content:"";position:absolute;inset:0;opacity:.09;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='104'%3E%3Cpolygon points='45,4 85,27 85,77 45,100 5,77 5,27' fill='none' stroke='%23f0cd85' stroke-width='1.5'/%3E%3C/svg%3E")}
.gift::after{content:"";position:absolute;width:560px;height:560px;border-radius:50%;inset-inline-start:-80px;top:-120px;background:radial-gradient(circle,rgba(240,205,133,.28),transparent 65%)}
.gift-inner{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center;position:relative;z-index:1}
.gift-art{position:relative;height:270px}
.gift-art svg{position:absolute;filter:drop-shadow(0 20px 22px rgba(0,0,0,.6))}
.g1{width:176px;height:220px;inset-inline-start:16%;bottom:0;z-index:2}
.g2{width:134px;height:168px;inset-inline-start:50%;bottom:0}
.gift h2{color:var(--cream)}
.gift p{font-size:18px;color:var(--text);margin:0 0 26px}

/* ---------- faq ---------- */
.faq{max-width:840px;margin:0 auto;text-align:start;display:grid;gap:12px}
.faq details{background:var(--card);border-radius:16px;border:1px solid var(--line);padding:0 24px;transition:.25s}
.faq details[open]{border-color:var(--gold);background:var(--card2);box-shadow:0 12px 30px rgba(0,0,0,.4)}
.faq summary{cursor:pointer;font-weight:700;color:var(--cream);padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:28px;color:var(--gold);line-height:1;transition:.25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:0 0 20px;color:var(--muted);font-size:16px}

/* ---------- contact & footer ---------- */
.contact-row{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap}
.chipl{border:1px solid var(--line);padding:9px 22px;border-radius:99px;color:var(--gold2);font-weight:500;background:rgba(217,164,65,.06)}
footer{background:#080502;color:var(--muted);padding:44px 6vw 22px;border-top:1px solid var(--line)}
.foot-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;max-width:1200px;margin:0 auto 24px}
.foot-top nav{display:flex;gap:24px;flex-wrap:wrap}
.foot-top nav a:hover{color:var(--gold2)}
.copy{text-align:center;font-size:14px;margin:0;border-top:1px solid rgba(217,164,65,.14);padding-top:20px;color:#8a7a5c}
.wa-float{position:fixed;inset-inline-start:18px;bottom:18px;background:#25d366;color:#fff;font-weight:700;padding:11px 20px;border-radius:99px;box-shadow:0 8px 20px rgba(0,0,0,.45);z-index:30}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding:70px 6vw 60px;text-align:center}
  .hero h1{font-size:clamp(26px,7vw,40px)}
  .hero-text p{margin-inline:auto}
  .cta,.trust{justify-content:center}
  .hero-art{height:330px;order:-1}
  .h-jar{width:160px;height:200px;inset-inline-start:30%}
  .h-jar2{width:112px;height:140px;inset-inline-end:8%}
  .h-candle{width:96px;height:120px;inset-inline-start:6%}
  .hexbg{width:240px}
  .gift-inner{grid-template-columns:1fr;text-align:center}
  .gift-art{height:230px}
  .g1{inset-inline-start:22%}.g2{inset-inline-start:52%}
  .burger{display:flex}
  .nav .btn{display:none}
  .nav nav{position:absolute;top:100%;inset-inline:0;background:#120b05;flex-direction:column;gap:0;padding:8px 6vw 16px;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(0,0,0,.6);display:none}
  .nav nav.open{display:flex}
  .nav nav a{padding:13px 0;border-bottom:1px solid rgba(217,164,65,.14)}
  .nav nav a::after{display:none}
  .sec{padding:64px 6vw}
}
@media (max-width:520px){
  body{font-size:16px}
  .topbar{font-size:12px}
  .card{padding:18px}
  .hero::after{height:60px}
  .foot-top{justify-content:center;text-align:center}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}

/* ---------- article pages ---------- */
.article-page main{background:var(--bg)}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:18px}
.crumbs a{color:var(--gold2)}
.crumbs a:hover{text-decoration:underline}
.article{max-width:780px;margin:0 auto;padding:56px 6vw 80px;text-align:start}
.article h1{font-family:var(--f-head);font-size:clamp(32px,4.4vw,48px);line-height:1.4;color:var(--cream);margin:10px 0 12px}
.article .meta{color:var(--muted);font-size:15px;margin:0 0 28px}
.article .lead{font-size:20px;color:var(--text);border-inline-start:3px solid var(--gold);padding-inline-start:16px;margin:0 0 32px}
.article h2{font-family:var(--f-head);font-size:30px;color:var(--gold2);margin:40px 0 10px;line-height:1.4}
.article h3{font-size:20px;color:var(--cream);margin:26px 0 6px}
.article p,.article li{font-size:18px;line-height:2;color:var(--text)}
.article ul,.article ol{padding-inline-start:24px;margin:8px 0 18px}
.article li{margin-bottom:6px}
.article strong{color:var(--cream)}
.article table{width:100%;border-collapse:collapse;margin:20px 0 28px;font-size:16px}
.article th,.article td{border:1px solid var(--line);padding:10px 12px;text-align:start;vertical-align:top}
.article th{background:var(--card2);color:var(--gold2)}
.article td{color:var(--text)}
.tablewrap{overflow-x:auto}
.note-box{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 20px;margin:24px 0;color:var(--muted);font-size:16px}
.cta-box{margin:44px 0 10px;background:linear-gradient(135deg,#2b1a09,#4a2d0e);border:1px solid var(--gold);border-radius:22px;padding:28px;text-align:center}
.cta-box h2{margin:0 0 8px;color:var(--cream)}
.cta-box p{margin:0 0 18px}
.related{margin-top:44px}
.related h2{font-size:26px}
.related ul{list-style:none;padding:0;display:grid;gap:10px}
.related a{display:block;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px;color:var(--cream);transition:.25s}
.related a:hover{border-color:var(--gold);transform:translateX(-4px)}

/* ---------- article cards (home + index) ---------- */
.art-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;max-width:1180px;margin:0 auto}
.art-card{display:flex;flex-direction:column;text-align:start;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;transition:.3s}
.art-card:hover{border-color:var(--gold);transform:translateY(-5px);background:var(--card2)}
.art-card .tag{font-size:13px;color:var(--gold);font-weight:700}
.art-card h3{font-family:var(--f-head);font-size:25px;color:var(--cream);margin:8px 0 6px;line-height:1.45}
.art-card p{color:var(--muted);font-size:16px;margin:0 0 16px}
.art-card .more{margin-top:auto;color:var(--gold2);font-weight:700}
.sec .more-link{display:inline-block;margin-top:30px}

.jar-maraai{--ha:#c9852a;--hb:#ecc062}
/* سلة المشتريات */
.no-scroll{overflow:hidden}
.buy-opts{display:flex;align-items:center;justify-content:center;gap:10px;margin:6px 0 10px;color:var(--gold2);font-weight:700}
.buy-opts .size{color:var(--muted);font-weight:500;font-size:15px}
.buy-opts select{background:var(--card2);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:8px 12px;font:inherit;font-size:15px}

.cart-fab{position:fixed;inset-inline-end:18px;bottom:18px;z-index:31;display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,#f0cd85,#d9a441 55%,#b87a1a);color:#1a0f05;border:0;border-radius:99px;padding:11px 18px;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.45)}
.cart-fab .cart-count{background:#1a0f05;color:var(--gold2);min-width:24px;height:24px;border-radius:99px;display:grid;place-items:center;font-size:14px;padding:0 6px}
.cart-fab:not(.has){opacity:.85}

.cart-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:40}
.cart-drawer{position:fixed;top:0;bottom:0;inset-inline-end:0;width:min(440px,100%);background:var(--bg2);border-inline-start:1px solid var(--line);z-index:41;display:flex;flex-direction:column;transform:translateX(-105%);transition:transform .3s;visibility:hidden}
html[dir="rtl"] .cart-drawer{transform:translateX(105%)}
.cart-drawer.open{transform:none!important;visibility:visible}
.cd-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.cd-head h2{margin:0;font-family:var(--f-head);color:var(--gold2);font-size:26px}
.cd-x{background:none;border:0;color:var(--text);font-size:32px;line-height:1;cursor:pointer}
.cd-body{overflow:auto;padding:14px 18px 28px}
.cd-empty{color:var(--muted);text-align:center;padding:30px 0}
.cd-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.cd-info b{display:block;color:var(--cream)}
.cd-info span{color:var(--muted);font-size:14px}
.cd-qty{display:flex;align-items:center;gap:8px}
.cd-qty button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:var(--card2);color:var(--gold2);font-size:18px;cursor:pointer;line-height:1}
.cd-qty i{font-style:normal;min-width:20px;text-align:center}
.cd-line{font-weight:700;color:var(--gold2);min-width:70px;text-align:end}
.cd-form{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.cd-form label{display:flex;flex-direction:column;gap:4px;font-size:15px;color:var(--muted)}
.cd-form input,.cd-form textarea{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font:inherit}
.cd-form .err{border-color:#ff7a3d}
.cd-ship,.cd-pay{font-size:14px;color:var(--muted);margin:4px 0;line-height:1.7}
.cd-total{display:flex;justify-content:space-between;font-size:20px;font-weight:800;color:var(--gold2);padding:8px 0;border-top:1px solid var(--line)}
.cd-send{width:100%;text-align:center}
.cd-bank{background:var(--card);border:1px dashed var(--gold);border-radius:14px;padding:0 14px;color:var(--cream)}
.cd-bank:not(:empty){padding:12px 14px}
.cd-bank h3{margin:0 0 6px;color:var(--gold2);font-size:17px}
.cd-bank dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px}
.cd-bank dt{color:var(--muted)}.cd-bank dd{margin:0;word-break:break-all}
@media (max-width:600px){.wa-float{bottom:78px}}