/* ══════════════════════════════════════
   LIGHT THEME OVERRIDES
   ══════════════════════════════════════ */

:root.light body {
    background: linear-gradient(155deg, #faf7f2, #f0ebe0) !important;
    color: #2c1f0a !important;
}

/* ── Sections ── */
:root.light #shop,
:root.light #about-section,
:root.light #why,
:root.light #testimonials,
:root.light #hero,
:root.light #checkout-page,
:root.light #success-page,
:root.light #track-page,
:root.light #myorders-page,
:root.light #contact-page {
    background: transparent !important;
}

/* ── All text ── */
:root.light h1,
:root.light h2,
:root.light h3,
:root.light h4,
:root.light p,
:root.light span,
:root.light div,
:root.light label,
:root.light li,
:root.light a {
    color: #2c1f0a;
}

/* Keep gold elements gold */
:root.light .gold,
:root.light .display em,
:root.light .hero-h1 em,
:root.light .prod-price .price-final,
:root.light .ord-total-val,
:root.light .suc-ref,
:root.light .nav-logo-name,
:root.light [style*="color:var(--gold)"] {
    color: #8b6914 !important;
}

/* Keep green discount text */
:root.light [style*="rgba(100,220,140"] {
    color: #2d7a4a !important;
}

/* ── Nav ── */
:root.light #nav {
    background: rgba(250,247,242,.96) !important;
    border-bottom: 1px solid rgba(139,105,20,.15) !important;
}

:root.light .nav-links a,
:root.light .nav-logo-sub {
    color: rgba(44,31,10,.6) !important;
}

    :root.light .nav-links a:hover {
        color: #8b6914 !important;
    }

:root.light .nav-cart {
    color: rgba(44,31,10,.7) !important;
    border-color: rgba(139,105,20,.25) !important;
}

:root.light .cart-n {
    background: #8b6914 !important;
}

/* ── Product cards ── */
:root.light .prod-card {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
    box-shadow: 0 2px 20px rgba(44,31,10,.08) !important;
}

:root.light .prod-name {
    color: #2c1f0a !important;
}

:root.light .prod-type {
    color: rgba(44,31,10,.5) !important;
}

:root.light .prod-desc {
    color: rgba(44,31,10,.65) !important;
}

:root.light .prod-tag {
    background: rgba(139,105,20,.08) !important;
    border-color: rgba(139,105,20,.2) !important;
    color: rgba(44,31,10,.6) !important;
}

:root.light .price-original {
    color: rgba(44,31,10,.35) !important;
}

:root.light .price-final {
    color: #8b6914 !important;
}

:root.light .prod-price small {
    color: rgba(44,31,10,.4) !important;
}

/* ── Variant buttons ── */
:root.light .variant-btn {
    border-color: rgba(139,105,20,.25) !important;
    color: rgba(44,31,10,.5) !important;
}

    :root.light .variant-btn.active {
        background: rgba(139,105,20,.12) !important;
        color: #8b6914 !important;
        border-color: rgba(139,105,20,.4) !important;
    }

/* ── Why cards ── */
:root.light .why-card {
    background: rgba(255,255,255,.6) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .why-title {
    color: #2c1f0a !important;
}

:root.light .why-body {
    color: rgba(44,31,10,.6) !important;
}

/* ── Testimonial cards ── */
:root.light .test-card {
    background: rgba(255,255,255,.6) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .test-q {
    color: rgba(44,31,10,.7) !important;
}

:root.light .test-name {
    color: #2c1f0a !important;
}

:root.light .test-loc {
    color: rgba(44,31,10,.5) !important;
}

:root.light .test-stars {
    color: #8b6914 !important;
}

/* ── Cart drawer ── */
:root.light #cartDrawer {
    background: #f5f0e8 !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .cart-title,
:root.light .ci-name {
    color: #2c1f0a !important;
}

:root.light .ci-unit {
    color: rgba(44,31,10,.45) !important;
}

:root.light .cart-total-val,
:root.light .ci-total {
    color: #8b6914 !important;
}

:root.light .cf-label,
:root.light .cart-total-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .cf-val {
    color: #2c1f0a !important;
}

:root.light .q-btn {
    background: rgba(139,105,20,.08) !important;
    border-color: rgba(139,105,20,.2) !important;
    color: #8b6914 !important;
}

:root.light .q-num {
    color: #2c1f0a !important;
}

:root.light .ci-rm {
    color: rgba(44,31,10,.4) !important;
}

/* ── Checkout page ── */
:root.light .form-panel,
:root.light .order-panel {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .panel-title {
    color: #2c1f0a !important;
}

:root.light .form-label {
    color: rgba(44,31,10,.6) !important;
}

:root.light .form-input,
:root.light .form-select {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #2c1f0a !important;
}

    :root.light .form-input::placeholder {
        color: rgba(44,31,10,.3) !important;
    }

:root.light .form-section {
    color: rgba(44,31,10,.5) !important;
}

:root.light .pay-opt {
    background: rgba(255,255,255,.5) !important;
    border-color: rgba(139,105,20,.2) !important;
}

    :root.light .pay-opt.active {
        background: rgba(139,105,20,.08) !important;
        border-color: rgba(139,105,20,.4) !important;
    }

:root.light .pay-label {
    color: #2c1f0a !important;
}

:root.light .pay-sub {
    color: rgba(44,31,10,.55) !important;
}

:root.light .ord-name {
    color: #2c1f0a !important;
}

:root.light .ord-qty,
:root.light .ord-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .ord-val {
    color: #2c1f0a !important;
}

:root.light .ord-total-label {
    color: #2c1f0a !important;
}

:root.light .coup-input {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #2c1f0a !important;
}

/* ── Success page ── */
:root.light .suc-detail-card {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .suc-dl {
    color: rgba(44,31,10,.45) !important;
}

:root.light .suc-dv {
    color: #2c1f0a !important;
}

:root.light .suc-h2 {
    color: #2c1f0a !important;
}

:root.light .suc-p {
    color: rgba(44,31,10,.6) !important;
}

/* ── About section ── */
:root.light .about-quote p {
    color: rgba(44,31,10,.6) !important;
}

:root.light .float-chip {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .fc-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .fc-val {
    color: #2c1f0a !important;
}

/* ── Ticker ── */
:root.light .ticker {
    background: rgba(240,235,224,.9) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .tick-item {
    color: rgba(44,31,10,.55) !important;
}

    :root.light .tick-item::after {
        background: rgba(139,105,20,.3) !important;
    }

/* ── Footer ── */
:root.light footer {
    background: #e8e0d0 !important;
    border-top-color: rgba(139,105,20,.2) !important;
}

:root.light .footer-brand h2 {
    color: #8b6914 !important;
}

:root.light .footer-brand small,
:root.light .footer-brand p,
:root.light .footer-col h4,
:root.light .footer-col a,
:root.light .footer-col span,
:root.light .footer-copy,
:root.light .footer-tag {
    color: rgba(44,31,10,.6) !important;
}

:root.light .f-social {
    border-color: rgba(139,105,20,.25) !important;
    color: rgba(44,31,10,.6) !important;
}

/* ── Eyebrow labels ── */
:root.light .eyebrow {
    color: rgba(44,31,10,.45) !important;
}

    :root.light .eyebrow::before,
    :root.light .eyebrow::after {
        background: rgba(139,105,20,.3) !important;
    }

/* ── Hero section ── */
:root.light .hero-pretag span {
    color: rgba(44,31,10,.5) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .hero-sub {
    color: rgba(44,31,10,.6) !important;
}

:root.light .hero-scroll span {
    color: rgba(44,31,10,.4) !important;
}

:root.light .scroll-bar {
    background: rgba(139,105,20,.3) !important;
}

/* ── Shop heading ── */
:root.light .shop-hd p {
    color: rgba(44,31,10,.5) !important;
}

/* ── Buttons keep their gold style ── */
:root.light .btn-gold {
    background: linear-gradient(135deg, #c4a05a, #a8864a) !important;
    color: #0b0806 !important;
}

:root.light .btn-outline {
    border-color: rgba(139,105,20,.4) !important;
    color: #8b6914 !important;
}

:root.light .btn-add {
    border-color: rgba(139,105,20,.3) !important;
    color: #8b6914 !important;
}

:root.light .btn-checkout {
    background: linear-gradient(135deg, #c4a05a, #a8864a) !important;
    color: #0b0806 !important;
}



/* ═══════════════════════════════════════════════════════════
   TOKENS
═══════════════════════════════════════════════════════════ */
:root{
  --ink:#090704;
  --bg:#0b0806;
  --bg2:#120e09;
  --bg3:#1a1209;
  --brown:#3d2410;
  --mid:#6b4020;
  --gold:#c4a05a;
  --gold2:#e0c07a;
  --gold-pale:rgba(196,160,90,.1);
  --mist:#2b4d3c;
  --mist2:#3d6b50;
  --teal:#2e5a46;
  --cream:#f2e8d8;
  --cream2:#e6d9c4;
  --line:rgba(196,160,90,.16);
  --line2:rgba(242,232,216,.07);
  --ease:cubic-bezier(.16,1,.3,1);
  --ease2:cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth}
body{
  font-family:'DM Sans',sans-serif;
  background:var(--bg);color:var(--cream);
  overflow-x:hidden;
  min-height:100vh
}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font-family:inherit}
img{display:block;max-width:100%}
ul{list-style:none}

/* ═══════════════════════════════════════════════════════════
   CURSOR
═══════════════════════════════════════════════════════════ */
#cur{position:fixed;width:9px;height:9px;background:var(--gold);border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);mix-blend-mode:screen;transition:width .2s,height .2s}
#cur-r{position:fixed;width:36px;height:36px;border:1px solid rgba(196,160,90,.42);border-radius:50%;pointer-events:none;z-index:99998;transform:translate(-50%,-50%);transition:width .38s var(--ease),height .38s var(--ease),opacity .3s;opacity:.48}
body:has(a:hover) #cur,body:has(button:hover) #cur,body:has(input:hover) #cur{width:15px;height:15px}
body:has(a:hover) #cur-r,body:has(button:hover) #cur-r{width:52px;height:52px;opacity:.16}

/* ═══════════════════════════════════════════════════════════
   PAGE SYSTEM
═══════════════════════════════════════════════════════════ */
.page{display:none;min-height:100vh}
.page.active{display:block}

/* ═══════════════════════════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════════════════════════ */
.serif{font-family:'Cormorant Garamond',serif}
.cinzel{font-family:'Cinzel',serif}
.eyebrow{font-size:.58rem;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);font-weight:400;display:inline-flex;align-items:center;gap:10px}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--gold)}
.display{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,5vw,4.6rem);font-weight:300;line-height:1.08;color:var(--cream)}
.display em{font-style:italic;color:var(--gold)}
.gold-bar{width:48px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);margin:22px 0}

/* ═══════════════════════════════════════════════════════════
   SCROLL REVEAL
═══════════════════════════════════════════════════════════ */
.rv{opacity:0;transform:translateY(28px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}
.rvl{opacity:0;transform:translateX(-28px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rvl.in{opacity:1;transform:none}
.rvr{opacity:0;transform:translateX(28px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rvr.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
.d4{transition-delay:.4s}.d5{transition-delay:.5s}

/* ═══════════════════════════════════════════════════════════
   NAVBAR
═══════════════════════════════════════════════════════════ */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:800;
  padding:20px 60px;display:flex;align-items:center;justify-content:space-between;
  transition:padding .5s,background .5s;border-bottom:1px solid transparent
}
#nav.scrolled{padding:13px 60px;background:rgba(11,8,6,.92);backdrop-filter:blur(24px);border-color:var(--line)}
.nav-logo-wrap{display:flex;align-items:center;gap:12px;cursor:none}
.nav-logo-svg{width:42px;height:42px}
.nav-logo-text{display:flex;flex-direction:column;gap:1px}
.nav-logo-name{font-family:'Cinzel',serif;font-size:.95rem;letter-spacing:.14em;color:var(--gold)}
.nav-logo-sub{font-size:.42rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(196,160,90,.45)}
.nav-links{display:flex;gap:32px}
.nav-links a{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,232,216,.5);transition:color .3s;position:relative;font-weight:400}
.nav-links a::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:1px;background:var(--gold);transition:width .3s}
.nav-links a:hover{color:var(--gold)}
.nav-links a:hover::after{width:100%}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-cart{
  position:relative;background:transparent;border:1px solid var(--line);
  padding:8px 18px;display:flex;align-items:center;gap:8px;
  color:var(--cream);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;
  transition:border-color .3s,color .3s
}
.nav-cart:hover{border-color:var(--gold);color:var(--gold)}
.nav-cart svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8}
.cart-n{
  position:absolute;top:-7px;right:-7px;
  width:19px;height:19px;border-radius:50%;
  background:var(--gold);color:var(--bg);
  font-size:.5rem;font-weight:700;letter-spacing:0;
  display:flex;align-items:center;justify-content:center;
  transform:scale(0);transition:transform .3s var(--ease)
}
.cart-n.show{transform:scale(1)}
.cart-n.pop{animation:cartPop .35s var(--ease)}
@keyframes cartPop{0%,100%{transform:scale(1)}45%{transform:scale(1.55)}}

/* ═══════════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;
  font-weight:500;border:none;padding:14px 36px;
  position:relative;overflow:hidden;cursor:none;transition:color .35s
}
.btn span{position:relative;z-index:1}
.btn::before{content:'';position:absolute;inset:0;transform:scaleX(0);transform-origin:left;transition:transform .42s var(--ease)}
.btn:hover::before{transform:scaleX(1)}
.btn-gold{background:var(--gold);color:var(--bg)}
.btn-gold::before{background:var(--gold2)}
.btn-outline{background:transparent;color:var(--cream);border:1px solid rgba(242,232,216,.28)}
.btn-outline::before{background:rgba(242,232,216,.07)}
.btn-outline:hover{border-color:rgba(242,232,216,.5)}
.btn-teal{background:var(--teal);color:var(--cream)}
.btn-teal::before{background:var(--mist2)}

/* ═══════════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════════ */
#hero{
  position:relative;min-height:100vh;
  display:flex;align-items:center;overflow:hidden
}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 55% at 20% 85%,rgba(61,36,16,.75),transparent 55%),
    radial-gradient(ellipse 45% 40% at 80% 25%,rgba(43,77,60,.28),transparent 50%),
    linear-gradient(165deg,#060402 0%,#110c07 28%,#150e08 58%,#090604 100%)
}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='https://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='.65' fill='rgba(196,160,90,.042)'/%3E%3C/svg%3E")
}
.hero-mtns{position:absolute;bottom:0;left:0;right:0;width:100%;z-index:1;pointer-events:none}
.hero-mist{position:absolute;left:-8%;right:-8%;border-radius:60%;filter:blur(55px);pointer-events:none;z-index:2;animation:mistPulse ease-in-out infinite}
.hm1{bottom:30%;height:88px;background:rgba(43,77,60,.16);animation-duration:14s}
.hm2{bottom:22%;height:64px;background:rgba(242,232,216,.04);animation-duration:20s;animation-delay:5s}
.hm3{bottom:14%;height:50px;background:rgba(43,77,60,.1);animation-duration:11s;animation-delay:9s}
@keyframes mistPulse{0%,100%{opacity:0;transform:translateX(-2%)}35%,65%{opacity:1}50%{transform:translateX(2%)}}
.hero-particles{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.grain{position:absolute;border-radius:50%;animation:grainFloat linear infinite;opacity:0}
@keyframes grainFloat{0%{opacity:0;transform:translateY(10px)}12%{opacity:.7}72%{opacity:.25}100%{opacity:0;transform:translateY(-100vh)}}

.hero-inner{position:relative;z-index:10;padding:0 60px;max-width:900px;padding-top:90px}
.hero-logo-hero{margin-bottom:32px;animation:heroFadeUp .9s .1s var(--ease) both}
.hero-logo-hero svg{width:90px;height:90px}
.hero-pretag{display:flex;align-items:center;gap:14px;margin-bottom:18px;animation:heroFadeUp .9s .2s var(--ease) both}
.hero-pretag span{font-size:.54rem;letter-spacing:.38em;text-transform:uppercase;color:var(--gold);font-weight:300}
.hero-pretag::before,.hero-pretag::after{content:'';flex:none;width:28px;height:1px;background:var(--gold)}
.hero-h1{font-family:'Cormorant Garamond',serif;font-size:clamp(3rem,7.5vw,7.8rem);font-weight:300;line-height:.98;margin-bottom:10px;animation:heroFadeUp 1s .32s var(--ease) both}
.hero-h1 em{display:block;color:var(--gold);font-style:italic}
.hero-sub{font-family:'Cormorant Garamond',serif;font-size:clamp(1rem,1.8vw,1.4rem);color:rgba(242,232,216,.6);font-weight:300;font-style:italic;line-height:1.75;margin-bottom:42px;animation:heroFadeUp 1s .44s var(--ease) both}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;animation:heroFadeUp 1s .58s var(--ease) both}
.hero-cup-scene{position:absolute;right:6%;bottom:8%;z-index:8;animation:heroFadeUp 1.2s .7s var(--ease) both}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(26px)}}
.hero-scroll{position:absolute;bottom:28px;left:60px;z-index:10;display:flex;flex-direction:column;align-items:center;gap:8px;animation:heroFadeUp 1s 1.3s both}
.hero-scroll span{font-size:.46rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(196,160,90,.45)}
.scroll-bar{width:1px;height:54px;background:linear-gradient(to bottom,var(--gold),transparent);animation:scrollPulse 2.2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{opacity:.2;transform:scaleY(.5);transform-origin:top}55%{opacity:1;transform:scaleY(1)}}
/* Steam */
.st{position:absolute;width:2px;border-radius:2px;background:linear-gradient(to top,rgba(242,232,216,.55),transparent);animation:stm linear infinite;opacity:0}
@keyframes stm{0%{opacity:0;transform:translateY(0) scaleX(1)}18%{opacity:.8}78%{opacity:.2}100%{opacity:0;transform:translateY(-100px) scaleX(.2)}}

/* ═══════════════════════════════════════════════════════════
   TICKER
═══════════════════════════════════════════════════════════ */
.ticker{overflow:hidden;padding:12px 0;background:rgba(196,160,90,.06);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ticker-t{display:flex;gap:48px;white-space:nowrap;animation:tickScroll 22s linear infinite}
@keyframes tickScroll{to{transform:translateX(-50%)}}
.tick-item{display:inline-flex;align-items:center;gap:12px;font-size:.55rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(196,160,90,.5);flex-shrink:0}
.tick-item::after{content:'✦';font-size:.4rem;color:rgba(196,160,90,.22)}

/* ═══════════════════════════════════════════════════════════
   PRODUCTS
═══════════════════════════════════════════════════════════ */
#shop{position:relative;padding:120px 60px;background:linear-gradient(180deg,#0d0906 0%,#120e08 100%);overflow:hidden}
#shop::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='70' height='70' xmlns='https://www.w3.org/2000/svg'%3E%3Cellipse cx='35' cy='35' rx='6' ry='9' fill='none' stroke='rgba(196,160,90,.036)' stroke-width='.75'/%3E%3C/svg%3E")}
#shop::after{content:'';position:absolute;top:50%;left:50%;width:800px;height:800px;border-radius:50%;background:radial-gradient(circle,rgba(61,36,16,.22),transparent 65%);transform:translate(-50%,-50%);pointer-events:none}
.shop-hd{text-align:center;margin-bottom:68px;position:relative;z-index:1}
.shop-hd .eyebrow{justify-content:center}
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1100px;margin:0 auto;position:relative;z-index:1}

.prod-card{
  background:linear-gradient(148deg,rgba(61,36,16,.32),rgba(11,8,6,.96));
  border:1px solid rgba(196,160,90,.12);overflow:hidden;
  transition:transform .5s var(--ease),border-color .3s,box-shadow .5s;cursor:none;
  display:flex;flex-direction:column
}
.prod-card:hover{transform:translateY(-10px);border-color:rgba(196,160,90,.42);box-shadow:0 32px 72px rgba(0,0,0,.55)}
.prod-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .5s var(--ease);position:relative}
.prod-card:hover .prod-top-line{transform:scaleX(1)}
.prod-top-line{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .5s var(--ease)}
.prod-visual{height:250px;display:flex;align-items:center;justify-content:center;position:relative;background:linear-gradient(160deg,rgba(43,77,60,.12),rgba(11,8,6,.6));overflow:hidden}
.prod-visual::after{content:'';position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to top,rgba(11,8,6,.9),transparent)}
.prod-badge{position:absolute;top:14px;right:14px;z-index:2;font-size:.46rem;letter-spacing:.18em;text-transform:uppercase;background:var(--gold);color:var(--bg);padding:4px 10px;font-weight:600}
.pouch-img{width:110px;filter:drop-shadow(0 14px 28px rgba(0,0,0,.7));transition:transform .5s var(--ease)}
.prod-card:hover .pouch-img{transform:scale(1.07) translateY(-5px) rotate(-1deg)}
.prod-body{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column}
.prod-type{font-size:.5rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.prod-name{font-family:'Cormorant Garamond',serif;font-size:1.65rem;font-weight:400;color:var(--cream);margin-bottom:8px;line-height:1.08}
.prod-desc{font-family:'Cormorant Garamond',serif;font-size:.98rem;color:rgba(242,232,216,.52);line-height:1.8;margin-bottom:16px;font-weight:300;font-style:italic;flex:1}
.prod-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:20px}
.prod-tag{font-size:.44rem;letter-spacing:.13em;text-transform:uppercase;padding:3px 8px;border:1px solid rgba(196,160,90,.2);color:rgba(196,160,90,.55)}
.prod-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(196,160,90,.1);padding-top:16px}
.prod-price{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--gold);line-height:1}
.prod-price small{font-size:.52rem;font-family:'DM Sans',sans-serif;color:rgba(196,160,90,.4);letter-spacing:.06em}
.prod-price del{font-size:.9rem;color:rgba(196,160,90,.3);margin-right:6px}
.btn-add{
  display:flex;align-items:center;gap:6px;
  padding:9px 18px;background:transparent;border:1px solid rgba(196,160,90,.35);
  color:var(--gold);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  cursor:none;position:relative;overflow:hidden;transition:color .35s
}
.btn-add::before{content:'';position:absolute;inset:0;background:var(--gold);transform:translateX(-101%);transition:transform .38s var(--ease)}
.btn-add:hover{color:var(--bg);border-color:var(--gold)}
.btn-add:hover::before{transform:translateX(0)}
.btn-add svg,.btn-add span{position:relative;z-index:1}
.btn-add svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;transition:stroke .35s}
.btn-add:hover svg{stroke:var(--bg)}

/* ═══════════════════════════════════════════════════════════
   ABOUT
═══════════════════════════════════════════════════════════ */
#about-page,#about-section{position:relative;padding:120px 60px;overflow:hidden;background:linear-gradient(148deg,#0b0703 0%,#1a1108 50%,#0e0905 100%)}
#about-page::before,#about-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 55% at 85% 50%,rgba(43,77,60,.14),transparent),radial-gradient(ellipse 40% 40% at 15% 75%,rgba(61,36,16,.3),transparent)}
.about-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:90px;align-items:center;max-width:1200px;margin:0 auto;position:relative;z-index:1}
.about-visual{position:relative;height:500px;display:flex;align-items:center;justify-content:center}
.orb{position:absolute;border-radius:50%;animation:orbSpin linear infinite}
.orb-a{width:370px;height:370px;border:1px solid rgba(196,160,90,.07);animation-duration:30s}
.orb-b{width:270px;height:270px;border:1px dashed rgba(196,160,90,.05);animation-duration:20s;animation-direction:reverse}
@keyframes orbSpin{to{transform:rotate(360deg)}}
.about-core{width:155px;height:155px;border-radius:50%;background:radial-gradient(circle,rgba(61,36,16,.9),rgba(11,8,6,.95));border:1px solid rgba(196,160,90,.22);display:flex;align-items:center;justify-content:center;font-size:4rem;box-shadow:0 0 70px rgba(196,160,90,.06)}
.float-chip{position:absolute;background:rgba(11,8,6,.88);border:1px solid rgba(196,160,90,.2);padding:12px 18px;backdrop-filter:blur(12px);animation:chipBob ease-in-out infinite alternate}
@keyframes chipBob{from{transform:translateY(0)}to{transform:translateY(-9px)}}
.fc-1{top:60px;right:20px;animation-duration:3.5s}
.fc-2{bottom:68px;left:10px;animation-duration:4.2s;animation-delay:1.8s}
.fc-label{font-size:.44rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(196,160,90,.46);margin-bottom:3px}
.fc-val{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--gold);line-height:1}
.about-quote{margin-top:32px;padding:20px 26px;border-left:2px solid var(--gold);background:rgba(196,160,90,.04)}
.about-quote p{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-style:italic;color:var(--gold);line-height:1.65;font-weight:300}

/* ═══════════════════════════════════════════════════════════
   WHY / FEATURES
═══════════════════════════════════════════════════════════ */
#why{position:relative;padding:110px 60px;background:linear-gradient(135deg,#080503 0%,#140f09 50%,#0a0704 100%);overflow:hidden}
#why::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' xmlns='https://www.w3.org/2000/svg'%3E%3Ccircle cx='40' cy='40' r='1' fill='rgba(196,160,90,.032)'/%3E%3C/svg%3E")}
.why-hd{text-align:center;margin-bottom:62px;position:relative;z-index:1}
.why-grid{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);max-width:1200px;margin:0 auto;position:relative;z-index:1}
.why-card{padding:44px 24px 40px;border-right:1px solid var(--line);text-align:center;position:relative;transition:background .4s;cursor:default}
.why-card:last-child{border-right:none}
.why-line{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:scaleX(0);transition:transform .45s var(--ease)}
.why-card:hover .why-line{transform:scaleX(1)}
.why-card:hover{background:rgba(61,36,16,.16)}
.why-icon{font-size:2.2rem;margin-bottom:16px;display:block}
.why-title{font-family:'Cormorant Garamond',serif;font-size:.95rem;color:var(--gold);margin-bottom:10px;line-height:1.3}
.why-body{font-size:.74rem;color:rgba(242,232,216,.42);line-height:1.76}

/* ═══════════════════════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════════════════════ */
#testimonials{position:relative;padding:110px 60px;background:linear-gradient(180deg,#0e0a06,#110d07);overflow:hidden}
.test-hd{text-align:center;margin-bottom:58px;position:relative;z-index:1}
.test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1200px;margin:0 auto;position:relative;z-index:1}
.test-card{background:rgba(20,14,9,.85);border:1px solid rgba(196,160,90,.1);padding:34px 28px;transition:border-color .3s,transform .3s;cursor:default}
.test-card:hover{border-color:rgba(196,160,90,.3);transform:translateY(-3px)}
.test-stars{color:var(--gold);font-size:.85rem;letter-spacing:.22em;margin-bottom:16px}
.test-q{font-family:'Cormorant Garamond',serif;font-size:1.02rem;color:rgba(242,232,216,.8);font-style:italic;line-height:1.88;margin-bottom:22px;position:relative}
.test-q::before{content:'\201C';font-size:4rem;color:rgba(196,160,90,.12);line-height:0;vertical-align:-22px;margin-right:2px}
.test-meta{display:flex;align-items:center;gap:12px}
.test-av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--mist),var(--brown));display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--gold);border:1px solid rgba(196,160,90,.25);font-family:'Cormorant Garamond',serif}
.test-name{font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:var(--cream)}
.test-loc{font-size:.52rem;color:rgba(196,160,90,.42);margin-top:2px}

/* ═══════════════════════════════════════════════════════════
   CART DRAWER
═══════════════════════════════════════════════════════════ */
.cart-overlay{position:fixed;inset:0;z-index:3800;background:rgba(8,5,3,.78);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .4s}
.cart-overlay.open{opacity:1;pointer-events:all}
.cart-drawer{position:fixed;top:0;right:0;bottom:0;width:430px;background:linear-gradient(160deg,#1d1008,#110a06);border-left:1px solid rgba(196,160,90,.18);z-index:3900;transform:translateX(100%);transition:transform .46s var(--ease);display:flex;flex-direction:column;box-shadow:-26px 0 80px rgba(0,0,0,.65)}
.cart-drawer.open{transform:translateX(0)}
.cart-head{padding:26px 30px 20px;border-bottom:1px solid rgba(196,160,90,.1);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.cart-title{font-family:'Cormorant Garamond',serif;font-size:1.35rem;color:var(--cream)}
.cart-title em{color:var(--gold);font-style:italic}
.cart-x{width:32px;height:32px;background:transparent;border:1px solid rgba(196,160,90,.2);color:rgba(242,232,216,.48);display:flex;align-items:center;justify-content:center;font-size:.9rem;cursor:none;transition:all .25s}
.cart-x:hover{border-color:var(--gold);color:var(--gold)}
.cart-body{flex:1;overflow-y:auto;padding:20px 30px}
.cart-body::-webkit-scrollbar{width:3px}
.cart-body::-webkit-scrollbar-thumb{background:rgba(196,160,90,.2)}
.cart-empty{text-align:center;padding:60px 20px}
.c-empty-icon{font-size:3.5rem;opacity:.2;margin-bottom:14px}
.c-empty-txt{font-family:'Cormorant Garamond',serif;font-size:.95rem;color:rgba(242,232,216,.28);font-style:italic}
.cart-item{display:flex;gap:12px;align-items:flex-start;padding:16px 0;border-bottom:1px solid rgba(196,160,90,.07);animation:ciSlide .3s var(--ease)}
@keyframes ciSlide{from{opacity:0;transform:translateX(12px)}}
.ci-info{flex:1}
.ci-name{font-family:'Cormorant Garamond',serif;font-size:.95rem;color:var(--cream);margin-bottom:3px}
.ci-unit{font-size:.66rem;color:var(--gold);margin-bottom:10px}
.ci-qty{display:inline-flex;align-items:center;border:1px solid rgba(196,160,90,.22);overflow:hidden}
.q-btn{width:27px;height:27px;background:transparent;border:none;color:var(--gold);font-size:.9rem;cursor:none;transition:background .2s;display:flex;align-items:center;justify-content:center}
.q-btn:hover{background:rgba(196,160,90,.1)}
.q-num{min-width:28px;text-align:center;font-family:'Cormorant Garamond',serif;font-size:.88rem;color:var(--cream);border-left:1px solid rgba(196,160,90,.15);border-right:1px solid rgba(196,160,90,.15);padding:4px 2px;line-height:1}
.ci-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.ci-total{font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--gold)}
.ci-rm{background:transparent;border:none;color:rgba(242,232,216,.18);font-size:.52rem;letter-spacing:.14em;text-transform:uppercase;cursor:none;transition:color .2s;font-family:'DM Sans',sans-serif}
.ci-rm:hover{color:rgba(210,80,60,.8)}

/* Coupon in cart */
.cart-coupon{padding:16px 30px;border-top:1px solid rgba(196,160,90,.1)}
.coup-row{display:flex;gap:8px}
.coup-input{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(196,160,90,.18);padding:10px 14px;color:var(--cream);font-size:.78rem;outline:none;transition:border-color .3s}
.coup-input::placeholder{color:rgba(242,232,216,.2)}
.coup-input:focus{border-color:rgba(196,160,90,.5)}
.coup-apply{padding:10px 18px;background:rgba(196,160,90,.15);border:1px solid rgba(196,160,90,.35);color:var(--gold);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;cursor:none;transition:all .3s}
.coup-apply:hover{background:var(--gold);color:var(--bg)}
.coup-msg{font-size:.6rem;margin-top:7px;height:16px;transition:color .3s}
.coup-ok{color:rgba(80,200,120,.8)}
.coup-err{color:rgba(210,80,60,.8)}

.cart-foot{flex-shrink:0;padding:18px 30px 26px;border-top:1px solid rgba(196,160,90,.1);background:rgba(0,0,0,.2)}
.cart-subtotal-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.cf-label{font-size:.52rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(242,232,216,.36)}
.cf-val{font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--cream)}
.cart-discount-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;color:rgba(80,200,120,.75)}
.cart-total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;padding-top:10px;border-top:1px solid rgba(196,160,90,.12)}
.cart-total-label{font-size:.52rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(242,232,216,.38)}
.cart-total-val{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:var(--gold)}
.btn-checkout{width:100%;padding:14px;background:var(--gold);color:var(--bg);font-family:'DM Sans',sans-serif;font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;font-weight:600;border:none;cursor:none;position:relative;overflow:hidden;transition:background .3s}
.btn-checkout::before{content:'';position:absolute;inset:0;background:var(--gold2);transform:scaleX(0);transform-origin:left;transition:transform .42s var(--ease)}
.btn-checkout:hover::before{transform:scaleX(1)}

/* ═══════════════════════════════════════════════════════════
   CHECKOUT PAGE
═══════════════════════════════════════════════════════════ */
#checkout-page{padding:100px 60px;background:linear-gradient(155deg,#0d0904 0%,#1a1208 50%,#0d0904 100%)}
#checkout-page::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 50% 50% at 50% 0%,rgba(196,160,90,.06),transparent);pointer-events:none}
.checkout-wrap{max-width:1100px;margin:0 auto;position:relative;z-index:1}
.checkout-hd{margin-bottom:50px}
.checkout-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start}
.form-panel,.order-panel{background:rgba(255,255,255,.025);border:1px solid rgba(196,160,90,.14);padding:34px}
.panel-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--cream);margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(196,160,90,.1)}
.panel-title em{color:var(--gold);font-style:italic}
.form-section{font-size:.5rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(196,160,90,.44);margin:22px 0 14px;display:flex;align-items:center;gap:12px}
.form-section::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(196,160,90,.2),transparent)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-group{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}
.form-label{font-size:.48rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(196,160,90,.5)}
.form-input,.form-select{background:rgba(255,255,255,.035);border:1px solid rgba(196,160,90,.18);padding:12px 16px;color:var(--cream);font-family:'DM Sans',sans-serif;font-size:.84rem;font-weight:300;outline:none;transition:border-color .3s,background .3s;border-radius:0;width:100%;-webkit-appearance:none}
.form-input::placeholder{color:rgba(242,232,216,.2)}
.form-input:focus,.form-select:focus{border-color:rgba(196,160,90,.52);background:rgba(255,255,255,.05)}
.form-input.invalid{border-color:rgba(210,75,60,.6)}
.form-select{color:var(--cream);cursor:none}
.form-select option{background:#1a1208;color:var(--cream)}
.ferr{font-size:.48rem;color:rgba(210,85,65,.82);display:none;letter-spacing:.05em}
.form-input.invalid~.ferr{display:block}

/* Payment options */
.pay-opts{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.pay-opt{display:flex;align-items:center;gap:14px;padding:14px 18px;border:1px solid rgba(196,160,90,.18);cursor:none;transition:border-color .3s,background .3s;position:relative}
.pay-opt.active{border-color:var(--gold);background:rgba(196,160,90,.07)}
.pay-opt input[type=radio]{display:none}
.pay-radio{width:16px;height:16px;border-radius:50%;border:1px solid rgba(196,160,90,.4);flex-shrink:0;position:relative;transition:border-color .3s}
.pay-opt.active .pay-radio{border-color:var(--gold)}
.pay-radio::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--gold);transform:scale(0);transition:transform .25s var(--ease)}
.pay-opt.active .pay-radio::after{transform:scale(1)}
.pay-label{font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--cream)}
.pay-disc{margin-left:auto;font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;background:rgba(80,200,120,.15);color:rgba(100,220,140,.9);padding:3px 9px}
.pay-icons{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pay-icon-badge{font-size:.54rem;padding:4px 10px;border:1px solid rgba(242,232,216,.15);color:rgba(242,232,216,.55);letter-spacing:.08em}

/* Order summary panel */
.ord-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid rgba(196,160,90,.07)}
.ord-item:last-of-type{border-bottom:none}
.ord-name{font-family:'Cormorant Garamond',serif;font-size:.92rem;color:rgba(242,232,216,.75)}
.ord-qty{font-size:.6rem;color:rgba(196,160,90,.5);margin-top:2px}
.ord-price{font-family:'Cormorant Garamond',serif;font-size:.92rem;color:var(--gold)}
.ord-divider{border:none;border-top:1px solid rgba(196,160,90,.12);margin:14px 0}
.ord-row{display:flex;justify-content:space-between;margin-bottom:8px}
.ord-label{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,232,216,.38)}
.ord-val{font-family:'Cormorant Garamond',serif;font-size:.9rem;color:var(--cream)}
.ord-discount{color:rgba(80,200,120,.8)}
.ord-total-row{display:flex;justify-content:space-between;border-top:1px solid rgba(196,160,90,.16);padding-top:14px;margin-top:8px}
.ord-total-label{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,232,216,.45)}
.ord-total-val{font-family:'Cormorant Garamond',serif;font-size:1.55rem;color:var(--gold)}

/* Coupon in checkout */
.checkout-coupon{background:rgba(196,160,90,.04);border:1px solid rgba(196,160,90,.14);padding:18px;margin-bottom:16px}
.checkout-coupon .coup-row{display:flex;gap:8px}

.btn-place{width:100%;padding:16px;background:var(--gold);color:var(--bg);font-family:'DM Sans',sans-serif;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;font-weight:700;border:none;cursor:none;position:relative;overflow:hidden;transition:background .3s;margin-top:22px}
.btn-place::before{content:'';position:absolute;inset:0;background:var(--gold2);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.btn-place:hover::before{transform:scaleX(1)}

/* ═══════════════════════════════════════════════════════════
   ORDER SUCCESS
═══════════════════════════════════════════════════════════ */
#success-page{padding:120px 60px;background:linear-gradient(155deg,#091006 0%,#182a18 45%,#0d1a0c 100%);display:flex;align-items:center;justify-content:center;min-height:100vh}
.success-inner{max-width:600px;text-align:center;position:relative;z-index:1}
#success-page::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 55% at 50% 50%,rgba(43,77,60,.28),transparent)}
.suc-check{width:88px;height:88px;border-radius:50%;border:1px solid rgba(196,160,90,.3);display:flex;align-items:center;justify-content:center;margin:0 auto 28px;background:rgba(196,160,90,.06);animation:sucPop .7s var(--ease)}
@keyframes sucPop{from{transform:scale(0) rotate(-40deg);opacity:0}}
.suc-check svg{width:36px;height:36px;stroke:var(--gold);fill:none;stroke-width:2.5}
.suc-h2{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:300;color:var(--cream);margin-bottom:12px;animation:heroFadeUp .8s .15s var(--ease) both}
.suc-h2 em{color:var(--gold);font-style:italic}
.suc-p{font-family:'Cormorant Garamond',serif;font-size:1.02rem;color:rgba(242,232,216,.6);font-style:italic;line-height:1.9;margin-bottom:30px;animation:heroFadeUp .8s .28s var(--ease) both}
.suc-ref{font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(196,160,90,.25);padding:10px 24px;display:inline-block;margin-bottom:32px;animation:heroFadeUp .8s .4s var(--ease) both}
.suc-detail-card{background:rgba(255,255,255,.03);border:1px solid rgba(196,160,90,.14);padding:24px 28px;text-align:left;margin-bottom:28px;animation:heroFadeUp .8s .5s var(--ease) both}
.suc-detail-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid rgba(196,160,90,.07)}
.suc-detail-row:last-child{border-bottom:none}
.suc-dl{font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(242,232,216,.38)}
.suc-dv{font-family:'Cormorant Garamond',serif;font-size:.88rem;color:var(--cream)}
.suc-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;animation:heroFadeUp .8s .6s var(--ease) both}

/* ═══════════════════════════════════════════════════════════
   TRACK ORDER
═══════════════════════════════════════════════════════════ */
#track-page{padding:100px 60px;background:linear-gradient(155deg,#0b0804 0%,#18120a 50%,#0b0804 100%);min-height:100vh}
.track-wrap{max-width:700px;margin:0 auto}
.track-hd{margin-bottom:44px}
.track-input-row{display:flex;gap:12px;margin-bottom:36px}
.track-input{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(196,160,90,.2);padding:14px 20px;color:var(--cream);font-family:'DM Sans',sans-serif;font-size:.9rem;outline:none;transition:border-color .3s}
.track-input::placeholder{color:rgba(242,232,216,.2)}
.track-input:focus{border-color:rgba(196,160,90,.52)}
.track-result{background:rgba(255,255,255,.025);border:1px solid rgba(196,160,90,.14);padding:28px 32px;display:none}
.track-result.show{display:block}
.track-order-info{margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid rgba(196,160,90,.1)}
.track-order-id{font-family:'Cinzel',serif;font-size:1.1rem;color:var(--gold);letter-spacing:.1em;margin-bottom:6px}
.track-order-date{font-size:.62rem;color:rgba(242,232,216,.38);letter-spacing:.1em}
.track-steps{position:relative;padding-left:32px}
.track-steps::before{content:'';position:absolute;left:7px;top:8px;bottom:8px;width:1px;background:rgba(196,160,90,.2)}
.track-step{display:flex;align-items:flex-start;gap:16px;margin-bottom:22px;position:relative}
.step-dot{width:16px;height:16px;border-radius:50%;border:2px solid rgba(196,160,90,.3);background:transparent;flex-shrink:0;position:absolute;left:-25px;top:2px;transition:all .4s;z-index:1}
.step-dot.done{border-color:var(--gold);background:var(--gold)}
.step-dot.current{border-color:var(--gold);background:rgba(196,160,90,.2);box-shadow:0 0 12px rgba(196,160,90,.4)}
.step-content{}
.step-status{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,232,216,.35);margin-bottom:3px}
.step-status.done-status{color:var(--gold)}
.step-status.current-status{color:var(--cream);font-weight:500}
.step-detail{font-family:'Cormorant Garamond',serif;font-size:.9rem;color:rgba(242,232,216,.5);font-style:italic}
.track-not-found{text-align:center;padding:40px 20px;color:rgba(242,232,216,.4);font-family:'Cormorant Garamond',serif;font-size:1rem;font-style:italic}

/* ═══════════════════════════════════════════════════════════
   ADMIN PANEL
═══════════════════════════════════════════════════════════ */
#admin-page{background:linear-gradient(155deg,#080603 0%,#120e08 100%);min-height:100vh;padding:80px 30px 40px}
.admin-wrap{max-width:1400px;margin:0 auto}
.admin-hd{margin-bottom:32px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:32px}
.stat-card{background:rgba(255,255,255,.03);border:1px solid rgba(196,160,90,.14);padding:22px 24px}
.stat-n{font-family:'Cormorant Garamond',serif;font-size:2.2rem;color:var(--gold);line-height:1;margin-bottom:4px}
.stat-l{font-size:.52rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(242,232,216,.4)}
.admin-tabs{display:flex;gap:0;border-bottom:1px solid rgba(196,160,90,.15);margin-bottom:28px}
.admin-tab{padding:11px 22px;background:transparent;border:none;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,232,216,.38);cursor:none;border-bottom:2px solid transparent;transition:all .3s}
.admin-tab.active{color:var(--gold);border-bottom-color:var(--gold)}
.admin-tab-content{display:none}
.admin-tab-content.active{display:block}
.data-table{width:100%;border-collapse:collapse}
.data-table th{font-size:.5rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(196,160,90,.5);padding:10px 14px;border-bottom:1px solid rgba(196,160,90,.12);text-align:left;font-weight:400}
.data-table td{padding:12px 14px;border-bottom:1px solid rgba(242,232,216,.05);font-size:.8rem;color:rgba(242,232,216,.7);vertical-align:middle}
.data-table tr:hover td{background:rgba(196,160,90,.04)}
.status-badge{font-size:.48rem;letter-spacing:.14em;text-transform:uppercase;padding:3px 9px;border-radius:0}
.s-placed{background:rgba(196,160,90,.15);color:var(--gold)}
.s-processing{background:rgba(50,150,255,.12);color:rgba(100,180,255,.9)}
.s-shipped{background:rgba(150,100,255,.12);color:rgba(180,140,255,.9)}
.s-delivery{background:rgba(255,165,0,.12);color:rgba(255,180,60,.9)}
.s-delivered{background:rgba(80,200,120,.12);color:rgba(100,220,140,.9)}
.admin-action-btn{background:transparent;border:1px solid rgba(196,160,90,.25);color:var(--gold);font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;padding:5px 11px;cursor:none;transition:all .3s}
.admin-action-btn:hover{background:var(--gold);color:var(--bg)}
.coupon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.coupon-card{background:rgba(255,255,255,.025);border:1px solid rgba(196,160,90,.14);padding:20px}
.coup-code{font-family:'Cinzel',serif;font-size:1.1rem;color:var(--gold);letter-spacing:.1em;margin-bottom:6px}
.coup-info{font-size:.7rem;color:rgba(242,232,216,.5);line-height:1.7}
.coup-uses{font-size:.52rem;color:rgba(196,160,90,.42);margin-top:8px;letter-spacing:.12em;text-transform:uppercase}

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE
═══════════════════════════════════════════════════════════ */
#contact-page{padding:100px 60px;background:linear-gradient(155deg,#0c0804 0%,#18120a 50%,#0c0804 100%);min-height:100vh}
.contact-wrap{max-width:1000px;margin:0 auto}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:50px}
.contact-form-panel{background:rgba(255,255,255,.025);border:1px solid rgba(196,160,90,.14);padding:34px}
.contact-info{display:flex;flex-direction:column;gap:24px}
.ci-item{display:flex;gap:16px;align-items:flex-start}
.ci-icon{width:42px;height:42px;border:1px solid rgba(196,160,90,.2);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
.ci-detail h4{font-family:'Cormorant Garamond',serif;font-size:1.05rem;color:var(--gold);margin-bottom:4px}
.ci-detail p{font-size:.8rem;color:rgba(242,232,216,.5);line-height:1.7}

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
footer{background:#060402;border-top:1px solid rgba(196,160,90,.08);padding:68px 60px 32px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:52px;margin-bottom:56px;padding-bottom:56px;border-bottom:1px solid rgba(196,160,90,.07)}
.footer-brand h2{font-family:'Cinzel',serif;font-size:1.35rem;color:var(--gold);letter-spacing:.12em;margin-bottom:5px}
.footer-brand small{font-size:.44rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(196,160,90,.32);display:block;margin-bottom:16px}
.footer-brand p{font-size:.84rem;color:rgba(242,232,216,.36);line-height:1.86;font-family:'Cormorant Garamond',serif;font-style:italic}
.footer-col h4{font-size:.5rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(196,160,90,.4);margin-bottom:20px;font-weight:400}
.footer-col a,.footer-col span{display:block;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,232,216,.26);margin-bottom:11px;transition:color .3s;font-weight:300}
.footer-col a:hover{color:var(--gold)}
.footer-social-row{display:flex;flex-direction:column;gap:7px}
.f-social{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(242,232,216,.26);padding:7px 13px;border:1px solid rgba(196,160,90,.1);width:fit-content;transition:all .3s}
.f-social:hover{color:var(--gold);border-color:rgba(196,160,90,.35);background:rgba(196,160,90,.05)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-copy{font-size:.5rem;letter-spacing:.1em;color:rgba(242,232,216,.16)}
.footer-tag{font-family:'Cormorant Garamond',serif;font-size:.88rem;font-style:italic;color:rgba(196,160,90,.36)}

/* ═══════════════════════════════════════════════════════════
   TOAST
═══════════════════════════════════════════════════════════ */
.toast{position:fixed;bottom:32px;right:32px;z-index:9999;padding:14px 22px;background:rgba(26,18,9,.96);border:1px solid rgba(196,160,90,.3);color:var(--cream);font-size:.72rem;letter-spacing:.06em;max-width:320px;transform:translateY(20px);opacity:0;transition:all .4s var(--ease);pointer-events:none}
.toast.show{opacity:1;transform:translateY(0)}
.toast-gold{border-color:var(--gold);color:var(--gold)}
.toast-green{border-color:rgba(80,200,120,.5);color:rgba(100,220,140,.9)}
.toast-red{border-color:rgba(210,80,60,.4);color:rgba(220,100,80,.9)}

/* ═══════════════════════════════════════════════════════════
   MODAL
═══════════════════════════════════════════════════════════ */
.modal-overlay{position:fixed;inset:0;z-index:6000;background:rgba(8,5,3,.85);backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:opacity .4s;display:flex;align-items:center;justify-content:center}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal-box{background:linear-gradient(155deg,#1e1208,#140e07);border:1px solid rgba(196,160,90,.2);padding:40px 44px;max-width:480px;width:90%;transform:scale(.94);transition:transform .4s var(--ease)}
.modal-overlay.open .modal-box{transform:scale(1)}
.modal-title{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:var(--cream);margin-bottom:10px}
.modal-title em{color:var(--gold);font-style:italic}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════ */
@media(max-width:1100px){
  .about-grid{grid-template-columns:1fr;gap:50px}
  .about-visual{height:280px}
  .why-grid{grid-template-columns:repeat(3,1fr)}
  .why-card:nth-child(4),.why-card:nth-child(5){border-top:1px solid var(--line)}
  .prod-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr;gap:38px}
  .checkout-grid{grid-template-columns:1fr}
  .admin-stats{grid-template-columns:repeat(2,1fr)}
  .coupon-grid{grid-template-columns:1fr 1fr}
}

/* ── HAMBURGER BUTTON ── */
.nav-hamburger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:38px;height:38px;background:transparent;
  border:1px solid rgba(196,160,90,.22);padding:8px;cursor:none;
  transition:border-color .3s;flex-shrink:0
}
.nav-hamburger:hover{border-color:var(--gold)}
.ham-bar{width:100%;height:1px;background:var(--cream);transition:transform .35s var(--ease),opacity .25s,background .3s}
.nav-hamburger:hover .ham-bar{background:var(--gold)}
.nav-hamburger.open .ham-bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-hamburger.open .ham-bar:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-hamburger.open .ham-bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ── MOBILE DRAWER ── */
.mobile-nav-overlay{
  position:fixed;inset:0;z-index:750;
  background:rgba(8,5,3,.72);backdrop-filter:blur(8px);
  opacity:0;pointer-events:none;transition:opacity .4s
}
.mobile-nav-overlay.open{opacity:1;pointer-events:all}
.mobile-nav-drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(300px,85vw);
  background:linear-gradient(160deg,#1d1208,#0e0904);
  border-left:1px solid rgba(196,160,90,.18);
  z-index:760;transform:translateX(100%);
  transition:transform .42s var(--ease);
  display:flex;flex-direction:column;
  padding:0;overflow:hidden
}
.mobile-nav-drawer.open{transform:translateX(0)}
.mob-nav-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;border-bottom:1px solid rgba(196,160,90,.1)
}
.mob-nav-brand{font-family:'Cinzel',serif;font-size:.82rem;letter-spacing:.14em;color:var(--gold)}
.mob-nav-close{
  width:30px;height:30px;background:transparent;
  border:1px solid rgba(196,160,90,.2);color:rgba(242,232,216,.5);
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;cursor:none;transition:all .25s
}
.mob-nav-close:hover{border-color:var(--gold);color:var(--gold)}
.mob-nav-links{
  flex:1;display:flex;flex-direction:column;
  padding:28px 24px;gap:4px;overflow-y:auto
}
.mob-nav-link{
  display:block;font-size:.64rem;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(242,232,216,.5);
  padding:13px 0;border-bottom:1px solid rgba(196,160,90,.07);
  transition:color .3s,padding-left .3s;cursor:none;background:none;border-left:none;border-right:none;border-top:none;text-align:left;width:100%;font-family:'DM Sans',sans-serif
}
.mob-nav-link:hover,.mob-nav-link.active-link{color:var(--gold);padding-left:8px}
.mob-nav-foot{
  padding:20px 24px;border-top:1px solid rgba(196,160,90,.1)
}
.mob-nav-cart{
  width:100%;display:flex;align-items:center;justify-content:center;gap:10px;
  padding:13px;background:rgba(196,160,90,.1);border:1px solid rgba(196,160,90,.3);
  color:var(--gold);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  cursor:none;transition:all .3s
}
.mob-nav-cart:hover{background:var(--gold);color:var(--bg)}
.mob-nav-cart svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}

@media(max-width:768px){
  /* cursor fallback on touch */
  body{cursor:auto}
  button,input,select,textarea,a{cursor:auto}
  #cur,#cur-r{display:none}

  #nav{padding:13px 20px}
  #nav.scrolled{padding:10px 20px}
  .nav-links{display:none}
  .nav-hamburger{display:flex}

  #hero,#shop,#about-section,#why,#testimonials,#about-page,#checkout-page,#track-page,#contact-page,footer{padding-left:20px;padding-right:20px}
  .hero-inner{padding:0 20px;padding-top:88px}
  .hero-cup-scene{display:none}
  .hero-scroll{left:20px;bottom:20px}
  .hero-h1{font-size:clamp(2.6rem,11vw,4rem)}

  .prod-grid{grid-template-columns:1fr;padding:0}
  .prod-card{margin:0}

  .why-grid{grid-template-columns:1fr;border:none}
  .why-card{border:1px solid var(--line);border-top:none;border-right:none;border-left:none;padding:32px 18px 28px}

  .test-grid{grid-template-columns:1fr}

  .cart-drawer{width:100%;max-width:100%}

  .form-row{grid-template-columns:1fr}

  .footer-grid{grid-template-columns:1fr;gap:28px}
  footer{padding-bottom:48px}

  .admin-stats{grid-template-columns:1fr 1fr}
  .admin-wrap{padding:80px 20px 40px}
  .data-table{font-size:.62rem}
  .data-table th,.data-table td{padding:10px 8px}

  .contact-grid{grid-template-columns:1fr}
  .coupon-grid{grid-template-columns:1fr}

  .toast{bottom:20px;right:16px;left:16px;max-width:none}

  .pay-icons{flex-wrap:wrap;gap:4px}

  .checkout-grid{gap:28px}
  #checkout-page{padding:80px 20px 40px}

  .track-input-row{flex-direction:column}
  .track-input-row .btn{width:100%;justify-content:center}

  .suc-detail-row{flex-direction:column;gap:3px}
}

/* Touch device cursor fix — override cursor:none on all interactive elements */
@media (hover: none) and (pointer: coarse) {
  body,button,input,select,textarea,a,.nav-cart,.btn,.btn-add,.btn-place,.btn-checkout,.coup-apply,.q-btn,.ci-rm,.cart-x,.mob-nav-close,.mob-nav-cart,.admin-tab,.form-select,.pay-opt{cursor:auto !important}
  #cur,#cur-r{display:none !important}
}





/* ══ HERO SECTION LIGHT MODE ══ */
:root.light #hero {
    background: linear-gradient(155deg, #f5f0e8, #e8dfc8) !important;
}

:root.light .hero-bg {
    background: linear-gradient(155deg, #f5f0e8, #e8dfc8) !important;
    opacity: 0.3 !important;
}

:root.light .hero-mtns path,
:root.light .hero-mtns rect {
    opacity: 0.15 !important;
}

:root.light .hero-h1 {
    color: #2c1f0a !important;
}

    :root.light .hero-h1 em {
        color: #8b6914 !important;
    }

:root.light .hero-mist {
    opacity: 0.05 !important;
}

/* ══ TRACK ORDER PAGE LIGHT MODE ══ */
:root.light #track-page,
:root.light .track-wrap,
:root.light .track-hero {
    background: transparent !important;
    color: #2c1f0a !important;
}

:root.light .track-input-wrap input,
:root.light .track-input {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #2c1f0a !important;
}

    :root.light .track-input::placeholder {
        color: rgba(44,31,10,.3) !important;
    }

:root.light .track-result,
:root.light .track-card,
:root.light .track-box {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .track-ref {
    color: #8b6914 !important;
}

:root.light .track-meta,
:root.light .track-info,
:root.light .track-detail {
    color: rgba(44,31,10,.6) !important;
}

/* Timeline steps */
:root.light .step-label,
:root.light .track-step-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .step-desc,
:root.light .track-step-desc {
    color: rgba(44,31,10,.6) !important;
}

:root.light .step-date,
:root.light .track-step-date {
    color: rgba(44,31,10,.4) !important;
}

:root.light .step-line,
:root.light .track-line {
    background: rgba(139,105,20,.2) !important;
}

:root.light .step-dot.done,
:root.light .track-dot.done {
    background: #8b6914 !important;
    border-color: #8b6914 !important;
}

:root.light .step-dot.active,
:root.light .track-dot.active {
    border-color: #8b6914 !important;
}

/* ══ MY ORDERS PAGE LIGHT MODE ══ */
:root.light #myorders-page,
:root.light .myorders-wrap,
:root.light .orders-wrap {
    background: transparent !important;
    color: #2c1f0a !important;
}

:root.light .order-card,
:root.light .order-row,
:root.light .my-order-card {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .order-ref,
:root.light .my-order-ref {
    color: #8b6914 !important;
}

:root.light .order-date,
:root.light .order-meta,
:root.light .my-order-meta {
    color: rgba(44,31,10,.5) !important;
}

:root.light .order-items,
:root.light .my-order-items {
    color: rgba(44,31,10,.65) !important;
}

:root.light .order-total,
:root.light .my-order-total {
    color: #8b6914 !important;
}

:root.light .status-badge.s-placed {
    background: rgba(139,105,20,.1) !important;
    border-color: rgba(139,105,20,.3) !important;
    color: #8b6914 !important;
}

:root.light .status-badge.s-delivered {
    background: rgba(45,122,74,.1) !important;
    border-color: rgba(45,122,74,.3) !important;
    color: #2d7a4a !important;
}

:root.light .status-badge.s-shipped,
:root.light .status-badge.s-processing {
    background: rgba(139,105,20,.08) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #8b6914 !important;
}

/* ══ CONTACT PAGE LIGHT MODE ══ */
:root.light #contact-page,
:root.light .contact-wrap {
    background: transparent !important;
}

:root.light .contact-card,
:root.light .contact-box {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .contact-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light textarea.form-input {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #2c1f0a !important;
}

    :root.light textarea.form-input::placeholder {
        color: rgba(44,31,10,.3) !important;
    }

/* ══ PAGE HEADINGS (all pages) ══ */
:root.light .display,
:root.light .display em {
    color: #2c1f0a !important;
}

    :root.light .display em {
        color: #8b6914 !important;
    }

:root.light .eyebrow {
    color: rgba(44,31,10,.45) !important;
}

:root.light .gold-bar {
    background: linear-gradient(90deg, #8b6914, transparent) !important;
}

/* ══ ABOUT SECTION ══ */
:root.light .about-grid p,
:root.light .about-quote p {
    color: rgba(44,31,10,.68) !important;
}

:root.light .about-quote {
    border-color: rgba(139,105,20,.2) !important;
    background: rgba(139,105,20,.04) !important;
}

:root.light .orb-a,
:root.light .orb-b {
    opacity: 0.1 !important;
}



/* ══ ADMIN LIGHT MODE ══ */
:root.light .admin-topbar {
    background: rgba(250,247,242,.96) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .admin-brand {
    color: #8b6914 !important;
}

:root.light .admin-logout {
    color: rgba(44,31,10,.6) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light #admin-page {
    background: linear-gradient(155deg, #faf7f2, #f0ebe0) !important;
}

:root.light .stat-card {
    background: rgba(255,255,255,.65) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .stat-n {
    color: #8b6914 !important;
}

:root.light .stat-l {
    color: rgba(44,31,10,.5) !important;
}

:root.light .admin-tabs {
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .admin-tab {
    color: rgba(44,31,10,.4) !important;
}

    :root.light .admin-tab.active {
        color: #8b6914 !important;
        border-bottom-color: #8b6914 !important;
    }

:root.light .data-table th {
    color: rgba(44,31,10,.5) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .data-table td {
    color: #2c1f0a !important;
    border-color: rgba(139,105,20,.08) !important;
}

:root.light .data-table tr:hover td {
    background: rgba(139,105,20,.04) !important;
}

:root.light .admin-search {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #2c1f0a !important;
}

:root.light .manage-btn, :root.light .admin-action-btn {
    background: rgba(139,105,20,.08) !important;
    border-color: rgba(139,105,20,.25) !important;
    color: #8b6914 !important;
}

:root.light .coupon-card {
    background: rgba(255,255,255,.65) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .coup-code {
    color: #8b6914 !important;
}

:root.light .coup-info {
    color: rgba(44,31,10,.6) !important;
}

:root.light .coup-uses {
    color: rgba(44,31,10,.4) !important;
}

:root.light .om-box, :root.light .modal-box, :root.light .ac-box {
    background: #f5f0e8 !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .om-title, :root.light .modal-title, :root.light .ac-title {
    color: #8b6914 !important;
}

:root.light .om-info-item {
    background: rgba(139,105,20,.05) !important;
    border-color: rgba(139,105,20,.1) !important;
}

:root.light .om-info-label {
    color: rgba(44,31,10,.45) !important;
}

:root.light .om-info-val {
    color: #2c1f0a !important;
}

:root.light .om-step {
    background: rgba(255,255,255,.4) !important;
    border-color: rgba(139,105,20,.12) !important;
}

    :root.light .om-step.active {
        background: rgba(139,105,20,.1) !important;
    }

:root.light .om-step-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .om-step.active .om-step-label {
    color: #8b6914 !important;
}

:root.light .om-status-btn {
    background: rgba(255,255,255,.4) !important;
    border-color: rgba(139,105,20,.2) !important;
    color: rgba(44,31,10,.6) !important;
}

:root.light .om-tracking-section {
    background: rgba(139,105,20,.04) !important;
    border-color: rgba(139,105,20,.12) !important;
}

:root.light .om-field input {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.2) !important;
    color: #2c1f0a !important;
}

:root.light .ac-input {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(139,105,20,.2) !important;
    color: #2c1f0a !important;
}

:root.light .ac-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .ac-type-btn {
    background: rgba(255,255,255,.4) !important;
    border-color: rgba(139,105,20,.2) !important;
}

    :root.light .ac-type-btn.selected {
        background: rgba(139,105,20,.1) !important;
        border-color: #8b6914 !important;
    }

:root.light .ac-type-label {
    color: rgba(44,31,10,.5) !important;
}

:root.light .ac-type-btn.selected .ac-type-label {
    color: #8b6914 !important;
}

:root.light .om-cancel-btn {
    border-color: rgba(139,105,20,.25) !important;
    color: rgba(44,31,10,.6) !important;
}

/* ══ MY ORDERS LIGHT MODE ══ */
:root.light .page {
    background: transparent !important;
}

:root.light .page-title {
    color: #2c1f0a !important;
}

    :root.light .page-title em {
        color: #8b6914 !important;
    }

:root.light .page-sub {
    color: rgba(44,31,10,.55) !important;
}

:root.light .summary-strip {
    background: rgba(255,255,255,.5) !important;
    border-color: rgba(139,105,20,.15) !important;
}

:root.light .chip-val {
    color: #8b6914 !important;
}

:root.light .chip-lbl {
    color: rgba(44,31,10,.5) !important;
}

:root.light .order-card {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .oc-ref {
    color: #8b6914 !important;
}

:root.light .oc-date {
    color: rgba(44,31,10,.5) !important;
}

:root.light .oc-total {
    color: #8b6914 !important;
}

:root.light .oc-chevron {
    color: rgba(44,31,10,.4) !important;
}

:root.light .oc-progress-title,
:root.light .oc-items-title {
    color: rgba(44,31,10,.45) !important;
}

:root.light .progress-step {
    color: rgba(44,31,10,.4) !important;
}

    :root.light .progress-step.done {
        color: rgba(44,31,10,.7) !important;
    }

    :root.light .progress-step.current {
        color: #8b6914 !important;
    }

:root.light .oc-item {
    border-color: rgba(139,105,20,.1) !important;
}

:root.light .oc-item-name {
    color: #2c1f0a !important;
}

:root.light .oc-item-qty {
    color: rgba(44,31,10,.5) !important;
}

:root.light .oc-item-price {
    color: #8b6914 !important;
}

:root.light .oc-detail-box {
    background: rgba(139,105,20,.05) !important;
    border-color: rgba(139,105,20,.12) !important;
}

:root.light .oc-detail-label {
    color: rgba(44,31,10,.45) !important;
}

:root.light .oc-detail-val {
    color: #2c1f0a !important;
}

:root.light .oc-total-row {
    color: rgba(44,31,10,.6) !important;
    border-color: rgba(139,105,20,.1) !important;
}

:root.light .ov {
    color: #8b6914 !important;
}

:root.light .oc-discount {
    color: #2d7a4a !important;
}

/* ══ MY ORDERS LOGIN LIGHT MODE ══ */
:root.light .login-card {
    background: rgba(255,255,255,.7) !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .lc-eyebrow {
    color: rgba(44,31,10,.45) !important;
}

:root.light .lc-title {
    color: #2c1f0a !important;
}

    :root.light .lc-title em {
        color: #8b6914 !important;
    }

:root.light .lc-sub {
    color: rgba(44,31,10,.6) !important;
}

:root.light .field-label {
    color: rgba(44,31,10,.55) !important;
}

:root.light .field-input {
    background: rgba(255,255,255,.85) !important;
    border-color: rgba(139,105,20,.3) !important;
    color: #2c1f0a !important;
}

:root.light .field-hint {
    color: rgba(44,31,10,.45) !important;
}

:root.light .lc-track-link {
    color: #8b6914 !important;
    border-color: rgba(139,105,20,.2) !important;
}

:root.light .lc-feat-text {
    color: rgba(44,31,10,.6) !important;
}

    :root.light .lc-feat-text strong {
        color: #2c1f0a !important;
    }

:root.light .lc-divider {
    color: rgba(44,31,10,.35) !important;
}



/* ── Customer nav widget ──────────────────────────── */
.im-nav-user {
    position: relative;
    display: flex;
    align-items: center;
}

/* Sign-in trigger button */
.im-nav-signin {
    display: flex;
    align-items: center;
    gap: 7px;
    background: transparent;
    border: 1px solid rgba(200,169,110,0.28);
    color: #c8a96e;
    font-size: 0.68rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 7px 16px;
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, color .2s, border-color .2s;
    font-family: inherit;
    white-space: nowrap;
}

    .im-nav-signin:hover {
        background: rgba(200,169,110,0.10);
        border-color: #c8a96e;
        color: #e8d090;
    }

    .im-nav-signin svg {
        flex-shrink: 0;
    }

/* Logged-in pill */
.im-nav-user-pill {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 5px 14px 5px 8px;
    border: 1px solid rgba(200,169,110,0.18);
    border-radius: 2px;
    background: transparent;
    color: #c8a96e;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: border-color .2s, background .2s;
    position: relative;
    font-family: inherit;
}

    .im-nav-user-pill:hover {
        border-color: rgba(200,169,110,0.4);
        background: rgba(200,169,110,0.05);
    }

.im-nav-avatar {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4a9b8e, #c8a96e);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    color: #0d0d0d;
    font-weight: 700;
    flex-shrink: 0;
    font-family: inherit;
}

/* Dropdown */
.im-nav-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 190px;
    background: #111;
    border: 1px solid rgba(200,169,110,0.2);
    border-radius: 3px;
    padding: 6px 0;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .18s, transform .18s, visibility .18s;
    box-shadow: 0 12px 40px rgba(0,0,0,0.5);
}

    .im-nav-dropdown::before {
        content: '';
        position: absolute;
        top: -6px;
        right: 20px;
        width: 10px;
        height: 10px;
        background: #111;
        border-left: 1px solid rgba(200,169,110,0.2);
        border-top: 1px solid rgba(200,169,110,0.2);
        transform: rotate(45deg);
    }

    .im-nav-user-pill:hover .im-nav-dropdown,
    .im-nav-dropdown:hover {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .im-nav-dropdown a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 18px;
        font-size: 0.72rem;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: #9e9080;
        text-decoration: none;
        transition: color .15s, background .15s;
    }

        .im-nav-dropdown a:hover {
            color: #c8a96e;
            background: rgba(200,169,110,0.05);
        }

        .im-nav-dropdown a svg {
            opacity: 0.6;
            flex-shrink: 0;
        }

.im-nav-dd-divider {
    border: none;
    border-top: 1px solid rgba(200,169,110,0.1);
    margin: 5px 0;
}

.im-nav-dd-signout {
    color: #7a6060 !important;
}

    .im-nav-dd-signout:hover {
        color: #c07070 !important;
        background: rgba(180,80,80,0.05) !important;
    }
