/* ═══════════════════════════════════════════════════════
   MADHUBANI SUBTLE TOUCHES
   Traditional Bihar folk-art accents — light hand
═══════════════════════════════════════════════════════ */

/* ── 1. Dot-work body texture (Madhubani's signature stippling) ── */
body {
  background-image: radial-gradient(circle, rgba(123,29,0,0.042) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* ── 2. Announcement bar — scrolling promo ── */
.announcement-bar {
  background: #5a1200;
  color: #fdf6e3;
  padding: 9px 0;
  overflow: hidden;
  white-space: nowrap;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  position: relative;
  z-index: 99;
}
.announcement-track {
  display: inline-flex;
  gap: 0;
  animation: announce-scroll 30s linear infinite;
}
.announcement-track span {
  padding-right: 4rem;
  color: #fdf6e3;
}
.announcement-track .sep {
  color: #d4891a;
  padding-right: 4rem;
}
@keyframes announce-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* replace old spiky border with Madhubani art image */
.madhubani-border {
  display: block !important;
  height: 60px !important;
  background: none !important;
  background-image: url("https://i.ibb.co/B25qwXg1/madhubani-border.jpg") !important;
  background-repeat: repeat-x !important;
  background-size: auto 60px !important;
  overflow: visible !important;
  clip-path: none !important;
}
.madhubani-border::after { display: none !important; }

/* feature ticker — keep overflow:hidden for marquee, center text */
.feature-ticker { padding-top: 0 !important; padding-bottom: 0 !important; }
.feature-ticker .ticker-wrap { align-items: center; padding: 16px 0; }

/* ── 4. Section title — dotted Madhubani underline with diamond ── */
.section-title {
  position: relative;
  padding-bottom: 0.1rem;
}
.section-title::after {
  content: '◆';
  display: block;
  text-align: center;
  font-size: 0.55rem;
  color: #d4891a;
  letter-spacing: 6px;
  margin-top: 0.45rem;
  text-shadow: -10px 0 0 rgba(123,29,0,0.4), 10px 0 0 rgba(123,29,0,0.4);
}

/* ── 5. Product cards — Madhubani dotted outline frame ── */
.product-card {
  position: relative;
  outline: 1.5px dotted rgba(123,29,0,0.16);
  outline-offset: 5px;
  transition: outline-color 0.2s, outline-offset 0.2s;
}
.product-card:hover {
  outline-color: rgba(123,29,0,0.32);
  outline-offset: 3px;
}

/* ── 6. Feature ticker — double-border band (Madhubani frames) ── */
.feature-ticker {
  border-top:    2px solid rgba(123,29,0,0.18);
  border-bottom: 2px solid rgba(123,29,0,0.18);
  box-shadow:
    inset 0  3px 0 rgba(212,137,26,0.12),
    inset 0 -3px 0 rgba(212,137,26,0.12);
}

/* ── 7. Values section — inner frame (like Madhubani border panels) ── */
.values-section {
  position: relative;
}
.values-section::before {
  content: '';
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(123,29,0,0.07);
  border-radius: 4px;
  pointer-events: none;
}

/* ── 8. Heritage section — warm double border ── */
.heritage-section {
  border-top:    1px solid rgba(123,29,0,0.12);
  border-bottom: 1px solid rgba(123,29,0,0.12);
  box-shadow:
    inset 0  4px 0 rgba(212,137,26,0.07),
    inset 0 -4px 0 rgba(212,137,26,0.07);
}

/* ── 9. Hero section — top decorative strip ── */
.hero-section {
  border-top: 3px solid #7b1d00;
}

/* ── 10. Modal box — subtle Madhubani frame ── */
.modal-box {
  outline: 1.5px solid rgba(123,29,0,0.1);
  outline-offset: 6px;
}

/* ── 11. Blog / about / contact sections — warm card frames ── */
.blog-card,
.about-card,
.value-card,
[class*="blog-card"],
[class*="value-card"] {
  outline: 1px dotted rgba(123,29,0,0.12);
  outline-offset: 4px;
}

/* ── 12. Nav inner — subtle bottom border ── */
.nav-inner {
  border-bottom: 1px solid rgba(123,29,0,0.08);
}
