/* Happy Mom — homepage landing template styles
   Design tokens: see the site's active Novamira design (happy-mom-warm-care). */

@font-face {
  font-family: 'Fraunces';
  src: url('fonts/fraunces-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('fonts/fraunces-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('fonts/fraunces-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nunito Sans';
  src: url('fonts/nunito-sans-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nunito Sans';
  src: url('fonts/nunito-sans-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nunito Sans';
  src: url('fonts/nunito-sans-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nunito Sans';
  src: url('fonts/nunito-sans-800-normal.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}


/* Bangla (Bengali) script fonts for the Bangladesh-localized homepage.
   Fraunces/Nunito Sans have no Bengali glyphs, so these are appended
   as fallbacks in the same font-family stacks: the browser renders
   Bengali characters from these and Latin characters (prices, etc.)
   from the original declared fonts, automatically, per character. */
@font-face {
  font-family: 'Baloo Da 2';
  src: url('fonts/baloo-da-2-600-normal.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Baloo Da 2';
  src: url('fonts/baloo-da-2-700-normal.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hind Siliguri';
  src: url('fonts/hind-siliguri-400-normal.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hind Siliguri';
  src: url('fonts/hind-siliguri-600-normal.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hind Siliguri';
  src: url('fonts/hind-siliguri-700-normal.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
:where(html.happy-mom-landing-doc, body.happy-mom-landing) {
  margin: 0;
}

body.happy-mom-landing {
  background: #FFFBF7;
  color: #3D3436;
  font-family: 'Nunito Sans', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.happy-mom-landing :where(*) {
  box-sizing: border-box;
}

body.happy-mom-landing :where(a) {
  color: inherit;
  text-decoration: none;
}

body.happy-mom-landing a.nav-link:hover { color: #E8919B; }
body.happy-mom-landing a.foot-link:hover { color: #FFFFFF; }
body.happy-mom-landing a.text-link:hover { opacity: 0.75; }

body.happy-mom-landing :where(button) {
  cursor: pointer;
  font-family: inherit;
  border: none;
}

body.happy-mom-landing .btn-primary:hover { opacity: 0.9; }
body.happy-mom-landing .cat-card { transition: transform 0.15s ease; }
body.happy-mom-landing .cat-card:hover { transform: translateY(-4px); }
body.happy-mom-landing .prod-card { transition: transform 0.15s ease; }
body.happy-mom-landing .prod-card:hover { transform: translateY(-4px); }
body.happy-mom-landing input::placeholder { color: #B9A9A6; }

@media (prefers-reduced-motion: reduce) {
  body.happy-mom-landing .cat-card,
  body.happy-mom-landing .prod-card {
    transition: none;
  }
}

/* ===== Mobile nav (pure CSS, no JS) ===== */
body.happy-mom-landing .mobile-nav-checkbox { display: none; }
body.happy-mom-landing .mobile-nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  cursor: pointer;
}

/* ===== Responsive ===== */
@media (max-width: 900px) {
  body.happy-mom-landing .site-header-inner { flex-wrap: wrap !important; row-gap: 0 !important; }
  body.happy-mom-landing .header-icons { display: none !important; }
  body.happy-mom-landing .mobile-nav-toggle { display: flex !important; }

  body.happy-mom-landing .site-nav {
    display: none !important;
    width: 100% !important;
    order: 5;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    padding: 14px 0 6px 0 !important;
    margin-top: 10px !important;
    border-top: 1px solid #F1E4DD;
  }
  body.happy-mom-landing .site-nav a { padding: 8px 0 !important; width: 100%; }
  body.happy-mom-landing .mobile-nav-checkbox:checked ~ .site-header-inner .site-nav,
  body.happy-mom-landing .site-header-inner:has(.mobile-nav-checkbox:checked) .site-nav {
    display: flex !important;
  }

  body.happy-mom-landing .hero-row { flex-direction: column !important; gap: 36px !important; }
  body.happy-mom-landing .hero-col { width: 100% !important; }
  body.happy-mom-landing .hero-illustration-col { order: -1; max-width: 360px; margin: 0 auto; }
  body.happy-mom-landing .hero-title { font-size: 36px !important; }
  body.happy-mom-landing #top { padding: 40px 20px !important; }

  body.happy-mom-landing .trust-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 20px !important; }
  body.happy-mom-landing .category-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 16px !important; }
  body.happy-mom-landing .product-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 16px !important; }
  body.happy-mom-landing .tips-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
  body.happy-mom-landing .testimonial-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
  body.happy-mom-landing .footer-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 28px !important; }

  body.happy-mom-landing .consult-row { flex-direction: column !important; padding: 32px 24px !important; gap: 28px !important; }
  body.happy-mom-landing .consult-col-text, body.happy-mom-landing .consult-col-media { width: 100% !important; }

  body.happy-mom-landing #categories,
  body.happy-mom-landing #shop,
  body.happy-mom-landing #tips,
  body.happy-mom-landing .testimonials-section { padding: 56px 20px !important; }
  body.happy-mom-landing #consult { padding: 0 20px 56px 20px !important; }
  body.happy-mom-landing .trust-section { padding: 32px 20px !important; }
  body.happy-mom-landing .newsletter-section { padding: 48px 20px !important; }

  body.happy-mom-landing h2 { font-size: 28px !important; }
  body.happy-mom-landing .consult-col-text h2 { font-size: 26px !important; }
}

@media (max-width: 560px) {
  body.happy-mom-landing .hero-title { font-size: 30px !important; }
  body.happy-mom-landing h2 { font-size: 24px !important; }
  body.happy-mom-landing .trust-grid,
  body.happy-mom-landing .category-grid,
  body.happy-mom-landing .product-grid,
  body.happy-mom-landing .footer-grid { grid-template-columns: 1fr !important; }
  body.happy-mom-landing .site-header-actions a[href="#consult"] {
    padding: 9px 14px !important;
    font-size: 13px !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.happy-mom-landing .site-nav { transition: none; }
}