@import url('https://fonts.googleapis.com/css2?family=Geologica:wght,wdth@100..900,75..125&family=Jacques+Francois&display=swap');

:root {
    --white:      #FFFFFF;
    --beige:      #FBEBD9;
    --blue-mid:   #95B1BC;
    --blue-dark:  #5D688C;
    --red:        #F9595F;

    --text-main:  #2D3142;
    --text-muted: #9AACB8;
    --border:     #E8D8C8;

    --font-main: 'Geologica', sans-serif;
    --font-logo: 'Jacques Francois', serif;

    --radius-sm:   8px;
    --radius-md:   14px;
    --radius-lg:   20px;
    --radius-full: 100px;

    --shadow-card: 0 2px 12px rgba(93, 104, 140, 0.08);
    --transition:  0.2s ease;
}

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 15px;
    color: var(--text-main);
    background: var(--white);
    -webkit-font-smoothing: antialiased;
}

a {
    text-decoration: none;
    color: inherit;
    transition: opacity var(--transition);
}

a:hover { opacity: 0.75; }

img { display: block; max-width: 100%; }

button {
    cursor: pointer;
    border: none;
    background: none;
    font-family: var(--font-main);
}

input, select, textarea { font-family: var(--font-main); }

ul, ol { list-style: none; }
