/* Custom styles to apply the Heebo font */
body {
    font-family: 'Heebo', sans-serif;
}
/* Custom style for smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* CSS Variables for theming. Default is Pink */
:root {
    --color-brand-50: 255 241 242;
    --color-brand-100: 255 228 230;
    --color-brand-200: 254 205 211;
    --color-brand-300: 253 164 175;
    --color-brand-400: 251 113 133;
    --color-brand-500: 244 63 94;
    --color-brand-600: 225 29 72;
    --color-brand-700: 190 18 60;
    --color-brand-800: 159 18 57;
    --color-brand-900: 136 19 55;
}

/* Custom focus ring color using CSS variables */
.focus-ring-brand:focus {
    --tw-ring-color: rgb(var(--color-brand-500));
}

/* Styles for the connecting line in 'How it works' section */
.timeline-connector {
    position: absolute;
    top: 2rem;
    right: 16.7%;
    left: 16.7%;
    height: 2px;
    background-color: rgb(var(--color-brand-200));
    z-index: 0;
}