@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@400;500;600;700;800&display=swap');

:root {
  --color-primary: #2E9D45;
  --color-primary-dark: #1F4F2A;
  --color-primary-light: #7AD767;
  --color-accent: #F59E0B;
  --color-accent-dark: #EA7A13;
  --color-highlight: #F4FBEF;
  --color-bg: #FAFCF7;
  --color-surface: #ffffff;
  --color-text: #243325;
  --color-text-muted: #5F7162;
  --color-border: #DCE8D6;
  --color-success: #16a34a;
  --color-danger: #dc2626;
  --color-warning: #F59E0B;
  --font-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-bengali: 'Noto Sans Bengali', 'Nirmala UI', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: 3.2rem;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 24px;
  --shadow-sm: 0 4px 14px rgba(31, 79, 42, .06);
  --shadow-md: 0 16px 34px rgba(31, 79, 42, .11);
  --shadow-lg: 0 30px 70px rgba(31, 79, 42, .15);
  --container-max: 1380px;
  --transition-fast: 160ms ease;
  --transition-base: 260ms ease;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: 1.5;
}
[hidden] { display: none !important; }
img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

h1, h2, h3, h4 {
  color: var(--color-primary-dark);
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.2;
}
h1 { font-size: var(--fs-2xl); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }
p { color: var(--color-text); }
[lang="bn"], body { font-feature-settings: "kern" 1; }
[lang="bn"], h1, h2, h3, h4, p, button, input, select, textarea { font-family: var(--font-bengali); font-style: normal; letter-spacing: 0; }
.price { font-family: var(--font-body); font-variant-numeric: tabular-nums; }
.text-muted { color: var(--color-text-muted); }
.container { width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: 16px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
:focus-visible { outline: 3px solid rgba(46, 157, 69, .28); outline-offset: 2px; }

@media (min-width: 768px) {
  h1 { font-size: var(--fs-3xl); }
  h2 { font-size: var(--fs-2xl); }
  .container { padding-inline: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}