/* Warehouse Wins — October / Halloween festive 2026 */
:root {
  --cream: #fbf4e8;
  --cream-deep: #f0ddc4;
  --gold: #d4a017;
  --gold-light: #f5e0a0;
  --orange: #d3541a;
  --orange-bright: #ef7a2e;
  --pumpkin: #e07020;
  --burgundy: #8b1e0e;
  --burgundy-deep: #3d0c06;
  --wine: #a11a3a;
  --ink: #2a140c;
  --muted: #6e4632;
  --card: #fffcf6;
  --border: #e4c9a8;
  --shadow: 0 3px 16px rgba(61, 12, 6, 0.1);
  --shadow-lg: 0 10px 36px rgba(61, 12, 6, 0.16);
  --radius: 14px;
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--ink);
  background-color: var(--cream);
  background-image:
    radial-gradient(ellipse 100% 65% at 5% -5%, rgba(212, 160, 23, 0.22), transparent 50%),
    radial-gradient(ellipse 85% 50% at 95% 0%, rgba(211, 84, 26, 0.18), transparent 48%),
    radial-gradient(ellipse 70% 45% at 50% 105%, rgba(139, 30, 14, 0.08), transparent 55%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='110' height='110' viewBox='0 0 110 110'%3E%3Cg fill='%23d3541a' fill-opacity='0.045'%3E%3Cpath d='M55 8c-3 8-8 14-16 16 8 3 14 8 16 16 3-8 8-14 16-16-8-3-14-8-16-16z'/%3E%3Cpath d='M20 62c-1.8 4.5-4.5 8-9 9 4.5 1.8 8 4.5 9 9 1.8-4.5 4.5-8 9-9-4.5-1.8-8-4.5-9-9z'/%3E%3Cpath d='M88 48c-1.4 3.5-3.5 6-7 7 3.5 1.4 6 3.5 7 7 1.4-3.5 3.5-6 7-7-3.5-1.4-6-3.5-7-7z'/%3E%3Cpath d='M72 88c-1 2.5-2.5 4.2-5 5 2.5 1 4.2 2.5 5 5 1-2.5 2.5-4.2 5-5-2.5-1-4.2-2.5-5-5z'/%3E%3C/g%3E%3C/svg%3E");
  min-height: 100vh;
}

/* —— Seasonal top ribbon —— */
.season-ribbon {
  background: linear-gradient(90deg, #2a0a05 0%, #5c1408 25%, #8b1e0e 50%, #5c1408 75%, #2a0a05 100%);
  color: var(--gold-light);
  text-align: center;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.4rem 1rem;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(212, 160, 23, 0.35);
}

.season-ribbon::before,
.season-ribbon::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 120px;
  height: 18px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='18' viewBox='0 0 120 18'%3E%3Cg fill='%23d4a017' fill-opacity='0.55'%3E%3Cpath d='M8 9c-1 3-3 5-6 6 3 1 5 3 6 6 1-3 3-5 6-6-3-1-5-3-6-6z'/%3E%3Cpath d='M32 5c-1.2 3.5-3.5 6-7 7 3.5 1.2 6 3.5 7 7 1.2-3.5 3.5-6 7-7-3.5-1.2-6-3.5-7-7z'/%3E%3Cpath d='M58 9c-1 3-3 5-6 6 3 1 5 3 6 6 1-3 3-5 6-6-3-1-5-3-6-6z'/%3E%3Cpath d='M84 5c-1.2 3.5-3.5 6-7 7 3.5 1.2 6 3.5 7 7 1.2-3.5 3.5-6 7-7-3.5-1.2-6-3.5-7-7z'/%3E%3Cpath d='M108 9c-1 3-3 5-6 6 3 1 5 3 6 6 1-3 3-5 6-6-3-1-5-3-6-6z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
  opacity: 0.7;
  pointer-events: none;
}
.season-ribbon::before { left: 0.5rem; }
.season-ribbon::after { right: 0.5rem; }

.season-ribbon .ribbon-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  position: relative;
  z-index: 1;
}

.season-ribbon .mini-ico {
  width: 14px;
  height: 14px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.9;
}
.season-ribbon .mini-ico.leaf {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f5e0a0' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E");
}
.season-ribbon .mini-ico.pump {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='14' rx='8' ry='6.5' fill='%23ef7a2e'/%3E%3Crect x='11' y='6' width='2' height='3.5' rx='1' fill='%23f5e0a0'/%3E%3C/svg%3E");
}

/* —— Header —— */
.site-header {
  background: linear-gradient(118deg, var(--burgundy-deep) 0%, #5c1408 28%, var(--burgundy) 52%, #b84318 78%, var(--pumpkin) 100%);
  color: #fff;
  padding: 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 6px 28px rgba(61, 12, 6, 0.35);
}

.site-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='90' viewBox='0 0 200 90'%3E%3Cg fill='none' stroke='%23f5e0a0' stroke-opacity='0.22' stroke-width='1.3'%3E%3Cpath d='M6 70 Q28 22 48 48 Q62 62 82 28'/%3E%3Cpath d='M100 65 Q120 18 148 52'/%3E%3Cpath d='M55 78 Q70 48 88 62'/%3E%3Cpath d='M160 72 Q175 40 195 58'/%3E%3C/g%3E%3Cg fill='%23f5e0a0' fill-opacity='0.12'%3E%3Cpath d='M170 18c-1.5 4-4 7-8 8 4 1.5 7 4 8 8 1.5-4 4-7 8-8-4-1.5-7-4-8-8z'/%3E%3Cpath d='M30 20c-1.2 3.2-3.2 5.5-6.5 6.5 3.2 1.2 5.5 3.2 6.5 6.5 1.2-3.2 3.2-5.5 6.5-6.5-3.2-1.2-5.5-3.2-6.5-6.5z'/%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.site-header::after {
  content: "";
  position: absolute;
  right: -40px;
  top: -50px;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 224, 160, 0.28) 0%, transparent 68%);
  pointer-events: none;
}

.header-inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 1.1rem 1.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  position: relative;
  z-index: 1;
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: #fff;
}

.brand-mark {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cellipse cx='16' cy='18.5' rx='11' ry='9' fill='%237c1a0a'/%3E%3Cellipse cx='11' cy='18.5' rx='5' ry='8' fill='%23b84318' opacity='0.9'/%3E%3Cellipse cx='21' cy='18.5' rx='5' ry='8' fill='%235c1408' opacity='0.6'/%3E%3Cellipse cx='16' cy='18.5' rx='3.2' ry='8.2' fill='%239a3010'/%3E%3Crect x='14.7' y='7' width='2.6' height='5' rx='1.2' fill='%233d6b2a'/%3E%3Cpath d='M17.2 8.5 Q21 5 23 8' fill='none' stroke='%233d6b2a' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") center 52%/70% no-repeat,
    linear-gradient(145deg, var(--gold-light) 0%, var(--gold) 50%, var(--orange-bright) 100%);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 0 2px rgba(245, 224, 160, 0.35);
  flex-shrink: 0;
}

.brand-name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.4rem;
  letter-spacing: -0.02em;
  line-height: 1.15;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.brand-tag {
  display: block;
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 700;
  opacity: 0.95;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-top: 0.12rem;
  color: var(--gold-light);
}

.nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.nav a {
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.42rem 0.9rem;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: background 0.15s, border-color 0.15s;
}

.nav a:hover,
.nav a[aria-current="page"] {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(245, 224, 160, 0.55);
}

/* —— Festive hero banner —— */
.hero {
  max-width: 980px;
  margin: 0 auto;
  padding: 1.5rem 1.25rem 0.4rem;
  position: relative;
}

.hero-banner {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border: 1px solid rgba(139, 30, 14, 0.25);
}

.hero-banner-bg {
  background:
    linear-gradient(135deg, rgba(61, 12, 6, 0.72) 0%, rgba(139, 30, 14, 0.55) 40%, rgba(180, 70, 20, 0.45) 100%),
    linear-gradient(160deg, #3d0c06 0%, #8b1e0e 35%, #c45c26 70%, #d4a017 100%);
  padding: 1.65rem 1.6rem 1.45rem;
  color: #fff;
  position: relative;
  overflow: hidden;
}

.hero-banner-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='160' viewBox='0 0 280 160'%3E%3Cg fill='%23f5e0a0' fill-opacity='0.1'%3E%3Cpath d='M40 30c-2.5 7-7 12-14 14 7 2.5 12 7 14 14 2.5-7 7-12 14-14-7-2.5-12-7-14-14z'/%3E%3Cpath d='M120 100c-3 8-8 14-16 16 8 3 14 8 16 16 3-8 8-14 16-16-8-3-14-8-16-16z'/%3E%3Cpath d='M220 40c-2 6-6 10-12 12 6 2 10 6 12 12 2-6 6-10 12-12-6-2-10-6-12-12z'/%3E%3Cpath d='M250 110c-1.5 4-4 7-8 8 4 1.5 7 4 8 8 1.5-4 4-7 8-8-4-1.5-7-4-8-8z'/%3E%3Cpath d='M80 120c-1.5 4-4 7-8 8 4 1.5 7 4 8 8 1.5-4 4-7 8-8-4-1.5-7-4-8-8z'/%3E%3C/g%3E%3Cg fill='none' stroke='%23f5e0a0' stroke-opacity='0.18' stroke-width='1.4'%3E%3Cpath d='M10 140 Q40 80 70 110 Q90 130 120 70'/%3E%3Cpath d='M160 145 Q190 90 230 120'/%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}

.hero-banner-bg::after {
  content: "";
  position: absolute;
  bottom: -30px;
  right: -20px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 224, 160, 0.25) 0%, transparent 65%);
  pointer-events: none;
}

.hero-content {
  position: relative;
  z-index: 1;
  max-width: 34rem;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(245, 224, 160, 0.2);
  border: 1px solid rgba(245, 224, 160, 0.45);
  color: var(--gold-light);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  margin-bottom: 0.75rem;
  backdrop-filter: blur(4px);
}

.hero-badge .hb-ico {
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='14' rx='8' ry='6.5' fill='%23ef7a2e'/%3E%3Crect x='11' y='6' width='2' height='3.5' rx='1' fill='%233d6b2a'/%3E%3C/svg%3E") center/contain no-repeat;
}

.hero-banner h1 {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 4.2vw, 2.25rem);
  font-weight: 700;
  line-height: 1.18;
  margin: 0 0 0.55rem;
  color: #fff;
  letter-spacing: -0.025em;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.hero-period {
  color: var(--gold-light);
  font-style: italic;
  font-weight: 600;
}

.hero-lead {
  margin: 0;
  color: rgba(255, 248, 235, 0.92);
  font-size: 1.02rem;
  line-height: 1.5;
  max-width: 36rem;
}

.hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 1.05rem;
}

.hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #fff;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(245, 224, 160, 0.3);
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  backdrop-filter: blur(3px);
}

.hero-chip .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 2px rgba(212, 160, 23, 0.3);
  flex-shrink: 0;
}

/* Floating deco on hero */
.hero-float {
  position: absolute;
  pointer-events: none;
  z-index: 2;
  opacity: 0.85;
}
.hero-float.leaf1 {
  top: 1rem;
  right: 1.4rem;
  width: 36px;
  height: 36px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23f5e0a0' d='M16 2C12 8 6 12 2 14c6 1 11 5 14 12 2-6 7-10 14-12-6-2-10-6-14-12z'/%3E%3Cpath stroke='%23d4a017' stroke-width='1.2' fill='none' d='M16 4v20'/%3E%3C/svg%3E") center/contain no-repeat;
  transform: rotate(22deg);
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.25));
}
.hero-float.leaf2 {
  top: 3.6rem;
  right: 3.8rem;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23ef7a2e' d='M16 2C12 8 6 12 2 14c6 1 11 5 14 12 2-6 7-10 14-12-6-2-10-6-14-12z'/%3E%3C/svg%3E") center/contain no-repeat;
  transform: rotate(-30deg);
  opacity: 0.7;
}
.hero-float.pump1 {
  bottom: 1.1rem;
  right: 1.6rem;
  width: 42px;
  height: 42px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='20' cy='24' rx='14' ry='11' fill='%23e07020'/%3E%3Cellipse cx='13' cy='24' rx='6.5' ry='10' fill='%23ef7a2e' opacity='0.85'/%3E%3Cellipse cx='27' cy='24' rx='6.5' ry='10' fill='%23b84318' opacity='0.55'/%3E%3Cellipse cx='20' cy='24' rx='4' ry='10.5' fill='%23d3541a'/%3E%3Crect x='18.2' y='10' width='3.5' height='6' rx='1.5' fill='%233d6b2a'/%3E%3Cpath d='M21.5 12 Q26 8 28.5 12' fill='none' stroke='%233d6b2a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  filter: drop-shadow(0 3px 6px rgba(0,0,0,0.3));
}
.hero-float.pump2 {
  bottom: 1.4rem;
  right: 4.6rem;
  width: 26px;
  height: 26px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='20' cy='24' rx='14' ry='11' fill='%23c45c26'/%3E%3Cellipse cx='13' cy='24' rx='6.5' ry='10' fill='%23e07020' opacity='0.7'/%3E%3Crect x='18.5' y='11' width='3' height='5' rx='1.2' fill='%233d6b2a'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity: 0.75;
  transform: rotate(-8deg);
}
.hero-float.maple {
  top: 1.2rem;
  right: 6.5rem;
  width: 22px;
  height: 22px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f5e0a0' d='M12 1l1.5 5.5L18 4l-2 5.5L22 11l-6 1.5 2.5 5.5-5-3.5V22h-1.5v-7.5l-5 3.5L9 12.5 3 11l6-1.5L7 4l4.5 2.5L12 1z'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity: 0.65;
  transform: rotate(12deg);
}

.hero-garland {
  height: 10px;
  background: linear-gradient(90deg,
    var(--burgundy-deep),
    var(--burgundy),
    var(--orange),
    var(--gold),
    var(--orange),
    var(--burgundy),
    var(--burgundy-deep));
  position: relative;
}
.hero-garland::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='10' viewBox='0 0 48 10'%3E%3Ccircle cx='8' cy='5' r='2' fill='%23f5e0a0' fill-opacity='0.5'/%3E%3Ccircle cx='24' cy='5' r='1.5' fill='%23fff' fill-opacity='0.25'/%3E%3Ccircle cx='40' cy='5' r='2' fill='%23f5e0a0' fill-opacity='0.5'/%3E%3C/svg%3E");
  opacity: 0.8;
}

/* Leaf scatter strip under hero */
.leaf-strip {
  max-width: 980px;
  margin: 0.35rem auto 0;
  padding: 0 1.25rem;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  opacity: 0.55;
  pointer-events: none;
}
.leaf-strip span {
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
}
.leaf-strip .l1 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d3541a' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E"); transform: rotate(15deg); }
.leaf-strip .l2 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d4a017' d='M12 1l1.5 5.5L18 4l-2 5.5L22 11l-6 1.5 2.5 5.5-5-3.5V22h-1.5v-7.5l-5 3.5L9 12.5 3 11l6-1.5L7 4l4.5 2.5L12 1z'/%3E%3C/svg%3E"); transform: rotate(-20deg); }
.leaf-strip .l3 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%238b1e0e' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E"); transform: rotate(40deg); }
.leaf-strip .l4 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='14' rx='7' ry='5.5' fill='%23e07020'/%3E%3Crect x='11' y='7' width='2' height='3' rx='1' fill='%233d6b2a'/%3E%3C/svg%3E"); }
.leaf-strip .l5 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ef7a2e' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E"); transform: rotate(-35deg); }

/* —— Layout —— */
main {
  max-width: 980px;
  margin: 0 auto;
  padding: 0.65rem 1.25rem 2rem;
}

.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.3rem 1.4rem;
  margin: 1.05rem 0;
  box-shadow: var(--shadow);
  position: relative;
}

.card h2, .card h3, main > .card h1 {
  font-family: var(--font-display);
  color: var(--burgundy-deep);
  margin-top: 0;
}

.card h2 {
  font-size: 1.38rem;
  margin-bottom: 0.85rem;
  padding-bottom: 0.45rem;
  border-bottom: 2px solid var(--gold-light);
  display: inline-block;
}

.card h1 {
  font-family: var(--font-display);
  font-size: 1.75rem;
  color: var(--burgundy-deep);
  margin-top: 0;
  margin-bottom: 0;
}

.card h3 { font-size: 1.12rem; }
.card p { margin: 0.65rem 0; }
.card p:first-of-type { margin-top: 0.25rem; }

.tip-label {
  color: var(--burgundy);
  font-weight: 700;
}

.blurb {
  padding: 0.7rem 0.85rem;
  margin: 0.7rem 0;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(240, 221, 196, 0.65), rgba(250, 246, 240, 0.4));
  border-left: 3px solid var(--orange);
}
.blurb p { margin: 0; }

/* —— Filters —— */
.filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.7rem;
}

.flabel {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--burgundy);
  margin-right: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.filters button {
  border: 1.5px solid var(--orange);
  background: #fff;
  color: var(--burgundy);
  border-radius: 999px;
  padding: 0.4rem 0.9rem;
  margin: 0;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 0.88rem;
  font-weight: 600;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s, border-color 0.15s;
}

.filters button:hover {
  background: var(--cream-deep);
  box-shadow: 0 1px 5px rgba(211, 84, 26, 0.25);
}

.filters button.on {
  background: linear-gradient(135deg, var(--orange) 0%, var(--burgundy) 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(139, 30, 14, 0.35);
}

/* —— Table —— */
.table-wrap {
  overflow-x: auto;
  margin: 0.8rem 0 1.05rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
}

thead th {
  background: linear-gradient(180deg, #f3e2c8, #e8d0ae);
  color: var(--burgundy-deep);
  font-weight: 700;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.045em;
  padding: 0.7rem 0.8rem;
  text-align: left;
  border-bottom: 2px solid var(--gold);
  white-space: nowrap;
}

td {
  padding: 0.62rem 0.8rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}

tbody tr:nth-child(even) { background: rgba(250, 244, 232, 0.8); }
tbody tr:hover { background: rgba(245, 224, 160, 0.32); }
tbody tr:last-child td { border-bottom: none; }

.disc {
  color: var(--wine);
  font-weight: 700;
  white-space: nowrap;
}

/* —— Badges —— */
.badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  color: #fff;
  white-space: nowrap;
  letter-spacing: 0.02em;
}

.b-costco { background: linear-gradient(135deg, #c8102e, #9a0e24); }
.b-sams { background: linear-gradient(135deg, #0067a0, #004d78); }
.b-bjs { background: linear-gradient(135deg, #7a1f5c, #5a1644); }

/* —— Advertisement slot (AdSense-ready) —— */
.ad-slot {
  text-align: center;
  padding: 0.85rem 1rem 1.1rem;
  background:
    linear-gradient(180deg, rgba(255, 252, 246, 0.95), rgba(250, 240, 220, 0.9));
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

.ad-label {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  background: rgba(240, 221, 196, 0.7);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
  margin-bottom: 0.55rem;
}

.ad-slot-inner {
  min-height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background:
    repeating-linear-gradient(
      -45deg,
      rgba(212, 160, 23, 0.06),
      rgba(212, 160, 23, 0.06) 8px,
      rgba(255, 252, 246, 0.4) 8px,
      rgba(255, 252, 246, 0.4) 16px
    );
  border: 1px solid rgba(228, 201, 168, 0.85);
}

.ad-ready-note {
  margin: 0.75rem !important;
  font-size: 0.85rem;
  color: var(--muted);
  font-style: italic;
}

/* —— Partner / affiliate-ready note —— */
.partner-note {
  font-size: 0.82rem;
  color: var(--muted);
  margin: 0 0 0.85rem !important;
  padding: 0.45rem 0.7rem;
  border-radius: 8px;
  background: rgba(240, 221, 196, 0.45);
  border-left: 3px solid var(--gold);
}

.partner-note a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}
.partner-note a:hover {
  color: var(--burgundy);
  text-decoration: underline;
}

/* Amazon compare (secondary to club deal info) */
.amazon-compare {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--muted);
  font-weight: 400;
}
.amazon-link {
  color: #875a1f;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dotted rgba(135, 90, 31, 0.45);
}
.amazon-link:hover {
  color: var(--burgundy);
  border-bottom-color: var(--burgundy);
}
.amazon-ftc {
  font-size: 0.72rem;
  color: var(--muted);
  font-weight: 400;
}
.deal-item {
  display: inline;
}

/* —— Newsletter / Kit-ready signup —— */
.signup-card {
  text-align: center;
  background:
    linear-gradient(135deg, #fff8e7 0%, #fde9b8 55%, #f7d9a0 100%);
  border: 1px solid rgba(212, 160, 23, 0.55);
  box-shadow: var(--shadow);
}

.signup-card h3 {
  margin-bottom: 0.35rem;
}

.signup-lead {
  font-size: 0.95rem;
  color: var(--muted);
  margin: 0.35rem 0 0.5rem !important;
}

.signup-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 0.75rem;
}

.signup-form input[type="email"] {
  padding: 0.5rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 0.95rem;
  min-width: 200px;
  background: #fff;
}

.signup-form button {
  padding: 0.5rem 1.1rem;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--burgundy), var(--orange));
  color: #fff;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: not-allowed;
  opacity: 0.7;
}

.signup-status {
  font-size: 0.82rem;
  color: var(--muted);
  margin: 0.85rem 0 0 !important;
  line-height: 1.45;
}

.signup-status a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}
.signup-status a:hover {
  color: var(--burgundy);
  text-decoration: underline;
}

.signup-status code {
  font-size: 0.78rem;
  background: rgba(255, 252, 246, 0.85);
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  border: 1px solid var(--border);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Legacy dashed placeholder (unused after Phase 2) */
.ph {
  border: 2px dashed var(--gold);
  background: linear-gradient(135deg, #fff8e7 0%, #fde9b8 100%);
  text-align: center;
}

/* —— Sources —— */
.srcs {
  padding-left: 1.1rem;
  margin: 0.5rem 0;
}

.srcs li {
  margin: 0.4rem 0;
  font-size: 0.88rem;
  color: var(--muted);
}

.srcs a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}
.srcs a:hover {
  color: var(--burgundy);
  text-decoration: underline;
}

.meta-note {
  font-size: 0.8rem;
  color: var(--muted);
  margin-top: 0.75rem !important;
}

/* —— Footer —— */
footer {
  text-align: center;
  font-size: 0.8rem;
  padding: 2rem 1.25rem 2.5rem;
  color: var(--muted);
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, transparent, var(--cream-deep));
  position: relative;
}

.footer-accent {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
  opacity: 0.7;
}

.footer-accent span {
  width: 20px;
  height: 20px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.footer-accent .fa {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d3541a' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E");
}
.footer-accent .fp {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='14' rx='8' ry='6.5' fill='%23e07020'/%3E%3Crect x='11' y='6' width='2' height='3.5' rx='1' fill='%233d6b2a'/%3E%3C/svg%3E");
}
.footer-accent .fm {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d4a017' d='M12 1l1.5 5.5L18 4l-2 5.5L22 11l-6 1.5 2.5 5.5-5-3.5V22h-1.5v-7.5l-5 3.5L9 12.5 3 11l6-1.5L7 4l4.5 2.5L12 1z'/%3E%3C/svg%3E");
}
.footer-accent .dot-sep {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  opacity: 0.9;
}

footer a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}
footer a:hover { text-decoration: underline; }

/* —— About / Privacy —— */
.page-title-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
}

.page-title-row .accent {
  width: 1.4rem;
  height: 1.4rem;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d3541a' d='M12 2C9 6.5 4.5 9.5 1.5 11c4.5 1 8.5 4 10.5 9.5 1.5-4.5 5-7.5 10.5-9.5C19.5 9.5 15 6.5 12 2z'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity: 0.85;
}
.page-title-row .accent.maple {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23b84318' d='M12 1l1.5 5.5L18 4l-2 5.5L22 11l-6 1.5 2.5 5.5-5-3.5V22h-1.5v-7.5l-5 3.5L9 12.5 3 11l6-1.5L7 4l4.5 2.5L12 1z'/%3E%3C/svg%3E");
}

/* —— Mobile —— */
@media (max-width: 640px) {
  .season-ribbon { font-size: 0.68rem; letter-spacing: 0.08em; padding: 0.35rem 0.75rem; }
  .season-ribbon::before, .season-ribbon::after { display: none; }

  .header-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 0.9rem 1rem;
  }
  .nav { width: 100%; }
  .nav a {
    flex: 1;
    text-align: center;
    font-size: 0.82rem;
    padding: 0.4rem 0.5rem;
  }

  .hero { padding: 1rem 1rem 0.2rem; }
  .hero-banner-bg { padding: 1.25rem 1.15rem 1.15rem; }
  .hero-float.leaf1 { width: 26px; height: 26px; right: 0.8rem; }
  .hero-float.leaf2 { right: 2.6rem; width: 18px; height: 18px; top: 2.8rem; }
  .hero-float.maple { display: none; }
  .hero-float.pump1 { width: 32px; height: 32px; right: 0.9rem; }
  .hero-float.pump2 { right: 3.2rem; width: 20px; height: 20px; }
  .hero-content { max-width: 100%; padding-right: 2.5rem; }

  .leaf-strip { padding: 0 1rem; height: 22px; }
  .leaf-strip span { width: 12px; height: 12px; }

  main { padding: 0.5rem 1rem 1.5rem; }
  .card { padding: 1.05rem; }

  thead { display: none; }
  tr {
    display: block;
    border-bottom: 1px solid var(--border);
    padding: 0.7rem 0.55rem;
  }
  tbody tr:nth-child(even) { background: rgba(240, 221, 196, 0.55); }
  td {
    display: block;
    border: 0;
    padding: 0.15rem 0.35rem;
  }
  td:first-child { margin-bottom: 0.2rem; }
  .table-wrap { border: none; overflow: visible; }
  .filters button { font-size: 0.82rem; padding: 0.35rem 0.7rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .filters button, .nav a { transition: none; }
}

/* —— Monthly archive pages —— */
.archive-nav {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.breadcrumb {
  margin: 0 0 0.65rem;
  font-size: 0.88rem;
  color: var(--muted);
}
.breadcrumb a {
  color: var(--orange);
  font-weight: 600;
  text-decoration: none;
}
.breadcrumb a:hover { text-decoration: underline; color: var(--burgundy); }
.breadcrumb span[aria-hidden="true"] { margin: 0 0.35rem; opacity: 0.6; }

.archive-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}
.archive-pill {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 700;
  padding: 0.38rem 0.85rem;
  border-radius: 999px;
  text-decoration: none;
  color: var(--burgundy);
  background: #fff;
  border: 1.5px solid var(--orange);
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.archive-pill:hover {
  background: linear-gradient(135deg, var(--orange) 0%, var(--burgundy) 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(139, 30, 14, 0.3);
}

.highlight-list {
  margin: 0.4rem 0 0.8rem;
  padding-left: 1.2rem;
}
.highlight-list li {
  margin: 0.45rem 0;
  line-height: 1.45;
}
.highlight-list .meta-note {
  display: inline;
  margin: 0 !important;
  font-size: 0.85rem;
}

@media (max-width: 640px) {
  .archive-pill { font-size: 0.78rem; padding: 0.35rem 0.7rem; }
}