:root{
  --bg:#F8F4E9;
  --bg-soft:#EFE6CE;
  --card:#FFFEFB;
  --ink:#1C1912;
  --ink-soft:#6B6250;
  --heading:#0F5132;
  --primary:#0F5132;
  --primary-dark:#0A3A24;
  --accent-leaf:#4C7A3D;
  --clay:#9C6B2E;
  --clay-dark:#7A5220;
  --gold:#C9A227;
  --gold-light:#F0D98C;
  --gold-glow:rgba(201,162,39,0.45);
  --line:#E3D6AC;
  --white:#FFFEFB;
  --danger:#A83A2B;
  --radius:14px;
  --shadow:0 10px 34px rgba(20,16,8,0.10);
  --header-bg:rgba(248,244,233,0.88);
  --grain-dot:rgba(28,25,18,0.035);
}
body.dark{
  --bg:#0A0B09;
  --bg-soft:#141511;
  --card:#15150F;
  --ink:#F1ECDA;
  --ink-soft:#B6AC8E;
  --heading:#F2E4B8;
  --primary:#1D6B4B;
  --primary-dark:#081A12;
  --accent-leaf:#6FA85B;
  --clay:#D9A15C;
  --clay-dark:#E8B978;
  --gold:#D9B23C;
  --gold-light:#F5E3A3;
  --gold-glow:rgba(217,178,60,0.55);
  --line:#2C2A20;
  --white:#181812;
  --danger:#E17A5F;
  --shadow:0 10px 40px rgba(0,0,0,0.5);
  --header-bg:rgba(10,11,9,0.85);
  --grain-dot:rgba(217,178,60,0.04);
}
*{box-sizing:border-box;}
*{outline:none;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  background-image:
    radial-gradient(circle at 1px 1px, var(--grain-dot) 1px, transparent 0);
  background-size:22px 22px;
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-bottom:0;
  transition:background .3s ease, color .3s ease;
}
@keyframes glowPulse{0%,100%{opacity:.55;transform:scale(1);}50%{opacity:1;transform:scale(1.06);}}
@keyframes shimmerSweep{0%{transform:translateX(-160%) rotate(8deg);}100%{transform:translateX(220%) rotate(8deg);}}
.glow-blob{
  position:absolute;border-radius:50%;filter:blur(50px);pointer-events:none;z-index:0;
  animation:glowPulse 7s ease-in-out infinite;
}
h1,h2,h3,.display{font-family:'Fraunces', serif;}
a{color:inherit;}
button{font-family:inherit;cursor:pointer;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px;}
.eyebrow{
  text-transform:uppercase;letter-spacing:.18em;font-size:11.5px;
  font-weight:700;color:var(--gold);
}

/* ---------- HEADER ---------- */
header{
  position:sticky;top:0;z-index:40;
  background:var(--header-bg);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 var(--gold-glow);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;max-width:1180px;margin:0 auto;position:relative;
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;background:none;border:none;}
.brand-mark{width:var(--logo-w,36px);height:var(--logo-h,36px);flex:none;}
img.brand-mark{width:var(--logo-w,auto);height:var(--logo-h,48px);max-width:220px;object-fit:contain;}
@media(max-width:820px){ img.brand-mark{height:var(--logo-h,40px);max-width:170px;} }
.brand-name{font-family:'Fraunces',serif;font-weight:600;font-size:20px;letter-spacing:.02em;color:var(--ink);}
.brand-tag{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-top:-2px;font-weight:600;}
/* logo truly centered in the header on mobile — 3-column grid so the middle
   column is a real equal-width track, not affected by unequal icon counts
   on the left (hamburger) vs right (menu + cart) */
@media(max-width:820px){
  .header-inner{
    display:grid !important;grid-template-columns:1fr auto 1fr;
    grid-template-areas:"burger brand actions";align-items:center;
  }
  .hamburger-btn{grid-area:burger;justify-self:start;}
  .brand{grid-area:brand;justify-self:center;position:static;left:auto;top:auto;transform:none;margin:0;}
  .header-actions{grid-area:actions;justify-self:end;}
}
/* logo pinned to the left on desktop/web view */
@media(min-width:821px){
  .brand{ position:static;left:auto;top:auto;transform:none; }
}
nav.main-nav{display:flex;gap:28px;align-items:center;}
nav.main-nav button.navlink{
  background:none;border:none;font-size:14.5px;font-weight:600;color:var(--ink-soft);
  padding:6px 2px;border-bottom:2px solid transparent;
}
nav.main-nav button.navlink.active,nav.main-nav button.navlink:hover{color:var(--heading);border-color:var(--gold);}
.header-actions{display:flex;align-items:center;gap:14px;}
.icon-btn{
  position:relative;background:var(--card);border:1px solid var(--line);
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
.icon-btn svg{width:19px;height:19px;stroke:var(--heading);}
.cart-badge{
  position:absolute;top:-4px;right:-4px;background:var(--clay);color:#fff;
  font-size:10.5px;font-weight:700;border-radius:50%;min-width:18px;height:18px;
  display:flex;align-items:center;justify-content:center;padding:0 3px;border:2px solid var(--bg);
}
@media(max-width:820px){ nav.main-nav{display:none;} }
.hamburger-btn{display:none;margin-right:6px;}
@media(max-width:820px){ .hamburger-btn{display:flex;} }

/* header "more" menu — collapses theme/wishlist/account into one dropdown on small screens */
.header-actions{display:flex !important;align-items:center;gap:14px;}
.header-extra{display:flex !important;flex-direction:row !important;align-items:center;gap:14px;}
.icon-label{display:none;}
.more-btn{display:none;}
@media(max-width:480px){
  .more-btn{display:flex;}
  .header-extra{
    display:none !important;position:absolute;top:56px;right:14px;flex-direction:column !important;gap:2px;
    background:var(--white);border:1px solid var(--line);border-radius:14px;
    box-shadow:0 14px 34px rgba(20,16,8,0.18);padding:8px;min-width:180px;z-index:60;
  }
  .header-extra.open{display:flex !important;}
  .header-extra .icon-btn{
    position:relative;width:100%;height:auto;border-radius:10px;border:none;background:none;
    justify-content:flex-start;gap:10px;padding:10px 10px;
  }
  .header-extra .icon-btn:hover{background:var(--bg-soft);}
  .header-extra .icon-label{display:inline;font-size:13.5px;font-weight:600;color:var(--ink);}
  .header-extra .cart-badge{position:static;margin-left:auto;border:none;}
  .header-extra .account-menu-wrap{width:100%;}
  .header-extra .account-menu{position:static;box-shadow:none;border:none;padding:0;margin-top:2px;min-width:0;}
  .header-extra .account-menu.open{border-top:1px solid var(--line);padding-top:6px;margin-top:6px;}
}

/* account dropdown */
.account-menu-wrap{position:relative;}
.account-menu{
  position:absolute;top:52px;right:0;background:var(--white);border:1px solid var(--line);border-radius:14px;
  min-width:200px;box-shadow:0 14px 34px rgba(20,16,8,0.18);padding:8px;display:none;z-index:50;
}
.account-menu.open{display:block;}
.account-menu a,.account-menu button{
  display:block;width:100%;text-align:left;background:none;border:none;padding:10px 12px;border-radius:8px;
  font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;
}
.account-menu a:hover,.account-menu button:hover{background:var(--bg-soft);}
.account-menu .menu-greeting{padding:6px 12px 10px;font-size:12px;color:var(--ink-soft);border-bottom:1px solid var(--line);margin-bottom:6px;}

/* mobile slide-in menu */
.mobile-menu-overlay{
  position:fixed;inset:0;background:rgba(43,35,24,.45);z-index:90;
  display:none;
}
.mobile-menu-overlay.open{display:block;}
.mobile-menu{
  position:fixed;top:0;left:0;height:100%;width:290px;max-width:84vw;background:var(--white);
  box-shadow:10px 0 30px rgba(0,0,0,.15);display:flex;flex-direction:column;padding:10px;
}
.mobile-menu-head{display:flex;justify-content:space-between;align-items:center;padding:12px 10px 16px;font-weight:700;color:var(--heading);}
.mobile-menu-link{
  display:block;width:100%;text-align:left;background:none;border:none;padding:13px 10px;
  font-size:15px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line);
}
.mobile-menu-sep{height:10px;}

/* wishlist heart on product cards */
.wish-heart{
  position:absolute;top:8px;right:8px;width:34px;height:34px;border-radius:50%;background:rgba(255,254,251,.9);
  border:none;display:flex;align-items:center;justify-content:center;z-index:2;
}
.wish-heart svg{width:17px;height:17px;stroke:var(--danger);fill:none;stroke-width:2;}
.wish-heart.active svg{fill:var(--danger);}

/* auth tabs */
.auth-tabs{display:flex;gap:10px;margin-bottom:22px;border-bottom:1px solid var(--line);}
.auth-tab{background:none;border:none;padding:10px 4px;margin-right:20px;font-weight:700;font-size:15px;color:var(--ink-soft);border-bottom:2px solid transparent;}
.auth-tab.active{color:var(--heading);border-color:var(--gold);}
.checkbox-label{display:flex !important;align-items:center;gap:8px;text-transform:none !important;font-size:13.5px !important;font-weight:500 !important;color:var(--ink) !important;}
.checkbox-label input{width:auto !important;}
.guest-note{
  background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:12px 14px;
  font-size:13px;color:var(--ink-soft);margin-bottom:16px;line-height:1.5;
}
.link-btn{background:none;border:none;padding:0;font:inherit;font-weight:700;color:var(--accent-leaf);text-decoration:underline;cursor:pointer;}
.trust-badges{
  display:flex;flex-wrap:wrap;gap:10px 16px;justify-content:center;
  margin-top:14px;padding-top:14px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink-soft);
}
.trust-badges span{display:inline-flex;align-items:center;gap:5px;}

/* account dashboard */
.dash-layout{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:start;}
.dash-sidebar{
  background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px;
  display:flex;flex-direction:column;gap:2px;position:sticky;top:90px;
}
.dash-content{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;min-height:300px;}
@media(max-width:820px){
  .dash-layout{grid-template-columns:1fr;}
  .dash-sidebar{position:static;flex-direction:row;overflow-x:auto;}
}
.addr-card,.order-card{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;}
.addr-card .row1,.order-card .row1{display:flex;justify-content:space-between;align-items:center;gap:10px;}
.addr-card .default-tag{font-size:10.5px;font-weight:700;color:var(--accent-leaf);text-transform:uppercase;letter-spacing:.05em;}
.wishlist-grid-empty,.dash-empty{padding:30px;text-align:center;color:var(--ink-soft);}

/* ---------- BUTTONS ---------- */
.btn{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 26px;border-radius:999px;border:none;font-weight:600;font-size:14.5px;
  letter-spacing:.02em;text-decoration:none;
  transition:transform .15s ease, box-shadow .25s ease, filter .2s ease;
}
.btn::after{
  content:"";position:absolute;top:-50%;left:-20%;width:40%;height:200%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
  transform:translateX(-160%) rotate(8deg);pointer-events:none;
}
.btn:hover::after{animation:shimmerSweep .9s ease forwards;}
.btn:active{transform:scale(.97);}
.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-dark));color:var(--gold-light);box-shadow:0 6px 20px rgba(0,0,0,0.18), 0 0 0 1px var(--gold-glow) inset;}
.btn-primary:hover{box-shadow:0 8px 26px rgba(0,0,0,0.24), 0 0 22px var(--gold-glow), 0 0 0 1px var(--gold-glow) inset;}
.btn-gold{background:linear-gradient(135deg, var(--gold-light), var(--gold));color:#1C1912;box-shadow:0 6px 20px var(--gold-glow);}
.btn-gold:hover{filter:brightness(1.06);box-shadow:0 8px 26px var(--gold-glow);}
.btn-outline{background:transparent;border:1.5px solid var(--gold);color:var(--ink);}
.btn-outline:hover{background:var(--gold);color:#1C1912;box-shadow:0 0 18px var(--gold-glow);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-ghost{background:transparent;border:none;color:var(--ink-soft);font-weight:600;}
.btn-ghost::after{display:none;}
.btn-sm{padding:8px 14px;font-size:13px;border-radius:999px;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.45;cursor:not-allowed;}

/* ---------- HERO ---------- */
.hero{position:relative;overflow:hidden;padding:70px 0 44px;}

/* ---------- HERO SHOWCASE (mirrors the reference: split headline top-left/bottom-right
   around a centered floating product photo, thumbnail dock top-right, badge bottom-left) ---------- */
.hero-showcase{
  position:relative;overflow:hidden;background:radial-gradient(1200px 700px at 50% 30%,#12160f,#060705 75%);
  border-radius:26px;margin:16px auto 6px;max-width:1180px;color:#F4F6EF;
}
.hero-showcase::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(520px 420px at 10% 8%, rgba(143,212,107,.18), transparent 65%),
    radial-gradient(520px 420px at 92% 92%, var(--gold-glow), transparent 60%);
}
.showcase-stage{position:relative;z-index:1;min-height:640px;padding:0;}
.showcase-top-left{position:absolute;top:60px;left:48px;max-width:340px;z-index:3;}
.showcase-eyebrow{
  display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent-leaf);background:rgba(143,212,107,.1);
  border:1px solid rgba(143,212,107,.3);padding:6px 14px;border-radius:999px;margin-bottom:16px;
}
.showcase-title{
  font-family:'Work Sans',sans-serif;font-weight:800;text-transform:uppercase;
  font-size:clamp(30px,4.2vw,50px);line-height:1;letter-spacing:-.01em;margin:0 0 16px;color:#fff;
}
.showcase-title .hl{color:var(--accent-leaf);filter:drop-shadow(0 0 16px rgba(143,212,107,.55));display:block;}
.showcase-title-2{text-align:right;}
.showcase-lead{font-size:14.5px;line-height:1.6;color:#C7CDBC;margin-bottom:20px;}
.showcase-ctas{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.btn-neon{background:var(--accent-leaf);color:#0B1206;font-weight:700;box-shadow:0 0 0 1px rgba(143,212,107,.5) inset, 0 8px 26px rgba(76,122,61,.4);}
.btn-neon:hover{filter:brightness(1.1);box-shadow:0 0 0 1px rgba(143,212,107,.6) inset, 0 10px 32px rgba(76,122,61,.55);}
.showcase-dots{display:flex;gap:6px;margin-top:18px;}
.showcase-dots button{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25);border:none;padding:0;cursor:pointer;}
.showcase-dots button.active{background:var(--accent-leaf);width:20px;border-radius:5px;}
.showcase-thumbs{position:absolute;top:44px;right:48px;display:flex;gap:10px;z-index:3;}
.showcase-thumbs button{
  width:52px;height:66px;border-radius:12px;overflow:hidden;padding:0;cursor:pointer;
  border:2px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);transition:border-color .2s ease;
}
.showcase-thumbs button img{width:100%;height:100%;object-fit:cover;}
.showcase-thumbs button.active{border-color:var(--accent-leaf);}
.showcase-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;
  width:24%;min-width:190px;max-width:270px;aspect-ratio:.72/1;
  border-radius:160px 160px 46px 46px;overflow:hidden;
  box-shadow:0 40px 90px rgba(0,0,0,.6), 0 0 70px rgba(76,122,61,.32);
}
.showcase-center img{width:100%;height:100%;object-fit:cover;transition:opacity .35s ease;}
.showcase-bottom-right{position:absolute;right:48px;bottom:64px;z-index:3;max-width:300px;}
.showcase-badge-corner{
  position:absolute;left:48px;bottom:64px;z-index:3;display:flex;align-items:center;gap:9px;
  font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#9DA793;
}
.showcase-badge-corner b{display:block;color:#fff;font-size:12px;letter-spacing:.02em;text-transform:none;}
@media(max-width:860px){
  .hero-showcase{border-radius:0;margin:0 0 6px;}
  .showcase-stage{
    position:static;display:flex;flex-direction:column;align-items:center;
    gap:0;padding:34px 24px 30px;min-height:auto;text-align:left;
  }
  .showcase-top-left,.showcase-bottom-right,.showcase-badge-corner{
    position:static !important;transform:none !important;max-width:100%;
  }

  /* let the top-left wrapper's children become direct flex items of showcase-stage,
     so the headline halves, lead, CTA, image, thumbs and badge can each take their
     own place in a single top-to-bottom flow */
  .showcase-top-left{display:contents;}

  .showcase-eyebrow{display:none;}                 /* brand is already in the badge at the bottom */

  .showcase-title:not(.showcase-title-2){order:1;width:100%;margin:0;text-align:left;animation:coverFadeUp .6s ease .05s both;}
  .showcase-title-2{text-align:left;margin:0;}
  /* one continuous plain-white headline — no green split, no forced mid-line break on mobile */
  .showcase-title .hl{color:#fff;filter:none;display:inline;}
  .showcase-title br{display:none;}

  .showcase-lead{order:2;width:100%;max-width:100%;margin:0 0 20px;text-align:left;animation:coverFadeUp .6s ease .12s both;}

  .showcase-ctas{order:3;width:100%;justify-content:center;margin:0 0 30px;animation:coverFadeUp .6s ease .18s both;}
  .showcase-ctas .btn{padding:14px 30px;}

  .showcase-dots{display:none;}                     /* thumbnails below double as the picker */

  /* -- product photo: true centering. The base .showcase-center float animation uses
     translate(-50%,-50%), which is only valid for the desktop absolute-positioned
     layout — on mobile that offset was shoving the box left/up every frame, so it
     never looked centered. Give mobile its own float keyframes with no offset, plus
     a fade/scale entrance so it doesn't just pop in. -- */
  .showcase-center{
    position:static !important;max-width:100%;
    order:4;align-self:center;width:min(72%,300px);margin:0 auto 22px;
    aspect-ratio:.78/1;border-radius:50% 50% 14px 14px;
    animation:showcaseImgIn .7s ease .22s both, centerFloatMobile 5.5s ease-in-out .9s infinite;
  }
  .showcase-center::after{animation:haloPulse 3.4s ease-in-out infinite;}

  .showcase-thumbs{
    order:5;position:static;display:flex;align-self:center;justify-content:center;
    width:100%;margin:0 0 28px;animation:coverFadeUp .6s ease .3s both;
  }
  .showcase-thumbs button{width:64px;height:78px;}

  /* second headline half (e.g. "the honest way") now reads as its own line,
     positioned after the product photo/thumbnails and right above the badge,
     matching the reference mobile layout */
  .showcase-bottom-right{order:6;width:100%;text-align:left;margin:0 0 20px;animation:coverFadeUp .6s ease .36s both;}

  .showcase-badge-corner{
    order:7;align-self:center;margin:0;text-align:left;animation:coverFadeUp .6s ease .42s both;
  }

  .showcase-title{font-size:34px;line-height:1.08;}
}
@keyframes showcaseImgIn{from{opacity:0;transform:scale(.88);}to{opacity:1;transform:scale(1);}}
@keyframes centerFloatMobile{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}

/* scrolling product marquee */
.marquee-wrap{
  overflow:hidden;padding:18px 0;background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.marquee-track{display:flex;width:max-content;animation:marquee-scroll 32s linear infinite;}
.marquee-wrap:hover .marquee-track{animation-play-state:paused;}
.marquee-item{
  display:flex;align-items:center;gap:10px;flex:none;padding:8px 20px;border-right:1px solid var(--line);
  cursor:pointer;transition:transform .25s ease;
}
.marquee-item:hover{transform:translateY(-3px);}
.marquee-item img{width:44px;height:44px;border-radius:10px;object-fit:cover;flex:none;}
.marquee-item .mq-name{font-weight:600;font-size:13.5px;color:var(--heading);white-space:nowrap;}
.marquee-item .mq-price{font-size:12.5px;color:var(--gold);font-weight:700;white-space:nowrap;}
.marquee-item .mq-tag{font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-leaf, #4C7A3D);white-space:nowrap;}
@keyframes marquee-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none;}}
@media(max-width:600px){.marquee-item{padding:6px 14px;}.marquee-item img{width:36px;height:36px;}}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;}
.hero h1{font-size:54px;line-height:1.05;margin:16px 0 18px;color:var(--ink);font-weight:600;}
.hero h1 em{
  font-style:italic;
  background:linear-gradient(100deg, var(--gold-light), var(--gold) 45%, var(--clay));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px var(--gold-glow));
}
.hero p.lead{font-size:16.5px;color:var(--ink-soft);max-width:440px;margin-bottom:28px;line-height:1.65;}
.hero-ctas{display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
.hero-art{position:relative;aspect-ratio:1/1;}
.hero-photo{
  width:88%;height:88%;border-radius:50% 50% 46% 54%/54% 46% 54% 46%;
  object-fit:cover;border:6px solid var(--white);
  box-shadow:var(--shadow), 0 0 46px var(--gold-glow);
}
.stamp{
  position:absolute;bottom:6px;left:-6px;width:118px;height:118px;
  transform:rotate(-9deg);filter:drop-shadow(0 0 10px var(--gold-glow));
}
@media(max-width:820px){
  .hero{padding:34px 0 24px;}
  .hero-grid{grid-template-columns:1fr;gap:26px;}
  .hero h1{font-size:36px;}
  .hero-art{max-width:280px;margin:0 auto;}
}

/* botanical divider */
.divider{display:flex;align-items:center;justify-content:center;gap:14px;margin:10px 0 34px;}
.divider .line{width:70px;height:1px;background:linear-gradient(90deg, transparent, var(--gold));}
.divider .line.right{background:linear-gradient(90deg, var(--gold), transparent);}
.divider .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold-glow);}

/* ---------- SHOP ---------- */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px;flex-wrap:wrap;}
.section-head h2{font-size:30px;margin:4px 0 0;color:var(--heading);}
.chips{display:flex;gap:10px;overflow-x:auto;padding:4px 0 18px;scrollbar-width:none;}
.chips::-webkit-scrollbar{display:none;}
.chip{
  flex:none;padding:9px 18px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--card);font-size:13.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap;
  transition:border-color .15s ease;
}
.chip:hover{border-color:var(--accent-leaf);}
.chip.active{background:linear-gradient(135deg, var(--primary), var(--primary-dark));border-color:var(--gold);color:var(--gold-light);box-shadow:0 0 14px var(--gold-glow);}

.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-bottom:50px;}
@media(max-width:980px){.grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:700px){.grid{grid-template-columns:repeat(2,1fr);gap:12px;}}

.card{
  background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
  display:flex;flex-direction:column;position:relative;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover{
  transform:translateY(-4px);
  border-color:var(--gold);
  box-shadow:0 14px 34px rgba(20,16,8,0.14), 0 0 24px var(--gold-glow);
}
.card:active{transform:translateY(-1px) scale(.985);}
.card-img-wrap{position:relative;aspect-ratio:1/1;background:var(--bg-soft);overflow:hidden;}
.card-img-wrap::after{
  content:'';position:absolute;inset:auto 0 0 0;height:46%;pointer-events:none;
  background:linear-gradient(to top, rgba(0,0,0,0.34), transparent);
}
.card-img-wrap img{width:100%;height:100%;object-fit:cover;}
.mini-stamp{position:absolute;top:8px;left:8px;width:52px;height:52px;transform:rotate(-8deg);}
/* badges float over the product photo instead of taking a row in the card body */
.card-tags{position:absolute;top:9px;left:9px;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:4px;}
.card-body{padding:11px 14px 14px;display:flex;flex-direction:column;gap:5px;flex:1;}
.card-cat{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--accent-leaf);font-weight:700;}
.card-name{font-family:'Fraunces',serif;font-size:16.5px;font-weight:600;color:var(--ink);line-height:1.25;}
.card-desc{font-size:12.5px;color:var(--ink-soft);line-height:1.4;flex:1;}
/* description hidden on home page product cards (Featured / Latest arrivals) — still shown on the Shop page grid */
#featuredGrid .card-desc,#latestGrid .card-desc{display:none;}
/* compact sale-timer sized for the tighter width of a grid card */
.sale-timer.card-sale-timer{font-size:10.5px;padding:4px 10px 4px 7px;margin-top:2px;gap:4px;}
.sale-timer.card-sale-timer .st-prefix{display:none;}
.sale-timer.card-sale-timer .st-seg{padding:1px 4px;}
.card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:5px;}
.price{font-weight:700;font-size:15.5px;color:var(--ink);}
.stock-low{font-size:11px;color:var(--danger);font-weight:600;}
.add-btn{
  width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg, var(--primary), var(--primary-dark));color:var(--gold-light);border:none;
  display:flex;align-items:center;justify-content:center;font-size:20px;line-height:1;flex:none;
  box-shadow:0 0 0 1px var(--gold-glow) inset;transition:box-shadow .2s ease, transform .15s ease;
}
.add-btn:hover{box-shadow:0 0 14px var(--gold-glow), 0 0 0 1px var(--gold-glow) inset;transform:scale(1.06);}
.qty-stepper{display:flex;align-items:center;gap:8px;background:linear-gradient(135deg, var(--primary), var(--primary-dark));border-radius:999px;padding:4px;box-shadow:0 0 0 1px var(--gold-glow) inset;}
.qty-stepper button{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;border:none;font-size:16px;}
.qty-stepper span{color:#fff;font-weight:700;font-size:13px;min-width:16px;text-align:center;}
/* single, quieter order CTA — a slim gradient pill rather than a bulky bordered button */
.card-order-btn{
  width:100%;margin-top:8px;text-align:center;text-decoration:none;display:block;
  border:none;border-radius:999px;padding:9px 14px;font-size:13px;font-weight:700;letter-spacing:.01em;
  background:linear-gradient(135deg, var(--clay), var(--clay-dark));color:var(--white);
  box-shadow:0 0 0 1px var(--gold-glow) inset;transition:box-shadow .2s ease, transform .15s ease;
}
.card-order-btn:hover{box-shadow:0 0 14px var(--gold-glow), 0 0 0 1px var(--gold-glow) inset;transform:translateY(-1px);}
.card-order-btn:active{transform:translateY(0) scale(.98);}
.empty-note{padding:60px 20px;text-align:center;color:var(--ink-soft);}

/* ---------- CART DRAWER ---------- */
.overlay{position:fixed;inset:0;background:rgba(43,35,24,.4);z-index:60;opacity:0;pointer-events:none;transition:opacity .25s;}
.overlay.open{opacity:1;pointer-events:auto;}
.drawer{
  position:fixed;top:0;right:0;height:100%;width:400px;max-width:92vw;background:var(--white);
  z-index:70;transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column;
  box-shadow:-10px 0 30px rgba(0,0,0,.12);
}
.drawer.open{transform:translateX(0);}
.drawer-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;}
.drawer-head h3{margin:0;font-size:20px;color:var(--heading);}
.free-ship-bar{padding:12px 20px;border-bottom:1px solid var(--line);background:var(--bg-soft);}
.free-ship-msg{font-size:13px;color:var(--ink);margin-bottom:8px;}
.free-ship-msg b{color:var(--primary);}
.free-ship-track{height:6px;border-radius:999px;background:var(--line);overflow:hidden;}
.free-ship-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--secondary,var(--primary)),var(--primary));transition:width .3s ease;}
.free-ship-bar--done .free-ship-msg b{color:#1a7d3a;}
.free-ship-bar--done .free-ship-fill{background:#1a7d3a;}
.drawer-body{flex:1;overflow-y:auto;padding:14px 20px;}
.cart-line{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);}
.cart-line img{width:58px;height:58px;border-radius:10px;object-fit:cover;flex:none;background:var(--bg-soft);}
.cart-line-info{flex:1;}
.cart-line-info .name{font-weight:600;font-size:14px;}
.cart-line-info .cat{font-size:11px;color:var(--ink-soft);}
.cart-line-foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;}
.remove-link{font-size:11.5px;color:var(--danger);background:none;border:none;font-weight:600;}
.drawer-foot{padding:18px 20px;border-top:1px solid var(--line);background:var(--bg-soft);}
.subtotal-row{display:flex;justify-content:space-between;font-size:15px;font-weight:700;margin-bottom:14px;color:var(--heading);}
.close-x{background:none;border:none;font-size:22px;color:var(--ink-soft);line-height:1;}

/* mobile sticky cart bar */
.sticky-cart{
  position:fixed;left:14px;right:14px;bottom:14px;z-index:55;
  background:linear-gradient(135deg, var(--primary-dark), var(--primary));color:var(--gold-light);border-radius:16px;padding:13px 16px;
  display:none;align-items:center;justify-content:space-between;
  box-shadow:0 10px 30px rgba(0,0,0,.3), 0 0 0 1px var(--gold-glow) inset, 0 0 24px var(--gold-glow);
}
.sticky-cart.show{display:flex;}
.sticky-cart .info{font-size:13px;}
.sticky-cart .info b{display:block;font-size:14.5px;font-family:'Fraunces',serif;}
@media(min-width:701px){.sticky-cart{display:none !important;}}

/* ---------- FORMS / MODALS ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(43,35,24,.45);z-index:80;display:none;align-items:center;justify-content:center;padding:20px;}
.modal-overlay.open{display:flex;}
.modal{background:var(--white);border-radius:18px;max-width:520px;width:100%;max-height:88vh;overflow-y:auto;padding:26px;position:relative;}
.modal h3{margin-top:0;color:var(--heading);font-size:22px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;}
.field input,.field select,.field textarea{
  width:100%;padding:11px 13px;border-radius:10px;border:1.5px solid var(--line);background:var(--bg);
  font-family:inherit;font-size:14.5px;color:var(--ink);
}
.field textarea{resize:vertical;min-height:70px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.upload-box{
  width:100%;min-height:120px;border:1.5px dashed var(--line);border-radius:10px;background:var(--bg);
  display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;position:relative;
}
.upload-box:hover{border-color:var(--gold);}
.upload-box img{width:100%;height:140px;object-fit:cover;}
.upload-box span{font-size:13px;color:var(--ink-soft);font-weight:600;padding:20px;text-align:center;}
.upload-box.uploading{opacity:.5;pointer-events:none;}
.gallery-upload-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;}
.gallery-upload-item{position:relative;width:64px;height:64px;}
.gallery-upload-item img{width:100%;height:100%;object-fit:cover;border-radius:8px;}
.gallery-upload-item button{
  position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--danger);
  color:#fff;border:2px solid var(--white);font-size:11px;line-height:1;cursor:pointer;
}
.pay-options{display:flex;flex-direction:column;gap:10px;}
.pay-option{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:10px;padding:12px;font-size:14px;font-weight:600;}
.pay-option input{width:auto;}
.bank-details-card{background:var(--card);border:1px dashed var(--primary);border-radius:12px;padding:14px;margin-top:12px;}
.copy-btn{flex-shrink:0;padding:4px 10px;font-size:11.5px;font-weight:700;border-radius:999px;border:1px solid var(--gold);background:transparent;color:var(--ink);cursor:pointer;transition:background .15s ease,color .15s ease;}
.copy-btn:hover{background:var(--gold);color:#1C1912;}

/* ---------- CHECKOUT / CONFIRM VIEWS ---------- */
.view{display:none;}
.view.active{display:block;}
.narrow{max-width:560px;margin:0 auto;}
.confirm-box{text-align:center;padding:60px 20px;}
.confirm-check-wrap{position:relative;width:140px;height:140px;margin:0 auto 14px;}
.confirm-check-wrap::before{
  content:'';position:absolute;inset:-16px;border-radius:50%;
  background:radial-gradient(circle, var(--gold-glow), transparent 72%);
  animation:ccGlow 2.4s ease-in-out .6s infinite;
}
.confirm-check{position:relative;width:100%;height:100%;overflow:visible;}
.cc-ring{stroke-dasharray:327;stroke-dashoffset:327;animation:ccRing .85s ease-out forwards;}
.cc-fill{transform-origin:60px 60px;transform:scale(0);animation:ccPop .5s .35s cubic-bezier(.34,1.56,.64,1) forwards;}
.cc-check{stroke-dasharray:76;stroke-dashoffset:76;animation:ccDraw .4s .68s ease-out forwards;}
.confetti{
  position:absolute;top:50%;left:50%;width:8px;height:8px;border-radius:2px;background:var(--c, var(--gold));
  transform:translate(-50%,-50%) scale(0);opacity:0;
  animation:confettiBurst .7s var(--delay, .6s) cubic-bezier(.2,.8,.3,1) forwards;
}
.confirm-fade{opacity:0;transform:translateY(10px);animation:ccFadeUp .5s ease forwards;}
@keyframes ccGlow{0%,100%{opacity:.55;transform:scale(1);}50%{opacity:1;transform:scale(1.08);}}
@keyframes ccRing{to{stroke-dashoffset:0;}}
@keyframes ccPop{0%{transform:scale(0);}70%{transform:scale(1.08);}100%{transform:scale(1);}}
@keyframes ccDraw{to{stroke-dashoffset:0;}}
@keyframes confettiBurst{
  0%{transform:translate(-50%,-50%) scale(0) rotate(0deg);opacity:0;}
  25%{opacity:1;}
  100%{transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1) rotate(var(--rz, 0deg));opacity:0;}
}
@keyframes ccFadeUp{to{opacity:1;transform:translateY(0);}}
.order-summary{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-top:20px;text-align:left;}

/* ---------- FOOTER ---------- */
footer{background:var(--primary-dark);color:#EFE7CE;margin-top:40px;padding:44px 0 26px;}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;}
footer h4{font-family:'Fraunces',serif;font-size:20px;margin:0 0 8px;}
footer p{color:#C9BE9E;font-size:13.5px;max-width:320px;line-height:1.6;}
.foot-admin{background:none;border:1px solid #5b6b4f;color:#C9BE9E;font-size:11.5px;padding:6px 12px;border-radius:999px;margin-top:14px;}

/* ---------- ADMIN ---------- */
#adminRoot{display:none;}
#adminRoot.active{display:block;}
.admin-shell{min-height:100vh;background:var(--bg);}
.admin-login-box{max-width:360px;margin:90px auto;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:32px;text-align:center;}
.admin-bar{background:var(--primary-dark);color:#fff;padding:14px 20px;display:flex;justify-content:space-between;align-items:center;}
.admin-tabs{display:flex;gap:6px;overflow-x:auto;background:var(--white);border-bottom:1px solid var(--line);padding:0 20px;}
.admin-tab{padding:14px 16px;background:none;border:none;font-weight:600;font-size:13.5px;color:var(--ink-soft);border-bottom:3px solid transparent;white-space:nowrap;}
.admin-tab.active{color:var(--heading);border-color:var(--clay);}
.admin-body{padding:24px 20px 60px;max-width:1100px;margin:0 auto;}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:26px;}
@media(max-width:820px){.stat-grid{grid-template-columns:repeat(2,1fr);}}
.stat-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;transition:box-shadow .2s ease, border-color .2s ease;}
.stat-card:hover{border-color:var(--gold);box-shadow:0 0 18px var(--gold-glow);}
.stat-card .label{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:700;}
.stat-card .value{font-family:'Fraunces',serif;font-size:26px;color:var(--ink);margin-top:6px;}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px;}
.panel-head h3{margin:0;color:var(--heading);}
.admin-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:20px;}
/* ---------- ADMIN: THEMES TAB ---------- */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;}
.theme-card{border:2px solid var(--line);border-radius:16px;overflow:hidden;background:var(--card);transition:border-color .2s ease,box-shadow .2s ease;}
.theme-card.active{border-color:var(--primary);box-shadow:0 0 0 3px var(--gold-glow);}
.theme-card .theme-preview{height:130px;position:relative;overflow:hidden;}
.theme-card .theme-preview .tp-header{height:30px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;}
.theme-card .theme-preview .tp-body{padding:12px;display:flex;gap:10px;align-items:center;height:calc(100% - 30px);}
.theme-card .theme-preview .tp-card{flex:1;height:70px;border-radius:8px;}
.theme-card .theme-preview .tp-btn{width:54px;height:20px;border-radius:999px;flex:none;}
.theme-card-body{padding:14px 16px 16px;}
.theme-card-body h4{margin:0 0 4px;font-family:'Fraunces',serif;color:var(--heading);font-size:16.5px;}
.theme-card-body p{margin:0 0 12px;font-size:12.5px;color:var(--ink-soft);line-height:1.5;}
.theme-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.theme-card-tags span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--bg-soft);color:var(--ink-soft);padding:3px 8px;border-radius:999px;}
.theme-active-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--primary);}
.theme-layout-line{background:var(--bg-soft);border-radius:8px;padding:7px 10px;font-size:11.5px !important;color:var(--ink-soft);margin:0 0 12px !important;line-height:1.4 !important;}
.theme-card-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.theme-card-actions .btn-primary,.theme-card-actions .btn-outline{flex:1;}
.theme-preview-modal{width:min(94vw,1040px);}
.theme-preview-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.theme-preview-frame{width:100%;height:min(72vh,760px);border:1px solid var(--line);border-radius:14px;background:#fff;}
.theme-preview-modal-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:14px;}
table.data{width:100%;border-collapse:collapse;font-size:13.5px;}
table.data th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);padding:8px 10px;border-bottom:2px solid var(--line);}
table.data td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle;}
table.data tr:last-child td{border-bottom:none;}
.row-actions{display:flex;gap:8px;}
.status-badge{font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;text-transform:capitalize;}
.tag-badge{display:inline-block;font-size:10px;font-weight:700;padding:3px 8px;border-radius:999px;background:var(--accent-leaf, #4C7A3D);color:#fff;margin-right:4px;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,0.28);}
.tag-organic{
  background:linear-gradient(120deg, #3f6b32, #6fae4a, #C9A227, #6fae4a, #3f6b32);
  background-size:300% 100%;
  animation:organicShimmer 4s linear infinite, organicPulse 2.4s ease-in-out infinite;
  padding-left:9px;
}
.tag-organic::before{content:'🌿';margin-right:3px;font-size:9px;}
.tag-featured{background:#C9A227;color:#1b1b1b;}
.tag-bestseller{background:#B4531F;}
.tag-latest{background:#2C6E8E;}
@keyframes organicShimmer{0%{background-position:0% 50%;}100%{background-position:300% 50%;}}
@keyframes organicPulse{0%,100%{box-shadow:0 2px 8px rgba(0,0,0,0.28);}50%{box-shadow:0 2px 8px rgba(0,0,0,0.28), 0 0 10px var(--gold-glow);}}
.price-old{text-decoration:line-through;color:var(--ink-soft);font-size:12px;margin-right:6px;}
.price-discount-badge{font-size:11px;font-weight:700;color:#fff;background:var(--danger, #C0392B);padding:2px 6px;border-radius:6px;margin-left:6px;}
.gallery-thumbs{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;}
.gallery-thumbs img{width:56px;height:56px;object-fit:cover;border-radius:8px;cursor:pointer;border:2px solid transparent;}
.gallery-thumbs img.active{border-color:var(--gold, #C9A227);}
.pd-promo-banner{width:100%;max-height:280px;object-fit:cover;border-radius:16px;display:block;box-shadow:0 10px 30px rgba(0,0,0,.12);}
@media(max-width:700px){ .pd-promo-banner{max-height:180px;border-radius:12px;} }
.pd-section{margin-top:14px;}
.pd-section h5{margin:0 0 4px;color:var(--heading);font-size:13px;text-transform:uppercase;letter-spacing:.03em;}
.pd-section p{margin:0;font-size:13px;color:var(--ink-soft);line-height:1.6;white-space:pre-line;}
.status-pending{background:#F3E3C4;color:#8A5A17;}
.status-confirmed{background:#D8E4CE;color:#3E5A2C;}
.status-shipped{background:#D3E2EA;color:#2A5471;}
.status-delivered{background:#CFE6D4;color:#245C36;}
.status-cancelled{background:#F0D3CC;color:#8A3221;}
.bar-chart{display:flex;align-items:flex-end;gap:8px;height:140px;margin-top:10px;}
.bar-chart .bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;}
.bar-chart .bar{width:100%;background:var(--primary);border-radius:6px 6px 0 0;min-height:3px;}
.bar-chart .bar-label{font-size:10px;color:var(--ink-soft);margin-top:6px;}
.thumb-sm{width:40px;height:40px;border-radius:8px;object-fit:cover;background:var(--bg-soft);}
.toggle-row{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;}
.small-muted{font-size:12px;color:var(--ink-soft);}
.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--primary-dark);
  color:#fff;padding:12px 22px;border-radius:999px;font-size:13.5px;font-weight:600;z-index:999;opacity:0;
  transition:all .25s ease;pointer-events:none;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
@media(max-width:600px){
  .field-row{grid-template-columns:1fr;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  footer .wrap{flex-direction:column;}
}

/* ---------- THEME TOGGLE ---------- */
.theme-toggle{position:relative;overflow:hidden;}
.theme-icon-stack{position:relative;width:19px;height:19px;flex:none;display:inline-block;overflow:visible;}
.theme-toggle svg{position:absolute;top:0;left:0;transition:transform .35s ease, opacity .35s ease;}
.theme-toggle .sun{opacity:1;transform:rotate(0deg) scale(1);}
.theme-toggle .moon{opacity:0;transform:rotate(-60deg) scale(.4);}
body.dark .theme-toggle .sun{opacity:0;transform:rotate(60deg) scale(.4);}
body.dark .theme-toggle .moon{opacity:1;transform:rotate(0deg) scale(1);}

/* ---------- PROMO BANNER ---------- */
.promo-banner{
  background:var(--gold);color:#2B2318;text-align:center;font-size:13px;font-weight:700;
  padding:9px 16px;display:none;letter-spacing:.02em;
}
.promo-banner.show{display:block;}
.promo-banner b{background:rgba(43,35,24,0.12);padding:2px 8px;border-radius:6px;margin:0 3px;font-family:monospace;letter-spacing:.03em;}

/* ---------- SEARCH / SORT BAR ---------- */
.shop-toolbar{display:flex;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
/* Default (Classic) shop layout: sidebar wrapper is just a transparent pass-through —
   chips sit above the grid exactly as before. Theme presets below can turn
   .shop-sidebar into a real left-hand filter column via #shopLayout grid rules. */
.shop-layout{display:block;}
.shop-sidebar{display:contents;}
.shop-sidebar-label{display:none;}
.search-input-wrap{position:relative;flex:1;min-width:180px;}
.search-input-wrap input{
  width:100%;padding:11px 14px 11px 38px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--card);font-family:inherit;font-size:14px;color:var(--ink);
}
.search-input-wrap svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--ink-soft);}
.sort-select{border-radius:999px;border:1.5px solid var(--line);background:var(--card);padding:10px 14px;font-size:13.5px;font-weight:600;color:var(--ink-soft);font-family:inherit;}

/* ---------- COUPON ROW (checkout) ---------- */
.coupon-row{display:flex;gap:8px;}
.coupon-row input{flex:1;}
.coupon-applied{display:flex;justify-content:space-between;align-items:center;background:var(--bg-soft);border:1px dashed var(--clay);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;margin-top:8px;}
.coupon-applied button{background:none;border:none;color:var(--danger);font-weight:700;font-size:12px;}
.summary-row{display:flex;justify-content:space-between;padding:3px 0;font-size:13.5px;color:var(--ink-soft);}
.summary-row.discount{color:var(--primary);}

/* ---------- ORDER TRACKING ---------- */
.track-result{margin-top:20px;}
.track-order-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px;text-align:left;}
.track-order-card .row1{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}

/* ---------- ADMIN COUPON TOGGLE SWITCH ---------- */
.switch{position:relative;display:inline-block;width:40px;height:22px;}
.switch input{opacity:0;width:0;height:0;}
.switch .slider{position:absolute;cursor:pointer;inset:0;background:var(--line);border-radius:999px;transition:.2s;}
.switch .slider:before{content:"";position:absolute;height:16px;width:16px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s;}
.switch input:checked + .slider{background:var(--primary);}
.switch input:checked + .slider:before{transform:translateX(18px);}
.low-stock-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.low-stock-item:last-child{border-bottom:none;}

/* ---------- LOGO / FAVICON / BRANDING (added) ---------- */
#brandLogoImg{border-radius:6px;}
#footLogoImg{border-radius:6px;}

/* ---------- INVOICE LINKS (added) ---------- */
.track-order-card a.btn{text-decoration:none;}

/* ---------- ADMIN SETTINGS FILE INPUTS (added) ---------- */
#adminBody input[type="file"]{
  width:100%;padding:8px;border-radius:8px;border:1.5px dashed var(--line);
  background:var(--card);font-family:inherit;font-size:13px;color:var(--ink-soft);
}

/* ---------- ANNOUNCEMENT BAR (added) ---------- */
.announce-bar{background:var(--primary-dark);color:var(--gold-light);text-align:center;font-size:12.5px;font-weight:600;letter-spacing:.02em;padding:8px 14px;display:none;}
.announce-bar.show{display:block;}

/* ---------- HERO SLIDER (added) ---------- */
.hero-slider{position:relative;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);min-height:340px;}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;display:flex;align-items:center;}
.hero-slide.active{opacity:1;position:relative;}
.hero-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.62);}
.hero-slide-content{position:relative;z-index:2;padding:38px;color:#fff;max-width:480px;}
.hero-slide-content h2{color:#fff;font-size:26px;margin:8px 0 10px;}
.hero-slide-content p{color:#EDE7D2;line-height:1.6;}
.slider-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:7px;z-index:3;}
.slider-dots button{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,0.5);border:none;cursor:pointer;padding:0;}
.slider-dots button.active{background:var(--gold);width:22px;border-radius:5px;}

/* ---------- REVIEWS (added) ---------- */
.review-summary{display:flex;align-items:center;gap:10px;margin:14px 0;}
.review-stars{color:var(--gold);font-size:16px;letter-spacing:1px;}
.review-card{border-bottom:1px solid var(--line);padding:12px 0;}
.review-card:last-child{border-bottom:none;}
.review-card .rname{font-weight:700;font-size:13.5px;}
.review-card .rmeta{font-size:11px;color:var(--ink-soft);margin-left:6px;}
.official-buyer-badge{position:relative;display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;padding:3px 9px 3px 6px;border-radius:999px;background:linear-gradient(135deg,#0d3b2e,#123f2f 45%,#0a2e23);color:#f3d68a;margin-left:6px;letter-spacing:.03em;vertical-align:middle;border:1px solid rgba(212,175,90,.55);box-shadow:0 1px 3px rgba(0,0,0,.35),inset 0 0 0 1px rgba(212,175,90,.08);overflow:hidden;cursor:default;text-shadow:0 1px 1px rgba(0,0,0,.4);}
.official-buyer-badge::before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,229,153,.55) 45%,rgba(255,255,255,.75) 50%,rgba(255,229,153,.55) 55%,transparent);transform:skewX(-20deg);animation:badgeShine 3.2s ease-in-out infinite;}
@keyframes badgeShine{0%{left:-60%;}45%{left:130%;}100%{left:130%;}}
.official-buyer-badge svg{width:11px;height:11px;flex:none;position:relative;z-index:1;filter:drop-shadow(0 0 1px rgba(255,215,120,.6));}
.official-buyer-badge span.obb-label{position:relative;z-index:1;background:linear-gradient(180deg,#ffe9b0,#d8ab4e);-webkit-background-clip:text;background-clip:text;color:transparent;}
.official-buyer-badge::after{content:attr(data-tooltip);position:absolute;left:50%;bottom:calc(100% + 7px);transform:translateX(-50%) translateY(4px);background:#111;color:#fff;font-size:10px;font-weight:600;letter-spacing:.02em;padding:4px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;box-shadow:0 2px 8px rgba(0,0,0,.3);z-index:5;}
.official-buyer-badge:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}
.official-buyer-badge:hover{box-shadow:0 2px 6px rgba(0,0,0,.4),inset 0 0 0 1px rgba(212,175,90,.2);}
@keyframes reviewPopIn{
  0%{opacity:0;transform:translateY(-8px) scale(.97);background-color:rgba(15,81,50,0.10);}
  60%{opacity:1;transform:translateY(0) scale(1.01);}
  100%{opacity:1;transform:translateY(0) scale(1);background-color:transparent;}
}
.review-just-added{animation:reviewPopIn .7s ease-out;border-radius:8px;}
.review-form .field{margin-bottom:10px;}
.star-picker{display:flex;gap:4px;font-size:22px;cursor:pointer;color:var(--line);margin-bottom:6px;}
.star-picker span.on{color:var(--gold);}

/* ---------- 5-STAR REVIEW CELEBRATION ---------- */
.fsc-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .35s ease;}
.fsc-overlay.show{opacity:1;pointer-events:auto;}
.fsc-overlay.hide{opacity:0;}
.fsc-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 38%,rgba(46,34,10,0.6),rgba(10,9,6,0.86));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
.fsc-stage{position:relative;width:min(360px,88vw);padding:44px 22px 30px;text-align:center;perspective:1000px;}
.fsc-star-row{display:flex;gap:10px;justify-content:center;align-items:flex-end;margin-top:20px;position:relative;z-index:2;}
.fsc-mini-star{font-size:30px;line-height:1;color:rgba(255,255,255,0.22);transition:color .15s;}
.fsc-mini-star.filled{color:var(--gold);text-shadow:0 0 10px var(--gold-glow);}
.fsc-mini-star.target{position:relative;}
.fsc-mini-star.target.pop{color:var(--gold);text-shadow:0 0 16px var(--gold-glow);animation:fscPop .55s cubic-bezier(.34,1.56,.64,1);}
@keyframes fscPop{0%{transform:scale(1);}35%{transform:scale(1.8);}65%{transform:scale(.85);}100%{transform:scale(1);}}
.fsc-big-star{position:absolute;left:50%;top:0;font-size:60px;line-height:1;color:var(--gold);text-shadow:0 0 22px var(--gold-glow),0 0 60px var(--gold-glow);transform:translate(-50%,0) scale(1) rotateY(0deg) rotateX(0deg);will-change:transform,opacity;z-index:3;filter:drop-shadow(0 8px 12px rgba(0,0,0,.4));opacity:0;}
.fsc-big-star.fly{animation:fscFly 1.2s cubic-bezier(.5,.05,.22,1) forwards;}
@keyframes fscFly{
  0%{transform:translate(-50%,0) scale(1) rotateY(0deg) rotateX(0deg);opacity:0;}
  12%{opacity:1;}
  55%{transform:translate(-50%,-4px) scale(2.7) rotateY(760deg) rotateX(380deg);opacity:1;}
  100%{transform:translate(calc(-50% + var(--dx,0px)),var(--dy,0px)) scale(var(--scaleEnd,.5)) rotateY(1260deg) rotateX(720deg);opacity:1;}
}
.fsc-big-star.gone{opacity:0!important;transition:opacity .18s ease;}
.fsc-burst{position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:1;}
.fsc-burst.pop{animation:fscBurst .65s ease-out forwards;}
@keyframes fscBurst{0%{box-shadow:0 0 0 0 var(--gold-glow);}100%{box-shadow:0 0 0 60px rgba(201,162,39,0);}}
.fsc-text{margin-top:24px;opacity:0;transform:translateY(10px) scale(.92);}
.fsc-text.in{animation:fscTextIn .5s ease forwards;}
@keyframes fscTextIn{to{opacity:1;transform:translateY(0) scale(1);}}
.fsc-text .fsc-title{display:block;font-family:'Fraunces',serif;font-size:23px;font-weight:700;color:#fff;}
.fsc-text .fsc-sub{display:block;font-size:12.5px;color:var(--gold-light);margin-top:5px;letter-spacing:.4px;}
.fsc-confetti{position:absolute;top:2px;width:7px;height:12px;border-radius:2px;opacity:0;z-index:2;}
.fsc-confetti.go{animation:fscConfetti 1.3s ease-in forwards;}
@keyframes fscConfetti{0%{opacity:1;transform:translateY(0) rotate(0deg);}100%{opacity:0;transform:translateY(200px) rotate(540deg);}}
@media(prefers-reduced-motion:reduce){.fsc-big-star.fly,.fsc-mini-star.target.pop,.fsc-burst.pop,.fsc-text.in,.fsc-confetti.go{animation:none!important;}}

/* ---------- CONTACT PAGE (added) ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr;}}
.contact-info-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;}
.contact-info-row{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px;font-size:13.5px;color:var(--ink-soft);}
.contact-info-row b{color:var(--heading);display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;}
.social-links{display:flex;gap:10px;margin-top:14px;}
.social-links a{width:36px;height:36px;border-radius:50%;background:var(--primary);color:var(--gold-light);display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:15px;}

/* ---------- NEWSLETTER (added) ---------- */
.newsletter-box{margin-top:18px;}
.newsletter-row{display:flex;gap:8px;max-width:340px;}
.newsletter-row input{flex:1;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-family:inherit;font-size:13px;}
.newsletter-row button{white-space:nowrap;}
.foot-cols{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:24px;}
@media (max-width:1000px){.foot-cols{grid-template-columns:repeat(3,1fr);}}
@media (max-width:760px){.foot-cols{grid-template-columns:repeat(2,1fr);}}
@media (max-width:480px){.foot-cols{grid-template-columns:1fr;}}
.foot-cols h5{color:var(--heading);font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 10px;}
.foot-cols a.footlink{display:block;color:var(--ink-soft);text-decoration:none;font-size:13px;margin-bottom:8px;}
.foot-cols a.footlink:hover{color:var(--gold);}
.foot-copyright{
  max-width:1180px;margin:30px auto 0;padding:18px 20px 0;
  border-top:1px solid rgba(239,231,206,0.14);
  font-size:12.5px;color:var(--ink-soft);text-align:center;
}
.legal-content{color:var(--ink-soft);line-height:1.7;font-size:14.5px;}
.legal-content p{margin:0 0 14px;}

/* ---------- SALE COUNTDOWN TIMER (animated glowing digit clock) ---------- */
.sale-timer{
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;gap:6px;margin:6px 0 2px;padding:6px 13px 6px 9px;border-radius:999px;
  background:linear-gradient(135deg, rgba(168,58,43,0.14), rgba(201,162,39,0.10));
  color:var(--danger);font-size:11px;font-weight:700;letter-spacing:.01em;white-space:nowrap;
  box-shadow:0 0 0 1px rgba(168,58,43,0.16), 0 0 10px rgba(168,58,43,0.22);
  animation:stGlowPulse 2.4s ease-in-out infinite;
}
.sale-timer::before{
  content:'';position:absolute;top:0;left:-60%;width:35%;height:100%;z-index:0;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.65), transparent);
  transform:skewX(-20deg);animation:stShimmer 3s ease-in-out infinite;pointer-events:none;
}
body.dark .sale-timer::before{background:linear-gradient(120deg, transparent, rgba(255,255,255,0.2), transparent);}
body.dark .sale-timer{background:linear-gradient(135deg, rgba(225,122,95,0.20), rgba(217,178,60,0.13));}
.sale-timer .st-icon{position:relative;z-index:1;flex:none;filter:drop-shadow(0 0 4px rgba(168,58,43,0.7));animation:stTick 1.6s ease-in-out infinite;}
.sale-timer .st-prefix{position:relative;z-index:1;opacity:.85;}
.sale-timer .st-clock{position:relative;z-index:1;display:inline-flex;align-items:center;gap:1px;}
.sale-timer .st-seg{
  display:inline-flex;align-items:baseline;gap:2px;background:rgba(255,255,255,0.65);
  border-radius:6px;padding:2px 5px;margin:0 1px;
  box-shadow:inset 0 0 0 1px rgba(168,58,43,0.22), 0 0 6px rgba(168,58,43,0.3);
}
body.dark .sale-timer .st-seg{background:rgba(0,0,0,0.32);box-shadow:inset 0 0 0 1px rgba(225,122,95,0.4), 0 0 6px rgba(225,122,95,0.35);}
.sale-timer .st-seg:not(.st-s)::after{content:':';margin-left:3px;font-weight:800;opacity:.55;animation:stBlink 1s steps(1) infinite;}
.sale-timer .st-val{font-variant-numeric:tabular-nums;font-weight:800;display:inline-block;text-shadow:0 0 6px currentColor;}
.sale-timer .st-tag{font-size:.72em;font-weight:700;opacity:.6;text-transform:uppercase;}
.sale-timer .st-val.st-flip{animation:stFlip .45s ease;}
.sale-timer.pd-sale-timer{font-size:14px;padding:9px 19px 9px 13px;margin:10px 0 0;}
.sale-timer.pd-sale-timer .st-seg{padding:3px 7px;}
.sale-timer.mq-sale-timer{font-size:9.5px;padding:3px 9px 3px 6px;margin-top:4px;}
.sale-timer.mq-sale-timer .st-prefix{display:none;}
.sale-timer.mq-sale-timer .st-seg{padding:0 3px;}
.sale-timer.st-urgent{
  color:#fff;background:linear-gradient(135deg, var(--danger), #D0553D);
  box-shadow:0 0 0 1px rgba(168,58,43,0.4), 0 0 20px rgba(168,58,43,0.65);
  animation:stUrgentGlow 1.1s ease-in-out infinite;
}
.sale-timer.st-urgent::before{background:linear-gradient(120deg, transparent, rgba(255,255,255,0.85), transparent);}
.sale-timer.st-urgent .st-icon{filter:drop-shadow(0 0 6px rgba(255,255,255,0.9));}
.sale-timer.st-urgent .st-seg{background:rgba(255,255,255,0.2);box-shadow:none;}
.sale-timer.st-urgent .st-val{text-shadow:0 0 8px rgba(255,255,255,0.95);}
.sale-timer.st-urgent .st-tag{opacity:.9;}
@keyframes stFlip{
  0%{transform:rotateX(90deg);opacity:.3;}
  60%{transform:rotateX(0deg);opacity:1;}
  100%{transform:rotateX(0deg);opacity:1;}
}
@keyframes stTick{
  0%,100%{transform:rotate(0deg);}
  25%{transform:rotate(-8deg);}
  75%{transform:rotate(8deg);}
}
@keyframes stGlowPulse{
  0%,100%{box-shadow:0 0 0 1px rgba(168,58,43,0.16), 0 0 8px rgba(168,58,43,0.18);}
  50%{box-shadow:0 0 0 1px rgba(168,58,43,0.24), 0 0 20px rgba(168,58,43,0.5);}
}
@keyframes stShimmer{
  0%{left:-60%;}
  100%{left:130%;}
}
@keyframes stBlink{0%,49%{opacity:.75;}50%,100%{opacity:.15;}}
@keyframes stUrgentGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(168,58,43,0.5), 0 0 16px rgba(168,58,43,0.5);}
  50%{box-shadow:0 0 0 6px rgba(168,58,43,0), 0 0 32px rgba(168,58,43,0.9);}
}

/* ---------- HOME PAGE: FULL-WIDTH SALE TIMER SECTION (added) ---------- */
#homeSaleTimerWrap:empty{display:none;}
.home-sale-timer{
  position:relative;overflow:hidden;margin:18px auto;padding:36px 20px;max-width:1200px;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;
  border-radius:20px;color:#fff;box-shadow:0 14px 40px rgba(20,16,8,.22);
}
.home-sale-timer .hst-glow{
  position:absolute;inset:-40% -10%;filter:blur(60px);opacity:.55;z-index:0;
  animation:hstDrift 10s ease-in-out infinite alternate;
}
.home-sale-timer .hst-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:720px;}
.home-sale-timer .hst-inner.hst-has-media{max-width:980px;flex-direction:row;text-align:left;gap:28px;justify-content:center;}
.home-sale-timer .hst-media{
  width:150px;height:150px;object-fit:cover;border-radius:16px;flex:none;
  box-shadow:0 8px 26px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,0.25);
}
.home-sale-timer .hst-inner.hst-has-media .hst-text,
.home-sale-timer .hst-inner.hst-has-media .hst-clock,
.home-sale-timer .hst-inner.hst-has-media .hst-cta{align-items:flex-start;}
.home-sale-timer .hst-inner.hst-has-media{flex-wrap:wrap;}
@media(max-width:760px){
  .home-sale-timer .hst-inner.hst-has-media{flex-direction:column;text-align:center;}
  .home-sale-timer .hst-media{width:110px;height:110px;}
}
.home-sale-timer .hst-eyebrow{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.85;}
.home-sale-timer .hst-title{font-family:'Fraunces',serif;font-size:clamp(24px,4vw,40px);margin:2px 0 0;color:#fff;line-height:1.15;}
.home-sale-timer .hst-subtitle{margin:0;opacity:.92;font-size:14.5px;max-width:520px;}
.home-sale-timer .hst-cta{margin-top:2px;}
.home-sale-timer .hst-clock{
  font-size:15px;padding:10px 20px 10px 14px;background:rgba(255,255,255,0.16);color:#fff;
  box-shadow:0 0 0 1px rgba(255,255,255,0.28), 0 0 24px rgba(255,255,255,0.22);animation:none;
}
.home-sale-timer .hst-clock .st-seg{background:rgba(255,255,255,0.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.32);}
.home-sale-timer .hst-clock .st-val{text-shadow:0 0 8px rgba(255,255,255,0.75);}
.home-sale-timer .hst-clock.st-urgent{background:rgba(255,255,255,0.3);box-shadow:0 0 0 1px rgba(255,255,255,0.4), 0 0 30px rgba(255,255,255,0.55);}
.home-sale-timer .hst-clock.st-urgent .st-seg{background:rgba(255,255,255,0.34);}
/* theme palettes */
.home-sale-timer[data-theme="gold"]{background:linear-gradient(135deg,#8a6a12,#c9a227 60%,#f0d97a);}
.home-sale-timer[data-theme="gold"] .hst-glow{background:radial-gradient(circle, #ffe9a8, transparent 60%);}
.home-sale-timer[data-theme="coral"]{background:linear-gradient(135deg,#7a2e22,#a83a2b 55%,#e17a5f);}
.home-sale-timer[data-theme="coral"] .hst-glow{background:radial-gradient(circle, #ffb199, transparent 60%);}
.home-sale-timer[data-theme="emerald"]{background:linear-gradient(135deg,#0b3d24,#0f5132 55%,#4c7a3d);}
.home-sale-timer[data-theme="emerald"] .hst-glow{background:radial-gradient(circle, #8fd46b, transparent 60%);}
.home-sale-timer[data-theme="midnight"]{background:linear-gradient(135deg,#0c1224,#1b2547 55%,#3a4a86);}
.home-sale-timer[data-theme="midnight"] .hst-glow{background:radial-gradient(circle, #7d94ff, transparent 60%);}
.home-sale-timer[data-theme="sunset"]{background:linear-gradient(135deg,#4a1942,#a83a6d 55%,#f0824f);}
.home-sale-timer[data-theme="sunset"] .hst-glow{background:radial-gradient(circle, #ffb3d1, transparent 60%);}
@keyframes hstDrift{
  0%{transform:translate(-6%,-4%) scale(1);}
  100%{transform:translate(6%,4%) scale(1.15);}
}
@media(max-width:640px){
  .home-sale-timer{padding:26px 16px;border-radius:0;margin:14px 0;}
  .home-sale-timer .hst-clock{font-size:12px;padding:7px 12px 7px 9px;}
}

/* ---------- PRODUCT PAGE: MOBILE STICKY ADD-TO-CART BAR (added) ---------- */
.pd-mobile-bar{display:none;}
@media(max-width:700px){
  body{padding-bottom:76px;}
  .pd-mobile-bar{
    display:flex;align-items:center;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:var(--card);border-top:1px solid var(--line);padding:10px 14px;
    box-shadow:0 -8px 24px rgba(20,16,8,.14);
  }
  .pd-mobile-bar .btn{padding:11px 14px;font-size:13.5px;white-space:nowrap;}
  .pd-mobile-bar-price{font-family:'Fraunces',serif;font-size:16px;color:var(--heading);flex:none;}
}

/* ---------- ADMIN: extra tables / small helpers (added) ---------- */
.msg-unread{font-weight:700;}
.badge-count{background:var(--danger);color:#fff;font-size:10px;padding:1px 6px;border-radius:10px;margin-left:6px;}
.color-input-row{display:flex;align-items:center;gap:10px;}
.color-input-row input[type="color"]{width:42px;height:32px;border:1px solid var(--line);border-radius:6px;padding:0;background:none;}
.admin-card .slide-thumb{width:90px;height:50px;object-fit:cover;border-radius:6px;}
.log-item{padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px;}
.log-item b{color:var(--heading);}
.log-item .log-time{color:var(--ink-soft);font-size:11px;}

/* ================================================================
   ADMIN — SIDEBAR DASHBOARD LAYOUT (added)
   ================================================================ */
.admin-layout{display:flex;min-height:100vh;background:var(--bg);}
.admin-sidebar{
  width:230px;flex:none;background:var(--card);border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;
  transition:background .3s ease,border-color .3s ease;
}
.admin-sidebar-brand{display:flex;align-items:center;gap:10px;padding:20px 18px;border-bottom:1px solid var(--line);}
.admin-sidebar-brand .mark{width:30px;height:30px;flex:none;border-radius:8px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));display:flex;align-items:center;justify-content:center;color:var(--gold-light);font-family:'Fraunces',serif;font-weight:700;font-size:15px;}
.admin-sidebar-brand b{font-family:'Fraunces',serif;font-size:16.5px;color:var(--heading);}
.admin-sidebar-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);font-weight:700;padding:16px 18px 6px;}
.admin-nav{display:flex;flex-direction:column;gap:2px;padding:0 10px;flex:1;}
.admin-nav-link{
  display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;border:none;background:none;
  font-size:13.5px;font-weight:600;color:var(--ink-soft);text-align:left;width:100%;transition:background .15s ease,color .15s ease;
}
.admin-nav-link svg{width:18px;height:18px;stroke:currentColor;flex:none;}
.admin-nav-link:hover{background:var(--bg-soft);color:var(--heading);}
.admin-nav-link.active{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--gold-light);box-shadow:0 4px 14px var(--gold-glow);}
.admin-sidebar-foot{padding:14px 18px;border-top:1px solid var(--line);}
.admin-main{flex:1;min-width:0;display:flex;flex-direction:column;}
.admin-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 26px;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;
}
.admin-topbar-greet{font-family:'Fraunces',serif;font-size:19px;color:var(--heading);}
.admin-topbar-actions{display:flex;align-items:center;gap:10px;}
.admin-content{padding:26px;max-width:1200px;width:100%;margin:0 auto;box-sizing:border-box;}
@media(max-width:900px){
  .admin-sidebar{width:70px;}
  .admin-sidebar-brand b,.admin-sidebar-label,.admin-nav-link span{display:none;}
  .admin-nav-link{justify-content:center;}
  .admin-topbar-greet{font-size:15px;}
}

/* ---------- ADMIN: PROFESSIONAL POLISH (added) ---------- */
.admin-nav-link{position:relative;}
.admin-nav-link.active{padding-left:14px;}
.admin-nav-link.active::before{
  content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);
  width:4px;height:20px;border-radius:0 4px 4px 0;background:var(--gold);
}
.admin-topbar{box-shadow:0 2px 10px rgba(20,16,8,.05);}
.admin-content{animation:adminFadeIn .25s ease;}
@keyframes adminFadeIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}
.stat-card{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .2s ease;}
.stat-card:hover{transform:translateY(-2px);}
table.data tbody tr{transition:background .12s ease;}
table.data tbody tr:hover{background:var(--bg-soft);}
.admin-card{transition:box-shadow .2s ease;}
.panel-head h3{font-size:19px;}
.icon-btn{transition:background .15s ease,transform .15s ease;}
.icon-btn:hover{transform:translateY(-1px);}

/* ---------- ADMIN: PRODUCT FORM PAGE (full page, opens in new tab) (added) ---------- */
.pf-loading,.pf-denied{min-height:100vh;display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:14px;}
.pf-denied .admin-login-box{margin:0;}
#pfRoot{min-height:100vh;background:var(--bg);}
.pf-topbar{
  position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 28px;background:var(--card);border-bottom:1px solid var(--line);box-shadow:0 2px 10px rgba(20,16,8,.05);
}
.pf-topbar-left{display:flex;align-items:center;gap:14px;}
.pf-back-btn{
  width:38px;height:38px;flex:none;border-radius:10px;border:1.5px solid var(--line);background:var(--bg-soft);
  display:flex;align-items:center;justify-content:center;color:var(--ink);font-size:18px;cursor:pointer;
  transition:background .15s ease,border-color .15s ease;
}
.pf-back-btn:hover{background:var(--gold);border-color:var(--gold);color:#1C1912;}
.pf-eyebrow{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft);font-weight:700;}
.pf-title{margin:2px 0 0;font-family:'Fraunces',serif;font-size:21px;color:var(--heading);}
.pf-topbar-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.pf-save-status{font-size:12.5px;color:var(--ink-soft);white-space:nowrap;}
.pf-save-status.err{color:var(--danger);font-weight:700;}
.pf-layout{display:grid;grid-template-columns:1fr 320px;gap:20px;padding:26px 28px 60px;max-width:1180px;margin:0 auto;box-sizing:border-box;}
.pf-main{display:flex;flex-direction:column;gap:18px;min-width:0;}
.pf-side{display:flex;flex-direction:column;gap:18px;}
.pf-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px;box-shadow:0 2px 12px rgba(20,16,8,.045);}
.pf-card h4{margin:0;font-family:'Fraunces',serif;font-size:16.5px;color:var(--heading);}
.pf-card-sub{font-size:12px;color:var(--ink-soft);margin:3px 0 16px;line-height:1.5;}
.pf-status-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);}
.pf-status-row:last-child{border-bottom:none;}
.pf-status-row span{font-size:13.5px;font-weight:600;color:var(--ink);}
.pf-status-row small{display:block;font-size:11px;font-weight:400;color:var(--ink-soft);margin-top:2px;}
.pf-preview-card{text-align:center;}
.pf-preview-img{width:100%;height:150px;object-fit:cover;border-radius:12px;background:var(--bg-soft);margin-bottom:12px;}
.pf-preview-name{font-weight:700;font-size:14px;color:var(--ink);margin-bottom:2px;}
.pf-preview-price{font-family:'Fraunces',serif;font-size:20px;color:var(--heading);}
@media(max-width:900px){
  .pf-layout{grid-template-columns:1fr;padding:18px;}
  .pf-topbar{padding:12px 16px;flex-wrap:wrap;}
}
@media(max-width:560px){
  .pf-topbar-actions{width:100%;justify-content:space-between;}
  .pf-topbar-actions .btn{flex:1;}
  .pf-save-status{order:-1;width:100%;text-align:right;}
  .pf-card{padding:18px 16px;}
}
@media(max-width:480px){
  .admin-content{padding:16px;}
  .admin-topbar{padding:12px 14px;}
  .admin-topbar-greet{font-size:14.5px;}
  .stat-grid{gap:10px;}
  .stat-card{padding:14px;}
  .modal{padding:18px;border-radius:14px;}
  .panel-head{gap:8px;}
  .panel-head h3{font-size:16.5px;}
}

/* dashboard stat cards w/ icon bubble */
.dash-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:20px;}
@media(max-width:980px){.dash-stats{grid-template-columns:repeat(2,1fr);}}
.dash-stat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:14px;transition:transform .2s ease,box-shadow .2s ease;}
.dash-stat:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,16,8,.12);}
.dash-stat-top{display:flex;align-items:flex-start;justify-content:space-between;}
.dash-stat-label{font-size:12.5px;color:var(--ink-soft);font-weight:600;}
.dash-stat-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;font-size:17px;}
.dash-stat-value{font-family:'Fraunces',serif;font-size:26px;color:var(--ink);}
.dash-stat-delta{font-size:11.5px;font-weight:700;}
.dash-stat-delta.up{color:var(--primary);}
.dash-stat-delta.down{color:var(--danger);}

.dash-2col{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;margin-bottom:20px;align-items:stretch;}
@media(max-width:980px){.dash-2col{grid-template-columns:1fr;}}
.dash-panel{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;}
.dash-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.dash-panel-head h4{margin:0;color:var(--heading);font-family:'Fraunces',serif;font-size:16px;}
.mini-stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;}
@media(max-width:640px){.mini-stat-row{grid-template-columns:1fr;}}
.mini-stat-box{border-radius:12px;padding:12px 14px;}
.mini-stat-box.solid{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--gold-light);}
.mini-stat-box.outline{background:var(--bg-soft);border:1px solid var(--line);}
.mini-stat-box .msb-label{font-size:11px;opacity:.85;}
.mini-stat-box .msb-value{font-family:'Fraunces',serif;font-size:19px;margin-top:4px;}
.mini-stat-box .msb-delta{font-size:10.5px;margin-top:4px;font-weight:700;}

.chart-svg-wrap{position:relative;width:100%;}
.chart-svg-wrap svg{width:100%;height:auto;display:block;}

.donut-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;}
.donut{width:170px;height:170px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center;}
.donut::before{content:"";position:absolute;inset:22px;background:var(--card);border-radius:50%;}
.donut-legend{display:flex;flex-direction:column;gap:8px;width:100%;}
.donut-legend-row{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:var(--ink-soft);}
.donut-legend-row .dot{width:9px;height:9px;border-radius:50%;flex:none;margin-right:8px;}
.donut-legend-name{display:flex;align-items:center;font-weight:600;color:var(--ink);}

.top-products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:14px;}
.top-product-card{background:var(--bg-soft);border-radius:12px;overflow:hidden;border:1px solid var(--line);}
.top-product-card img{width:100%;aspect-ratio:1/1;object-fit:cover;}
.top-product-card .tp-body{padding:9px 10px;}
.top-product-card .tp-name{font-size:12.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.top-product-card .tp-price{font-size:12px;color:var(--clay);font-weight:700;}
.top-product-card .tp-sales{font-size:10.5px;color:var(--ink-soft);}

/* ================================================================
   WHATSAPP FLOATING BUTTON (added)
   ================================================================ */
.whatsapp-float{
  position:fixed;right:22px;bottom:24px;z-index:90;width:58px;height:58px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.28);
  text-decoration:none;animation:waFloatIn .5s ease, waPulse 2.6s ease-in-out 1.2s infinite;
}
.whatsapp-float svg{width:30px;height:30px;fill:#fff;}
.whatsapp-float:hover{animation:none;transform:scale(1.08);}
@keyframes waFloatIn{from{opacity:0;transform:translateY(30px) scale(.6);}to{opacity:1;transform:translateY(0) scale(1);}}
@keyframes waPulse{0%,100%{box-shadow:0 8px 22px rgba(0,0,0,.28),0 0 0 0 rgba(37,211,102,.5);}50%{box-shadow:0 8px 22px rgba(0,0,0,.28),0 0 0 10px rgba(37,211,102,0);}}
@media(max-width:700px){.whatsapp-float{bottom:92px;right:16px;width:52px;height:52px;}.whatsapp-float svg{width:26px;height:26px;}}

/* ================================================================
   HOMEPAGE COVER / INTRO SCREEN (added)
   ================================================================ */
.cover-overlay{
  position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;
  background:#0A0B09;overflow:hidden;
}
.cover-overlay.hidden{display:none;}
.cover-overlay.closing{animation:coverFadeOut .6s ease forwards;}
.cover-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.55);}
.cover-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,11,9,.35),rgba(10,11,9,.85));}
.cover-inner{position:relative;z-index:2;text-align:center;color:#fff;max-width:560px;padding:0 24px;}
.cover-inner .eyebrow{color:var(--gold-light,#F0D98C);}
.cover-inner h2{font-family:'Fraunces',serif;font-size:clamp(28px,5vw,46px);margin:14px 0 12px;color:#fff;}
.cover-inner p{color:#E5DFC8;line-height:1.6;margin-bottom:24px;}
.cover-overlay.anim-fade .cover-inner{animation:coverFadeUp .9s ease both;}
.cover-overlay.anim-fade .cover-bg{animation:coverFadeInBg 1.1s ease both;}
.cover-overlay.anim-zoom .cover-bg{animation:coverZoomIn 1.4s ease both;}
.cover-overlay.anim-zoom .cover-inner{animation:coverFadeUp 1s ease .2s both;}
.cover-overlay.anim-slideup .cover-inner{animation:coverSlideUp .8s cubic-bezier(.2,.8,.2,1) both;}
.cover-overlay.anim-slideup .cover-bg{animation:coverFadeInBg 1s ease both;}
@keyframes coverFadeInBg{from{opacity:0;}to{opacity:1;}}
@keyframes coverFadeUp{from{opacity:0;transform:translateY(26px);}to{opacity:1;transform:translateY(0);}}
@keyframes coverSlideUp{from{opacity:0;transform:translateY(70px);}to{opacity:1;transform:translateY(0);}}
@keyframes coverZoomIn{from{transform:scale(1.15);opacity:0;}to{transform:scale(1);opacity:1;}}
@keyframes coverFadeOut{from{opacity:1;}to{opacity:0;visibility:hidden;}}

/* ================================================================
   SCROLL-REVEAL HOMEPAGE ANIMATIONS (added)
   ================================================================ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1;transform:translateY(0);}
.reveal-stagger.in-view{transition-delay:calc(var(--ri,0) * 70ms);}
.hero-slide.active img{animation:kenBurns 9s ease-in-out infinite alternate;}
@keyframes kenBurns{from{transform:scale(1);}to{transform:scale(1.09);}}
.hero .eyebrow{display:inline-block;animation:coverFadeUp .7s ease both;}
.hero h1{animation:coverFadeUp .8s ease .08s both;}
.hero p.lead{animation:coverFadeUp .8s ease .16s both;}
.hero-ctas{animation:coverFadeUp .8s ease .24s both;}
.hero-art{animation:coverFadeUp .9s ease .2s both;}
@keyframes cardEnter{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}
.grid .card{animation:cardEnter .5s ease both;}
.grid .card:nth-child(1){animation-delay:.02s;} .grid .card:nth-child(2){animation-delay:.06s;}
.grid .card:nth-child(3){animation-delay:.10s;} .grid .card:nth-child(4){animation-delay:.14s;}
.grid .card:nth-child(5){animation-delay:.18s;} .grid .card:nth-child(6){animation-delay:.22s;}
.grid .card:nth-child(7){animation-delay:.26s;} .grid .card:nth-child(8){animation-delay:.30s;}
.grid .card:nth-child(n+9){animation-delay:.32s;}

/* ================================================================
   HOMEPAGE — EXTRA "BEAUTIFUL ANIMATION" LAYER (added)
   ================================================================ */

/* -- floating ambient blobs + drifting leaf particles inside the hero -- */
.showcase-orb{
  position:absolute;border-radius:50%;filter:blur(46px);pointer-events:none;z-index:0;
  animation:orbDrift 14s ease-in-out infinite;
}
.showcase-orb.o1{width:260px;height:260px;left:-60px;top:-60px;background:rgba(143,212,107,.32);}
.showcase-orb.o2{width:320px;height:320px;right:-90px;bottom:-100px;background:var(--gold-glow);animation-duration:18s;animation-delay:-4s;}
@keyframes orbDrift{
  0%,100%{transform:translate(0,0) scale(1);}
  33%{transform:translate(26px,-18px) scale(1.08);}
  66%{transform:translate(-18px,20px) scale(.95);}
}
.showcase-leaves{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;}
.showcase-leaf{position:absolute;opacity:0;animation:leafDrift linear infinite;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35));}
.showcase-leaf svg{width:100%;height:100%;display:block;}
@keyframes leafDrift{
  0%{transform:translateY(8%) translateX(0) rotate(0deg);opacity:0;}
  8%{opacity:.85;}
  50%{transform:translateY(-55%) translateX(18px) rotate(160deg);}
  92%{opacity:.7;}
  100%{transform:translateY(-118%) translateX(-10px) rotate(300deg);opacity:0;}
}

/* -- hero center product: gentle float + soft pulsing halo -- */
.showcase-center{animation:centerFloat 5.5s ease-in-out infinite;}
.showcase-center::after{
  content:"";position:absolute;inset:-18px;border-radius:inherit;z-index:-1;
  background:radial-gradient(circle,rgba(143,212,107,.35),transparent 70%);
  animation:haloPulse 3.4s ease-in-out infinite;
}
@keyframes centerFloat{0%,100%{transform:translate(-50%,-50%) translateY(0);}50%{transform:translate(-50%,-50%) translateY(-14px);}}
@keyframes haloPulse{0%,100%{opacity:.5;transform:scale(1);}50%{opacity:.95;transform:scale(1.1);}}

/* -- eyebrow shimmer sweep -- */
.showcase-eyebrow{position:relative;overflow:hidden;}
.showcase-eyebrow::after{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);
  animation:eyebrowShine 3.2s ease-in-out infinite;
}
@keyframes eyebrowShine{0%{left:-60%;}55%,100%{left:130%;}}

/* -- entrance choreography for the showcase panel itself -- */
.hero-showcase{animation:showcaseIn .9s cubic-bezier(.2,.8,.2,1) both;}
@keyframes showcaseIn{from{opacity:0;transform:translateY(24px) scale(.985);}to{opacity:1;transform:translateY(0) scale(1);}}

/* -- richer section reveal: fade + rise + slight scale -- */
.reveal{opacity:0;transform:translateY(28px) scale(.98);filter:blur(3px);transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1), filter .7s ease;}
.reveal.in-view{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}

/* -- product card hover: lift, tilt, image zoom, shine sweep -- */
.card{transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;}
.card:hover{transform:translateY(-8px) scale(1.015);}
.card-img-wrap{position:relative;}
.card-img-wrap img{transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.card:hover .card-img-wrap img{transform:scale(1.09) rotate(.4deg);}
.card-img-wrap::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.35) 50%,transparent 80%);
  transform:translateX(-120%);
}
.card:hover .card-img-wrap::before{transition:transform .75s ease;transform:translateX(120%);}

/* -- section eyebrow underline draw-in when revealed -- */
.section-head .eyebrow{position:relative;}
.section-head .eyebrow::after{
  content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--gold);
  transition:width .6s ease .15s;
}
.section-head.in-view .eyebrow::after{width:100%;}

/* -- gentle marquee item entrance -- */
.marquee-item{animation:cardEnter .5s ease both;}

@media (prefers-reduced-motion: reduce){
  .showcase-orb,.showcase-leaf,.showcase-center,.showcase-center::after,.showcase-eyebrow::after,
  .hero-showcase,.card,.card-img-wrap img,.reveal,.marquee-item{
    animation:none !important;transition:none !important;
  }
  .reveal{opacity:1;transform:none;filter:none;}
}
@media(max-width:860px){
  .showcase-orb{display:none;}
}

/* ================================================================
   HARD OVERRIDE — mobile product-showcase centering.
   Appended last on purpose so it wins the cascade no matter what
   else exists earlier in this file. If the photo still isn't
   centered after this, something outside style.css (inline style,
   a second stylesheet, or a cached copy) is the cause.
   ================================================================ */
@media(max-width:860px){
  #heroShowcaseGrid{display:flex !important;flex-direction:column !important;align-items:center !important;}
  #heroShowcaseGrid .showcase-center{
    position:static !important;
    left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;
    transform:none;
    width:min(72%,300px) !important;
    max-width:100% !important;
    margin:0 auto 22px !important;
    order:4 !important;
    align-self:center !important;
    animation:showcaseImgIn .7s ease .22s both, centerFloatMobile 5.5s ease-in-out .9s infinite;
  }
  #heroShowcaseGrid .showcase-center::after{animation:haloPulse 3.4s ease-in-out infinite;}
}

/* ================================================================
   THEMES — storefront preset system
   Applied via [data-theme="..."] on <html>, set from Admin → Themes.
   Each theme is a self-contained palette + effects + header/footer/
   layout treatment. "classic" (no attribute, or data-theme="classic")
   is the original Onganic look above and needs no overrides here.
   ================================================================ */

/* ---------------------------------------------------------------
   THEME: GLASS — "Midnight Glass"
   Deep navy/violet, frosted glassmorphism + glossy transparent
   surfaces, glossy sheen on buttons, blurred glass header/footer.
   --------------------------------------------------------------- */
html[data-theme="glass"]{
  --bg:#0B1020; --bg-soft:#121936; --card:rgba(255,255,255,0.055);
  --ink:#EAF0FF; --ink-soft:#94A0C7; --heading:#F2F6FF;
  --primary:#4F8CFF; --primary-dark:#2451C7; --accent-leaf:#42E8C4;
  --clay:#B98CFF; --clay-dark:#8A5CE0; --gold:#7CF5D6; --gold-light:#B7FFEA;
  --gold-glow:rgba(124,245,214,0.45); --line:rgba(255,255,255,0.14);
  --white:#161D3B; --danger:#FF6B8B; --radius:22px;
  --shadow:0 20px 60px rgba(0,0,0,0.45);
  --header-bg:rgba(11,16,32,0.55); --grain-dot:rgba(124,245,214,0.05);
}
html[data-theme="glass"] body{background-image:
    radial-gradient(900px 500px at 12% -6%, rgba(79,140,255,.22), transparent 60%),
    radial-gradient(900px 560px at 100% 10%, rgba(124,245,214,.16), transparent 55%),
    radial-gradient(circle at 1px 1px, var(--grain-dot) 1px, transparent 0);
  background-size:auto,auto,22px 22px;background-attachment:fixed;
}
html[data-theme="glass"] header{
  background:var(--header-bg);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);
  border-bottom:1px solid rgba(255,255,255,0.10);box-shadow:0 1px 0 rgba(255,255,255,0.06), 0 12px 30px rgba(0,0,0,0.25);
}
html[data-theme="glass"] .icon-btn{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);backdrop-filter:blur(8px);}
html[data-theme="glass"] .card,
html[data-theme="glass"] .modal,
html[data-theme="glass"] .drawer,
html[data-theme="glass"] .order-summary,
html[data-theme="glass"] .addr-card,html[data-theme="glass"] .order-card,
html[data-theme="glass"] .bank-details-card{
  background:rgba(255,255,255,0.055) !important;backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);
  border:1px solid rgba(255,255,255,0.14);
}
html[data-theme="glass"] .card{box-shadow:0 10px 40px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.10);}
html[data-theme="glass"] .card:hover{border-color:rgba(124,245,214,0.55);box-shadow:0 18px 50px rgba(0,0,0,0.45), 0 0 30px rgba(124,245,214,0.28), inset 0 1px 0 rgba(255,255,255,0.14);}
html[data-theme="glass"] .card-img-wrap{background:rgba(255,255,255,0.04);}
/* glossy transparent + glossy sheen buttons */
html[data-theme="glass"] .btn{border:1px solid rgba(255,255,255,0.24);backdrop-filter:blur(6px);}
html[data-theme="glass"] .btn-primary{
  background:linear-gradient(180deg, rgba(255,255,255,0.22), rgba(79,140,255,0.35) 45%, rgba(36,81,199,0.55));
  color:#F2FBFF;box-shadow:0 8px 26px rgba(36,81,199,0.4), inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -12px 20px rgba(0,0,0,0.18);
}
html[data-theme="glass"] .btn-primary:hover{box-shadow:0 10px 32px rgba(66,232,196,0.35), inset 0 1px 0 rgba(255,255,255,0.6), inset 0 -12px 20px rgba(0,0,0,0.18);}
html[data-theme="glass"] .btn-gold{
  background:linear-gradient(180deg, rgba(255,255,255,0.55), rgba(124,245,214,0.55) 45%, rgba(66,232,196,0.65));
  color:#062A22;box-shadow:0 8px 24px rgba(66,232,196,0.35), inset 0 1px 0 rgba(255,255,255,0.7);
}
html[data-theme="glass"] .btn-outline{background:rgba(255,255,255,0.06);border-color:rgba(124,245,214,0.6);backdrop-filter:blur(6px);}
html[data-theme="glass"] .add-btn,html[data-theme="glass"] .qty-stepper{
  background:linear-gradient(180deg, rgba(255,255,255,0.25), rgba(79,140,255,0.45));
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.5), 0 0 0 1px rgba(255,255,255,0.18);
}
html[data-theme="glass"] .chip{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.14);backdrop-filter:blur(6px);}
html[data-theme="glass"] .chip.active{background:linear-gradient(180deg, rgba(255,255,255,0.25), rgba(79,140,255,0.5));border-color:rgba(124,245,214,0.6);}
html[data-theme="glass"] .hero-showcase{
  background:radial-gradient(1200px 700px at 50% 20%, rgba(79,140,255,.28), #0B1020 72%);
  border:1px solid rgba(255,255,255,0.12);box-shadow:0 30px 80px rgba(0,0,0,0.5);
}
html[data-theme="glass"] .showcase-center{box-shadow:0 40px 90px rgba(0,0,0,.55), 0 0 80px rgba(66,232,196,.4);border-radius:32px;}
html[data-theme="glass"] .section-head h2,html[data-theme="glass"] h1,html[data-theme="glass"] h2,html[data-theme="glass"] h3{letter-spacing:.01em;}
html[data-theme="glass"] .eyebrow{color:var(--accent-leaf);}
html[data-theme="glass"] .field input,html[data-theme="glass"] .field select,html[data-theme="glass"] .field textarea{
  background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.16);color:var(--ink);backdrop-filter:blur(6px);
}
html[data-theme="glass"] footer{
  background:linear-gradient(180deg, rgba(18,25,54,0.6), rgba(11,16,32,0.92));backdrop-filter:blur(20px);
  border-top:1px solid rgba(255,255,255,0.10);border-radius:28px 28px 0 0;color:#D7DEFF;
}
html[data-theme="glass"] footer h4,html[data-theme="glass"] footer h5{color:#fff;}
html[data-theme="glass"] .promo-banner,html[data-theme="glass"] .announce-bar{
  background:linear-gradient(90deg, rgba(79,140,255,0.28), rgba(124,245,214,0.28));backdrop-filter:blur(10px);
}
/* --- GLASS layout: stacked two-tier header (centered logo on top, nav in its
   own row below), a staggered 3-column "floating panes" product grid, and an
   asymmetric 3-column footer — distinct structure, not just re-colored. --- */
html[data-theme="glass"] .header-inner{
  display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"burger brand actions" "nav nav nav";
  row-gap:10px;padding-bottom:12px;
}
html[data-theme="glass"] .hamburger-btn{grid-area:burger;}
html[data-theme="glass"] .brand{grid-area:brand;justify-self:center;}
html[data-theme="glass"] .header-actions{grid-area:actions;justify-self:end;}
html[data-theme="glass"] nav.main-nav{grid-area:nav;justify-content:center;gap:26px;}
@media(max-width:820px){ html[data-theme="glass"] .header-inner{grid-template-areas:"burger brand actions";} }
html[data-theme="glass"] .grid{grid-template-columns:repeat(3,1fr);gap:26px;}
html[data-theme="glass"] .grid .card:nth-child(3n+2){transform:translateY(16px);}
@media(max-width:900px){ html[data-theme="glass"] .grid .card:nth-child(3n+2){transform:none;} }
html[data-theme="glass"] .foot-cols{grid-template-columns:1.6fr 1fr 1fr;}
html[data-theme="glass"] .section-head{flex-direction:column;align-items:flex-start;gap:6px;}
html[data-theme="glass"] #view-shop .shop-sidebar{display:block;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:20px;padding:16px;backdrop-filter:blur(14px);margin-bottom:16px;}
html[data-theme="glass"] #view-shop .shop-sidebar-label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-leaf);margin-bottom:10px;}

/* ---------------------------------------------------------------
   THEME: SUNSET — "Sunset Glow"
   Warm coral/pink/gold gradients, glossy pill buttons, generous
   rounded shapes, gradient header & footer.
   --------------------------------------------------------------- */
html[data-theme="sunset"]{
  --bg:#FFF3E9; --bg-soft:#FFE3D0; --card:#FFFBF7;
  --ink:#3A1F1A; --ink-soft:#8A6459; --heading:#7A2A3A;
  --primary:#FF5D73; --primary-dark:#C7304C; --accent-leaf:#FF8A3D;
  --clay:#FFB23D; --clay-dark:#E8901E; --gold:#FF3D81; --gold-light:#FFD1A6;
  --gold-glow:rgba(255,93,115,0.4); --line:#FFD9C2; --white:#FFFFFF;
  --danger:#C7304C; --radius:26px;
  --shadow:0 18px 46px rgba(199,48,76,0.16);
  --header-bg:linear-gradient(120deg, rgba(255,141,113,0.92), rgba(255,61,129,0.9));
  --grain-dot:rgba(255,93,115,0.05);
}
html[data-theme="sunset"] body{background-image:
    radial-gradient(700px 420px at 8% 0%, rgba(255,178,61,.28), transparent 60%),
    radial-gradient(700px 420px at 100% 0%, rgba(255,61,129,.18), transparent 55%),
    radial-gradient(circle at 1px 1px, var(--grain-dot) 1px, transparent 0);
  background-size:auto,auto,22px 22px;
}
html[data-theme="sunset"] header{
  background:var(--header-bg);backdrop-filter:none;border-bottom:none;
  box-shadow:0 10px 30px rgba(199,48,76,0.25);
}
html[data-theme="sunset"] .brand-name,html[data-theme="sunset"] .brand-tag,
html[data-theme="sunset"] nav.main-nav button.navlink{color:#fff;}
html[data-theme="sunset"] nav.main-nav button.navlink.active,html[data-theme="sunset"] nav.main-nav button.navlink:hover{color:#FFE8D6;border-color:#FFE8D6;}
html[data-theme="sunset"] .icon-btn{background:rgba(255,255,255,0.18);border:1px solid rgba(255,255,255,0.4);}
html[data-theme="sunset"] .icon-btn svg{stroke:#fff;}
html[data-theme="sunset"] .card{border-radius:28px;border:none;box-shadow:0 14px 30px rgba(199,48,76,0.10);}
html[data-theme="sunset"] .card:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 22px 44px rgba(199,48,76,0.22);border-color:transparent;}
html[data-theme="sunset"] .card-img-wrap{border-radius:28px 28px 0 0;}
/* glossy gradient pill buttons */
html[data-theme="sunset"] .btn{border-radius:999px;}
html[data-theme="sunset"] .btn-primary{
  background:linear-gradient(180deg, rgba(255,255,255,0.35), transparent 50%), linear-gradient(120deg, #FF8A3D, #FF3D81);
  color:#fff;box-shadow:0 10px 26px rgba(255,61,129,0.4), inset 0 1px 0 rgba(255,255,255,0.6);
}
html[data-theme="sunset"] .btn-primary:hover{filter:brightness(1.05);box-shadow:0 14px 34px rgba(255,61,129,0.5), inset 0 1px 0 rgba(255,255,255,0.7);}
html[data-theme="sunset"] .btn-gold{
  background:linear-gradient(180deg, rgba(255,255,255,0.4), transparent 50%), linear-gradient(120deg, #FFB23D, #FF5D73);
  color:#5A1424;box-shadow:0 10px 24px rgba(255,178,61,0.4), inset 0 1px 0 rgba(255,255,255,0.6);
}
html[data-theme="sunset"] .btn-outline{border-color:#FF5D73;color:#C7304C;}
html[data-theme="sunset"] .btn-outline:hover{background:#FF5D73;color:#fff;}
html[data-theme="sunset"] .add-btn{background:linear-gradient(180deg, rgba(255,255,255,0.4), transparent 50%), linear-gradient(120deg, #FF8A3D, #FF3D81);}
html[data-theme="sunset"] .qty-stepper{background:linear-gradient(120deg, #FF8A3D, #FF3D81);}
html[data-theme="sunset"] .chip.active{background:linear-gradient(120deg, #FF8A3D, #FF3D81);border-color:transparent;}
html[data-theme="sunset"] .eyebrow{color:#FF5D73;}
html[data-theme="sunset"] .hero-showcase{
  background:radial-gradient(1200px 700px at 50% 25%, rgba(255,141,113,.5), #7A2A3A 78%);border-radius:40px;
}
html[data-theme="sunset"] .showcase-center{border-radius:50% 50% 40px 40px;box-shadow:0 40px 90px rgba(122,42,58,.5), 0 0 70px rgba(255,141,113,.4);}
html[data-theme="sunset"] footer{
  background:linear-gradient(120deg, #C7304C, #FF5D73 55%, #FF8A3D);color:#FFEFE6;
  border-radius:44px 44px 0 0;margin-top:60px;
}
html[data-theme="sunset"] footer h4,html[data-theme="sunset"] footer h5{color:#fff;}
html[data-theme="sunset"] footer p, html[data-theme="sunset"] .footlink{color:#FFE1D2;}
/* --- SUNSET layout: nav lifted into its own floating rounded pill sitting
   below the header, wide-gapped 3-column grid with bigger cards, and
   centered section headings — a softer, more editorial arrangement. --- */
html[data-theme="sunset"] .header-inner{padding-bottom:0;}
html[data-theme="sunset"] nav.main-nav{
  background:rgba(255,255,255,0.16);border:1px solid rgba(255,255,255,0.35);
  border-radius:999px;padding:8px 22px;backdrop-filter:blur(6px);
}
html[data-theme="sunset"] .grid{grid-template-columns:repeat(3,1fr);gap:30px;}
html[data-theme="sunset"] .section-head{flex-direction:column;text-align:center;align-items:center;gap:8px;}
html[data-theme="sunset"] .section-head .btn-ghost{margin-top:4px;}
html[data-theme="sunset"] #view-shop .shop-sidebar{display:flex;justify-content:center;background:#fff;border-radius:24px;padding:14px 18px;margin-bottom:14px;box-shadow:0 14px 30px rgba(199,48,76,0.10);}
html[data-theme="sunset"] #view-shop .chips{justify-content:center;}

/* ---------------------------------------------------------------
   THEME: MONO — "Mono Minimal"
   Flat black/white, zero radius, no shadows, thin hairline borders,
   wide-tracked uppercase type. The deliberate opposite of the other
   themes — no glow, no gradient, no blur.
   --------------------------------------------------------------- */
html[data-theme="mono"]{
  --bg:#FFFFFF; --bg-soft:#F2F2F0; --card:#FFFFFF;
  --ink:#111111; --ink-soft:#6B6B6B; --heading:#000000;
  --primary:#111111; --primary-dark:#000000; --accent-leaf:#111111;
  --clay:#111111; --clay-dark:#000000; --gold:#111111; --gold-light:#FFFFFF;
  --gold-glow:rgba(0,0,0,0); --line:#D8D8D5; --white:#FFFFFF;
  --danger:#B4271F; --radius:0px; --shadow:none;
  --header-bg:#FFFFFF; --grain-dot:rgba(0,0,0,0);
}
html[data-theme="mono"] body{background-image:none;}
html[data-theme="mono"] .glow-blob{display:none;}
html[data-theme="mono"] header{backdrop-filter:none;border-bottom:2px solid #111;box-shadow:none;}
html[data-theme="mono"] nav.main-nav button.navlink{text-transform:uppercase;letter-spacing:.14em;font-size:12.5px;font-weight:700;}
html[data-theme="mono"] nav.main-nav button.navlink.active,html[data-theme="mono"] nav.main-nav button.navlink:hover{color:#000;border-color:#000;}
html[data-theme="mono"] .icon-btn{background:#fff;border:1.5px solid #111;border-radius:0;}
html[data-theme="mono"] .brand-name{letter-spacing:.02em;}
html[data-theme="mono"] .card{border:1.5px solid #111;border-radius:0;box-shadow:none;transition:background .2s ease;}
html[data-theme="mono"] .card:hover{transform:none;box-shadow:none;border-color:#111;background:#F7F7F5;}
html[data-theme="mono"] .card-img-wrap{border-radius:0;background:#F2F2F0;}
html[data-theme="mono"] .card-cat{color:#6B6B6B;}
html[data-theme="mono"] .card-name{font-family:'Work Sans',sans-serif;text-transform:uppercase;letter-spacing:.03em;font-size:14px;}
html[data-theme="mono"] .btn{border-radius:0;letter-spacing:.1em;text-transform:uppercase;font-size:12.5px;}
html[data-theme="mono"] .btn::after{display:none;}
html[data-theme="mono"] .btn-primary{background:#111;color:#fff;box-shadow:none;}
html[data-theme="mono"] .btn-primary:hover{background:#000;box-shadow:none;}
html[data-theme="mono"] .btn-gold{background:#fff;color:#111;border:1.5px solid #111;box-shadow:none;}
html[data-theme="mono"] .btn-gold:hover{background:#111;color:#fff;filter:none;}
html[data-theme="mono"] .btn-outline{border:1.5px solid #111;color:#111;border-radius:0;}
html[data-theme="mono"] .btn-outline:hover{background:#111;color:#fff;box-shadow:none;}
html[data-theme="mono"] .add-btn{background:#111;border-radius:0;box-shadow:none;}
html[data-theme="mono"] .qty-stepper{background:#111;border-radius:0;box-shadow:none;}
html[data-theme="mono"] .chip{border-radius:0;border:1.5px solid #111;background:#fff;text-transform:uppercase;letter-spacing:.06em;font-size:11.5px;}
html[data-theme="mono"] .chip.active{background:#111;color:#fff;box-shadow:none;}
html[data-theme="mono"] .eyebrow{color:#111;}
html[data-theme="mono"] .section-head h2{text-transform:uppercase;letter-spacing:.03em;font-family:'Work Sans',sans-serif;}
html[data-theme="mono"] .hero-showcase{background:#111;border-radius:0;}
html[data-theme="mono"] .showcase-title .hl{color:#fff;filter:none;}
html[data-theme="mono"] .showcase-center{border-radius:0;box-shadow:none;border:2px solid #fff;}
html[data-theme="mono"] .field input,html[data-theme="mono"] .field select,html[data-theme="mono"] .field textarea{border-radius:0;border:1.5px solid #111;}
html[data-theme="mono"] footer{background:#111;color:#fff;border-radius:0;padding:32px 0 20px;}
html[data-theme="mono"] footer h4,html[data-theme="mono"] footer h5{text-transform:uppercase;letter-spacing:.08em;font-size:13px;color:#fff;}
html[data-theme="mono"] footer p,html[data-theme="mono"] .footlink{color:#B8B8B8;}
html[data-theme="mono"] .foot-copyright{border-top:1px solid #333;}
/* --- MONO layout: the deliberate structural opposite of the others — an
   editorial left filter sidebar (instead of top chips), single-column
   horizontal list cards (instead of a grid of tiles), nav pushed to the
   right edge next to the icons, and a single stacked footer column. --- */
html[data-theme="mono"] .header-inner{justify-content:flex-start;}
html[data-theme="mono"] .brand{margin-right:auto;}
html[data-theme="mono"] nav.main-nav{margin-right:24px;}
html[data-theme="mono"] .section-head{border-bottom:2px solid #111;padding-bottom:14px;align-items:flex-end;}
html[data-theme="mono"] #view-shop .shop-layout{display:grid;grid-template-columns:220px 1fr;gap:36px;align-items:start;}
html[data-theme="mono"] #view-shop .shop-sidebar{
  display:block;grid-column:1;position:sticky;top:90px;border-right:2px solid #111;padding-right:18px;
}
html[data-theme="mono"] #view-shop .shop-sidebar-label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:700;margin-bottom:14px;}
html[data-theme="mono"] #view-shop .chips{flex-direction:column;align-items:stretch;gap:0;}
html[data-theme="mono"] #view-shop .chip{border:none;border-radius:0;border-bottom:1px solid #E2E2DE;padding:10px 0;background:none;text-align:left;justify-content:flex-start;}
html[data-theme="mono"] #view-shop .chip.active{background:none;color:#111;font-weight:700;}
html[data-theme="mono"] .grid{grid-template-columns:1fr;gap:0;}
html[data-theme="mono"] .grid .card{
  display:grid;grid-template-columns:220px 1fr;grid-template-rows:auto;align-items:stretch;
  border-left:none;border-right:none;border-top:none;border-bottom:1.5px solid #111;border-radius:0;
}
html[data-theme="mono"] .grid .card:first-child{border-top:1.5px solid #111;}
html[data-theme="mono"] .grid .card-img-wrap{aspect-ratio:auto;height:100%;}
html[data-theme="mono"] .grid .card-body{padding:18px 4px 18px 22px;}
html[data-theme="mono"] .grid .wish-heart{top:14px;right:auto;left:196px;}
@media(max-width:700px){
  html[data-theme="mono"] #view-shop .shop-layout{grid-template-columns:1fr;}
  html[data-theme="mono"] #view-shop .shop-sidebar{position:static;border-right:none;border-bottom:2px solid #111;padding:0 0 16px;}
  html[data-theme="mono"] .grid .card{grid-template-columns:120px 1fr;}
  html[data-theme="mono"] .grid .wish-heart{left:96px;}
}
html[data-theme="mono"] .foot-cols{grid-template-columns:1fr;max-width:520px;}
html[data-theme="mono"] .foot-cols>div{border-bottom:1px solid #333;padding-bottom:18px;margin-bottom:4px;}
html[data-theme="mono"] .foot-cols>div:last-child{border-bottom:none;}

/* ---------------------------------------------------------------
   THEME: NEON — "Neon Nights"
   Near-black background, neon green/magenta/cyan, glowing edges,
   dark grid layout, glow-underline nav — a night-market/cyber look.
   --------------------------------------------------------------- */
html[data-theme="neon"]{
  --bg:#07070C; --bg-soft:#0F0F18; --card:#101019;
  --ink:#EAF7EE; --ink-soft:#8C93A6; --heading:#39FF9E;
  --primary:#39FF9E; --primary-dark:#0FBE6E; --accent-leaf:#00E5FF;
  --clay:#FF2ECC; --clay-dark:#C400A0; --gold:#FF2ECC; --gold-light:#FF8AE8;
  --gold-glow:rgba(57,255,158,0.55); --line:#1E2130; --white:#101019;
  --danger:#FF4D6D; --radius:10px; --shadow:0 0 30px rgba(57,255,158,0.12);
  --header-bg:rgba(7,7,12,0.9); --grain-dot:rgba(57,255,158,0.04);
}
html[data-theme="neon"] body{background-image:
    radial-gradient(circle at 1px 1px, var(--grain-dot) 1px, transparent 0),
    linear-gradient(180deg, #07070C, #0A0A14 60%, #07070C);
  background-size:22px 22px, auto;
}
html[data-theme="neon"] header{border-bottom:1px solid rgba(57,255,158,0.35);box-shadow:0 1px 0 rgba(57,255,158,0.35), 0 8px 24px rgba(57,255,158,0.08);}
html[data-theme="neon"] .brand-name{color:var(--heading);text-shadow:0 0 12px rgba(57,255,158,0.6);}
html[data-theme="neon"] nav.main-nav button.navlink{color:#8C93A6;}
html[data-theme="neon"] nav.main-nav button.navlink.active,html[data-theme="neon"] nav.main-nav button.navlink:hover{color:#39FF9E;border-color:#39FF9E;text-shadow:0 0 8px rgba(57,255,158,0.7);}
html[data-theme="neon"] .icon-btn{background:#101019;border:1px solid rgba(57,255,158,0.35);}
html[data-theme="neon"] .icon-btn svg{stroke:#39FF9E;}
html[data-theme="neon"] .cart-badge{background:#FF2ECC;box-shadow:0 0 10px rgba(255,46,204,0.7);}
html[data-theme="neon"] .card{border:1px solid rgba(57,255,158,0.2);box-shadow:none;}
html[data-theme="neon"] .card:hover{border-color:#39FF9E;box-shadow:0 0 0 1px rgba(57,255,158,0.4), 0 0 30px rgba(57,255,158,0.35);transform:translateY(-4px);}
html[data-theme="neon"] .card-img-wrap{background:#0F0F18;}
html[data-theme="neon"] .card-name{color:#EAF7EE;}
html[data-theme="neon"] .card-cat{color:#00E5FF;}
html[data-theme="neon"] .price{color:#39FF9E;}
html[data-theme="neon"] .btn-primary{background:#0B1F16;color:#39FF9E;box-shadow:0 0 0 1px rgba(57,255,158,0.6) inset, 0 0 22px rgba(57,255,158,0.35);}
html[data-theme="neon"] .btn-primary:hover{box-shadow:0 0 0 1px rgba(57,255,158,0.9) inset, 0 0 34px rgba(57,255,158,0.55);}
html[data-theme="neon"] .btn-gold{background:#1F0B1B;color:#FF2ECC;box-shadow:0 0 0 1px rgba(255,46,204,0.6) inset, 0 0 22px rgba(255,46,204,0.35);}
html[data-theme="neon"] .btn-gold:hover{box-shadow:0 0 0 1px rgba(255,46,204,0.9) inset, 0 0 32px rgba(255,46,204,0.5);filter:none;}
html[data-theme="neon"] .btn-outline{border-color:#00E5FF;color:#00E5FF;}
html[data-theme="neon"] .btn-outline:hover{background:#00E5FF;color:#07070C;box-shadow:0 0 20px rgba(0,229,255,0.6);}
html[data-theme="neon"] .add-btn{background:#0B1F16;color:#39FF9E;box-shadow:0 0 0 1px rgba(57,255,158,0.6) inset, 0 0 16px rgba(57,255,158,0.4);}
html[data-theme="neon"] .qty-stepper{background:#0B1F16;box-shadow:0 0 0 1px rgba(57,255,158,0.5) inset;}
html[data-theme="neon"] .chip{background:#101019;border:1px solid rgba(57,255,158,0.25);color:#8C93A6;}
html[data-theme="neon"] .chip.active{background:#0B1F16;border-color:#39FF9E;color:#39FF9E;box-shadow:0 0 14px rgba(57,255,158,0.4);}
html[data-theme="neon"] .eyebrow{color:#00E5FF;text-shadow:0 0 8px rgba(0,229,255,0.5);}
html[data-theme="neon"] .hero-showcase{background:radial-gradient(1200px 700px at 50% 25%, rgba(57,255,158,.14), #07070C 75%);border:1px solid rgba(57,255,158,0.25);}
html[data-theme="neon"] .showcase-title .hl{color:#39FF9E;filter:drop-shadow(0 0 18px rgba(57,255,158,.7));}
html[data-theme="neon"] .showcase-center{box-shadow:0 0 0 1px rgba(57,255,158,0.4), 0 0 70px rgba(57,255,158,0.4);}
html[data-theme="neon"] .field input,html[data-theme="neon"] .field select,html[data-theme="neon"] .field textarea{background:#101019;border-color:rgba(57,255,158,0.25);color:#EAF7EE;}
html[data-theme="neon"] footer{background:#0A0A12;color:#8C93A6;border-top:1px solid rgba(57,255,158,0.3);box-shadow:0 -8px 30px rgba(57,255,158,0.06);}
html[data-theme="neon"] footer h4,html[data-theme="neon"] footer h5{color:#39FF9E;}
html[data-theme="neon"] .footlink:hover{color:#39FF9E;}
/* --- NEON layout: nav sits tight against the icon cluster on the right
   (logo alone on the left), and the product grid is an asymmetric "bento"
   layout — the first tile in every row of 6 spans two columns and two rows. --- */
html[data-theme="neon"] .header-inner{justify-content:flex-start;}
html[data-theme="neon"] nav.main-nav{margin-left:auto;margin-right:22px;}
html[data-theme="neon"] .grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:14px;}
html[data-theme="neon"] .grid .card:nth-child(6n+1){grid-column:span 2;grid-row:span 2;}
html[data-theme="neon"] .grid .card:nth-child(6n+1){display:flex;flex-direction:column;}
html[data-theme="neon"] .grid .card:nth-child(6n+1) .card-img-wrap{aspect-ratio:auto;flex:1;min-height:220px;}
@media(max-width:900px){
  html[data-theme="neon"] .grid{grid-template-columns:repeat(2,1fr);}
  html[data-theme="neon"] .grid .card:nth-child(6n+1){grid-column:span 2;grid-row:span 1;}
}
html[data-theme="neon"] #view-shop .shop-sidebar{display:flex;gap:10px;flex-wrap:wrap;padding:10px 0 4px;border-bottom:1px solid rgba(57,255,158,0.2);margin-bottom:14px;}

/* ---------------------------------------------------------------
   THEME: COVER STORY — full-bleed magazine cover hero
   Ivory/charcoal/terracotta editorial palette; the homepage hero
   becomes a single tall edge-to-edge photo with the headline and
   CTA overlaid near the bottom, instead of the bento showcase.
   Rendered by renderCoverHero()/updateCoverHero() in site.js.
   --------------------------------------------------------------- */
html[data-theme="cover"]{
  --bg:#FAF6EF; --bg-soft:#F2EBDC; --card:#FFFFFF;
  --ink:#2B2318; --ink-soft:#7A6F5C; --heading:#1C140C;
  --primary:#1C1C1C; --primary-dark:#000000; --accent-leaf:#B5502E;
  --clay:#B5502E; --clay-dark:#8A3A20; --gold:#B5502E; --gold-light:#E8CBB8;
  --gold-glow:rgba(181,80,46,0.18); --line:#E4DCC9; --white:#FFFFFF;
  --danger:#B4271F; --radius:6px; --shadow:0 8px 24px rgba(28,20,12,0.08);
  --header-bg:#FAF6EF; --grain-dot:rgba(0,0,0,0);
}
html[data-theme="cover"] body{background-image:none;}
html[data-theme="cover"] .glow-blob{display:none;}
html[data-theme="cover"] header{background:var(--header-bg);border-bottom:1px solid var(--line);box-shadow:none;backdrop-filter:none;}
html[data-theme="cover"] .brand-name{font-family:'Fraunces',serif;letter-spacing:.01em;}
html[data-theme="cover"] nav.main-nav button.navlink{text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:600;color:var(--ink-soft);}
html[data-theme="cover"] nav.main-nav button.navlink.active,html[data-theme="cover"] nav.main-nav button.navlink:hover{color:var(--accent-leaf);border-color:var(--accent-leaf);}
html[data-theme="cover"] .icon-btn{background:#fff;border:1px solid var(--line);}
html[data-theme="cover"] .card{border:1px solid var(--line);box-shadow:none;border-radius:6px;transition:box-shadow .2s ease;}
html[data-theme="cover"] .card:hover{transform:none;box-shadow:0 12px 28px rgba(28,20,12,0.10);}
html[data-theme="cover"] .card-img-wrap{border-radius:6px 6px 0 0;background:var(--bg-soft);}
html[data-theme="cover"] .card-name{font-family:'Fraunces',serif;font-size:16px;}
html[data-theme="cover"] .card-cat{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em;font-size:11px;}
html[data-theme="cover"] .price{color:var(--accent-leaf);}
html[data-theme="cover"] .btn{border-radius:4px;}
html[data-theme="cover"] .btn-primary{background:var(--primary);color:#fff;box-shadow:none;}
html[data-theme="cover"] .btn-primary:hover{background:var(--primary-dark);}
html[data-theme="cover"] .btn-gold{background:var(--accent-leaf);color:#fff;box-shadow:none;}
html[data-theme="cover"] .btn-gold:hover{background:var(--clay-dark);filter:none;}
html[data-theme="cover"] .btn-outline{border:1.5px solid var(--ink);color:var(--ink);}
html[data-theme="cover"] .btn-outline:hover{background:var(--ink);color:#fff;}
html[data-theme="cover"] .add-btn{background:var(--primary);box-shadow:none;}
html[data-theme="cover"] .qty-stepper{background:var(--primary);box-shadow:none;}
html[data-theme="cover"] .chip{border:1px solid var(--line);background:#fff;text-transform:uppercase;letter-spacing:.05em;font-size:11.5px;}
html[data-theme="cover"] .chip.active{background:var(--ink);border-color:var(--ink);color:#fff;}
html[data-theme="cover"] .eyebrow{color:var(--accent-leaf);}
html[data-theme="cover"] .section-head h2{font-family:'Fraunces',serif;}
html[data-theme="cover"] .field input,html[data-theme="cover"] .field select,html[data-theme="cover"] .field textarea{border:1px solid var(--line);border-radius:4px;}
html[data-theme="cover"] footer{background:#1C140C;color:#D8CFC0;border-radius:0;}
html[data-theme="cover"] footer h4,html[data-theme="cover"] footer h5{font-family:'Fraunces',serif;color:#fff;}
html[data-theme="cover"] footer p,html[data-theme="cover"] .footlink{color:#B7AB96;}
html[data-theme="cover"] .footlink:hover{color:#fff;}

/* full-bleed cover hero — replaces the bento showcase for this theme only */
html[data-theme="cover"] .hero-showcase{
  border-radius:0;margin:0 0 8px;background:#1C140C;max-width:none;
}
html[data-theme="cover"] .showcase-stage{min-height:0;}
html[data-theme="cover"] .hero-showcase::before{display:none;}
.cover-hero-media{
  position:absolute;inset:0;background-size:cover;background-position:center;
  transition:opacity .35s ease;
}
.cover-hero-scrim{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.15) 45%, rgba(15,10,5,.82) 100%);
}
.cover-hero-inner{
  position:relative;z-index:2;min-height:min(86vh,720px);display:flex;flex-direction:column;
  justify-content:flex-end;align-items:flex-start;max-width:640px;padding:0 48px 64px;color:#fff;
}
.cover-hero-kicker{
  display:inline-block;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:#F0E6D6;margin-bottom:18px;
}
.cover-hero-title{
  font-family:'Fraunces',serif;font-weight:700;font-size:clamp(34px,6vw,68px);line-height:1.04;
  margin:0 0 16px;color:#fff;
}
.cover-hero-sub{font-size:15.5px;line-height:1.6;color:#EFE7D8;max-width:480px;margin:0 0 26px;}
.cover-hero-btn{background:#fff;color:#1C140C;border-radius:4px;font-weight:700;padding:14px 30px;}
.cover-hero-btn:hover{background:#B5502E;color:#fff;}
.cover-hero-dots{display:flex;gap:7px;margin-top:26px;}
.cover-hero-dots button{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35);border:none;padding:0;cursor:pointer;}
.cover-hero-dots button.active{background:#fff;width:22px;border-radius:5px;}
@media(max-width:700px){
  .cover-hero-inner{min-height:520px;padding:0 22px 40px;}
  .cover-hero-title{font-size:clamp(28px,9vw,42px);}
  .cover-hero-sub{font-size:14px;}
}