/* =====================================================================
   Zain'ss · theme «لؤلؤة» (premium) — fine jewellery & watches.
   Quiet luxury: ivory paper, deep emerald, warm gold; a serif display face set large and light, hairline rules,
   centred section heads with a small lozenge, lots of air. The 3D sections (hero_3d / showcase_3d) get a gold halo,
   an orbit ring and pedestals.
   ===================================================================== */
.theme-lulua{--hair:color-mix(in srgb,var(--text) 14%,transparent);--gold:var(--accent);--gold-soft:color-mix(in srgb,var(--accent) 22%,var(--bg))}
.theme-lulua ::selection{background:var(--gold-soft)}

/* ---------------------------------------------------------------- type */
.theme-lulua h1,.theme-lulua h2,.theme-lulua h3{font-weight:var(--h-weight,500);letter-spacing:0}
.theme-lulua .eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--gold);gap:12px}
.theme-lulua .eyebrow::before{width:28px;opacity:.6}
.theme-lulua .scheme-dark .eyebrow,.theme-lulua .scheme-ink .eyebrow,.theme-lulua .h3d--dark .eyebrow{color:color-mix(in srgb,var(--gold) 70%,#fff)}

/* centred section heads with a lozenge under the title */
.theme-lulua .sec-head{flex-direction:column;align-items:center;text-align:center;gap:14px}
.theme-lulua .sec-head>div:first-child:not(.tab-list){display:flex;flex-direction:column;align-items:center}
.theme-lulua .sec-head h2{font-size:calc(clamp(34px,3.6vw,56px) * var(--h-scale,1));line-height:1.1;margin-top:8px}
.theme-lulua .sec-head h2::after{content:"";display:block;width:7px;height:7px;margin:16px auto 0;background:var(--gold);transform:rotate(45deg)}
.theme-lulua .sec-head .eyebrow::before{display:none}
.theme-lulua .sec-head .eyebrow::after{content:"";width:28px;height:1px;background:currentColor;opacity:.6;order:-1}
.theme-lulua .sec-head .eyebrow{flex-direction:row}
.theme-lulua .sec-head .eyebrow::before{content:"";display:block;width:28px;height:1px;background:currentColor;opacity:.6;order:2}
.theme-lulua .sec-tools{align-self:center}
.theme-lulua .more{font-size:13.5px;letter-spacing:.04em;border-bottom:1px solid var(--hair);padding-bottom:4px}

/* ---------------------------------------------------------------- buttons */
.theme-lulua .btn{height:52px;padding:0 30px;font-size:14.5px;letter-spacing:.06em;border-width:1px}
.theme-lulua .btn--ghost{background:transparent;color:var(--text);border-color:color-mix(in srgb,var(--text) 40%,transparent)}
.theme-lulua .btn--ghost:hover{background:var(--text);color:var(--bg);border-color:var(--text)}
.theme-lulua .btn:not(.btn--ghost):not(.btn--light):not(.btn--wa):hover{background:var(--c-dark);border-color:var(--c-dark);color:#fff}
.theme-lulua .btn--light{background:#F7F2EB;border-color:#F7F2EB;color:#1B1915}

/* ---------------------------------------------------------------- header */
.theme-lulua .ann{height:36px;font-size:12.5px;letter-spacing:.06em}
.theme-lulua .hdr{border-bottom-color:var(--hair)}
.theme-lulua .nav-link{font-size:14px;letter-spacing:.04em}
.theme-lulua .logo img{max-height:52px}

/* ---------------------------------------------------------------- «غلاف 3D» */
.theme-lulua .h3d{background:radial-gradient(120% 90% at 20% 40%,color-mix(in srgb,var(--surface) 70%,var(--bg)),var(--bg) 70%)}
.theme-lulua .h3d-title{font-weight:500;font-size:calc(clamp(46px,6vw,96px) * var(--h-scale,1));line-height:1}
.theme-lulua .h3d-eyebrow{color:var(--gold)}
.theme-lulua .h3d-price b{font:500 30px/1 var(--font-head),var(--font-body),serif}
.theme-lulua .h3d-text{color:color-mix(in srgb,var(--text) 70%,var(--bg))}
.theme-lulua .h3d-dot-img{border-radius:50%;background:var(--surface)}
.theme-lulua .h3d-dot.is-active .h3d-dot-img{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 20%,transparent)}
.theme-lulua .h3d-dot-bar i{background:var(--gold)}

/* ---------------------------------------------------------------- press, categories */
.theme-lulua .press-title{letter-spacing:.14em;font-size:12px;color:var(--muted)}
.theme-lulua .press-mark{font-family:var(--font-head),serif!important;font-style:italic!important;opacity:.55;letter-spacing:.02em}
.theme-lulua .cat-tile--cards .cat-media{border-radius:0;aspect-ratio:4/5;background:var(--surface)}
.theme-lulua .cat-tile--cards .cat-label{align-items:center;text-align:center;padding-top:6px}
.theme-lulua .cat-tile--cards .cat-label b{font:500 calc(24px * var(--h-scale,1))/1.2 var(--font-head),serif}
.theme-lulua .cat-tile--cards:hover .cat-label b{color:var(--gold)}

/* ---------------------------------------------------------------- product cards */
.theme-lulua .pcard-media{background:var(--surface);border-radius:0}
.theme-lulua .pcard-title{font:500 calc(19px * var(--h-scale,1))/1.3 var(--font-head),serif}
.theme-lulua .pcard .price b{font-weight:500;letter-spacing:.02em}
.theme-lulua .tab{font:500 calc(clamp(22px,2vw,30px) * var(--h-scale,1))/1.3 var(--font-head),serif;border-bottom-width:1px}
.theme-lulua .tab[aria-selected=true]{border-color:var(--gold)}
.theme-lulua .tabs-head{justify-content:center;flex-direction:column;align-items:center;gap:14px}

/* ---------------------------------------------------------------- «معرض 3D» */
.theme-lulua .s3d-lead{text-align:center;margin-inline:auto}
.theme-lulua .s3d-stage{border-radius:0;background:radial-gradient(70% 55% at 50% 40%,color-mix(in srgb,#fff 55%,var(--bg)),var(--surface) 85%)}
.theme-lulua .s3d-info{align-items:center;text-align:center;padding-inline:44px}
.theme-lulua .s3d-info h3{font:500 calc(20px * var(--h-scale,1))/1.3 var(--font-head),serif}
.theme-lulua .s3d-badge{background:color-mix(in srgb,var(--c-dark) 88%,transparent);color:#f3e4c3}
.theme-lulua .s3d-link{inset-inline-end:0;border-color:var(--hair)}
.theme-lulua .s3d-card:hover .s3d-stage{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 45%,transparent)}

/* ---------------------------------------------------------------- banners */
.theme-lulua .ibanner-title,.theme-lulua .banner-text h2{font-weight:500;line-height:1.02}
.theme-lulua .ibanner .eyebrow{color:var(--gold)}
.theme-lulua .banner{border-radius:0}
.theme-lulua .banner .cd-unit{border-radius:0;background:transparent;border:1px solid currentColor;min-width:70px}
.theme-lulua .banner .cd-unit b{font:500 34px/1 var(--font-head),serif}

/* ---------------------------------------------------------------- shop the look */
.theme-lulua .hs-img{border-radius:0}
.theme-lulua .hs-dot{width:30px;height:30px;background:rgba(247,242,235,.9);backdrop-filter:blur(4px)}
.theme-lulua .hs-dot::before{background:var(--gold);width:8px;height:8px}
.theme-lulua .hs-dot::after{border-color:color-mix(in srgb,var(--gold) 80%,#fff)}
.theme-lulua .hs-pop{border-radius:0}
.theme-lulua .hs-item{border-radius:0}
@media (min-width:961px){
  .theme-lulua .hotspots-sec--side .sec-head{align-items:flex-start;text-align:start}
  .theme-lulua .hotspots-sec--side .sec-head>div:first-child{align-items:flex-start}
  .theme-lulua .hotspots-sec--side .sec-head h2::after{margin-inline:0}
}

/* ---------------------------------------------------------------- testimonial, story, faq, trust */
.theme-lulua .testi blockquote,.theme-lulua .testi-quote{font:500 calc(clamp(26px,2.8vw,42px) * var(--h-scale,1))/1.45 var(--font-head),serif}
.theme-lulua .story-media{border-radius:0}
.theme-lulua .story-text h2{font-weight:500}
.theme-lulua .stats b,.theme-lulua .stat b{font:500 calc(44px * var(--h-scale,1))/1 var(--font-head),serif;color:var(--gold)}
.theme-lulua .faq-q{font:500 calc(21px * var(--h-scale,1))/1.4 var(--font-head),serif}
.theme-lulua .trust{background:transparent;border-block:1px solid var(--hair)}
.theme-lulua .trust-ic{background:transparent;border-color:color-mix(in srgb,var(--gold) 45%,transparent);color:var(--gold)}
.theme-lulua .trust-item b{font:500 calc(19px * var(--h-scale,1))/1.3 var(--font-head),serif}

/* ---------------------------------------------------------------- product page */
.theme-lulua .pdp-title{font-weight:500;line-height:1.1}
.theme-lulua .pdp-price b{font:500 calc(32px * var(--h-scale,1))/1 var(--font-head),serif}
.theme-lulua .g-slide,.theme-lulua .g-main{border-radius:0;background:var(--surface)}
.theme-lulua .vp-sw{border-radius:50%}
.theme-lulua .opt-pill{border-radius:0;min-width:52px}
.theme-lulua .pdp-text--note{background:color-mix(in srgb,var(--gold) 9%,var(--bg));border:1px solid color-mix(in srgb,var(--gold) 28%,transparent);color:var(--text)}
.theme-lulua .accordion summary{font:500 calc(19px * var(--h-scale,1))/1.3 var(--font-head),serif}
.theme-lulua .bundle{border-radius:0}

/* ---------------------------------------------------------------- footer */
.theme-lulua .ftr{border-top:0}
.theme-lulua .ftr h3{font:500 calc(20px * var(--h-scale,1))/1.3 var(--font-head),serif;letter-spacing:0;color:#F3E9D8}
.theme-lulua .ftr .logo img{max-height:56px}
.theme-lulua .ftr-bottom{border-top-color:color-mix(in srgb,#fff 12%,transparent)}

@media (max-width:960px){
  .theme-lulua .h3d-title{font-size:calc(clamp(40px,11vw,60px) * var(--h-scale,1))}
  .theme-lulua .sec-head h2{font-size:calc(clamp(30px,8vw,40px) * var(--h-scale,1))}
}
@media (max-width:640px){
  .theme-lulua .btn{height:50px;padding:0 22px}
  .theme-lulua .cat-tile--cards .cat-label b{font-size:20px}
}
