@import url("https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap");
:root{
  --primary-color: #1d3557;
  --secondary-color: #457b9d;
  --accent-color: #457b9d;
  --background-color: #f0f2f5;
  --text-color: #333333;
  --heading-font: 'Merriweather', sans-serif;
  --body-font: 'Poppins', sans-serif;
  --button-radius: 999px;
  --button-bg: rgba(230, 57, 70, 0.12);
  --button-border: 1px solid transparent;
  --button-text: #457b9d;
  --button-padding: 6px 14px;
  --card-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  --card-border: 1px solid rgba(255,255,255,0.45);
  --card-bg: rgba(255,255,255,0.75);
  --card-backdrop: blur(10px);
  --logo-left: auto;
  --logo-right: 16px;
  --logo-top: auto;
  --logo-bottom: 16px;
  --hero-text-left: 16px;
  --hero-text-right: auto;
  --hero-text-top: 16px;
  --hero-text-bottom: auto;
  --hero-text-align: left;
  --hero-text-transform: none;
  --hero-title-left: 16px;
  --hero-title-right: auto;
  --hero-title-top: 16px;
  --hero-title-bottom: auto;
  --hero-title-align: left;
  --hero-title-transform: none;
  --hero-date-left: 16px;
  --hero-date-right: auto;
  --hero-date-top: auto;
  --hero-date-bottom: 16px;
  --hero-date-align: left;
  --hero-date-transform: none;
  --hero-date-offset: 6px;
}