/* ============================================================
   BLOSSOM HONEY & ORGANICS — PREMIUM ART DIRECTION (shared, all pages)
   Part 1: tokens · type · buttons · pill nav · hero · ticker · waves
   Visual layer only — overrides the base theme. No content changes.
   ============================================================ */

/* ---------- tokens ---------- */
:root {
  --ivory: #F7F0E3;
  --cream: #F4EDDC;
  --sand: #EDE2CE;
  --beige: #E2D2B6;
  --line: #EADFC8;
  --ink: #241709;
  --ink-2: #3A2C17;
  --muted: #8C7B5F;
  --soft: #B29E7B;
  --honey: #C7913C;
  --honey-2: #9F6E24;
  --gold: #D9AC54;
  --gold-bright: #E7BC62;
  --gold-deep: #B97A23;
  --olive: #6E6C4D;
  --olive-2: #56543B;
  --espresso: #211610;
  --espresso-2: #2C2014;
  --espresso-3: #382A1B;
  --white: #FFFDF7;
  --chalk: #FCF8EC;
  --shadow-soft: 0 2px 6px rgba(38,26,10,.06), 0 18px 44px -18px rgba(38,26,10,.18);
  --shadow-lift: 0 6px 12px rgba(38,26,10,.08), 0 34px 66px -26px rgba(38,26,10,.34);
  --font-display: 'Fraunces', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
}

/* ---------- global art ---------- */
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 118px; }
body {
  background:
    radial-gradient(1100px 520px at 90% -6%, rgba(222,168,72,.10), transparent 62%),
    radial-gradient(900px 640px at -8% 42%, rgba(214,164,76,.07), transparent 60%),
    linear-gradient(180deg, #F8F2E4, #F4ECDB);
}
::selection { background: rgba(201,145,60,.32); }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #F1E8D4; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #D9AC54, #B97A23); border-radius: 20px; border: 3px solid #F1E8D4; }
::-webkit-scrollbar-thumb:hover { background: #9F6E24; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

/* ---------- typography ---------- */
h1, h2, h3, h4 { letter-spacing: -.02em; text-wrap: balance; }
.h-title, .h-display { font-weight: 480; }
.h-display { font-size: clamp(2.3rem, 5.6vw, 4.6rem); }
.h-title em, .h-display em, .hero-title em { font-style: italic; color: var(--gold-bright); }
.lede, .lead { color: var(--ink-2); }

.eyebrow { letter-spacing: .24em; color: var(--honey-2); }
.eyebrow::before {
  content: ""; width: 9px; height: 11px; flex: none;
  background: linear-gradient(200deg, #F2D186, #C7872B);
  border-radius: 2px 2px 14px 14px; border-radius: 60% 60% 80% 60%;
  transform: rotate(-8deg);
  box-shadow: 0 2px 5px rgba(159,110,36,.35);
}
.eyebrow.center::after {
  content: ""; width: 9px; height: 11px; flex: none;
  background: linear-gradient(20deg, #F2D186, #C7872B);
  border-radius: 60% 60% 60% 80%;
  transform: rotate(8deg);
  box-shadow: 0 2px 5px rgba(159,110,36,.35);
}

/* ---------- buttons ---------- */
.btn { border-radius: 999px; font-weight: 600; padding: 15px 30px; letter-spacing: .01em; }
.btn svg { transition: transform .35s var(--ease); }
.btn:hover svg { transform: translateX(4px); }
.btn-gold {
  background: linear-gradient(135deg, #E8BE66 0%, #CE9435 55%, #B97A23 100%);
  color: #261608;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -2px 6px rgba(122,76,15,.35), 0 12px 26px -10px rgba(185,122,35,.6);
  position: relative; overflow: hidden;
}
.btn-gold::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -70%; width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-20deg); transition: left .6s var(--ease);
}
.btn-gold:hover { transform: translateY(-2px); color: #1F1306; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 18px 34px -12px rgba(185,122,35,.75); }
.btn-gold:hover::after { left: 120%; }
.btn-primary {
  background: linear-gradient(140deg, #3A2A17, #1E1408);
  color: var(--chalk);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 12px 26px -12px rgba(20,12,3,.55);
}
.btn-primary:hover { transform: translateY(-2px); color: var(--gold-bright); }
.btn-outline { border: 1.5px solid rgba(201,145,60,.5); color: var(--honey-2); background: transparent; }
.btn-outline:hover { transform: translateY(-2px); border-color: var(--gold-deep); background: rgba(201,145,60,.08); color: var(--gold-deep); }
.btn-outline-light { border: 1.5px solid rgba(255,240,214,.5); color: #F8EED9; }
.btn-outline-light:hover { transform: translateY(-2px); background: rgba(255,240,214,.1); border-color: rgba(255,240,214,.9); }
.btn-ghost { background: rgba(201,145,60,.1); color: var(--honey-2); }
.btn-ghost:hover { background: rgba(201,145,60,.18); transform: translateY(-2px); }
.badge.honey { background: linear-gradient(135deg, var(--gold-bright), var(--gold-deep)); color: #261608; }

/* ---------- floating pill navigation ---------- */
.site-header { padding: 0; }
.site-header .h-inner {
  height: 62px; max-width: min(1180px, calc(100% - 28px)); margin: 12px auto 0;
  padding: 0 18px; border-radius: 999px;
  background: linear-gradient(180deg, #FFFDF6, #F7F0DE);
  border: 1px solid rgba(217,170,84,.5);
  box-shadow: 0 14px 36px -16px rgba(30,18,6,.32), inset 0 1px 0 rgba(255,255,255,.9);
  transition: height .4s var(--ease), margin .4s var(--ease), box-shadow .4s, background .4s;
}
.site-header.scrolled { background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.site-header.scrolled .h-inner {
  height: 56px; margin-top: 8px;
  background: rgba(252,248,236,.92);
  backdrop-filter: blur(18px) saturate(1.3); -webkit-backdrop-filter: blur(18px) saturate(1.3);
  border-color: rgba(217,170,84,.65);
  box-shadow: 0 18px 48px -18px rgba(28,17,5,.38), inset 0 1px 0 rgba(255,255,255,.85);
}
.site-header.hide { transform: translateY(-130%); }

.site-header.light-text:not(.scrolled), .site-header.light-text { color: var(--ink-2); }
.site-header .h-nav a, .site-header.light-text .h-nav a { color: var(--ink-2); }
.site-header .ico-btn, .site-header.light-text .ico-btn { color: var(--ink-2); }
.site-header .nav-toggle, .site-header.light-text .nav-toggle { color: var(--ink-2); }
.site-header .ico-btn { background: transparent; }
.site-header .ico-btn { position: relative; }
.site-header .h-nav a:hover, .site-header.light-text .h-nav a:hover { color: var(--gold-deep); background: rgba(201,145,60,.14); }
.site-header .ico-btn:hover, .site-header.light-text .ico-btn:hover { color: var(--gold-deep); background: rgba(201,145,60,.14); }

.brand .brand-word span, .site-header.light-text .brand .brand-word span { color: #A98B56; }
.brand .brand-word b { font-size: 18px; font-weight: 600; letter-spacing: .015em; }
.brand .brand-mark {
  position: relative;
  border-radius: 14px;
  background: radial-gradient(120% 130% at 30% 18%, #F0CE82, #B97A23 62%, #8C5B14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -3px 8px rgba(90,55,10,.5), 0 8px 18px -6px rgba(168,116,32,.55);
}
.brand .brand-mark::after {
  content: ""; position: absolute; left: 50%; bottom: -7px;
  width: 7px; height: 9px; transform: translateX(-50%) rotate(15deg);
  background: linear-gradient(180deg, #E3B65A, #A8721F);
  border-radius: 3px 3px 12px 12px; border-radius: 55% 55% 75% 55%;
}
.count-pill { border-color: var(--chalk); background: linear-gradient(135deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08; }

@media (min-width: 1210px) {
  .site-header .h-inner { position: relative; gap: 14px; justify-content: space-between; }
  .site-header .brand { position: static; transform: none; margin: 0; order: 1; flex: none; }
  .h-inner .h-nav { order: 2; flex: 1 1 auto; min-width: 0; padding-left: 10px; display: flex; justify-content: center; }
  .h-inner .h-nav ul { flex-wrap: nowrap; gap: 4px; white-space: nowrap; }
  .h-inner .h-actions { order: 3; margin-left: 8px; flex: none; }
  .h-nav a { padding: 9px 13px; font-size: 14.5px; }
  .h-nav a.on { color: var(--gold-deep); font-weight: 600; background: linear-gradient(135deg, rgba(232,190,102,.2), rgba(201,141,49,.12)); position: relative; }
  .h-nav a.on::after { content: ""; position: absolute; left: 50%; bottom: 3px; transform: translateX(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--gold-deep); }
}
@media (max-width: 700px) {
  .site-header .h-inner { height: 58px; max-width: calc(100% - 20px); padding: 0 12px; }
}

/* ---------- hero ---------- */
.hero { position: relative; isolation: isolate; }
.hero-bg img { animation: kenBurns 26s ease-in-out infinite alternate; }
@keyframes kenBurns { from { transform: scale(1.02); } to { transform: scale(1.14); } }
.hero-shade {
  background:
    radial-gradient(120% 90% at 78% 22%, rgba(10,6,2,.08), transparent 60%),
    linear-gradient(180deg, rgba(12,7,2,.52) 0%, rgba(12,7,2,.30) 44%, rgba(8,5,1,.78) 100%);
}
.hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: clamp(48px, 7vw, 118px); z-index: 1;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 70C220 116 440 24 700 54c260 30 484 64 740 22v44H0z' fill='%23F6EFE2'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
  pointer-events: none;
}
.hero-inner { position: relative; z-index: 2; padding-bottom: 176px; }
.hero-title { font-weight: 420; letter-spacing: -.03em; }
.hero-sub { color: rgba(255,246,230,.9); max-width: 56ch; }
.hero-chips { gap: 12px; }
.hero-chips .chip {
  background: rgba(20,12,4,.42); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(232,196,122,.45); color: #F6ECD7;
  padding: 10px 18px; border-radius: 999px; box-shadow: 0 10px 24px -10px rgba(0,0,0,.45);
}
.hero-chips .chip svg { color: var(--gold-bright); }
.hero-scroll {
  bottom: 30px; display: inline-flex;
  color: #F6EAD0; padding: 11px 20px 11px 24px; border-radius: 999px;
  background: rgba(20,12,4,.42); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(232,196,122,.4);
}
.hero-scroll:hover { color: var(--gold-bright); }

/* hero decorations */
.hero-honeycomb, .hero-glow, .hero-jar, .bee { position: absolute; pointer-events: none; }
.hero-honeycomb {
  inset: 0; z-index: 0; opacity: .5;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cg fill='none' stroke='%23D9AC54' stroke-opacity='.30' stroke-width='1.3'%3E%3Cpath d='M42 4 74 24v48l-32 18L10 72V24Z'/%3E%3Cpath d='M84 48v48M0 48v48M0 0h84M0 96h84'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 84px 96px;
  -webkit-mask-image: radial-gradient(120% 100% at 72% 16%, #000 26%, transparent 72%);
  mask-image: radial-gradient(120% 100% at 72% 16%, #000 26%, transparent 72%);
}
.hero-glow { inset: 0; z-index: 0; background: radial-gradient(640px 500px at 26% 60%, rgba(222,168,72,.34), transparent 70%); }
.hero-jar { right: 5.5%; bottom: 17%; width: min(236px, 19vw); z-index: 2; display: none; animation: floaty 7s ease-in-out infinite; }
@media (min-width: 1200px) { .hero-jar { display: block; } }
.hj-img {
  display: block; position: relative; aspect-ratio: 1; border-radius: 50%;
  border: 9px double rgba(232,190,102,.6); overflow: hidden; background: #271A0E;
  box-shadow: 0 34px 80px -18px rgba(0,0,0,.55), inset 0 0 0 2px rgba(20,12,4,.25);
}
.hj-img img { width: 100%; height: 100%; object-fit: cover; }
.hj-ring { position: absolute; inset: -20px; border-radius: 50%; border: 1.5px dashed rgba(232,190,102,.5); animation: spin 30s linear infinite; }
.hj-drip { position: absolute; left: -34px; bottom: 4px; width: 58px; height: auto; animation: dripDrop 3.6s ease-in-out infinite; filter: drop-shadow(0 8px 12px rgba(0,0,0,.4)); }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes dripDrop { 0%,100% { transform: translateY(0) scale(1); } 45% { transform: translateY(6px) scale(1.03); } }

/* bees */
.bee { width: 48px; height: 48px; color: var(--gold-bright); z-index: 3; filter: drop-shadow(0 8px 12px rgba(0,0,0,.35)); }
.bee svg { width: 100%; height: 100%; }
.bee-a { top: 20%; right: 10%; animation: beeFly 14s ease-in-out infinite; }
.bee-b { top: -34px; right: 4%; color: #B2842C; animation: beeFly 16s ease-in-out infinite; }
.bee-c { left: 5%; bottom: 18%; animation: beeFly 15s ease-in-out infinite; }
@keyframes beeFly {
  0%, 100% { transform: translate(0, 0) rotate(-4deg); }
  25% { transform: translate(14px, -16px) rotate(6deg); }
  50% { transform: translate(-8px, -30px) rotate(-6deg); }
  75% { transform: translate(10px, -12px) rotate(4deg); }
}

/* ---------- honey ticker marquee ---------- */
.honey-ticker {
  background: linear-gradient(180deg, #221810, #2A1D11);
  border-block: 1px solid rgba(232,190,102,.18);
  overflow: hidden; position: relative; z-index: 5;
}
.ticker-track { display: flex; align-items: center; width: max-content; white-space: nowrap; animation: ticker 30s linear infinite; }
.ticker-track span { display: inline-flex; align-items: center; gap: 40px; padding: 15px 0 15px 40px; }
.ticker-track .tk { font-family: var(--font-display); font-style: italic; font-size: 15.5px; letter-spacing: .02em; color: #EAD9AC; }
.ticker-track .tk-sep { color: var(--gold); font-size: 11px; }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ---------- section waves & surfaces ---------- */
.story { background: linear-gradient(180deg, #FFFDF6, #FAF3E3); overflow: hidden; }
.story-grid { position: relative; }
.story-media { position: relative; }
.story-media::before {
  content: ""; position: absolute; inset: -16px auto auto -20px; width: 54%; height: 70%;
  border: 1.5px dashed rgba(201,145,60,.4); border-radius: 28px; pointer-events: none;
}
.story-media .sm-main { border-radius: 28px; box-shadow: var(--shadow-lift); }
.story-media .sm-float { border: 7px solid #FFFDF6; border-radius: 22px; box-shadow: 0 30px 60px -24px rgba(38,26,10,.45); }
.story-copy { position: relative; z-index: 1; }

.featured {
  background:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cg fill='none' stroke='%23E7BC62' stroke-opacity='.05' stroke-width='1.3'%3E%3Cpath d='M42 4 74 24v48l-32 18L10 72V24Z'/%3E%3Cg%3E%3C/svg%3E"),
    radial-gradient(1200px 600px at 85% -10%, rgba(222,168,72,.14), transparent 55%),
    linear-gradient(165deg, #2A1D12, #1A110A 60%);
  background-size: 84px 96px, auto, auto;
}
.featured::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: clamp(40px, 6vw, 88px); z-index: 1;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1440v78c-244 40-470-8-732 20-258 28-410-2-708-46z' fill='%23FFFFFF'/%3E%3C/svg%3E") center top / 100% 100% no-repeat;
  pointer-events: none;
}
.featured-wrap { position: relative; z-index: 2; }
.featured-media .fm-main { border: 1px solid rgba(228,187,96,.28); border-radius: 30px; box-shadow: 0 44px 96px -34px rgba(0,0,0,.65); }
.fm-tag {
  background: linear-gradient(135deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08;
  font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: 11px;
  padding: 9px 18px; border-radius: 999px; box-shadow: 0 10px 22px -8px rgba(183,120,32,.6);
}
.featured-copy .f-price-row .price { color: var(--gold-bright); }
.featured-copy .f-price-row .save { background: rgba(232,190,102,.16); color: var(--gold-bright); }

.dryfruit { position: relative; background: linear-gradient(180deg, #F5EDDC, #F1E7D2); }
.dryfruit::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: clamp(40px, 6vw, 88px); z-index: 2;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 70C220 116 440 24 700 54c260 30 484 64 740 22v44H0z' fill='%2321190F'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
  pointer-events: none;
}
.dryfruit::after {
  content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: clamp(40px, 6vw, 80px); z-index: 2;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 70C220 116 440 24 700 54c260 30 484 64 740 22v44H0z' fill='%23F6EFE2'/%3E%3C/svg%3E") center top / 100% 100% no-repeat;
  pointer-events: none;
}
.dryfruit > .container { position: relative; z-index: 3; }

.reviews { background: linear-gradient(180deg, #FFFDF7, #F7F0DF); }
.contact { background: linear-gradient(180deg, #FFFDF7, #F5EEDC); }
/* ============================================================
   BLOSSOM HONEY — PREMIUM ART DIRECTION (shared)
   Part 2: trust · cards · shop · product · checkout · footer · polish
   ============================================================ */

/* ---------- trust bar (floating glass) ---------- */
.trust-bar { background: transparent; border: 0; padding: 0; position: relative; z-index: 6; }
.trust-bar .container {
  background: linear-gradient(135deg, rgba(255,252,244,.88), rgba(248,240,224,.8));
  backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3);
  border: 1px solid rgba(217,170,84,.4); border-radius: 26px;
  box-shadow: 0 28px 64px -28px rgba(30,18,6,.4); padding: 24px clamp(18px, 3vw, 42px);
}
.trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px 22px; }
.trust-item { display: flex; align-items: center; gap: 14px; padding: 6px 8px; }
.t-ic {
  width: 52px; height: 52px; flex: none; border-radius: 17px;
  display: grid; place-items: center; color: #5B4118;
  background: linear-gradient(140deg, #F1D59B, #E3B457);
  box-shadow: 0 10px 20px -8px rgba(183,122,35,.55), inset 0 1px 0 rgba(255,255,255,.65);
}
.trust-item b { font-size: 14.5px; }
.trust-item div span { font-size: 12.5px; color: var(--muted); }
@media (max-width: 760px) {
  .trust-bar .container { padding: 20px 16px; }
  .trust-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .trust-item { padding: 0; gap: 10px; }
  .t-ic { width: 44px; height: 44px; border-radius: 14px; }
  .trust-item div span { display: none; }
}

/* ---------- section headers / more-links ---------- */
.sec-head { margin-bottom: clamp(34px, 5vw, 58px); }
.link-more {
  font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--honey-2); display: inline-flex; align-items: center; gap: 10px; padding-bottom: 6px;
  border-bottom: 1.5px solid rgba(201,145,60,.3);
}
.link-more svg {
  width: 32px; height: 32px; padding: 8px; border-radius: 50%;
  background: linear-gradient(135deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08;
  box-shadow: 0 8px 16px -6px rgba(183,122,35,.6);
}
.link-more:hover { color: var(--gold-deep); }
.link-more:hover svg { transform: translateX(4px); }

/* ---------- product cards ---------- */
.p-card {
  background: #FFFCF4; border: 1px solid #EFE3CB; border-radius: 22px;
  box-shadow: var(--shadow-soft);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s;
}
.p-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lift); border-color: rgba(201,151,63,.4); }
.p-card .p-media { border-radius: 22px 22px 14px 14px; overflow: hidden; }
.p-card .p-media img { transition: transform .8s var(--ease); }
.p-card:hover .p-media img { transform: scale(1.07); }
.p-card .p-name { font-size: 17.5px; font-weight: 520; }
.p-card .p-name a { transition: color .25s; }
.p-card:hover .p-name a { color: var(--gold-deep); }
.p-card .p-price { color: var(--ink); }
.p-card .p-add {
  background: linear-gradient(135deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08;
  box-shadow: 0 12px 24px -8px rgba(185,122,35,.65); transition: transform .3s var(--ease), background .3s;
}
.p-card .p-add:hover { transform: scale(1.08) rotate(4deg); background: linear-gradient(135deg, #1F1408, #0F0A04); color: var(--gold-bright); }

/* ---------- category cards ---------- */
.cat-card { box-shadow: 0 18px 44px -22px rgba(38,26,10,.35); }
.cat-card::before {
  content: ""; position: absolute; inset: 10px; z-index: 2; pointer-events: none;
  border: 1px solid rgba(255,255,255,.28); border-radius: 18px; transition: inset .4s var(--ease), border-color .4s;
}
.cat-card:hover::before { inset: 7px; border-color: rgba(255,255,255,.5); }
.cat-card .cc-img img { transition: transform .8s var(--ease); }
.cat-card:hover .cc-img img { transform: scale(1.08); }
.cat-card .cc-label { z-index: 3; }
.cat-card .cc-label h3 { font-family: var(--font-display); font-weight: 520; font-size: 22px; }
.cat-card .cc-label span {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
  font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-bright);
}
.cat-card .cc-label span svg { width: 15px; height: 15px; transition: transform .35s var(--ease); }
.cat-card:hover .cc-label span svg { transform: translateX(5px); }
.cat-card:hover .cc-label h3 { color: var(--gold-bright); }

/* ---------- story / why / dryfruit / reviews / insta / faq ---------- */
.story-point .sp-ic {
  width: 52px; height: 52px; flex: none; border-radius: 16px; display: grid; place-items: center;
  color: #3A2A0E; background: linear-gradient(140deg, #F1D8A0, #E4B457);
  box-shadow: 0 10px 20px -10px rgba(183,122,35,.55), inset 0 1px 0 rgba(255,255,255,.6);
}
.why-card {
  background: linear-gradient(160deg, #FFFDF6, #F7F0E0); border: 1px solid #F0E3C9;
  border-radius: 22px; box-shadow: var(--shadow-soft);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.why-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.why-card .w-ic {
  color: #402B09; background: linear-gradient(140deg, #F1D59B, #E3B457);
  box-shadow: 0 12px 24px -10px rgba(183,122,35,.55), inset 0 1px 0 rgba(255,255,255,.6);
}
.df-tag .dt-ic {
  background: linear-gradient(140deg, #F1D59B, #E3B457); color: #402B09;
  box-shadow: 0 10px 20px -10px rgba(183,122,35,.5), inset 0 1px 0 rgba(255,255,255,.6);
}
.df-media .df-strip .strip-item { border: 4px solid #FFF9EA; border-radius: 16px; box-shadow: var(--shadow-soft); }
.rev-card { background: #FFFCF4; border: 1px solid #F0E4CC; border-radius: 22px; box-shadow: var(--shadow-soft); }
.rev-card .rev-avatar { background: linear-gradient(140deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08; }
.rev-card .rev-stars, .rev-card .rev-stars svg { color: var(--gold-deep); }
.rev-card .rev-quote { color: var(--ink-2); }
.insta-item { border-radius: 18px; overflow: hidden; box-shadow: var(--shadow-soft); }
.insta-item img { transition: transform .7s var(--ease); }
.insta-item:hover img { transform: scale(1.09); }
.insta-item .in-overlay {
  background: linear-gradient(180deg, transparent, rgba(33,22,16,.65));
  color: var(--gold-bright); opacity: 0; transition: opacity .4s;
}
.insta-item:hover .in-overlay { opacity: 1; }
.faq-item .faq-in { border-color: #EFE3CB; }
.faq-item .acc-q, .faq-item .faq-q { font-family: var(--font-display); font-size: clamp(1.05rem, 1.7vw, 1.28rem); }
.faq-item .faq-icon { background: linear-gradient(140deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08; }

/* ---------- page head ---------- */
.page-head {
  position: relative; overflow: hidden;
  background:
    radial-gradient(900px 380px at 85% -20%, rgba(222,168,72,.18), transparent 60%),
    linear-gradient(180deg, #F4ECDC, #F0E6D2);
  border-bottom: 0;
}
.page-head::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: clamp(40px, 5vw, 64px);
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 70C220 116 440 24 700 54c260 30 484 64 740 22v44H0z' fill='%23F6EFE2'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
  pointer-events: none;
}
.page-head.dark {
  background:
    radial-gradient(1000px 420px at 80% -10%, rgba(221,170,76,.16), transparent 60%),
    linear-gradient(180deg, #2A1D12, #1E130B);
}
.page-head .crumbs { color: var(--muted); }
.page-head .crumbs a:hover { color: var(--gold-deep); }

/* ---------- shop ---------- */
.filter-btn { border: 1.5px solid #E6D8BC; background: #FFFCF4; color: #43331B; box-shadow: 0 2px 6px -2px rgba(60,40,12,.06); }
.filter-btn:hover:not(.on) { border-color: rgba(201,145,60,.5); color: var(--gold-deep); }
.filter-btn.on { background: linear-gradient(135deg, #E7BC62, #C98D31); border-color: transparent; color: #271705; font-weight: 700; box-shadow: 0 8px 18px -6px rgba(183,120,32,.5); }
.sort-select, .search-inline { border-color: #E6D8BC; background: #FFFCF4; box-shadow: 0 2px 6px -2px rgba(60,40,12,.06); }
.result-count {
  display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 999px;
  background: linear-gradient(135deg, rgba(232,190,102,.2), rgba(201,141,49,.12));
  color: var(--honey-2); font-size: 12.5px; font-weight: 700;
}

/* ---------- product page ---------- */
.pd-main { background: linear-gradient(180deg, #F8F0DC, #EFE3C8); }
.pd-main img { transition: transform .8s var(--ease); }
.pd-main:hover img { transform: scale(1.04); }
.pd-thumb { border: 2px solid transparent; }
.pd-thumb.on { border-color: var(--gold); }
.size-pill.on { background: linear-gradient(135deg, #E7BC62, #C98D31); color: #2A1A08; border-color: transparent; font-weight: 700; }
.pd-price-row .price { color: var(--gold-deep); }
.pd-wish-btn { color: var(--honey-2); border: 1.5px solid rgba(201,145,60,.4); border-radius: 999px; }
.pd-wish-btn.on { background: linear-gradient(135deg, #E7BC62, #C98D31); color: #2A1A08; border-color: transparent; }
.pd-trust .t-item { background: rgba(201,145,60,.08); border: 1px solid rgba(201,145,60,.22); border-radius: 999px; }
.pd-trust .t-item svg { color: var(--gold-deep); }
.pd-acc .acc-b { border-color: #EFE3CB; }

/* ---------- checkout ---------- */
.co-steps .co-step { font-weight: 600; color: var(--muted); }
.co-steps .co-step .n { border: 2px solid #E6D8BC; color: var(--muted); }
.co-steps .co-step.on .n, .co-steps .co-step.done .n {
  background: linear-gradient(135deg, #E7BC62, #C98D31); color: #2A1A08; border-color: transparent;
  box-shadow: 0 6px 14px -4px rgba(183,120,32,.5);
}
.co-steps .sep { background: linear-gradient(90deg, #D9AC54, #EFE3CB); border-radius: 2px; }
.co-card, .co-summary .cs-card { background: #FFFCF4; border: 1px solid #EFE3CB; border-radius: 24px; box-shadow: var(--shadow-soft); }
.co-card h3 .n { background: linear-gradient(140deg, var(--gold-bright), var(--gold-deep)); color: #2A1A08; }
.pay-opt.on { border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(201,145,60,.15); }
.summary-row.total { color: var(--gold-deep); }
.qty { border-color: #E6D8BC; background: #FFFCF4; }

/* ---------- forms ---------- */
.contact-form-card {
  background: linear-gradient(180deg, #FFFDF6, #F7F0E0);
  border: 1px solid rgba(217,170,84,.35); border-radius: 26px; box-shadow: var(--shadow-lift);
}
.contact-form-card input:focus, .contact-form-card textarea:focus, .co-card input:focus, .co-card textarea:focus {
  border-color: var(--gold); box-shadow: 0 0 0 4px rgba(201,145,60,.14); outline: none;
}
.channel { border: 1px solid #EFE3CB; background: #FFFCF4; border-radius: 18px; box-shadow: var(--shadow-soft); }
.channel:hover { border-color: rgba(201,145,60,.4); transform: translateY(-2px); }
.ch-ic.wa, .ch-ic.ig, .ch-ic.em { background: linear-gradient(140deg, #F1D59B, #E3B457); color: #4A3210; box-shadow: 0 10px 20px -10px rgba(183,122,35,.5); }

/* ---------- footer ---------- */
.site-footer {
  background:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cg fill='none' stroke='%23E7BC62' stroke-opacity='.05' stroke-width='1.3'%3E%3Cpath d='M42 4 74 24v48l-32 18L10 72V24Z'/%3E%3Cg%3E%3C/svg%3E"),
    radial-gradient(900px 520px at 90% -10%, rgba(221,170,76,.12), transparent 60%),
    linear-gradient(180deg, #241A11, #160E08);
  background-size: 84px 96px, auto, auto;
}
.site-footer::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: clamp(40px, 5vw, 72px); z-index: 2;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1440v78c-244 40-470-8-732 20-258 28-410-2-708-46z' fill='%23FFFFFF'/%3E%3C/svg%3E") center top / 100% 100% no-repeat;
  pointer-events: none;
}
.site-footer .footer-wrap { position: relative; z-index: 3; }
.site-footer .footer-grid, .site-footer .footer-bottom { padding-top: clamp(30px, 4vw, 52px); }
.site-footer .footer-brand p { max-width: 42ch; }
.site-footer .footer-col a:hover { color: var(--gold-bright); }
.site-footer .footer-social .s-btn { border: 1px solid rgba(232,190,102,.25); }
.site-footer .footer-social .s-btn:hover { background: var(--gold-bright); color: #2A1A08; border-color: transparent; }

/* ---------- overlays / menus / drawers ---------- */
.overlay { background: rgba(15,9,3,.55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.modal { border-radius: 26px; }
.m-menu .m-panel { border-radius: 0 26px 26px 0; }
.cart-drawer .cart-body { background: #FFFDF7; }
.acc-tabs button.on { background: linear-gradient(135deg, #E7BC62, #C98D31); color: #2A1A08; font-weight: 700; }
.summary-row.total { border-top-color: rgba(201,145,60,.4); }

/* ---------- micro + reveal ---------- */
.reveal { transition: opacity .9s var(--ease-2), transform .9s var(--ease-2); }
.d1 { transition-delay: .08s; } .d2 { transition-delay: .16s; }
.d3 { transition-delay: .24s; } .d4 { transition-delay: .32s; }
.d5 { transition-delay: .4s; } .d6 { transition-delay: .48s; }

@media (prefers-reduced-motion: reduce) {
  .hero-bg img, .bee, .hero-jar, .hj-ring, .hj-drip, .ticker-track { animation: none !important; }
  .reveal { transition: none !important; }
}

/* ---------- compact responsive ---------- */
@media (max-width: 900px) {
  .honey-ticker .ticker-track span { padding: 12px 0 12px 32px; gap: 32px; }
  .hero-title { letter-spacing: -.02em; }
}
@media (max-width: 640px) {
  .hero-inner { padding-bottom: 120px; }
  .hero-jar { display: none; }
}