@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@300;400;500;600;700&display=swap');

/* ============================================================
   CLEAN LUXURY DESIGN TOKENS — production baseline
   Light is the default. Dark mode is applied only via html[data-theme="dark"].
   ============================================================ */
:root{
  --bg-main:#F6F1EB;
  --bg-soft:#EFE7DD;
  --primary:#8B5E3C;
  --primary-dark:#5A3E2B;
  --accent:#C49A6C;
  --text-main:#2B2B2B;
  --text-soft:#6B5E55;
  --border-soft:rgba(0,0,0,0.08);

  /* Backward-compatible aliases used by the existing codebase. */
  --page-bg:var(--bg-main);
  --bg:var(--bg-main);
  --surface:#FFFFFF;
  --surface-2:var(--bg-soft);
  --surface-3:#E4D4C3;
  --card:#FFFFFF;
  --soft:var(--text-main);
  --text:var(--text-main);
  --muted:var(--text-soft);
  --muted-2:#85766B;
  --line:var(--border-soft);
  --gold:var(--accent);
  --gold-2:#D8B98D;
  --accent-2:#A8734D;
  --camel:var(--primary);
  --brown:var(--primary-dark);
  --cream:#FFF8F0;
  --espresso:#24170F;
  --shadow:0 18px 48px rgba(43,43,43,.10);
  --shadow-soft:0 10px 28px rgba(43,43,43,.08);
  --radius:18px;
  --radius-lg:26px;
  --radius-xl:36px;
  --container:min(1200px, calc(100% - 48px));
  --container-wide:min(1360px, calc(100% - 48px));
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --transition:all .24s cubic-bezier(.22,.61,.36,1);
}
html[data-theme="dark"]{
  --bg-main:#0F0B08;
  --bg-soft:#17110D;
  --primary:#C49A6C;
  --primary-dark:#8B5E3C;
  --accent:#E1B878;
  --text-main:#F8EFE5;
  --text-soft:#C8B8AA;
  --border-soft:rgba(255,255,255,.10);

  --page-bg:var(--bg-main);
  --bg:var(--bg-main);
  --surface:#17110D;
  --surface-2:#211711;
  --surface-3:#2B1D15;
  --card:#18110D;
  --soft:var(--text-main);
  --text:var(--text-main);
  --muted:var(--text-soft);
  --muted-2:#A99584;
  --line:var(--border-soft);
  --gold:var(--accent);
  --gold-2:#F0D19B;
  --accent-2:#C98754;
  --camel:#C98754;
  --brown:#2B1D15;
  --cream:#F8EFE5;
  --espresso:#090604;
  --shadow:0 22px 58px rgba(0,0,0,.34);
  --shadow-soft:0 12px 36px rgba(0,0,0,.24);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--sans);
  background:
    radial-gradient(circle at 10% 0%, rgba(201,133,93,.16), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(185,138,86,.13), transparent 26%),
    linear-gradient(180deg,#120c09 0%, #1b120e 35%, #120c09 100%);
  color:var(--text);
  line-height:1.7;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
main{position:relative;z-index:2}
.container{width:var(--container);margin:0 auto}
.container-wide{width:var(--container-wide);margin:0 auto}
.grain{
  pointer-events:none;
  position:fixed;
  inset:0;
  z-index:0;
  opacity:.06;
  background-image:
    radial-gradient(circle at 25% 20%, rgba(255,255,255,.45) 0 1px, transparent 1px),
    radial-gradient(circle at 70% 80%, rgba(255,255,255,.35) 0 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.25) 0 1px, transparent 1px);
  background-size:180px 180px, 240px 240px, 140px 140px;
}
.section{padding:110px 0;position:relative}
.section-heading{max-width:740px;margin-bottom:46px}
.section-heading.center{margin-inline:auto;text-align:center}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-transform:uppercase;
  letter-spacing:.25em;
  font-size:.72rem;
  color:var(--gold-2);
  font-weight:700;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:34px;
  height:1px;
  background:linear-gradient(90deg,var(--gold),transparent);
}
h1,h2,h3,h4{
  margin:0 0 18px;
  font-family:var(--serif);
  line-height:1.05;
  font-weight:700;
  letter-spacing:-.02em;
}
h1{font-size:clamp(3.4rem, 7vw, 6.6rem)}
h2{font-size:clamp(2.1rem, 4vw, 3.6rem)}
h3{font-size:clamp(1.35rem, 2vw, 1.8rem)}
p{margin:0 0 18px;color:var(--muted)}
ul{margin:0;padding-left:18px}
.center{text-align:center}
.mt-40{margin-top:40px}

.topbar{
  border-bottom:1px solid rgba(255,255,255,.05);
  background:rgba(13,9,7,.7);
  backdrop-filter:blur(16px);
}
.topbar-inner{
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:.8rem;
  color:var(--muted-2);
  padding:10px 0;
}
.site-header{
  position:sticky;
  top:0;
  z-index:50;
}
.nav-shell{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:12px 0;
  background:rgba(15,10,8,.74);
  backdrop-filter:blur(18px);
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:max-content;
  text-decoration:none;
}

/* Brand mark: acts as a controlled, non-distorting container whether the
   real logo PNG is present or the "CM" text fallback is visible. The image
   sits at 80% of the pad so there's a consistent optical margin around it. */
.brand-mark{
  width:48px;
  height:48px;
  border-radius:16px;
  border:1px solid rgba(199,164,104,.35);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
  font-family:var(--serif);
  font-size:1.05rem;
  color:var(--gold-2);
  background:linear-gradient(180deg, rgba(199,164,104,.12), rgba(255,255,255,.02));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  flex-shrink:0;
}
.brand-mark img.brand-logo{
  display:block;
  width:80%;
  height:80%;
  max-width:80%;
  max-height:80%;
  object-fit:contain;      /* never distort the logo */
  object-position:center;
  /* The logo image renders on top of the "CM" text fallback. If it fails to
     load, JS sets .brand-logo--missing on the <img> and the fallback shows. */
  position:relative;
  z-index:2;
  background:transparent;
}
.brand-mark img.brand-logo.brand-logo--missing{display:none}
.brand-mark .brand-mark-fallback{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-family:var(--serif);
  font-size:1.05rem;
  color:var(--gold-2);
  pointer-events:none;
  z-index:1;
}

/* Footer uses the same component at a slightly smaller scale. */
.footer-brand .brand-mark{
  width:44px;
  height:44px;
  border-radius:14px;
}

/* Light-mode — give the logo a subtle neutral plate so a dark logo on a
   light background still reads, and inversely a light logo on dark. */
html[data-theme="light"] .brand-mark{
  background:linear-gradient(180deg, rgba(199,164,104,.10), rgba(0,0,0,.02));
  border-color:rgba(199,164,104,.45);
}

/* Admin sidebar brand mark is smaller by design. */
.sidebar-brand .brand-mark{width:42px;height:42px;border-radius:12px;font-size:.95rem}
.admin-login-card .brand .brand-mark{width:52px;height:52px;border-radius:16px;font-size:1.1rem}

/* Responsive sizes — keep the brand proportional but let small phones
   shrink so the header doesn't overflow. */
@media (max-width:980px){
  .brand-mark{width:44px;height:44px;border-radius:14px;font-size:.98rem}
  .footer-brand .brand-mark{width:40px;height:40px}
}
@media (max-width:720px){
  .brand-mark{width:40px;height:40px;border-radius:12px;font-size:.92rem}
  .footer-brand .brand-mark{width:38px;height:38px;border-radius:11px}
}

.brand-text{
  display:grid;
  gap:4px;
}
.brand-text strong{font-family:var(--serif);font-size:1.1rem}
.brand-text small{color:var(--muted-2);letter-spacing:.08em;text-transform:uppercase;font-size:.68rem}
.main-nav ul{
  display:flex;
  align-items:center;
  gap:28px;
  list-style:none;
  padding:0;
}
.main-nav a{
  position:relative;
  color:#e7dbcf;
  font-size:.96rem;
}
.main-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-10px;
  width:100%;
  height:1px;
  transform:scaleX(0);
  transform-origin:left;
  background:linear-gradient(90deg,var(--gold),transparent);
  transition:var(--transition);
}
.main-nav a:hover::after,
.main-nav a.active::after{transform:scaleX(1)}
.main-nav a.active{color:#fff}
.nav-actions{
  display:flex;
  align-items:center;
  gap:14px;
}
.link-chip,.cart-pill{
  border:1px solid rgba(255,255,255,.08);
  padding:12px 16px;
  border-radius:999px;
  color:#f4ede6;
  background:rgba(255,255,255,.02);
}
.cart-pill{
  display:flex;
  align-items:center;
  gap:10px;
}
.cart-count{
  min-width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:var(--gold);
  color:#120d0a;
  font-size:.8rem;
  font-weight:700;
}
.nav-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  border:0;
  background:none;
  padding:0;
}
.nav-toggle span{
  width:26px;height:2px;background:#fff;display:block;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:15px 24px;
  border-radius:999px;
  border:1px solid transparent;
  transition:var(--transition);
  font-weight:600;
}
.btn-gold{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
  box-shadow:0 15px 30px rgba(199,164,104,.22);
}
.btn-gold:hover{transform:translateY(-3px)}
.btn-ghost{
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.02);
  color:var(--text);
}
.btn-outline{
  border-color:rgba(199,164,104,.45);
  color:var(--gold-2);
  background:transparent;
}
.full-width{width:100%}
.text-link{
  color:var(--gold-2);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.text-link::after{content:"→";transition:var(--transition)}
.text-link:hover::after{transform:translateX(4px)}

.hero{
  padding:70px 0 70px;
  position:relative;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:40px;
  align-items:center;
}
.hero-copy p{
  max-width:650px;
  font-size:1.05rem;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
}
.hero-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:36px;
}
.hero-metrics div{
  padding:20px 18px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
}
.hero-metrics strong{display:block;font-family:var(--serif);font-size:1.05rem;margin-bottom:6px}
.hero-metrics span{color:var(--muted-2);font-size:.92rem}

.frame-stack{
  position:relative;
  min-height:640px;
}
.hero-card{
  position:absolute;
  border-radius:36px;
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.08);
}
.hero-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-card-main{
  inset:30px 80px 40px 0;
  transform:rotate(-7deg);
}
.hero-card-side{
  width:260px;
  height:340px;
  right:20px;
  top:0;
  transform:rotate(9deg);
}
.floating-note,
.floating-badge{
  position:absolute;
  backdrop-filter:blur(18px);
  background:rgba(17,12,9,.76);
  border:1px solid rgba(199,164,104,.24);
  box-shadow:var(--shadow-soft);
}
.floating-note{
  left:40px;
  bottom:18px;
  max-width:280px;
  padding:22px;
  border-radius:24px;
}
.note-label,.tag{
  display:inline-block;
  margin-bottom:10px;
  color:#120d0a;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  padding:7px 12px;
  border-radius:999px;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:700;
}
.floating-note strong{font-family:var(--serif);font-size:1.35rem;line-height:1.2}
.floating-badge{
  right:46px;
  bottom:90px;
  padding:18px 20px;
  border-radius:22px;
  display:grid;
}
.floating-badge span{
  color:var(--muted-2);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.7rem;
}
.floating-badge strong{
  font-family:var(--serif);
  font-size:1.2rem;
  margin-top:6px;
}

.editorial-section{
  padding-top:60px;
}
.split-showcase{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:58px;
  align-items:center;
}
.showcase-image img,
.arched-card img,
.narrative-card img,
.contact-card,
.product-gallery-main img{
  box-shadow:var(--shadow-soft);
}
.showcase-image img{
  border-radius:32px;
  min-height:620px;
  object-fit:cover;
  width:100%;
}
.signature-points{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:30px;
}
.signature-points article{
  padding:24px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.07);
}
.signature-points p{font-size:.96rem;margin-bottom:0}

.dark-band{
  background:
    radial-gradient(circle at top left, rgba(199,164,104,.14), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.featured-grid,
.catalogue-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.product-card{
  display:flex;
  flex-direction:column;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  overflow:hidden;
  transition:var(--transition);
  position:relative;
}
.product-card:hover{
  transform:translateY(-6px);
  border-color:rgba(199,164,104,.38);
  box-shadow:0 24px 48px -24px rgba(199,164,104,.22);
}
.product-media{
  position:relative;
  aspect-ratio:4/4.2;
  overflow:hidden;
  background:#1a120d;
}
.product-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .8s ease;
}
.product-card:hover .product-media img{transform:scale(1.05)}
.product-badge{
  position:absolute;
  left:14px;
  top:14px;
  background:rgba(16,11,8,.88);
  border:1px solid rgba(199,164,104,.3);
  color:var(--gold-2);
  padding:6px 10px;
  border-radius:999px;
  font-size:.66rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
}
.product-body{
  padding:18px 18px 20px;
  display:grid;
  gap:8px;
}
.product-topline{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.product-card h3{
  font-size:1.18rem;
  margin-bottom:2px;
  line-height:1.25;
}
.product-collection{
  color:var(--muted-2);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.66rem;
}
.price{
  font-weight:700;
  font-size:1.02rem;
  color:var(--gold-2);
  white-space:nowrap;
  font-family:var(--serif);
}
.product-card p{
  margin:0;
  font-size:.9rem;
  color:var(--muted);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-actions{
  display:flex;
  gap:8px;
  margin-top:10px;
}
.product-actions .btn{
  flex:1;
  padding:10px 12px;
  font-size:.86rem;
}
.btn-small{padding:10px 14px;font-size:.88rem}

.collection-band{
  padding-top:70px;
  padding-bottom:70px;
}
.collection-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.collection-panel{
  padding:34px;
  border-radius:30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    radial-gradient(circle at top right, rgba(199,164,104,.12), transparent 30%);
  border:1px solid rgba(255,255,255,.08);
}
.collection-panel h3{max-width:300px}

.story-ribbon .ribbon-layout{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:50px;
  align-items:center;
}
.lux-list{
  list-style:none;
  padding:0;
  display:grid;
  gap:16px;
  margin-top:22px;
}
.lux-list li{
  position:relative;
  padding-left:26px;
  color:#ddd0c3;
}
.lux-list li::before{
  content:"";
  width:10px;height:10px;border-radius:50%;
  position:absolute;left:0;top:10px;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
}
.arched-card{
  border-radius:300px 300px 26px 26px;
  overflow:hidden;
  padding:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.arched-card img{
  border-radius:260px 260px 18px 18px;
  width:100%;
  min-height:580px;
  object-fit:cover;
}

.process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.process-card{
  padding:28px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
}
.process-card span{
  display:inline-grid;
  place-items:center;
  width:44px;height:44px;border-radius:50%;
  background:rgba(199,164,104,.12);
  color:var(--gold-2);
  margin-bottom:18px;
  font-weight:700;
}
.process-card p{margin-bottom:0}

.testimonials-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.testimonial{
  padding:34px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
}
.testimonial p{
  color:#f3e9df;
  font-family:var(--serif);
  font-size:1.45rem;
  line-height:1.35;
}
.testimonial cite{color:var(--muted-2)}

.faq-preview-grid{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:36px;
  align-items:start;
}
.accordion-group{
  display:grid;
  gap:14px;
}
.accordion-group details{
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  padding:0 22px;
}
.accordion-group summary{
  list-style:none;
  cursor:pointer;
  padding:22px 0;
  font-weight:600;
  color:#f7f0e8;
}
.accordion-group summary::-webkit-details-marker{display:none}
.accordion-group p{padding-bottom:20px;margin:0}

.cta-banner{padding-top:30px}
.cta-shell{
  padding:34px 38px;
  border-radius:34px;
  background:
    linear-gradient(120deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    radial-gradient(circle at left, rgba(199,164,104,.16), transparent 35%);
  border:1px solid rgba(255,255,255,.08);
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
}

.page-hero{
  padding:56px 0 22px;
}
.compact-hero{padding-bottom:6px}
.page-hero-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:34px;
  align-items:end;
}
.stats-ribbon{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.stats-ribbon div{
  padding:22px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.stats-ribbon strong{
  display:block;
  font-family:var(--serif);
  font-size:1.1rem;
  margin-bottom:6px;
}
.stats-ribbon span{color:var(--muted-2)}

.hero-image-stack{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.hero-image-stack img{
  width:100%;
  border-radius:28px;
  min-height:330px;
  object-fit:cover;
  box-shadow:var(--shadow-soft);
}
.hero-image-stack img:last-child{margin-top:40px}

.boutique-layout{
  display:grid;
  grid-template-columns:300px 1fr;
  gap:30px;
  align-items:start;
}
.filter-panel{
  position:sticky;
  top:122px;
  padding:28px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
}
.filter-group{margin-top:24px}
.filter-group label{display:block;margin-bottom:12px;font-weight:600}
.filter-panel input,.filter-panel select,
.contact-form input,.contact-form textarea,
.checkout-form input,.checkout-form textarea{
  width:100%;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:#fff;
  padding:15px 16px;
  outline:none;
}
.filter-panel input::placeholder,
.contact-form input::placeholder,
.contact-form textarea::placeholder,
.checkout-form input::placeholder,
.checkout-form textarea::placeholder{color:#a89684}
.filter-panel select option{background:#1a130f}
.chip-group{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  color:var(--muted);
  padding:10px 14px;
  border-radius:999px;
  transition:var(--transition);
}
.chip.active,.chip:hover{
  color:#120d0a;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  border-color:transparent;
}
.catalogue-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:20px;
  margin-bottom:28px;
}
.toolbar-copy{max-width:340px;text-align:right}
.filter-note{
  margin-top:24px;
  padding:18px;
  border-radius:20px;
  background:rgba(199,164,104,.07);
  border:1px solid rgba(199,164,104,.18);
}

.narrative-cards{
  display:grid;
  gap:28px;
}
.narrative-card{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:30px;
  align-items:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:34px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  padding:18px;
}
.narrative-card.reverse{grid-template-columns:.98fr 1.02fr}
.narrative-card.reverse > div{order:2}
.narrative-card img{
  border-radius:26px;
  width:100%;
  min-height:420px;
  object-fit:cover;
}

.heritage-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:30px;
}
.heritage-copy{
  padding:42px;
  border-radius:34px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.quote-card{
  min-height:100%;
  display:grid;
  place-items:center;
  padding:50px;
  border-radius:34px;
  background:
    radial-gradient(circle at top right, rgba(199,164,104,.16), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.quote-card p{
  font-family:var(--serif);
  font-size:2rem;
  line-height:1.25;
  color:#fff;
  margin:0;
}

.timeline{
  display:grid;
  gap:18px;
}
.timeline-item{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:22px;
  align-items:start;
  padding:24px 28px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
}
.timeline-item span{
  width:60px;height:60px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(199,164,104,.12);
  color:var(--gold-2);
  font-weight:700;
  font-size:1.1rem;
}

.craft-columns{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.craft-card{
  padding:34px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    radial-gradient(circle at top right, rgba(199,164,104,.1), transparent 40%);
}

.contact-layout{
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:28px;
  align-items:start;
}
.contact-cards{
  display:grid;
  gap:18px;
}
.contact-card,.contact-form,.checkout-form,.summary-card,.legal-layout,
.filter-panel,.cart-items-panel{
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.contact-card{
  padding:28px;
  border-radius:26px;
}
.contact-form,.checkout-form{
  padding:34px;
  border-radius:30px;
}
.form-heading{margin-bottom:26px}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}
.form-grid label{
  display:grid;
  gap:10px;
}
.form-grid .full{grid-column:1/-1}
.form-grid span{font-size:.94rem;color:#ddd0c3}
textarea{resize:vertical;min-height:140px}

.faq-page-layout{max-width:900px}
.legal-layout{
  padding:30px;
  border-radius:30px;
  display:grid;
  gap:20px;
}
.legal-block{
  padding:26px;
  border-radius:24px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.legal-block h2{font-size:1.5rem}

.product-detail{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:34px;
  align-items:start;
}
/* gallery sticky is on .product-gallery-wrap; main has position:relative via later rules */
.product-info{
  padding:10px 0;
}
.product-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:18px;
}
.meta-pill{
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:#dfcfbe;
  font-size:.88rem;
}
.product-price-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  margin:24px 0;
}
.product-price-value{
  font-size:2rem;
  font-family:var(--serif);
  color:#fff;
}
.product-actions-row{
  display:flex;
  gap:12px;
  margin-bottom:24px;
}
.qty-box{
  display:flex;
  align-items:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  overflow:hidden;
}
.qty-box button{
  width:42px;height:48px;
  background:transparent;
  color:#fff;
  border:0;
}
.qty-box input{
  width:56px;
  text-align:center;
  border:0;
  background:transparent;
  color:#fff;
}
.product-details-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin-top:24px;
}
.detail-card{
  padding:20px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
.detail-card h3{font-size:1.1rem;margin-bottom:8px}
.material-list{
  list-style:none;
  padding:0;
  display:grid;
  gap:10px;
}
.material-list li{
  padding-left:22px;
  position:relative;
}
.material-list li::before{
  content:"";
  position:absolute;left:0;top:10px;
  width:8px;height:8px;border-radius:50%;
  background:var(--gold);
}

.cart-layout,.checkout-layout{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:28px;
  align-items:start;
}
.cart-items-panel{
  border-radius:30px;
  padding:24px;
}
.cart-item{
  display:grid;
  grid-template-columns:124px 1fr auto;
  gap:18px;
  align-items:center;
  padding:18px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.cart-item:last-child{border-bottom:0}
.cart-item img{
  width:124px;height:124px;object-fit:cover;border-radius:18px;
}
.cart-item h3{font-size:1.3rem;margin-bottom:8px}
.cart-item .cart-meta{color:var(--muted-2);font-size:.9rem}
.qty-inline{
  display:flex;align-items:center;gap:10px;margin-top:12px;
}
.qty-inline button{
  width:34px;height:34px;border-radius:50%;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
  color:#fff;
}
.remove-link{
  background:none;border:0;color:#d3b080;padding:0;
}
.summary-card{
  padding:28px;
  border-radius:30px;
  position:sticky;
  top:118px;
}
.summary-line{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:16px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.summary-line.total{
  font-size:1.08rem;
  color:#fff;
}
.summary-line:last-of-type{margin-bottom:18px}
.empty-state{
  padding:34px;
  text-align:center;
  border-radius:28px;
  background:rgba(255,255,255,.02);
  border:1px dashed rgba(255,255,255,.12);
}
.payment-box{
  margin:26px 0;
  padding:22px;
  border-radius:24px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
}
.payment-option{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:14px;
  color:#e7dbcf;
}
.checkout-items{
  display:grid;
  gap:12px;
  margin-bottom:10px;
}
.checkout-line{
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:.95rem;
}
.checkout-line span:last-child{color:#fff}
.notice{
  padding:18px 20px;
  border-radius:22px;
  background:rgba(199,164,104,.08);
  border:1px solid rgba(199,164,104,.18);
  color:#f2e5d8;
}

.site-footer{
  position:relative;
  z-index:3;
  margin-top:110px;
  padding:56px 0 26px;
  border-top:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.015), rgba(0,0,0,.02));
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr .8fr .8fr;
  gap:30px;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:18px;
}
.footer-links,
.footer-contact{
  list-style:none;
  padding:0;
  display:grid;
  gap:10px;
}
.footer-links a,.footer-contact a{color:var(--muted)}
.footer-links a:hover,.footer-contact a:hover{color:#fff}
.newsletter-card{
  padding:22px;
  border-radius:24px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
}
.newsletter-form{
  display:grid;
  gap:12px;
  margin-top:14px;
}
.newsletter-form input{
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#fff;
  padding:14px 16px;
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  margin-top:40px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.06);
  color:var(--muted-2);
  font-size:.9rem;
}
.footer-mini-links{display:flex;gap:14px;flex-wrap:wrap}

.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .85s ease, transform .85s ease;
}
.reveal.in-view{
  opacity:1;
  transform:none;
}

.hidden{display:none!important}


/* === Theme toggle, light mode, chatbot, custom design, conversion UX === */
:root{
  --body-bg:
    radial-gradient(circle at 10% 0%, rgba(201,133,93,.16), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(185,138,86,.13), transparent 26%),
    linear-gradient(180deg,#120c09 0%, #1b120e 35%, #120c09 100%);
  --topbar-bg:rgba(14,9,7,.75);
  --nav-bg:rgba(18,12,9,.78);
  --chip-bg:rgba(255,255,255,.02);
  --chip-border:rgba(255,255,255,.08);
  --nav-link:#e7dbcf;
  --nav-link-active:#fff;
  --soft-text:#150f0c;
  --panel-highlight:rgba(255,255,255,.03);
  --card-elevated:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  --whatsapp:#c7a468;
}
html[data-theme="light"]{
  --bg:#fbf3ea;
  --surface:#fffaf4;
  --surface-2:#f3e3d5;
  --surface-3:#ead3bf;
  --card:#fffaf4;
  --soft:#2b1710;
  --text:#2b1710;
  --muted:#755844;
  --muted-2:#927562;
  --line:rgba(77,45,30,.14);
  --gold:#d6a85f;
  --gold-2:#f0cb83;
  --accent:#9c5b3a;
  --accent-2:#bc7550;
  --camel:#9c5b3a;
  --brown:#2b1710;
  --cream:#fffaf4;
  --shadow:0 24px 80px rgba(79,55,33,.14);
  --shadow-soft:0 16px 40px rgba(79,55,33,.12);
  --body-bg:
    radial-gradient(circle at 10% 0%, rgba(156,91,58,.14), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(214,168,95,.16), transparent 24%),
    linear-gradient(180deg,#fbf3ea 0%, #f3e3d5 48%, #fbf3ea 100%);
  --topbar-bg:rgba(255,250,244,.92);
  --nav-bg:rgba(255,252,247,.92);
  --chip-bg:rgba(255,255,255,.66);
  --chip-border:rgba(73,45,26,.1);
  --nav-link:#523828;
  --nav-link-active:#1e120d;
  --soft-text:#28180f;
  --panel-highlight:rgba(255,255,255,.76);
  --card-elevated:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,248,241,.74));
  --whatsapp:#1f9f69;
}
body{
  background:var(--body-bg);
  color:var(--text);
  transition:background .45s ease, color .45s ease;
}
body, .site-header, .topbar, .nav-shell, .link-chip, .cart-pill, .collection-panel, .process-card, .testimonial,
.product-card, .filter-panel, .contact-card, .contact-form, .newsletter-card, .site-footer, .faq-list details,
.detail-card, .cart-item, .cart-summary, .checkout-card, .legal-card, .timeline-item, .cta-shell, .narrative-card,
.stats-ribbon > div, .floating-note, .floating-badge, .hero-card, .product-gallery-main, .chatbot-shell,
.chatbot-card, .custom-form-shell, .trust-card, .mini-testimonial, .sales-reassurance, .conversion-strip,
.sticky-contact-panel, .theme-toggle, .upload-placeholder, .product-cta-stack .btn, .contact-shortcut{
  transition:background .45s ease, color .45s ease, border-color .45s ease, box-shadow .45s ease, transform .35s ease;
}
.topbar{
  background:var(--topbar-bg);
  border-bottom-color:var(--line);
}
.nav-shell{background:var(--nav-bg)}
.main-nav a{color:var(--nav-link)}
.main-nav a.active{color:var(--nav-link-active)}
.link-chip,.cart-pill,.theme-toggle,.contact-shortcut{
  background:var(--chip-bg);
  border-color:var(--chip-border);
  color:var(--text);
}
.btn-ghost{
  background:var(--chip-bg);
  border-color:var(--chip-border);
}
.hero-card,.product-card,.filter-panel,.contact-card,.contact-form,.newsletter-card,.detail-card,.cart-summary,
.checkout-card,.legal-card,.timeline-item,.faq-list details,.narrative-card,.custom-form-shell,.trust-card,
.mini-testimonial,.sales-reassurance,.conversion-strip,.sticky-contact-panel{
  background:var(--card-elevated);
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
}
.stats-ribbon > div,
.floating-note,
.floating-badge{
  background:color-mix(in srgb, var(--surface) 86%, transparent);
  border:1px solid var(--line);
}
.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  font-weight:600;
}
.theme-toggle:hover{transform:translateY(-2px)}
.theme-toggle .theme-toggle-icon{
  width:26px;
  height:26px;
  border-radius:999px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  font-size:.9rem;
}
html[data-theme="light"] .theme-toggle .theme-toggle-icon{background:rgba(73,45,26,.05)}
.btn-whatsapp{
  background:linear-gradient(135deg, color-mix(in srgb, var(--whatsapp) 78%, white), var(--whatsapp));
  color:#fff;
  box-shadow:0 14px 30px color-mix(in srgb, var(--whatsapp) 22%, transparent);
}
.btn-whatsapp:hover{transform:translateY(-3px)}
.contact-shortcut{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 18px;
  border-radius:999px;
  font-weight:600;
}
.conversion-strip{
  margin:34px 0 0;
  padding:22px;
  border-radius:26px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.conversion-strip strong{display:block;font-family:var(--serif);font-size:1.1rem;margin-bottom:6px;color:var(--text)}
.conversion-strip span{color:var(--muted);font-size:.95rem}
.custom-design-teaser{
  overflow:hidden;
}
.custom-design-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:32px;
  align-items:stretch;
}
.custom-design-content,
.custom-design-aside{
  position:relative;
  padding:34px;
  border-radius:32px;
  background:var(--card-elevated);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}
.custom-design-content::before,
.custom-design-aside::before,
.chatbot-card::before,
.sticky-contact-panel::before,
.custom-form-shell::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(199,164,104,.14), transparent 42%);
}
.custom-bullets{list-style:none;padding:0;display:grid;gap:12px;margin:28px 0}
.custom-bullets li{
  padding:14px 18px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  color:var(--muted);
}
html[data-theme="light"] .custom-bullets li{background:rgba(255,255,255,.72)}
.dual-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.trust-stack{display:grid;gap:16px;margin-top:24px}
.trust-card{padding:18px 20px;border-radius:22px}
.trust-card strong{display:block;margin-bottom:8px;color:var(--text);font-family:var(--serif)}
.custom-page-layout{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:28px;
  align-items:start;
}
.custom-form-shell{padding:34px;border-radius:32px;position:relative;overflow:hidden}
.custom-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.custom-form-grid label,
.contact-form label{display:grid;gap:8px}
.custom-form-grid label span,
.contact-form label span{font-size:.86rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);font-weight:700}
.custom-form-grid input,
.custom-form-grid select,
.custom-form-grid textarea,
.contact-form input,
.contact-form textarea,
.filter-group input,
.filter-group select,
.checkout-form input,
.checkout-form textarea{
  width:100%;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  color:var(--text);
  padding:14px 16px;
  outline:none;
}
html[data-theme="light"] .custom-form-grid input,
html[data-theme="light"] .custom-form-grid select,
html[data-theme="light"] .custom-form-grid textarea,
html[data-theme="light"] .contact-form input,
html[data-theme="light"] .contact-form textarea,
html[data-theme="light"] .filter-group input,
html[data-theme="light"] .filter-group select,
html[data-theme="light"] .checkout-form input,
html[data-theme="light"] .checkout-form textarea{
  background:rgba(255,255,255,.72);
}
.custom-form-grid .full{grid-column:1/-1}
.upload-placeholder{
  display:grid;
  place-items:center;
  gap:10px;
  min-height:154px;
  padding:22px;
  border-radius:24px;
  border:1px dashed color-mix(in srgb, var(--gold) 46%, transparent);
  background:rgba(255,255,255,.02);
  text-align:center;
}
.upload-placeholder small{color:var(--muted)}
.custom-note{
  margin-top:18px;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(199,164,104,.09);
  border:1px solid rgba(199,164,104,.22);
  color:var(--text);
}
.sales-reassurance-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:28px;
}
.sales-reassurance{padding:20px;border-radius:22px}
.sales-reassurance strong{display:block;margin-bottom:8px;color:var(--text);font-family:var(--serif)}
.product-cta-stack{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.product-assurance{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:26px;
}
.product-assurance .trust-card{padding:16px 18px}
.mini-testimonials{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:30px;
}
.mini-testimonial{padding:20px;border-radius:22px}
.mini-testimonial p{margin-bottom:12px}
.mini-testimonial cite{color:var(--muted-2);font-style:normal}
/* Chatbot */
.chatbot-shell,
.floating-contact-stack{
  position:fixed;
  right:20px;
  z-index:65;
}
.chatbot-shell{bottom:20px}
.floating-contact-stack{bottom:96px;display:grid;gap:12px}
.chatbot-toggle,
.sticky-contact-btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(199,164,104,.22);
  background:rgba(17,12,9,.96);
  color:#fff;
  border-radius:999px;
  padding:14px 18px;
  box-shadow:var(--shadow);
}
html[data-theme="light"] .chatbot-toggle,
html[data-theme="light"] .sticky-contact-btn{
  background:rgba(255,255,255,.96);
  color:var(--text);
  border-color:rgba(73,45,26,.12);
}
.chatbot-toggle .dot,
.sticky-contact-btn .dot{
  width:10px;height:10px;border-radius:999px;background:var(--gold);
  box-shadow:0 0 0 8px rgba(199,164,104,.12);
}
.chatbot-panel{
  position:absolute;
  right:0;
  bottom:82px;
  width:min(390px, calc(100vw - 28px));
  opacity:0;
  pointer-events:none;
  transform:translateY(18px) scale(.98);
  transition:var(--transition);
}
.chatbot-shell.open .chatbot-panel{
  opacity:1;
  pointer-events:auto;
  transform:none;
}
.chatbot-card{
  position:relative;
  overflow:hidden;
  border-radius:30px;
  background:rgba(17,12,9,.98);
  color:#fff;
  border:1px solid rgba(199,164,104,.22);
  box-shadow:var(--shadow);
}
html[data-theme="light"] .chatbot-card{
  background:rgba(255,252,248,.98);
  color:var(--text);
  border-color:rgba(73,45,26,.12);
}
.chatbot-header,
.chatbot-footer,
.chatbot-body{position:relative;z-index:1}
.chatbot-header{
  padding:20px 22px 14px;
  border-bottom:1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
html[data-theme="light"] .chatbot-header{border-bottom-color:rgba(73,45,26,.08)}
.chatbot-header strong{display:block;font-family:var(--serif);font-size:1.2rem}
.chatbot-header span{display:block;color:var(--muted);font-size:.92rem;margin-top:6px}
.chatbot-close{
  width:38px;height:38px;border-radius:999px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);color:inherit
}
html[data-theme="light"] .chatbot-close{border-color:rgba(73,45,26,.08);background:rgba(255,255,255,.7)}
.chatbot-body{padding:18px 18px 10px;max-height:420px;overflow:auto;display:grid;gap:12px}
.chatbot-message{
  max-width:88%;
  padding:14px 16px;
  border-radius:20px;
  font-size:.96rem;
  line-height:1.55;
}
.chatbot-message.bot{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}
.chatbot-message.user{
  margin-left:auto;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
}
html[data-theme="light"] .chatbot-message.bot{
  background:rgba(73,45,26,.05);
  border-color:rgba(73,45,26,.08);
}
.chatbot-quick-replies{display:flex;flex-wrap:wrap;gap:10px;padding:4px 18px 14px}
.quick-reply{
  border-radius:999px;
  border:1px solid rgba(199,164,104,.22);
  padding:10px 14px;
  background:rgba(255,255,255,.04);
  color:inherit;
}
html[data-theme="light"] .quick-reply{background:rgba(73,45,26,.05);border-color:rgba(73,45,26,.12)}
.chatbot-footer{
  padding:14px 18px 18px;
  border-top:1px solid rgba(255,255,255,.08);
  display:grid;
  gap:12px;
}
html[data-theme="light"] .chatbot-footer{border-top-color:rgba(73,45,26,.08)}
.chatbot-input-row{display:flex;gap:10px}
.chatbot-input{
  flex:1;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:inherit;
  padding:14px 16px;
}
html[data-theme="light"] .chatbot-input{background:rgba(73,45,26,.04);border-color:rgba(73,45,26,.1)}
.chatbot-send{
  min-width:54px;
  border-radius:18px;
  border:none;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
  font-weight:700;
}
.chatbot-cta-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.chatbot-cta-row a{
  text-align:center;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:inherit;
  font-size:.93rem;
  font-weight:600;
}
html[data-theme="light"] .chatbot-cta-row a{background:rgba(73,45,26,.05);border-color:rgba(73,45,26,.1)}
.chatbot-cta-row a.primary{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#150f0c;border-color:transparent}
.chatbot-empty-note{padding:6px 18px 0;color:var(--muted);font-size:.85rem}
.sticky-contact-panel{
  position:absolute;
  right:0;
  bottom:74px;
  width:270px;
  padding:18px;
  border-radius:24px;
  opacity:0;
  pointer-events:none;
  transform:translateY(12px);
}
.floating-contact-stack.open .sticky-contact-panel{opacity:1;pointer-events:auto;transform:none}
.sticky-contact-panel strong{display:block;margin-bottom:8px;font-family:var(--serif)}
.sticky-contact-links{display:grid;gap:10px;margin-top:14px}
.sticky-contact-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
}
html[data-theme="light"] .sticky-contact-links a{background:rgba(255,255,255,.72)}
.section-subtle{
  color:var(--muted);
  max-width:700px;
}
.notice-compact{
  margin-top:12px;
  color:var(--muted-2);
  font-size:.92rem;
}
html[data-theme="light"] .site-footer,
html[data-theme="light"] .dark-band{
  background:linear-gradient(180deg, rgba(58,35,23,.06), rgba(255,255,255,.24));
}
html[data-theme="light"] .hero-card,
html[data-theme="light"] .hero-card-main,
html[data-theme="light"] .hero-card-side,
html[data-theme="light"] .product-gallery-main,
html[data-theme="light"] .arched-card,
html[data-theme="light"] .showcase-image,
html[data-theme="light"] .narrative-card > div:first-child{
  box-shadow:var(--shadow);
}

/* ============================================================
   DARK MODE BUG FIXES — hardcoded colors invisible in light mode
   ============================================================ */
html[data-theme="light"] .price{color:var(--text)}
html[data-theme="light"] .product-price-value{color:var(--text)}
html[data-theme="light"] .accordion-group summary{color:var(--text)}
html[data-theme="light"] .testimonial p{color:var(--text)}
html[data-theme="light"] .lux-list li{color:var(--muted)}
html[data-theme="light"] .quote-card p{color:var(--text)}
html[data-theme="light"] .quote-card{
  background:radial-gradient(circle at top right, rgba(184,137,78,.14), transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.8),rgba(248,240,230,.9));
  border-color:var(--line);
}
html[data-theme="light"] .payment-option{color:var(--text)}
html[data-theme="light"] .newsletter-form input{
  color:var(--text);
  background:rgba(255,255,255,.82);
  border-color:rgba(73,45,26,.12);
}
html[data-theme="light"] .newsletter-form input::placeholder{color:var(--muted-2)}
html[data-theme="light"] .form-grid span{color:var(--muted)}
html[data-theme="light"] .qty-box{border-color:var(--line)}
html[data-theme="light"] .qty-box button,
html[data-theme="light"] .qty-box input{color:var(--text)}
html[data-theme="light"] .qty-inline button{color:var(--text);border-color:var(--line);background:rgba(255,255,255,.72)}
html[data-theme="light"] .remove-link{color:var(--camel)}
html[data-theme="light"] .summary-line.total{color:var(--text)}
html[data-theme="light"] .checkout-line span:last-child{color:var(--text)}
html[data-theme="light"] .main-nav{
  background:rgba(255,248,242,.97) !important;
  border-color:rgba(73,45,26,.08) !important;
}
html[data-theme="light"] .empty-state{
  border-color:rgba(73,45,26,.12);
  background:rgba(255,255,255,.6);
}
html[data-theme="light"] .process-card span{color:var(--gold)}
html[data-theme="light"] .timeline-item span{color:var(--gold)}
html[data-theme="light"] .accordion-group details{
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(248,240,230,.7));
  border-color:var(--line);
}
html[data-theme="light"] .accordion-group p{color:var(--muted)}
html[data-theme="light"] .chatbot-message.bot{color:var(--text)}

/* ============================================================
   PRODUCT GALLERY — thumbnail strip
   ============================================================ */
.product-gallery-wrap{
  position:relative;
}
.product-gallery-main{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--surface);
}
.product-gallery-main img{
  width:100%;
  max-height:640px;
  aspect-ratio:4/5;
  object-fit:cover;
  display:block;
  transition:opacity .35s ease;
}
.product-gallery-thumbs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:10px;
}
.gallery-thumb{
  aspect-ratio:1/1.05;
  border-radius:16px;
  overflow:hidden;
  cursor:pointer;
  border:2px solid transparent;
  transition:border-color .3s ease, opacity .3s ease, transform .25s ease;
  background:var(--surface);
  flex-shrink:0;
}
.gallery-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.gallery-thumb:hover{
  opacity:.84;
  transform:translateY(-2px);
}
.gallery-thumb.active{
  border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold);
}
html[data-theme="light"] .gallery-thumb{background:rgba(255,255,255,.9)}
@media (max-width:1180px){
  .product-gallery-wrap{position:relative;top:auto}
  .product-gallery-main img{min-height:480px}
}
@media (max-width:720px){
  .product-gallery-main img{min-height:300px}
  .product-gallery-thumbs{grid-template-columns:repeat(4,1fr);gap:8px}
}

/* ============================================================
   LANGUAGE SELECTOR
   ============================================================ */
.lang-switcher{
  display:inline-flex;
  align-items:center;
  gap:4px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:4px;
  background:var(--chip-bg);
}
.lang-btn{
  border:none;
  background:transparent;
  color:var(--muted);
  padding:7px 10px;
  border-radius:999px;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  transition:var(--transition);
  line-height:1;
}
.lang-btn:hover{color:var(--text)}
.lang-btn.active{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
}
/* Language switcher must stay reachable on tablet and phone. Previously it
   was display:none under 980px, which left Arabic users stranded on the
   French site. We compact it instead. */
@media (max-width:980px){
  .lang-switcher{padding:2px;gap:2px}
  .lang-btn{padding:5px 7px;font-size:.68rem;letter-spacing:.04em}
}
@media (max-width:480px){
  /* On very small phones we drop the switcher into the mobile nav menu
     instead of the top action row so the header doesn't overflow. The JS
     handles this by moving the element once on init. */
  .lang-switcher{margin-left:auto}
}

/* ============================================================
   CHATBOT — premium redesign
   ============================================================ */
.chatbot-panel{
  width:min(430px, calc(100vw - 24px));
  bottom:88px;
}
.chatbot-card{
  border-radius:32px;
  border:1px solid rgba(199,164,104,.26);
  box-shadow:0 32px 80px rgba(0,0,0,.38), 0 8px 24px rgba(0,0,0,.18);
}
html[data-theme="light"] .chatbot-card{
  box-shadow:0 24px 64px rgba(79,55,33,.18), 0 6px 18px rgba(79,55,33,.1);
}
.chatbot-header{
  padding:20px 22px 18px;
  background:linear-gradient(135deg, rgba(199,164,104,.14) 0%, transparent 55%);
  display:flex;
  align-items:center;
  gap:14px;
  border-bottom:1px solid rgba(199,164,104,.14);
}
html[data-theme="light"] .chatbot-header{
  background:linear-gradient(135deg,rgba(184,137,78,.1),transparent 55%);
  border-bottom-color:rgba(73,45,26,.06);
}
.chatbot-header-info{flex:1;min-width:0}
.chatbot-header-avatar{
  width:46px;
  height:46px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  display:grid;
  place-items:center;
  font-family:var(--serif);
  font-size:1.15rem;
  color:#150f0c;
  font-weight:700;
  flex-shrink:0;
  box-shadow:0 4px 12px rgba(199,164,104,.3);
}
.chatbot-header strong{font-family:var(--serif);font-size:1.15rem;display:block}
.chatbot-header span{font-size:.88rem;color:var(--muted);display:block;margin-top:3px}
.chatbot-online{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:4px;
  font-size:.78rem;
  color:var(--muted-2);
}
.chatbot-online::before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:#4caf83;
  box-shadow:0 0 0 3px rgba(76,175,131,.2);
  flex-shrink:0;
}
.chatbot-close{
  width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(199,164,104,.2);
  background:rgba(255,255,255,.04);
  color:var(--muted);
  font-size:1.1rem;
  transition:var(--transition);
}
.chatbot-close:hover{background:rgba(255,255,255,.1);color:var(--text)}
html[data-theme="light"] .chatbot-close{
  background:rgba(73,45,26,.04);
  border-color:rgba(73,45,26,.1);
}
.chatbot-body{
  padding:18px 18px 8px;
  max-height:380px;
  overflow-y:auto;
  display:grid;
  gap:10px;
  scrollbar-width:thin;
  scrollbar-color:rgba(199,164,104,.2) transparent;
}
.chatbot-body::-webkit-scrollbar{width:4px}
.chatbot-body::-webkit-scrollbar-track{background:transparent}
.chatbot-body::-webkit-scrollbar-thumb{background:rgba(199,164,104,.25);border-radius:4px}
.chatbot-message{
  max-width:85%;
  padding:12px 16px;
  border-radius:20px;
  font-size:.94rem;
  line-height:1.6;
  animation:msg-in .25s ease;
}
@keyframes msg-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.chatbot-message.bot{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.09);
  border-bottom-left-radius:6px;
  color:inherit;
}
html[data-theme="light"] .chatbot-message.bot{
  background:rgba(73,45,26,.05);
  border-color:rgba(73,45,26,.08);
  color:var(--text);
}
.chatbot-message.user{
  margin-left:auto;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
  border-bottom-right-radius:6px;
  font-weight:500;
}
.chatbot-typing{
  display:flex;
  align-items:center;
  gap:5px;
  padding:14px 18px;
}
.chatbot-typing span{
  width:7px;height:7px;border-radius:50%;
  background:var(--gold);
  opacity:.5;
  animation:typing-dot .9s ease-in-out infinite;
}
.chatbot-typing span:nth-child(2){animation-delay:.18s}
.chatbot-typing span:nth-child(3){animation-delay:.36s}
@keyframes typing-dot{0%,80%,100%{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}
.chatbot-quick-replies{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:6px 18px 12px;
}
.quick-reply{
  border-radius:999px;
  border:1px solid rgba(199,164,104,.24);
  padding:9px 15px;
  background:rgba(255,255,255,.04);
  color:inherit;
  font-size:.88rem;
  transition:var(--transition);
}
.quick-reply:hover{
  background:rgba(199,164,104,.12);
  border-color:rgba(199,164,104,.4);
}
html[data-theme="light"] .quick-reply{
  background:rgba(255,255,255,.72);
  border-color:rgba(73,45,26,.14);
}
html[data-theme="light"] .quick-reply:hover{background:rgba(184,137,78,.1)}
.chatbot-empty-note{
  padding:4px 18px 8px;
  color:var(--muted-2);
  font-size:.82rem;
  font-style:italic;
}
.chatbot-footer{
  padding:12px 18px 18px;
  border-top:1px solid rgba(255,255,255,.07);
  display:grid;
  gap:10px;
}
html[data-theme="light"] .chatbot-footer{border-top-color:rgba(73,45,26,.07)}
.chatbot-input-row{display:flex;gap:10px;align-items:center}
.chatbot-input{
  flex:1;
  border-radius:20px;
  border:1px solid rgba(199,164,104,.18);
  background:rgba(255,255,255,.04);
  color:inherit;
  padding:13px 16px;
  font-size:.93rem;
  outline:none;
  transition:border-color .3s ease;
}
.chatbot-input:focus{border-color:rgba(199,164,104,.4)}
html[data-theme="light"] .chatbot-input{
  background:rgba(255,255,255,.82);
  border-color:rgba(73,45,26,.14);
  color:var(--text);
}
html[data-theme="light"] .chatbot-input::placeholder{color:var(--muted-2)}
.chatbot-send{
  width:48px;height:48px;
  border-radius:50%;
  border:none;
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
  font-weight:700;
  font-size:1.05rem;
  display:grid;
  place-items:center;
  flex-shrink:0;
  transition:transform .25s ease, box-shadow .25s ease;
}
.chatbot-send:hover{transform:scale(1.08);box-shadow:0 6px 18px rgba(199,164,104,.35)}
.chatbot-cta-row{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
}
.chatbot-cta-row a{
  text-align:center;
  padding:11px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:inherit;
  font-size:.86rem;
  font-weight:600;
  transition:var(--transition);
}
.chatbot-cta-row a:hover{background:rgba(255,255,255,.08)}
html[data-theme="light"] .chatbot-cta-row a{
  background:rgba(73,45,26,.05);
  border-color:rgba(73,45,26,.1);
}
html[data-theme="light"] .chatbot-cta-row a:hover{background:rgba(73,45,26,.1)}
.chatbot-cta-row a.primary{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
  border-color:transparent;
}
.chatbot-cta-row a.primary:hover{transform:translateY(-2px)}
.chatbot-toggle{
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(199,164,104,.28);
  background:rgba(13,9,7,.97);
  color:#f4ede6;
  border-radius:999px;
  padding:14px 22px;
  box-shadow:0 16px 40px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.2);
  transition:transform .3s ease, box-shadow .3s ease;
}
.chatbot-toggle:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 48px rgba(0,0,0,.35), 0 6px 16px rgba(199,164,104,.12);
}
html[data-theme="light"] .chatbot-toggle{
  background:rgba(255,253,250,.97);
  color:var(--text);
  border-color:rgba(73,45,26,.14);
  box-shadow:0 12px 32px rgba(79,55,33,.16), 0 4px 12px rgba(79,55,33,.08);
}
.chatbot-toggle .dot{
  width:11px;height:11px;
  border-radius:50%;
  background:var(--gold);
  animation:pulse-dot 2.4s ease-in-out infinite;
  flex-shrink:0;
}
@keyframes pulse-dot{
  0%,100%{box-shadow:0 0 0 0 rgba(199,164,104,.5)}
  50%{box-shadow:0 0 0 8px rgba(199,164,104,0)}
}
.chatbot-toggle .label{font-size:.92rem;font-weight:600}
@media (max-width:720px){
  .chatbot-panel{width:calc(100vw - 20px);bottom:80px}
  .chatbot-cta-row{grid-template-columns:1fr}
  .chatbot-toggle .label{display:none}
  .chatbot-body{max-height:320px}
}

/* ============================================================
   RTL SUPPORT — Arabic
   ============================================================ */
[dir="rtl"]{text-align:right}
[dir="rtl"] body{
  font-family:'Noto Sans Arabic',var(--sans);
  font-size:1rem;
}
/* Arabic headings: Noto Sans Arabic renders at a larger optical size than
   Latin fonts at the same em value — scale down all heading sizes so they
   never become absurdly oversized on any viewport. */
[dir="rtl"] h1{font-size:clamp(1.6rem,3.8vw,3rem)}
[dir="rtl"] h2{font-size:clamp(1.3rem,2.8vw,2.2rem)}
[dir="rtl"] h3{font-size:clamp(1.05rem,2vw,1.55rem)}
[dir="rtl"] .hero-copy h1{font-size:clamp(1.55rem,3.4vw,2.8rem);line-height:1.3}
[dir="rtl"] .hero-copy p{font-size:.95rem}
[dir="rtl"] .section-heading h2{font-size:clamp(1.3rem,2.6vw,2.1rem)}
[dir="rtl"] .product-title{font-size:clamp(1.2rem,2.4vw,1.9rem)}
[dir="rtl"] .boutique-hero h1{font-size:clamp(1.3rem,2.6vw,2rem)}
[dir="rtl"] .eyebrow{flex-direction:row-reverse}
[dir="rtl"] .eyebrow::before{
  background:linear-gradient(270deg,var(--gold),transparent);
}
[dir="rtl"] .text-link{flex-direction:row-reverse}
[dir="rtl"] .text-link::after{content:"←"}
[dir="rtl"] .text-link:hover::after{transform:translateX(-4px)}
[dir="rtl"] .main-nav a::after{
  left:auto;right:0;
  transform-origin:right;
}
[dir="rtl"] .main-nav ul{flex-direction:row-reverse}
[dir="rtl"] .nav-shell{flex-direction:row-reverse}
[dir="rtl"] .brand{flex-direction:row-reverse}
[dir="rtl"] .nav-actions{flex-direction:row-reverse}
[dir="rtl"] .footer-grid{direction:rtl}
[dir="rtl"] .footer-links,[dir="rtl"] .footer-contact{direction:rtl}
[dir="rtl"] ul{padding-right:18px;padding-left:0}
[dir="rtl"] .lux-list li{padding-right:26px;padding-left:0}
[dir="rtl"] .lux-list li::before{right:0;left:auto}
[dir="rtl"] .material-list li{padding-right:22px;padding-left:0}
[dir="rtl"] .material-list li::before{right:0;left:auto}
[dir="rtl"] .product-topline{flex-direction:row-reverse}
[dir="rtl"] .product-actions{flex-direction:row-reverse}
[dir="rtl"] .hero-actions,[dir="rtl"] .dual-cta,
[dir="rtl"] .product-cta-stack{flex-direction:row-reverse}
[dir="rtl"] .cart-pill{flex-direction:row-reverse}
[dir="rtl"] .summary-line{flex-direction:row-reverse}
[dir="rtl"] .checkout-line{flex-direction:row-reverse}
[dir="rtl"] .chatbot-shell,[dir="rtl"] .floating-contact-stack{
  right:auto;left:20px;
}
[dir="rtl"] .chatbot-panel{right:auto;left:0}
[dir="rtl"] .chatbot-message.user{margin-left:0;margin-right:auto}
[dir="rtl"] .chatbot-message.bot{
  border-bottom-left-radius:20px;
  border-bottom-right-radius:6px;
}
[dir="rtl"] .chatbot-message.user{
  border-bottom-right-radius:20px;
  border-bottom-left-radius:6px;
}
[dir="rtl"] .chatbot-quick-replies{flex-direction:row-reverse}
[dir="rtl"] .chatbot-input-row{flex-direction:row-reverse}
[dir="rtl"] .sticky-contact-panel{right:auto;left:0}
[dir="rtl"] .site-toast{right:auto;left:18px}
[dir="rtl"] .product-badge{left:auto;right:18px}
[dir="rtl"] .lang-switcher{flex-direction:row-reverse}
@media (max-width:980px){
  [dir="rtl"] .chatbot-shell,[dir="rtl"] .floating-contact-stack{right:auto;left:16px}
}
@media (max-width:720px){
  [dir="rtl"] .chatbot-shell{right:auto;left:12px}
  [dir="rtl"] .floating-contact-stack{right:auto;left:12px}
  [dir="rtl"] .site-toast{right:auto;left:12px}
}
[dir="rtl"] .filter-panel input,[dir="rtl"] .contact-form input,
[dir="rtl"] .checkout-form input,[dir="rtl"] .chatbot-input{
  text-align:right;
}

/* ── Phase 3.5 additional RTL rules ───────────────────────── */
/* Sur-mesure + checkout + contact form grids: align labels to the right,
   keep the grid structure but mirror the natural reading flow. */
[dir="rtl"] .custom-form-grid label > span,
[dir="rtl"] .checkout-form label > span,
[dir="rtl"] .contact-form label > span{
  text-align:right;
}
[dir="rtl"] .custom-form-grid input,
[dir="rtl"] .custom-form-grid textarea,
[dir="rtl"] .custom-form-grid select,
[dir="rtl"] .contact-form textarea,
[dir="rtl"] .checkout-form textarea,
[dir="rtl"] .checkout-form select{
  text-align:right;
}
/* Selects in RTL: the browser-native caret stays on the right; override the
   rare cases where a theme flipped the direction accidentally. */
[dir="rtl"] select{ direction:rtl; }

/* Upload card in sur-mesure: keep it centered in RTL too. */
[dir="rtl"] .upload-placeholder{ text-align:right; }

/* Product card meta row, price line, and CTA stacks all read RTL. */
[dir="rtl"] .product-meta-row{flex-direction:row-reverse}
[dir="rtl"] .product-price-line{flex-direction:row-reverse}
[dir="rtl"] .product-actions-row{flex-direction:row-reverse}
[dir="rtl"] .product-details-grid{direction:rtl}
[dir="rtl"] .product-assurance{direction:rtl}

/* Boutique filter bar: search icon on the correct side. */
[dir="rtl"] .boutique-filter-bar{flex-direction:row-reverse}
[dir="rtl"] .filter-controls{flex-direction:row-reverse}
[dir="rtl"] .filter-chips{flex-direction:row-reverse}

/* Cart qty controls: +/- should still read "minus on the start, plus on the
   end" in RTL — flex-direction:row-reverse achieves that. */
[dir="rtl"] .qty-inline,[dir="rtl"] .qty-box{flex-direction:row-reverse}
[dir="rtl"] .cart-item{direction:rtl}

/* Admin sidebar: keep layout LTR even in Arabic to preserve icon+text
   alignment. The content area itself will inherit dir from <html>. */
[dir="rtl"] .admin-sidebar{direction:ltr}
[dir="rtl"] .admin-topbar{flex-direction:row-reverse}
[dir="rtl"] .admin-table{text-align:right}
[dir="rtl"] .admin-filter-bar{flex-direction:row-reverse}

/* Custom-request admin layout: flip the 2-pane grid so list sits to the
   right and detail on the left, matching reading flow. */
[dir="rtl"] .cr-layout{direction:rtl}
[dir="rtl"] .cr-row-grid{direction:rtl}

/* Hero floating cards carry custom transforms that look odd mirrored; we
   keep them visually centered rather than flipping. */
[dir="rtl"] .floating-note,[dir="rtl"] .floating-badge{direction:rtl}

/* Footer grid cells are already flipped above; ensure inner headings and
   newsletter card text align right. */
[dir="rtl"] .site-footer h4,
[dir="rtl"] .site-footer p,
[dir="rtl"] .site-footer ul{text-align:right}
[dir="rtl"] .newsletter-form{flex-direction:row-reverse}


/* ============================================================
   BOUTIQUE PAGE — redesigned top-filter layout
   ============================================================ */

/* Hero — compact editorial */
.boutique-hero{
  padding:40px 0 22px;
}
.boutique-hero-inner{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  flex-wrap:wrap;
}
.boutique-hero-copy{
  flex:1;
  min-width:260px;
}
.boutique-hero-copy h1{
  font-size:clamp(2.4rem,5.5vw,4.4rem);
  margin-bottom:14px;
}
.boutique-hero-copy p{
  font-size:1.05rem;
  max-width:480px;
  margin:0;
}
.boutique-hero-stats{
  display:flex;
  gap:12px;
  flex-shrink:0;
  align-items:stretch;
}
.boutique-hero-stats div{
  padding:18px 22px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  text-align:center;
  min-width:100px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
}
.boutique-hero-stats strong{
  display:block;
  font-family:var(--serif);
  font-size:1.08rem;
  color:#fff;
}
.boutique-hero-stats span{
  color:var(--muted-2);
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.1em;
}

/* Boutique shell — tighter top padding */
.boutique-shell{
  padding-top:20px !important;
}

/* Top filter bar */
.boutique-filter-bar{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 18px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  margin-bottom:28px;
  flex-wrap:wrap;
  position:relative;
}
.boutique-filter-bar::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:radial-gradient(ellipse at top left, rgba(199,164,104,.06), transparent 55%);
}
.filter-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  flex:1;
  min-width:0;
}
.filter-controls{
  display:flex;
  gap:10px;
  align-items:center;
  flex-shrink:0;
}

/* Search input in filter bar */
.filter-search{
  width:200px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:10px 18px;
  outline:none;
  transition:border-color .3s ease, background .3s ease;
  font-size:.9rem;
}
.filter-search:focus{
  border-color:rgba(199,164,104,.45);
  background:rgba(255,255,255,.06);
}
.filter-search::placeholder{color:var(--muted-2);font-size:.88rem}

/* Sort dropdown in filter bar */
.filter-sort{
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:10px 36px 10px 16px;
  outline:none;
  cursor:pointer;
  font-size:.88rem;
  -webkit-appearance:none;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' fill='none'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23c7a468' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  transition:border-color .3s ease;
}
.filter-sort:hover{border-color:rgba(199,164,104,.35)}
.filter-sort:focus{border-color:rgba(199,164,104,.45);outline:none}
.filter-sort option{background:#1a130f;color:#f4ede6}

/* Catalogue area wrapper */
.catalogue-area{
  position:relative;
}

/* 4-column grid on the boutique page for wide screens */
@media (min-width:1200px){
  .boutique-shell .catalogue-grid{
    grid-template-columns:repeat(4,1fr);
    gap:22px;
  }
}

/* Chips slightly tighter in bar context */
.boutique-filter-bar .chip{
  padding:8px 14px;
  font-size:.84rem;
}

/* Light mode adaptations */
html[data-theme="light"] .boutique-hero-stats div{
  background:var(--card-elevated);
  border-color:var(--line);
  box-shadow:var(--shadow-soft);
}
html[data-theme="light"] .boutique-hero-stats strong{color:var(--text)}
html[data-theme="light"] .boutique-filter-bar{
  background:var(--card-elevated);
  border-color:var(--line);
  box-shadow:var(--shadow-soft);
}
html[data-theme="light"] .filter-search,
html[data-theme="light"] .filter-sort{
  background:rgba(255,255,255,.72);
  border-color:rgba(73,45,26,.1);
  color:var(--text);
}
html[data-theme="light"] .filter-search::placeholder{color:var(--muted-2)}
html[data-theme="light"] .filter-sort option{background:#fff8f2;color:var(--text)}
html[data-theme="light"] .filter-sort{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' fill='none'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23b8894e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* RTL — boutique filter bar */
[dir="rtl"] .boutique-hero-inner{flex-direction:row-reverse}
[dir="rtl"] .boutique-filter-bar{flex-direction:row-reverse}
[dir="rtl"] .filter-search{text-align:right}
[dir="rtl"] .filter-sort{
  padding:10px 16px 10px 36px;
  background-position:left 14px center;
}
[dir="rtl"] .topbar-inner{flex-direction:row-reverse}
[dir="rtl"] .product-detail{direction:rtl}
[dir="rtl"] .footer-bottom{flex-direction:row-reverse}
[dir="rtl"] .footer-mini-links{flex-direction:row-reverse}
[dir="rtl"] .form-grid label{direction:rtl;text-align:right}
[dir="rtl"] .cart-item{direction:rtl}
[dir="rtl"] .product-meta-row{flex-direction:row-reverse}
[dir="rtl"] .cta-shell{flex-direction:row-reverse}
[dir="rtl"] .conversion-strip{direction:rtl}
[dir="rtl"] .chatbot-header{flex-direction:row-reverse}
[dir="rtl"] .chatbot-footer{direction:rtl}
[dir="rtl"] .chatbot-cta-row{direction:rtl}
[dir="rtl"] .chatbot-online::before{margin-left:6px;margin-right:0}

/* ── Form feedback messages ──────────────────────────────── */
.form-message{
  margin:12px 0;
  padding:12px 16px;
  border-radius:10px;
  font-size:.92rem;
  font-weight:500;
  display:none;
}
.form-message:not(:empty){ display:block; }
.form-message.success{
  background:rgba(34,139,34,.12);
  color:#1a6b1a;
  border:1px solid rgba(34,139,34,.25);
}
.form-message.error{
  background:rgba(200,40,40,.1);
  color:#b01c1c;
  border:1px solid rgba(200,40,40,.22);
}
[data-theme="dark"] .form-message.success{
  background:rgba(34,180,34,.1);
  color:#6de06d;
  border-color:rgba(34,180,34,.2);
}
[data-theme="dark"] .form-message.error{
  background:rgba(220,60,60,.12);
  color:#f07070;
  border-color:rgba(220,60,60,.22);
}

/* ── Coupon box ──────────────────────────────────────────── */
.coupon-box{
  margin:20px 0;
  padding:18px;
  border:1px solid var(--border);
  border-radius:12px;
}
.coupon-box h3{
  font-size:.9rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:10px;
  opacity:.7;
}
.coupon-input-row{
  display:flex;
  gap:10px;
}
.coupon-input-row input{
  flex:1;
  padding:10px 14px;
  border:1px solid var(--border);
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  font-size:.92rem;
}
.coupon-input-row input:focus{
  outline:none;
  border-color:var(--gold-1);
}
.coupon-message{
  margin-top:8px;
  font-size:.88rem;
  font-weight:500;
  min-height:1.2em;
}
.coupon-message.success{ color:#1a8c1a; }
.coupon-message.error  { color:#b01c1c; }
[data-theme="dark"] .coupon-message.success{ color:#6de06d; }
[data-theme="dark"] .coupon-message.error  { color:#f07070; }

/* ── Admin login page ────────────────────────────────────── */
.admin-login-page{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--bg);
}
.admin-login-card{
  width:100%;
  max-width:420px;
  padding:40px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:20px;
  box-shadow:0 20px 60px rgba(0,0,0,.15);
}
.admin-login-card .brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:28px;
  text-decoration:none;
  color:var(--text);
}
.admin-login-card .brand .brand-mark{
  width:44px;height:44px;
  border-radius:10px;
  background:var(--gold-1);
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:800;
  font-size:1rem;
}
.admin-login-card h1{
  font-size:1.5rem;
  margin-bottom:6px;
}
.admin-login-card p{
  opacity:.6;
  font-size:.9rem;
  margin-bottom:24px;
}
.admin-login-card .form-group{
  margin-bottom:16px;
}
.admin-login-card .form-group label{
  display:block;
  font-size:.85rem;
  font-weight:600;
  margin-bottom:6px;
  opacity:.75;
}
.admin-login-card .form-group input{
  width:100%;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--bg);
  color:var(--text);
  font-size:.95rem;
  box-sizing:border-box;
}
.admin-login-card .form-group input:focus{
  outline:none;
  border-color:var(--gold-1);
}
.admin-login-card .btn-full{
  width:100%;
  margin-top:8px;
}
.admin-login-back{
  display:block;
  text-align:center;
  margin-top:20px;
  font-size:.85rem;
  opacity:.6;
  color:var(--text);
  text-decoration:none;
}
.admin-login-back:hover{ opacity:1; }
[dir="rtl"] .sticky-contact-links a{flex-direction:row-reverse}

/* ============================================================
   PAYMENT OPTIONS — enhanced
   ============================================================ */
.payment-box{
  margin-top:28px;
  padding:22px 24px;
  border-radius:18px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.07);
}
.payment-box h3{
  font-size:.8rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:.45;
  margin-bottom:14px;
}
.payment-option{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:12px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.06);
  cursor:pointer;
  transition:border-color .2s, background .2s;
}
.payment-option:has(input:checked){
  border-color:rgba(200,165,106,.45);
  background:rgba(200,165,106,.06);
}
.payment-option--main{
  border-color:rgba(200,165,106,.25);
  background:rgba(200,165,106,.04);
}
.payment-option input[type="radio"]{
  accent-color:var(--gold);
  width:18px;
  height:18px;
  flex-shrink:0;
}
.payment-option-body{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.payment-option-body strong{
  font-size:.96rem;
  color:#f2e5d8;
}
.payment-option-body small{
  font-size:.8rem;
  opacity:.5;
  line-height:1.4;
}
.payment-badge{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gold);
  border:1px solid rgba(200,165,106,.4);
  padding:3px 10px;
  border-radius:20px;
  background:rgba(200,165,106,.08);
  white-space:nowrap;
}

/* ============================================================
   ORDER SUCCESS OVERLAY
   ============================================================ */
.order-success-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.order-success-card{
  background:linear-gradient(145deg,#1a1208,#120d06);
  border:1px solid rgba(200,165,106,.22);
  border-radius:28px;
  padding:48px 40px;
  max-width:480px;
  width:100%;
  text-align:center;
  box-shadow:0 40px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(200,165,106,.08);
  animation:successCardIn .4s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes successCardIn{
  from{opacity:0;transform:translateY(30px) scale(.95)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.order-success-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  background:linear-gradient(135deg,#c8a56a,#e6c88a);
  color:#12100a;
  font-size:2rem;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 24px;
  box-shadow:0 0 0 12px rgba(200,165,106,.12), 0 0 0 24px rgba(200,165,106,.05);
}
.order-success-title{
  font-size:1.6rem;
  font-weight:700;
  letter-spacing:-.02em;
  margin-bottom:8px;
  color:#f2e5d8;
}
.order-success-ref{
  font-size:.88rem;
  opacity:.45;
  margin-bottom:16px;
  font-family:monospace;
  letter-spacing:.05em;
}
.order-success-msg{
  font-size:.92rem;
  line-height:1.65;
  opacity:.65;
  margin-bottom:32px;
  color:#e7dbcf;
}
.order-success-actions{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.order-success-wa{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.order-success-continue{
  font-size:.88rem;
  opacity:.7;
}
.order-success-continue:hover{ opacity:1; }

/* Light theme adjustments */
html[data-theme="light"] .payment-box{
  background:rgba(0,0,0,.03);
  border-color:rgba(73,45,26,.1);
}
html[data-theme="light"] .payment-option{
  border-color:rgba(73,45,26,.1);
  color:var(--text);
}
html[data-theme="light"] .payment-option:has(input:checked){
  border-color:rgba(140,95,50,.5);
  background:rgba(140,95,50,.06);
}
html[data-theme="light"] .payment-option--main{
  border-color:rgba(140,95,50,.25);
  background:rgba(140,95,50,.04);
}
html[data-theme="light"] .payment-option-body strong{ color:var(--text); }
html[data-theme="light"] .order-success-card{
  background:linear-gradient(145deg,#fffbf5,#fff8ee);
  border-color:rgba(140,95,50,.2);
  box-shadow:0 40px 80px rgba(73,45,26,.18), 0 0 0 1px rgba(140,95,50,.08);
}
html[data-theme="light"] .order-success-title{ color:var(--text); }
html[data-theme="light"] .order-success-msg{ color:var(--muted); }

/* ── Brand Promise Section ────────────────────────────── */
.brand-promise-section{
  background:linear-gradient(135deg,#13100c 0%,#1a1410 50%,#13100c 100%);
  border-top:1px solid rgba(199,164,104,.1);
  border-bottom:1px solid rgba(199,164,104,.1);
}
.brand-promise-header{text-align:center;max-width:780px;margin:0 auto 60px;}
.brand-promise-headline{
  font-size:clamp(1.8rem,4vw,3rem);
  font-family:var(--serif);
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.02em;
  margin:16px 0 18px;
  background:linear-gradient(135deg,#f4ede6,#e6c488);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.brand-promise-sub{
  font-size:1.05rem;color:var(--muted);max-width:600px;margin:0 auto;line-height:1.7;
}
.promise-pillars{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:24px;margin-bottom:50px;
}
.promise-pillar{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(199,164,104,.12);
  border-radius:20px;padding:32px 28px;
  transition:border-color .3s,transform .3s;
  text-align:center;
}
.promise-pillar:hover{border-color:rgba(199,164,104,.3);transform:translateY(-3px);}
.pillar-icon{
  font-size:1.4rem;color:var(--gold);
  margin-bottom:16px;
  width:52px;height:52px;border-radius:50%;
  background:rgba(199,164,104,.1);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
  border:1px solid rgba(199,164,104,.2);
}
.promise-pillar h3{
  font-size:1rem;font-weight:700;margin:0 0 10px;
  color:var(--soft);letter-spacing:-.01em;
}
.promise-pillar p{font-size:.88rem;color:var(--muted);line-height:1.65;margin:0;}
.promise-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

html[data-theme="light"] .brand-promise-section{
  background:linear-gradient(135deg,#faf6f0,#f4ede6,#faf6f0);
}
html[data-theme="light"] .promise-pillar{
  background:#fff;border-color:rgba(73,45,26,.1);
}

/* ── Boutique: better category chips ────────────────── */
.chip-group{display:flex;flex-wrap:wrap;gap:8px;}
.chip{
  padding:8px 18px;border-radius:999px;
  border:1px solid rgba(199,164,104,.25);
  background:transparent;
  color:var(--muted);
  font-size:.82rem;font-weight:600;cursor:pointer;
  transition:all .18s;letter-spacing:.02em;
  font-family:var(--sans);
}
.chip:hover{border-color:rgba(199,164,104,.5);color:var(--soft);}
.chip.active{
  background:linear-gradient(135deg,rgba(199,164,104,.18),rgba(199,164,104,.08));
  border-color:var(--gold);color:var(--gold-2);
  box-shadow:0 0 0 1px rgba(199,164,104,.15);
}
html[data-theme="light"] .chip{border-color:rgba(73,45,26,.15);color:#6a5040;}
html[data-theme="light"] .chip.active{
  background:rgba(73,45,26,.07);border-color:rgba(73,45,26,.35);color:#3a2317;
}

/* ── Product card: sale price + out of stock ────────── */
.price-wrap{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.price-original{font-size:.82rem;opacity:.5;text-decoration:line-through;}
.badge-oos{
  position:absolute;top:10px;left:10px;
  background:rgba(15,10,8,.85);
  color:var(--muted);font-size:.72rem;font-weight:700;
  padding:4px 10px;border-radius:999px;
  letter-spacing:.04em;border:1px solid rgba(255,255,255,.1);
}
.out-of-stock .product-media{opacity:.7;}
.out-of-stock .btn[disabled]{opacity:.5;cursor:not-allowed;}

/* ── Product gallery (authoritative) ────────────────────── */
.product-gallery-wrap{
  position:sticky;
  top:var(--header-offset,118px);
}
.product-gallery-main{
  position:relative;
  top:auto;
  border-radius:24px;
  overflow:hidden;
  background:var(--surface);
  border:1px solid var(--line);
  aspect-ratio:4/5;
}
.product-gallery-main img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:opacity .22s ease;
}
.product-gallery-thumbs{
  display:flex;
  gap:8px;
  margin-top:12px;
  flex-wrap:wrap;
}
.gallery-thumb{
  width:72px;height:72px;
  border-radius:12px;
  overflow:hidden;
  border:2px solid transparent;
  background:var(--surface);
  cursor:pointer;
  padding:0;
  flex-shrink:0;
  transition:border-color .18s, transform .18s;
}
.gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.gallery-thumb:hover{border-color:rgba(199,164,104,.45);transform:translateY(-2px);}
.gallery-thumb.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);}
html[data-theme="light"] .gallery-thumb{background:rgba(255,255,255,.9)}
.gallery-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:40px;height:40px;
  border-radius:50%;
  border:none;
  background:rgba(17,12,9,.6);
  color:#fff;
  font-size:1.3rem;
  line-height:1;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .18s,opacity .18s;
  opacity:.82;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}
.gallery-nav:hover{background:rgba(17,12,9,.92);opacity:1;}
.gallery-nav-prev{left:12px;}
.gallery-nav-next{right:12px;}
html[data-theme="light"] .gallery-nav{background:rgba(255,255,255,.78);color:#28180f;}
html[data-theme="light"] .gallery-nav:hover{background:rgba(255,255,255,.96);}

/* ── Boutique improvements ───────────────────────────── */
.filter-panel{
  position:sticky;top:100px;align-self:start;
}
.filter-group{margin-bottom:24px;}
.filter-group > label{
  display:block;
  font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.1em;
  color:var(--muted);margin-bottom:10px;
}
.filter-group input[type="search"],
.filter-group select{
  width:100%;padding:10px 14px;
  border-radius:12px;border:1px solid rgba(199,164,104,.15);
  background:rgba(255,255,255,.04);
  color:var(--text);font-size:.88rem;
  transition:border-color .18s;outline:none;
}
.filter-group input[type="search"]:focus,
.filter-group select:focus{border-color:rgba(199,164,104,.4);}
html[data-theme="light"] .filter-group input[type="search"],
html[data-theme="light"] .filter-group select{
  background:#fff;border-color:rgba(73,45,26,.15);color:#1c1008;
}

/* ── Admin CSS additions ─────────────────────────────── */
.admin-table .product-thumb{
  border-radius:10px;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
}
.hint{font-size:.72rem;color:var(--adm-muted,#a89888);opacity:.7;margin-top:3px;}

/* ── Modal improvements ──────────────────────────────── */
.admin-card .admin-card-header h2{font-size:.95rem;}

/* ── Image gallery in admin ──────────────────────────── */
.image-gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
  gap:12px;margin-bottom:18px;
}
.image-item{
  position:relative;border-radius:12px;overflow:hidden;
  border:2px solid rgba(255,255,255,.07);
  transition:border-color .18s;cursor:pointer;
  aspect-ratio:1;
}
.image-item img{width:100%;height:100%;object-fit:cover;display:block;}
.image-item.is-main{border-color:var(--adm-gold,#c8a56a);}
.img-main-badge{
  position:absolute;bottom:0;left:0;right:0;
  background:rgba(200,165,106,.9);
  color:#120e08;font-size:.68rem;font-weight:700;
  text-align:center;padding:4px;letter-spacing:.04em;
}
.img-actions{
  position:absolute;inset:0;
  background:rgba(0,0,0,.6);
  display:flex;align-items:center;justify-content:center;gap:6px;
  opacity:0;transition:opacity .18s;flex-direction:column;
}
.image-item:hover .img-actions{opacity:1;}

.upload-zone{
  border:2px dashed rgba(199,164,104,.25);
  border-radius:16px;padding:32px;
  text-align:center;cursor:pointer;
  transition:border-color .18s,background .18s;
  margin-top:12px;
}
.upload-zone:hover{border-color:rgba(199,164,104,.5);background:rgba(199,164,104,.04);}
.upload-zone input[type="file"]{display:none;}
.upload-icon{font-size:2rem;margin-bottom:8px;}
.upload-zone p{color:var(--adm-muted,#a89888);font-size:.88rem;margin:4px 0;}

.form-message{padding:10px 14px;border-radius:10px;font-size:.86rem;}
.form-message.success{background:rgba(61,184,90,.1);color:#3db85a;border:1px solid rgba(61,184,90,.2);}
.form-message.error{background:rgba(220,80,80,.1);color:#dc5050;border:1px solid rgba(220,80,80,.2);}

/* ── Bundles / Packs public display ──────────────────── */
.bundles-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:28px;
}
.bundle-card{
  background:var(--surface);
  border:1px solid rgba(199,164,104,.15);
  border-radius:24px;overflow:hidden;
  transition:border-color .3s,transform .3s,box-shadow .3s;
}
.bundle-card:hover{
  border-color:rgba(199,164,104,.35);
  transform:translateY(-4px);
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.bundle-img{aspect-ratio:16/9;overflow:hidden;}
.bundle-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.bundle-card:hover .bundle-img img{transform:scale(1.04);}
.bundle-body{padding:26px;}
.bundle-body h3{
  font-size:1.15rem;font-weight:700;margin:8px 0 10px;
  font-family:var(--serif);letter-spacing:-.01em;
}
.bundle-body p{font-size:.88rem;color:var(--muted);margin:0 0 14px;line-height:1.6;}
.bundle-items-list{
  list-style:none;padding:0;margin:0 0 18px;
  display:flex;flex-direction:column;gap:4px;
}
.bundle-items-list li{
  font-size:.82rem;color:var(--muted);
  padding-left:14px;position:relative;
}
.bundle-items-list li::before{
  content:"·";position:absolute;left:0;color:var(--gold);font-weight:700;
}
.bundle-price-row{
  display:flex;align-items:baseline;gap:12px;margin-bottom:18px;flex-wrap:wrap;
}
.bundle-price{font-size:1.4rem;font-weight:800;color:var(--gold-2);}
.bundle-saving{
  font-size:.82rem;font-weight:600;
  background:rgba(199,164,104,.12);
  color:var(--gold);
  padding:3px 10px;border-radius:999px;
  border:1px solid rgba(199,164,104,.2);
}
html[data-theme="light"] .bundle-card{
  background:#fff;border-color:rgba(73,45,26,.12);
}
html[data-theme="light"] .bundle-card:hover{border-color:rgba(73,45,26,.3);}


/* ============================================================
   FINAL FRONTEND POLISH — Phase 3.8
   Purpose: compact premium feel, first-screen balance at 100% zoom,
            products appear sooner, stronger cards, cleaner header.
   Non-destructive: only tightens existing rules. No rebuild.
   ============================================================ */

/* --- Header: truly compact. --- */
.topbar{font-size:.74rem}
.topbar-inner{padding:7px 0}
.nav-shell{padding:10px 0;gap:18px}
.brand{gap:12px}
.brand-mark{width:44px;height:44px;border-radius:14px}
.brand-text strong{font-size:1.02rem;line-height:1.2}
.brand-text small{font-size:.66rem;letter-spacing:.07em}
.main-nav ul{gap:22px}
.main-nav a{font-size:.92rem}
.nav-actions{gap:10px}
.link-chip{padding:7px 12px;font-size:.82rem}
.cart-pill{padding:8px 14px;font-size:.86rem}

/* Hero: tighter vertical rhythm and smaller image stack so the fold
   shows hero copy + CTA + first product peek on a 768–900px laptop. */
.hero{padding:48px 0 56px}
.hero-grid{gap:36px;grid-template-columns:1.05fr .95fr;align-items:center}
.hero-copy h1{font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1.1;margin-bottom:14px}
.hero-copy p{font-size:1rem;max-width:560px}
.hero-actions{margin-top:20px;gap:12px}
.hero-metrics{margin-top:26px;gap:14px}
.hero-metrics div{padding:14px 14px;border-radius:18px}
.hero-metrics strong{font-size:.95rem;margin-bottom:4px}
.hero-metrics span{font-size:.84rem}
.frame-stack{min-height:460px}
.hero-card-main{inset:24px 70px 30px 0;border-radius:30px}
.hero-card-side{width:220px;height:290px;border-radius:26px}
.floating-note{padding:14px 16px;border-radius:18px;font-size:.88rem;max-width:240px}
.floating-badge{padding:10px 14px;border-radius:14px;font-size:.8rem}

/* Push the first product section up: it used to sit ~1300px from the top,
   now it starts right after a compact hero. */
.featured-after-hero{padding:60px 0 70px}
.featured-after-hero .section-heading{margin-bottom:28px}
.featured-after-hero .section-heading h2{font-size:clamp(1.6rem,2.6vw,2.3rem);margin-bottom:6px}
.featured-after-hero .section-heading p{font-size:.96rem;max-width:620px;margin-left:auto;margin-right:auto}
.mt-40{margin-top:28px}

/* Product cards: less padding, more image, clearer price + CTA. */
.product-card{transition:transform .35s ease,border-color .25s ease}
.product-card:hover{transform:translateY(-4px)}
.product-card .product-media img{transition:transform .6s ease}
.product-card:hover .product-media img{transform:scale(1.04)}

/* Tighter section rhythm overall. */
.section{padding:80px 0}
.editorial-section{padding:70px 0}
.dark-band{padding:80px 0}

/* --- Boutique page: categories appear right below the boutique title.
   The filter bar is now the visual anchor, not an afterthought. --- */
.boutique-hero{padding:32px 0 16px}
.boutique-hero-copy h1{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:8px;line-height:1.12}
.boutique-hero-copy p{font-size:.98rem;max-width:540px}
.boutique-hero-stats{gap:10px}
.boutique-hero-stats div{padding:14px 16px;min-width:110px}
.boutique-shell{padding-top:14px !important;padding-bottom:80px !important}
.boutique-filter-bar{margin-bottom:22px;padding:10px 14px;border-radius:18px}
.boutique-filter-bar .chip{padding:7px 14px;font-size:.84rem}
.boutique-filter-bar .chip.active{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;border-color:transparent;
}
.catalogue-grid{gap:22px}

/* --- Footer compaction. --- */
.site-footer{padding:60px 0 30px}
.footer-grid{gap:28px;margin-bottom:30px}

/* --- Admin-login: tighter card on small viewports. --- */
.admin-login-card{padding:36px 32px}
.admin-login-card h1{font-size:1.5rem;margin-bottom:6px}
.admin-login-card .brand{margin-bottom:18px}

/* --- Light theme adjustments for the new compact look --- */
html[data-theme="light"] .boutique-filter-bar{
  background:#fff;border-color:rgba(73,45,26,.1);
}
html[data-theme="light"] .featured-after-hero{background:#f7f0e6}


/* ============================================================
   FINAL FRONTEND REFINEMENT — Phase 3.9
   Purpose: remove layout heaviness, improve first-screen balance,
            surface Boutique categories immediately, and make shopping
            sections feel more premium without changing the stack.
   ============================================================ */
:root{
  --container:min(1240px, calc(100% - clamp(24px, 4vw, 56px)));
  --container-wide:min(1380px, calc(100% - clamp(24px, 4vw, 56px)));
  --header-offset:88px;
}

.site-header{
  border-bottom:1px solid rgba(199,164,104,.12);
  background:linear-gradient(180deg, rgba(10,7,6,.92), rgba(10,7,6,.74));
  backdrop-filter:blur(20px);
}

.topbar-inner{
  align-items:center;
  flex-wrap:wrap;
  row-gap:6px;
}

.nav-shell{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  min-height:74px;
  gap:clamp(14px, 2vw, 24px);
  padding:8px 0;
}

.brand{min-width:0}
.brand-text{min-width:0}
.brand-text strong{font-size:clamp(.98rem, 1vw, 1.08rem)}
.main-nav{min-width:0}
.main-nav ul{
  justify-content:center;
  gap:clamp(14px, 1.6vw, 22px);
  flex-wrap:wrap;
}
.main-nav a{white-space:nowrap}
.nav-actions{
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.link-chip,.cart-pill,.theme-toggle{min-height:42px}
.link-chip,.cart-pill{padding:8px 14px}
.theme-toggle{padding:8px 14px}
.lang-switcher{min-height:42px}

.hero{
  padding:clamp(24px, 4vw, 40px) 0 clamp(34px, 5vw, 54px);
}
.hero-grid{
  grid-template-columns:minmax(0, 1.02fr) minmax(300px, .9fr);
  gap:clamp(22px, 3vw, 38px);
  align-items:center;
}
.hero-copy{max-width:640px}
.hero-copy h1{
  font-size:clamp(2.05rem, 4vw, 3.7rem);
  line-height:1.06;
  max-width:11.5ch;
  margin-bottom:12px;
}
.hero-copy p{
  max-width:58ch;
  font-size:clamp(.97rem, 1vw, 1.02rem);
}
.hero-actions{
  margin-top:18px;
  gap:12px;
}
.hero-metrics{
  margin-top:22px;
  gap:12px;
}
.hero-metrics div{
  padding:14px 14px;
  border-radius:18px;
}
.frame-stack{
  min-height:clamp(310px, 34vw, 430px);
}
.hero-card-main{
  inset:18px clamp(48px, 5vw, 72px) 22px 0;
  border-radius:28px;
}
.hero-card-side{
  width:clamp(168px, 18vw, 218px);
  height:clamp(210px, 24vw, 288px);
  border-radius:24px;
}
.floating-note{
  max-width:220px;
  padding:13px 15px;
}
.floating-badge{
  padding:10px 14px;
}

.section{padding:72px 0}
.editorial-section{padding:64px 0}
.dark-band{padding:74px 0}
.page-hero{padding:clamp(28px, 4vw, 42px) 0 18px}
.compact-hero{padding-bottom:0}
.page-hero-grid{gap:28px}

.featured-after-hero{padding:46px 0 62px}
.featured-after-hero .section-heading{
  margin-bottom:22px;
  max-width:660px;
}
.featured-after-hero .section-heading h2{
  font-size:clamp(1.55rem, 2.7vw, 2.25rem);
  margin-bottom:6px;
}
.featured-after-hero .section-heading p{
  font-size:.95rem;
}

.featured-grid,
.catalogue-grid{align-items:stretch}

.product-card{
  height:100%;
  border-radius:24px;
  overflow:hidden;
}
.product-media{
  aspect-ratio:4 / 4.5;
  background:linear-gradient(180deg, rgba(21,14,11,.84), rgba(21,14,11,.96));
}
.product-body{
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  gap:10px;
  height:100%;
  padding:16px 16px 18px;
}
.product-topline{gap:10px}
.product-card h3{
  font-size:1.08rem;
  line-height:1.2;
}
.product-card p{
  min-height:2.9em;
  -webkit-line-clamp:3;
}
.price-wrap{
  display:grid;
  justify-items:end;
  gap:2px;
}
.product-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:6px;
}
.product-actions .btn{
  width:100%;
  min-height:42px;
}

.boutique-hero{
  padding:22px 0 8px;
}
.boutique-hero-inner{
  gap:18px;
  align-items:end;
}
.boutique-hero-copy h1{
  font-size:clamp(1.95rem, 3.8vw, 3rem);
  margin-bottom:8px;
}
.boutique-hero-copy p{
  max-width:60ch;
  font-size:.97rem;
}
.boutique-hero-stats{gap:10px}
.boutique-hero-stats div{
  padding:12px 15px;
  min-width:102px;
}

.boutique-shell{
  padding-top:8px !important;
  padding-bottom:72px !important;
}
.boutique-category-rail{
  display:grid;
  gap:16px;
  margin-bottom:18px;
}
.boutique-category-intro{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}
.boutique-category-intro .eyebrow{margin-bottom:0}
.boutique-category-intro p{
  margin:0;
  max-width:640px;
  font-size:.94rem;
}
.boutique-category-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
}
.boutique-category-card{
  appearance:none;
  border:1px solid rgba(199,164,104,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  color:var(--text);
  border-radius:22px;
  padding:16px 16px 15px;
  text-align:left;
  display:grid;
  gap:6px;
  min-height:122px;
  box-shadow:var(--shadow-soft);
  transition:transform .32s ease, border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.boutique-category-card:hover,
.boutique-category-card:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(199,164,104,.4);
  outline:none;
}
.boutique-category-card.active{
  background:linear-gradient(135deg, rgba(230,196,136,.96), rgba(199,164,104,.96));
  color:#170f0b;
  border-color:transparent;
  box-shadow:0 18px 34px rgba(199,164,104,.24);
}
.boutique-category-kicker{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--muted-2);
}
.boutique-category-card.active .boutique-category-kicker,
.boutique-category-card.active .boutique-category-meta{color:rgba(23,15,11,.72)}
.boutique-category-title{
  font-family:var(--serif);
  font-size:1.08rem;
  line-height:1.15;
}
.boutique-category-meta{
  font-size:.84rem;
  color:var(--muted);
}

.boutique-filter-bar{
  position:sticky;
  top:calc(var(--header-offset, 88px) + 12px);
  z-index:18;
  margin-bottom:18px;
  padding:10px 12px;
  border-radius:20px;
  background:color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter:blur(14px);
}
.filter-controls{gap:8px}
.filter-search{width:min(220px, 100%)}
.filter-sort{min-width:220px}
.catalogue-area{
  display:grid;
  gap:18px;
}
.conversion-strip{
  margin:0;
  padding:20px;
}

.filter-panel,
.summary-card,
.cart-summary-panel{
  top:calc(var(--header-offset, 88px) + 16px);
}
.cart-layout,.checkout-layout{gap:22px}

html[data-theme="light"] .site-header{
  background:linear-gradient(180deg, rgba(255,249,243,.94), rgba(255,249,243,.82));
}
html[data-theme="light"] .boutique-category-card{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,242,235,.92));
  border-color:rgba(73,45,26,.1);
}
html[data-theme="light"] .boutique-category-card.active{
  background:linear-gradient(135deg, #e6c488, #c7a468);
}
html[data-theme="light"] .boutique-filter-bar{
  background:rgba(255,255,255,.88);
  border-color:rgba(73,45,26,.1);
}


/* === Final packaged boutique/admin/contact fixes === */
:root{ --header-offset: 82px; }
.container-wide{ width:min(1320px, calc(100% - 48px)); margin-inline:auto; }
html[data-theme="light"] body{ background:linear-gradient(180deg,#f8f1e8 0%,#fbf7f2 38%,#f8f2ea 100%); }
html[data-theme="light"] .site-header{ backdrop-filter:blur(16px); box-shadow:0 10px 28px rgba(73,45,26,.06); }
.topbar{ font-size:.82rem; }
.nav-shell{ min-height:72px; gap:20px; }
.nav-actions{ gap:10px; }
.nav-actions .link-chip,.nav-actions .cart-pill,.currency-control,.language-selector,.theme-toggle{ min-height:42px; border-radius:999px; }
.boutique-hero{ padding:34px 0 14px; }
.boutique-hero-inner{ align-items:end; gap:28px; }
.boutique-hero-copy h1{ font-size:clamp(2.4rem,5.2vw,5rem); max-width:9ch; letter-spacing:-.04em; line-height:.96; }
.boutique-hero-copy p{ max-width:60ch; font-size:1.06rem; color:var(--muted); }
.boutique-hero-stats{ align-self:end; grid-template-columns:repeat(3,minmax(0,1fr)); }
.boutique-hero-stats div{ min-width:0; border-radius:24px; padding:18px 18px 16px; background:rgba(255,255,255,.7); box-shadow:0 14px 36px rgba(73,45,26,.08); }
.boutique-shell{ padding-top:10px !important; padding-bottom:78px !important; }
.boutique-catalog-shell{ display:grid; gap:18px; padding:24px; border-radius:34px; border:1px solid rgba(73,45,26,.09); background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(248,241,232,.92)); box-shadow:0 30px 64px rgba(73,45,26,.08); }
.boutique-category-rail{ margin-bottom:0; gap:18px; }
.boutique-category-intro p{ max-width:680px; }
.boutique-category-grid{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
.boutique-category-card{ min-height:110px; border-radius:24px; padding:16px 18px; }
.boutique-filter-bar{ position:static !important; top:auto !important; z-index:auto !important; margin-bottom:0; padding:14px 16px; border:1px solid rgba(73,45,26,.08); border-radius:24px; background:rgba(255,252,248,.92); box-shadow:0 12px 30px rgba(73,45,26,.05); }
.boutique-filter-bar::before{ display:none; }
.filter-chips{ gap:10px; flex:1 1 auto; min-width:0; overflow:auto; padding-bottom:2px; }
.filter-controls{ flex:0 0 auto; display:flex; gap:10px; align-items:center; }
.filter-search,.filter-sort{ min-height:48px; border-radius:18px; background:#fffdfa; border:1px solid rgba(73,45,26,.1); box-shadow:none; }
.filter-search{ width:220px; }
.filter-sort{ min-width:220px; background-image:linear-gradient(45deg, transparent 50%, rgba(73,45,26,.65) 50%),linear-gradient(135deg, rgba(73,45,26,.65) 50%, transparent 50%); background-position:calc(100% - 18px) calc(50% - 3px), calc(100% - 12px) calc(50% - 3px); background-size:6px 6px, 6px 6px; background-repeat:no-repeat; }
.catalogue-area{ gap:22px; }
.catalogue-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:stretch; }
.product-card{ border-radius:28px; overflow:hidden; border:1px solid rgba(73,45,26,.09); background:linear-gradient(180deg,#fffdfa 0%,#fbf5ee 100%); box-shadow:0 20px 40px rgba(73,45,26,.08); }
.product-card:hover{ transform:translateY(-8px); box-shadow:0 28px 50px rgba(73,45,26,.12); }
.product-media{ position:relative; aspect-ratio:4/4.7; background:linear-gradient(180deg,#f4eadf,#ead9ca); }
.product-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.product-image-secondary{ position:absolute; inset:0; opacity:0; transition:opacity .45s ease,transform .65s ease; }
.product-media.has-secondary:hover .product-image-secondary{ opacity:1; transform:scale(1.03); }
.product-media.has-secondary:hover .product-image-primary{ opacity:0; }
.product-badge{ top:16px; left:16px; }
.product-body{ padding:18px 18px 20px; display:grid; gap:14px; }
.product-meta-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.product-card h3{ font-size:1.34rem; line-height:1.12; margin:0; }
.product-card p{ min-height:48px; color:var(--muted); }
.price-wrap,.product-meta-top > .price{ text-align:right; }
.price{ font-size:1.18rem; font-weight:700; }
.price-original{ display:block; margin-top:4px; }
.product-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.product-actions .btn{ min-height:44px; border-radius:14px; }
.site-footer .footer-contact a[href^="tel:"],.site-footer .footer-contact a[href^="mailto:"],.contact-card a[href^="tel:"],.contact-card a[href^="mailto:"],.sticky-contact-links a{ word-break:break-word; }
html[data-theme="light"] .boutique-catalog-shell,html[data-theme="light"] .product-card,html[data-theme="light"] .boutique-filter-bar{ border-color:rgba(73,45,26,.08); }

 
/* ============================================================
   MOBILE COMFORT REFINEMENT — April 2026
   Focus: lighter header, easier thumb reach, stronger product browsing,
          safer stacking on phone, no stack change.
   ============================================================ */

html{
  scroll-padding-top:calc(var(--header-offset, 82px) + 16px);
}
body.menu-open{
  overflow:hidden;
}
main, section, .container, .container-wide,
.hero-grid, .page-hero-grid, .product-detail,
.contact-layout, .cart-layout, .checkout-layout,
.catalogue-grid, .featured-grid{
  min-width:0;
}

.site-header{
  background:linear-gradient(180deg, rgba(15,10,8,.94), rgba(15,10,8,.74));
  backdrop-filter:blur(16px);
}
.topbar{
  border-bottom:1px solid rgba(255,255,255,.04);
}
.topbar-inner{
  padding:6px 0;
  gap:14px;
}
.nav-shell{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  min-height:70px;
  padding:10px 0;
}
.brand{
  min-width:0;
  gap:12px;
}
.brand-text{
  min-width:0;
}
.brand-text strong{
  font-size:clamp(.98rem, 1vw + .7rem, 1.08rem);
  white-space:nowrap;
}
.main-nav{
  min-width:0;
}
.main-nav ul{
  justify-content:center;
  flex-wrap:wrap;
  gap:22px;
}
.main-nav a{
  font-size:.92rem;
}
.nav-actions{
  justify-self:end;
  min-width:0;
}
.link-chip,
.cart-pill,
.theme-toggle,
.lang-switcher{
  min-height:42px;
}
.nav-toggle{
  width:44px;
  height:44px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  align-items:center;
  justify-content:center;
  padding:0;
}
.nav-toggle span{
  width:18px;
  border-radius:999px;
}
.mobile-nav-utility{
  display:none;
}

.btn{
  min-height:46px;
}
.btn-small{
  min-height:42px;
}

.hero{
  padding:44px 0 48px;
}
.hero-grid{
  gap:30px;
}
.hero-copy h1{
  max-width:11ch;
  line-height:1;
}
.hero-copy p{
  max-width:58ch;
  font-size:1rem;
}
.hero-metrics{
  margin-top:24px;
  gap:12px;
}
.hero-metrics div{
  padding:16px 16px 15px;
  border-radius:20px;
}
.frame-stack{
  min-height:500px;
}
.floating-note,
.floating-badge{
  backdrop-filter:blur(12px);
}

.page-hero{
  padding:34px 0 14px;
}
.page-hero-grid{
  gap:22px;
}
.stats-ribbon{
  gap:12px;
}
.stats-ribbon div{
  padding:16px;
  border-radius:20px;
}

.featured-grid,
.catalogue-grid{
  align-items:stretch;
}
.product-card{
  min-height:100%;
}
.product-media{
  aspect-ratio:4 / 4.9;
}
.product-body{
  grid-template-rows:auto auto minmax(0,1fr) auto;
  gap:10px;
  padding:16px 16px 18px;
}
.product-meta-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.product-card h3{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:0;
  font-size:1.1rem;
  line-height:1.18;
}
.product-card p{
  min-height:2.8em;
  font-size:.88rem;
}
.price-wrap,
.product-meta-top > .price{
  text-align:right;
}
.price{
  font-size:1.12rem;
}
.product-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:4px;
}
.product-actions .btn{
  width:100%;
  min-height:44px;
  border-radius:14px;
}

.boutique-category-grid{
  gap:12px;
}
.boutique-category-card{
  min-height:116px;
}
.boutique-filter-bar{
  padding:12px;
  border-radius:20px;
}
.filter-chips{
  flex-wrap:nowrap;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding-bottom:4px;
}
.filter-chips::-webkit-scrollbar{
  display:none;
}
.filter-chips .chip{
  flex:0 0 auto;
  white-space:nowrap;
}
.filter-controls{
  min-width:0;
}
.filter-search,
.filter-sort{
  min-height:46px;
  border-radius:16px;
}

.product-detail{
  gap:28px;
}
.product-title{
  margin-top:12px;
  margin-bottom:14px;
  font-size:clamp(2rem, 3vw + 1.2rem, 3.3rem);
  line-height:1.02;
}
.product-info > p{
  font-size:.98rem;
}
.product-purchase-panel{
  display:grid;
  gap:14px;
  margin:22px 0 20px;
}
.product-price-line{
  margin:0;
  padding:18px 20px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
}
.product-actions-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:stretch;
  gap:12px;
  margin:0;
}
.qty-box{
  min-height:50px;
}
.qty-box button{
  width:44px;
  height:50px;
}
.qty-box input{
  width:60px;
  font-weight:700;
}
.product-cta-stack{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:0;
}
.product-cta-stack .btn,
.contact-shortcut{
  min-height:48px;
  border-radius:16px;
}
.product-assurance{
  gap:12px;
  margin-top:18px;
}
.product-assurance .trust-card{
  border-radius:18px;
}
.product-details-grid{
  gap:12px;
}
.detail-card{
  border-radius:20px;
}
.mini-testimonials{
  gap:12px;
  margin-top:20px;
}
.mini-testimonial{
  border-radius:18px;
}

.product-gallery-wrap{
  top:calc(var(--header-offset, 82px) + 10px);
}
.product-gallery-main{
  aspect-ratio:1 / 1.08;
  border-radius:24px;
}
.gallery-thumb{
  width:68px;
  height:68px;
}
.gallery-nav{
  width:42px;
  height:42px;
}

.cart-layout,
.checkout-layout,
.contact-layout{
  gap:22px;
}
.cart-items-panel,
.summary-card,
.contact-card,
.contact-form,
.checkout-form{
  border-radius:24px;
}
.cart-item{
  grid-template-columns:110px minmax(0,1fr) auto;
  gap:16px;
  align-items:start;
}
.cart-item-media img{
  width:110px;
  height:110px;
  border-radius:18px;
}
.cart-item-main,
.cart-item-side{
  min-width:0;
}
.cart-item h3{
  font-size:1.08rem;
  line-height:1.2;
}
.cart-item-side{
  display:grid;
  justify-items:end;
  gap:12px;
  padding-top:2px;
}
.qty-inline{
  flex-wrap:wrap;
}
.summary-line{
  padding:14px 0;
}

.contact-card,
.contact-form,
.checkout-form,
.cart-items-panel,
.summary-card{
  padding:22px;
}
.contact-form input,
.contact-form textarea,
.checkout-form input,
.checkout-form textarea,
.filter-panel input,
.filter-panel select{
  min-height:50px;
  border-radius:16px;
}
textarea{
  min-height:130px;
}

html[data-theme="light"] .site-header{
  background:linear-gradient(180deg, rgba(255,249,243,.95), rgba(255,249,243,.86));
}
html[data-theme="light"] .product-price-line,
html[data-theme="light"] .cart-item,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .checkout-form,
html[data-theme="light"] .summary-card,
html[data-theme="light"] .cart-items-panel{
  border-color:rgba(73,45,26,.08);
}

[dir="rtl"] .product-actions,
[dir="rtl"] .product-cta-stack,
[dir="rtl"] .qty-inline,
[dir="rtl"] .cart-item{
  direction:rtl;
}
[dir="rtl"] .product-meta-top > .price,
[dir="rtl"] .price-wrap,
[dir="rtl"] .cart-item-side{
  text-align:left;
}

/* ============================================================
   FINAL FIXES — currency, product gallery, light/dark, spacing
   ============================================================ */

/* Currency switcher — mirrors the .lang-switcher visual language */
.currency-switcher{
  display:inline-flex;
  align-items:center;
  gap:2px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:3px;
  background:var(--chip-bg, rgba(255,255,255,.04));
}
.currency-btn{
  border:none;
  background:transparent;
  color:var(--muted);
  padding:6px 10px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:pointer;
  line-height:1;
  transition:color .18s ease, background .18s ease;
  font-family:inherit;
}
.currency-btn:hover{color:var(--text)}
.currency-btn.active{
  background:linear-gradient(135deg,var(--gold-2),var(--gold));
  color:#150f0c;
}
html[data-theme="light"] .currency-switcher{
  background:rgba(73,45,26,.04);
  border-color:rgba(73,45,26,.14);
}
html[data-theme="light"] .currency-btn{color:#6b5a47}
html[data-theme="light"] .currency-btn:hover{color:#2a1c12}

/* ============================================================
   Product page — REMOVE sticky, cap image height
   ============================================================ */
.product-gallery-wrap{
  position:relative !important;
  top:auto !important;
}
.product-gallery-main img{
  min-height:0 !important;
  max-height:640px;
  aspect-ratio:4/5;
  object-fit:cover;
  width:100%;
  display:block;
}

/* ============================================================
   Light-mode contrast — strike-through prices must stay visible
   ============================================================ */
.price-original{
  opacity:1;
  color:var(--muted);
  text-decoration:line-through;
  font-size:.82rem;
}
html[data-theme="light"] .price-original{
  color:#8a7460;
  opacity:1;
}
html[data-theme="light"] .product-card p{color:#5a4839}
html[data-theme="light"] .product-collection{color:#8a7460}
html[data-theme="light"] .price{color:#2a1c12}
html[data-theme="light"] .product-badge{
  background:#fff;border-color:rgba(73,45,26,.2);color:#2a1c12;
}

/* ============================================================
   Boutique hero — tighter, no empty band before the filter bar
   ============================================================ */
.boutique-hero{padding:28px 0 14px !important}
.boutique-hero-inner{gap:24px}
.boutique-hero-copy h1{margin-bottom:6px}
.boutique-shell{padding-top:10px !important}
.boutique-filter-bar{margin-bottom:20px}

/* Collapse the old category rail — the filter chips are the single
   category UI (removes the blank duplicate band). */
.boutique-category-rail{display:none !important}

/* Empty bundles section never shows a blank band */
.bundles-section:empty,
.bundles-grid:empty ~ *{display:none}

/* ============================================================
   PHASE 4.0 — LAUNCH FIXES (April 2026)
   Surgical patches only. Ordered:
     1. Floating helpers hide on open mobile menu
     2. Currency switcher inside mobile menu (full width row)
     3. Mobile menu panel stacks above floating helpers
     4. RTL-safe currency switcher behaviour
     5. Tiny safety-net for price contrast
   ============================================================ */

/* 1 — Hide floating contact + chatbot when the mobile nav is open.
   They previously overlapped the open menu and caught taps meant for
   nav links. Desktop unaffected because the menu is always "open"
   (inline) there — body.menu-open is never toggled above 980px. */
body.menu-open .floating-contact-stack,
body.menu-open .chatbot-shell{
  display:none !important;
}

/* 2 — Currency switcher rendered inside the mobile utility row.
   Mirrors the language switcher: a full-width inline-flex that spans
   the menu drawer so the three MAD/EUR/USD buttons are tappable. */
.mobile-nav-utility .currency-switcher{
  width:100%;
  justify-content:center;
  gap:4px;
  padding:4px;
}
.mobile-nav-utility .currency-switcher .currency-btn{
  flex:1;
  padding:10px 12px;
  font-size:.78rem;
  min-height:40px;
}

/* 3 — Mobile nav panel must sit above the (already-hidden) floating
   helpers just in case the menu-open class toggle is delayed by the
   browser paint. Explicit z-index prevents the flash-of-overlap. */
@media (max-width: 980px){
  .main-nav{z-index:70}
  .floating-contact-stack,
  .chatbot-shell{z-index:55}
}

/* 4 — RTL fixes for the currency switcher.
   On RTL the active button's rounded gradient still reads left-to-right
   which looks fine, but the wrapper should mirror so MAD is on the right. */
[dir="rtl"] .currency-switcher{flex-direction:row-reverse}
[dir="rtl"] .mobile-nav-utility .currency-switcher{flex-direction:row}
[dir="rtl"] .bundle-saving{direction:rtl;unicode-bidi:plaintext}
[dir="rtl"] .bundle-price-row{flex-direction:row-reverse;justify-content:flex-start}

/* 5 — Safety-net contrast: the old price must never read as grey-on-grey.
   Both themes re-confirmed with explicit colours, not opacity. */
.price-original{opacity:1 !important;text-decoration:line-through}
html:not([data-theme="light"]) .price-original{color:#c3ae99}
html[data-theme="light"] .price-original{color:#8a7460}
.bundle-price{color:var(--gold-2)}
html[data-theme="light"] .bundle-price{color:#2a1c12}
.bundle-saving{color:var(--muted-2);font-size:.82rem}
html[data-theme="light"] .bundle-saving{color:#6d5542}

/* ============================================================
   PRODUCTION LUXURY REFRESH — clean, visible ecommerce redesign
   ============================================================ */
html,body{max-width:100%;overflow-x:hidden;}
body{
  background:linear-gradient(180deg,var(--bg-main) 0%, #fff 42%, var(--bg-soft) 100%) !important;
  color:var(--text-main) !important;
  text-rendering:optimizeLegibility;
}
html[data-theme="dark"] body{
  background:radial-gradient(circle at 10% 0%,rgba(196,154,108,.10),transparent 30%),linear-gradient(180deg,#0F0B08 0%,#17110D 58%,#0F0B08 100%) !important;
}
.grain{opacity:.025;}
.section{padding:96px 0;}
.site-header{position:sticky;top:0;z-index:90;}
.topbar{
  background:rgba(246,241,235,.88) !important;
  border-bottom:1px solid var(--border-soft) !important;
  color:var(--text-soft) !important;
}
.nav-shell{
  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(139,94,60,.08);
  border-inline:0;
  box-shadow:0 12px 36px rgba(43,43,43,.08);
  backdrop-filter:blur(18px);
}
html[data-theme="dark"] .topbar,
html[data-theme="dark"] .nav-shell{
  background:rgba(15,11,8,.88) !important;
  border-color:rgba(255,255,255,.08) !important;
  box-shadow:0 14px 40px rgba(0,0,0,.34);
}
.brand-mark{
  border-radius:16px;
  background:linear-gradient(135deg,var(--primary),var(--accent)) !important;
  border:0 !important;
  box-shadow:0 10px 24px rgba(139,94,60,.20);
  color:white !important;
}
.brand-text strong,.main-nav a{color:var(--text-main) !important;}
.brand-text small,.topbar-inner{color:var(--text-soft) !important;}
html[data-theme="dark"] .brand-text strong,
html[data-theme="dark"] .main-nav a{color:var(--text-main) !important;}
.main-nav a{font-weight:700;letter-spacing:.01em;}
.main-nav a::after{background:linear-gradient(90deg,var(--primary),var(--accent));height:2px;border-radius:999px;}
.nav-toggle{width:42px;height:42px;border-radius:999px;align-items:center;justify-content:center;border:1px solid var(--border-soft);background:var(--surface);box-shadow:var(--shadow-soft);}
.nav-toggle span{background:var(--text-main) !important;width:19px;}
.btn,button.btn,a.btn,.cart-pill,.utility-dropdown-trigger,.theme-toggle,.filter-search,.filter-sort{
  border-radius:999px !important;
  font-weight:800 !important;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.btn:hover,.cart-pill:hover,.utility-dropdown-trigger:hover,.theme-toggle:hover{transform:translateY(-2px);}
.btn-gold,.product-actions .btn-gold,.product-actions-row .btn-gold,button[data-add-to-cart],button[data-product-add]{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary) 54%,var(--accent)) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 14px 28px rgba(139,94,60,.22);
}
.btn-ghost,.btn-outline,.product-actions .btn-ghost{
  background:rgba(255,255,255,.74) !important;
  color:var(--primary-dark) !important;
  border:1px solid rgba(139,94,60,.18) !important;
}
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .product-actions .btn-ghost{
  background:rgba(255,255,255,.06) !important;
  color:var(--text-main) !important;
  border-color:rgba(255,255,255,.12) !important;
}
.cart-pill,.utility-dropdown-trigger,.theme-toggle{
  background:var(--surface) !important;
  color:var(--text-main) !important;
  border:1px solid var(--border-soft) !important;
  box-shadow:var(--shadow-soft);
}
.cart-count{background:var(--primary) !important;color:#fff !important;}
.hero,.page-hero,.boutique-hero{
  background:radial-gradient(circle at 12% 14%,rgba(196,154,108,.22),transparent 28%),linear-gradient(135deg,#FFFFFF 0%,var(--bg-main) 56%,var(--bg-soft) 100%) !important;
}
html[data-theme="dark"] .hero,
html[data-theme="dark"] .page-hero,
html[data-theme="dark"] .boutique-hero{
  background:radial-gradient(circle at 12% 14%,rgba(196,154,108,.16),transparent 28%),linear-gradient(135deg,#0F0B08 0%,#17110D 56%,#211711 100%) !important;
}
.boutique-filter-bar,.filter-panel,.boutique-catalog-shell{
  background:rgba(255,255,255,.88) !important;
  border:1px solid var(--border-soft) !important;
  border-radius:24px !important;
  box-shadow:0 18px 42px rgba(43,43,43,.08) !important;
}
html[data-theme="dark"] .boutique-filter-bar,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .boutique-catalog-shell{
  background:rgba(23,17,13,.92) !important;
  box-shadow:0 20px 48px rgba(0,0,0,.28) !important;
}
.filter-chips .chip,.boutique-filter-bar .chip{
  border-radius:999px !important;
  background:var(--bg-soft) !important;
  color:var(--text-main) !important;
  border:1px solid var(--border-soft) !important;
  font-weight:800 !important;
}
.filter-chips .chip.active,.boutique-filter-bar .chip.active{
  background:linear-gradient(135deg,var(--primary),var(--accent)) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.product-card{
  border-radius:16px !important;
  background:#fff !important;
  border:1px solid rgba(0,0,0,.06) !important;
  box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
  overflow:hidden !important;
  transition:transform .22s ease, box-shadow .22s ease;
}
.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(43,43,43,.12) !important;}
html[data-theme="dark"] .product-card{
  background:linear-gradient(180deg,#1A120D,#120D0A) !important;
  border-color:rgba(255,255,255,.10) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.32) !important;
}
.product-media{
  background:linear-gradient(135deg,#EFE7DD,#D8C4B0) !important;
  border-radius:0 !important;
}
html[data-theme="dark"] .product-media{background:linear-gradient(135deg,#2B1D15,#5A3E2B) !important;}
.product-body{padding:16px !important;}
.product-card h3{color:var(--text-main) !important;font-family:var(--sans);font-weight:850;}
.product-card p{color:var(--text-soft) !important;}
.price,.product-price-value,.bundle-price{color:var(--primary-dark) !important;font-weight:900 !important;}
html[data-theme="dark"] .price,
html[data-theme="dark"] .product-price-value,
html[data-theme="dark"] .bundle-price{color:var(--accent) !important;}
.price-original{color:var(--text-soft) !important;opacity:.9 !important;}
.product-badge,.badge-oos{
  background:rgba(43,43,43,.90) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}
.utility-dropdown-menu{
  background:var(--surface) !important;
  border:1px solid var(--border-soft) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.12) !important;
}
.site-footer{
  background:linear-gradient(180deg,var(--primary-dark),#2A1B12) !important;
  color:#fff !important;
}
.site-footer p,.site-footer a{color:rgba(255,255,255,.78) !important;}
.circle-btn,.chatbot-toggle,.sticky-contact-btn,.floating-contact-stack .sticky-contact-trigger{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  min-height:56px !important;
  border-radius:50% !important;
  background:var(--primary) !important;
  color:white !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:0 14px 32px rgba(90,62,43,.28) !important;
}
.chatbot-toggle .label,.sticky-contact-btn span:not(.dot){display:none !important;}
.chatbot-panel,.sticky-contact-panel{
  border-radius:22px !important;
  background:var(--surface) !important;
  border:1px solid var(--border-soft) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.20) !important;
}
html[data-theme="dark"] .chatbot-panel,
html[data-theme="dark"] .sticky-contact-panel{box-shadow:0 24px 60px rgba(0,0,0,.42) !important;}
[dir="rtl"] .product-card,[dir="rtl"] .boutique-filter-bar{text-align:right;}