/* ════════════════════════════════════════════════════════════════════════
   HIVE — futuristic re-skin for the Honey Market homepage concept.
   Layered AFTER bee-king.css: same brand (pure black, gold comb,
   pink-gold accent, approved art), re-registered as a futuristic hive —
   hexagonal structure, amber glow, fine circuit traces, crisp sans UI
   type. The product layer stays disciplined: uniform cards, even
   spacing, prices showing. Atmosphere only — never clutter.
   ════════════════════════════════════════════════════════════════════════ */

:root{
  --hv-ui:"Avenir Next","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --hv-amber:#f0b93e;
  --hv-glow:rgba(232,200,90,.28);
  --hv-glow-soft:rgba(232,200,90,.12);
  --hv-panel:#070604;
  --hv-edge:#3a2f14;
  /* Fine circuit traces — thin gold right-angle lines + nodes, faint.
     A background whisper only; it never sits under product text. */
  --hv-circuit:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill='none' stroke='%23c9a227' stroke-opacity='0.16' stroke-width='1'%3E%3Cpath d='M10 40h70l20 20h60'/%3E%3Cpath d='M250 90h-55l-18 18H90'/%3E%3Cpath d='M30 230v-60l22-22h58'/%3E%3Cpath d='M210 250v-48l-16-16h-44'/%3E%3C/g%3E%3Cg fill='%23c9a227' fill-opacity='0.35'%3E%3Ccircle cx='10' cy='40' r='2'/%3E%3Ccircle cx='160' cy='60' r='2'/%3E%3Ccircle cx='250' cy='90' r='2'/%3E%3Ccircle cx='90' cy='108' r='2'/%3E%3Ccircle cx='110' cy='148' r='2'/%3E%3Ccircle cx='30' cy='230' r='2'/%3E%3Ccircle cx='150' cy='186' r='2'/%3E%3Ccircle cx='210' cy='250' r='2'/%3E%3C/g%3E%3C/svg%3E");
}

body.hv{background-color:#000;font-family:var(--hv-ui)}

/* ── Top bar: slim, precise, one gold hairline over a comb strip ───── */
body.hv header.site{
  padding:.65rem 1.4rem;
  background-color:#000;
  border-bottom:1px solid var(--bk-gold-dim);
  box-shadow:0 1px 0 rgba(201,162,39,.22),0 10px 34px -18px var(--hv-glow);
}
body.hv .brand{
  font-family:var(--hv-ui);font-weight:600;font-size:.92rem;
  letter-spacing:.34em;color:var(--bk-gold);
}
body.hv nav.main{gap:1.5rem;font-family:var(--hv-ui)}
body.hv nav.main a{
  font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);
}
body.hv .pickers select{
  font-family:var(--hv-ui);font-size:.8rem;background:#0a0805;
  border:1px solid var(--hv-edge);color:var(--ink);padding:.32rem .45rem;
}
body.hv .stall-link{
  font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;
  color:#0a0803;background:var(--bk-gold);padding:.48rem .9rem;font-weight:600;
}
body.hv .stall-link:hover{background:var(--bk-gold-bright);color:#0a0803;text-decoration:none}

/* ── Search: one precise field, amber edge ─────────────────────────── */
body.hv .searchbar{
  margin:0;max-width:520px;flex:1;min-width:200px;
  border:1px solid var(--hv-edge);background:#050403;
}
body.hv .searchbar input{
  font-family:var(--hv-ui);font-size:.92rem;padding:.62rem .9rem;color:var(--ink);
}
body.hv .searchbar input::placeholder{color:#7d745c;font-style:normal}
body.hv .searchbar button{
  font-family:var(--hv-ui);font-size:.68rem;letter-spacing:.24em;
  padding:0 1.2rem;background:var(--bk-gold);
}

/* ── Hero band: three framed cards on a comb arch + circuit field ──── */
body.hv .hero{padding:2.2rem 1.5rem 1.6rem}
body.hv .hero::before{background-size:84px 147px;opacity:.9}
body.hv .hv-hero-band{
  position:relative;display:flex;justify-content:center;gap:clamp(1rem,4vw,3.2rem);
  padding:1.4rem 1rem 1.2rem;
  background-image:var(--hv-circuit);background-size:260px 260px;
}
body.hv .hv-hero-band figure{
  margin:0;padding:8px;background:#000;
  border:1px solid var(--bk-gold);outline:1px solid var(--bk-gold-dim);outline-offset:4px;
  box-shadow:0 0 34px var(--hv-glow-soft),0 0 70px rgba(229,139,177,.05);
}
body.hv .hv-hero-band img{display:block;height:290px;width:auto;background:#000}
@media (max-width:640px){ body.hv .hv-hero-band img{height:158px} }

/* ── Product grid: uniform cards, even spacing, calm margins ───────── */
body.hv main{max-width:1240px;padding:0 1.4rem 3.5rem}
body.hv .grid{
  display:grid;gap:1.3rem;margin-top:2.2rem;
  grid-template-columns:repeat(4,1fr);
}
@media (max-width:1080px){ body.hv .grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:700px){ body.hv .grid{grid-template-columns:repeat(2,1fr);gap:.9rem} }

body.hv .p-card{
  background:var(--hv-panel);border:1px solid var(--hv-edge);
  display:flex;flex-direction:column;overflow:hidden;position:relative;
}
body.hv .p-card::before{ /* gold top rule — the hive cell edge */
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--bk-gold-dim),var(--bk-gold),var(--bk-gold-dim));
  opacity:.75;
}
body.hv .p-card:hover{border-color:var(--bk-gold);box-shadow:0 0 22px var(--hv-glow-soft)}
body.hv .p-img{
  background:#000;aspect-ratio:4/4.1;display:flex;align-items:center;justify-content:center;
  border-bottom:1px solid #1d1809;padding:.7rem;
}
body.hv .p-img img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
body.hv .p-body{padding:.85rem .95rem 1rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
body.hv .p-name{
  font-size:.94rem;font-weight:600;color:var(--ink);line-height:1.35;letter-spacing:.01em;
}
body.hv .p-price{display:flex;align-items:baseline;justify-content:space-between;margin-top:auto;padding-top:.35rem}
body.hv .p-price .amt{
  color:var(--bk-gold-bright);font-size:1.22rem;font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;
}
body.hv .p-price .amt::before{ /* small gold hexagon bullet */
  content:"";display:inline-block;width:8px;height:9px;margin-right:.5rem;vertical-align:baseline;
  background:var(--bk-gold);
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
}
body.hv .p-price .alt{color:#a89e83;font-size:.72rem;letter-spacing:.06em;white-space:nowrap}
body.hv .p-stall{
  display:flex;align-items:center;gap:.5rem;color:#a89e83;font-size:.76rem;letter-spacing:.05em;
}
body.hv .p-stall .bk-badge{font-size:.6rem;letter-spacing:.2em}
body.hv .p-stall .bk-badge img{height:24px;padding:1px}

/* ── Shelves: pictured tiles, one geometry for all ─────────────────── */
body.hv .shelves{
  display:grid;gap:1px;background:var(--hv-edge);border:1px solid var(--hv-edge);
  grid-template-columns:repeat(3,1fr);margin-top:.4rem;
}
@media (max-width:700px){ body.hv .shelves{grid-template-columns:repeat(2,1fr)} }
body.hv .tile{background:#050403;display:block;position:relative}
body.hv .tile .t-img{height:118px;overflow:hidden;position:relative}
body.hv .tile .t-img img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92}
body.hv .tile .t-img::after{ /* centre hexagon on the image's lower edge */
  content:"";position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);
  width:16px;height:18px;background:#050403;border:1px solid var(--bk-gold-dim);
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
}
body.hv .tile .t-label{
  display:block;text-align:center;padding:.85rem .5rem 1rem;color:var(--ink);
  font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;
}
body.hv .tile:hover .t-label{color:var(--bk-gold-bright)}
body.hv .tile:hover{text-decoration:none}

/* ── Footer: links + name line only ────────────────────────────────── */
body.hv footer{font-family:var(--hv-ui);padding:1.8rem 1.4rem 2.2rem}
body.hv footer nav a{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase}
body.hv footer .fname{font-size:.8rem;letter-spacing:.3em;color:var(--bk-gold);margin-top:.4rem}