/* Herbal Ifocus — Dark & Gold landing */

:root {
  --mp-bg: #070707;
  --mp-bg-2: #101010;
  --mp-bg-3: #181818;
  --mp-surface: #14110c;
  --mp-border: #3a3018;
  --mp-gold: #d4af37;
  --mp-gold-soft: #c9a227;
  --mp-gold-bright: #f5e6a8;
  --mp-gold-dim: #8a7340;
  --mp-text: #fff6df;
  --mp-text-body: #efe2bf;
  --mp-text-muted: #c4b384;
  --mp-red: #e53935;
  --mp-green: #43a047;
  --mp-font: "Noto Sans Gujarati", "Mukta Vaani", "Hind Vadodara", system-ui, sans-serif;
}

html { scroll-behavior: smooth; }

html,
body {
  background: var(--mp-bg) !important;
  color: var(--mp-text-body) !important;
  font-family: var(--mp-font) !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
  letter-spacing: 0.01em !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
}

.storybody_news_content___Fx0V,
.storybody_news_content_text__g8WyZ,
.layout_children_container,
.box_default__riuyC {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

:root,
body {
  --mui-palette-common-background: #070707 !important;
  --mui-palette-background-default: #070707 !important;
  --mui-palette-background-paper: #101010 !important;
  --mui-palette-text-primary: #fff6df !important;
  --mui-palette-text-secondary: #c4b384 !important;
  --Text-Default-Primary-Text-default-primary-ressed: #fff6df !important;
  --Black-Black-00: #070707 !important;
  --White-White-00: #fff6df !important;
  --font-hindi-primary: var(--mp-font) !important;
}

body *,
body *::before,
body *::after {
  font-family: var(--mp-font) !important;
}

.layout_children_container {
  max-width: 820px;
  margin: 0 auto;
  padding-bottom: 110px !important;
}

.layout_children_container p,
.layout_children_container li,
.layout_children_container span,
.layout_children_container div,
.layout_children_container font {
  color: #f7f1de !important;
  font-size: clamp(17px, 2.6vw, 20px) !important;
  line-height: 1.85 !important;
  font-weight: 500 !important;
}

.layout_children_container strong,
.layout_children_container b {
  color: var(--mp-gold-bright) !important;
  font-weight: 800 !important;
}

.StoryHeader_story_title_text__cdXP0,
.styles_story_title_text__Be3V7,
h1.StoryHeader_story_title_text__cdXP0 {
  color: var(--mp-gold) !important;
  font-size: clamp(24px, 5vw, 34px) !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
}

.layout_children_container h2,
.layout_children_container h3,
.layout_children_container h4 {
  color: var(--mp-gold) !important;
  font-size: clamp(20px, 3.5vw, 26px) !important;
  line-height: 1.5 !important;
  font-weight: 800 !important;
  margin: 1.4em 0 0.6em !important;
}

.header_upper_header__YL4xa,
.header_lower_header__8lhxK,
.header_bottom_nav_container__r1l8d,
.bottom-nav_bottom_nav_wrapper__ZPP0l {
  background: #050505 !important;
  border-color: var(--mp-border) !important;
}

.header_date_font__OLaRI,
.header_categories_text___1waY,
.header_epaper_text__8UaTH,
.header_nav_text__7U8sM,
.bottom-nav_nav_text__JvxjE,
.MuiTypography-root {
  color: var(--mp-gold-bright) !important;
}

.prod-link {
  color: var(--mp-gold) !important;
  font-weight: 800 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.layout_children_container img,
img[src*="ifocus"] {
  max-width: 100%;
  height: auto;
  border-radius: 14px;
  display: block;
  margin: 18px auto;
}

img[src*="ifocus"],
img.product-img,
.product-img {
  display: block !important;
  margin: 20px auto !important;
  max-width: min(640px, 96%) !important;
  width: 100% !important;
  border: 1px solid var(--mp-gold-dim) !important;
  border-radius: 14px !important;
  background: #000 !important;
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.25), 0 18px 50px rgba(0, 0, 0, 0.55) !important;
}

.mp-cta {
  display: block;
  width: min(420px, 92%);
  margin: 28px auto;
  padding: 16px 22px;
  text-align: center;
  text-decoration: none !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #111 !important;
  border-radius: 999px;
  background: linear-gradient(180deg, #f5e6a8 0%, #d4af37 48%, #a8851f 100%);
  box-shadow: 0 10px 28px rgba(212, 175, 55, 0.35);
}

.mp-benefits {
  display: grid;
  gap: 10px;
  width: min(640px, 94%);
  margin: 22px auto;
}

.mp-benefit {
  background: linear-gradient(90deg, #1a160e, #12100a);
  border: 1px solid var(--mp-gold-dim);
  border-radius: 12px;
  padding: 14px 16px;
  color: var(--mp-gold-bright) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

.mp-benefit span {
  color: var(--mp-gold) !important;
  margin-right: 8px;
}

.mp-urgency {
  width: min(640px, 94%);
  margin: 18px auto;
  padding: 12px 16px;
  border-radius: 10px;
  background: rgba(229, 57, 53, 0.12);
  border: 1px solid rgba(229, 57, 53, 0.45);
  color: #ffcdd2 !important;
  text-align: center;
  font-weight: 700 !important;
}

.order-form-container {
  background: linear-gradient(180deg, #1a160e 0%, #0d0d0d 100%) !important;
  border: 2px solid var(--mp-gold) !important;
  border-radius: 16px !important;
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.25), 0 24px 70px rgba(0, 0, 0, 0.6) !important;
  padding: 26px 18px !important;
  width: min(560px, 96%) !important;
  margin: 0 auto !important;
}

.order-form-container h1,
.order-form-container h2,
.order-form-container p,
.order-form-container label,
.order-form-container span,
.order-form-container font,
.order-form-container b,
.order-form-container .mp-offer-title,
.order-form-container .mp-offer-title b {
  color: var(--mp-gold-bright) !important;
}

.order-form-container label {
  display: block;
  text-align: left;
  margin-bottom: 6px;
  font-size: 16px !important;
  color: var(--mp-gold) !important;
}

.order-form-container [style*="line-through"] {
  color: #ef5350 !important;
}

.order-form-container [style*="color: green"],
.order-form-container [style*="color:green"] {
  color: #66bb6a !important;
}

.order-form input,
.order-form-container input,
.order-form-container textarea,
.form_item {
  background: #0a0a0a !important;
  color: var(--mp-text) !important;
  border: 1.5px solid var(--mp-gold-dim) !important;
  border-radius: 10px !important;
  padding: 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  font-size: 17px !important;
  min-height: 50px;
}

.order-form-container textarea.form_item {
  min-height: 90px;
  resize: vertical;
}

.order-form-container input:focus,
.order-form-container textarea:focus {
  outline: none !important;
  border-color: var(--mp-gold) !important;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.22) !important;
}

.green-button,
button.green-button,
.order-form-container button[type="submit"] {
  background: linear-gradient(180deg, #f5e6a8 0%, #d4af37 45%, #a8851f 100%) !important;
  color: #111 !important;
  border: none !important;
  border-radius: 12px !important;
  font-weight: 900 !important;
  font-size: 20px !important;
  padding: 16px 28px !important;
  width: min(100%, 420px) !important;
  cursor: pointer;
}

.mp-sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
  background: rgba(8, 8, 8, 0.96);
  border-top: 1px solid var(--mp-gold);
  pointer-events: auto;
}

.mp-sticky-copy {
  flex: 1;
  text-align: center;
  color: var(--mp-gold-bright);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  pointer-events: none;
}

.mp-sticky-copy small {
  display: block;
  color: #ef9a9a;
  font-size: 12px;
  margin-top: 2px;
}

.mp-sticky a {
  flex-shrink: 0;
  text-decoration: none;
  font-weight: 900;
  font-size: 14px;
  padding: 12px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

.mp-call-btn {
  color: #fff !important;
  background: linear-gradient(180deg, #43a047, #2e7d32) !important;
}

.mp-order-btn {
  color: #111 !important;
  background: linear-gradient(180deg, #f5e6a8, #d4af37) !important;
}

@media (max-width: 768px) {
  .header_bottom_nav_container__r1l8d { display: none !important; }
  .mp-sticky-copy { font-size: 12px; }
  .mp-call-btn, .mp-order-btn { font-size: 13px; padding: 11px 12px; }
}
