:root {
    --primary: #F4ECDF;
    --secondary: #FDFBF7;
    --accent: #314A67;
    --text: #6F7684;
    --border: #E8E3D9;
    --primary-button: #F5E8D2;
    --text-filter: brightness(0) saturate(100%) invert(48%) sepia(7%) saturate(730%) hue-rotate(182deg) brightness(93%) contrast(85%);
    --accent-filter: brightness(0) saturate(100%) invert(23%) sepia(47%) saturate(539%) hue-rotate(172deg) brightness(96%) contrast(88%);
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body {
    width: 100%;
    min-height: 100vh;
    font-family: Georgia, "Times New Roman", serif;
    color: var(--text);
    background-color: var(--primary);
}

main {
    flex: 1;
    margin: 24px;
}

a {
    color: var(--text);
}

a:hover {
    color: var(--accent);
}

.display-1 {
    font-weight: 700;
}

.image-icon {
    filter: var(--text-filter);
}

a:hover .image-icon {
    filter: var(--accent-filter);
}

span {
    margin: 0;
}

.btn {
    font-weight: 700;
    padding: 14px 24px;
    border-radius: 30px;
    transition: transform 0.2s ease, opacity 0.2s ease;
    letter-spacing: 0.04em;
}

.btn:hover {
    transform: translateY(-2px);
}

.btn-primary, .btn-primary:hover {
    color: var(--text);
    background-color: var(--primary-button);
    border-color: transparent;
}

.btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.btn-check:focus + .btn-primary,
.btn-check:active + .btn-primary:focus,
.btn-check:checked + .btn-primary:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-check:focus + .btn-primary,
.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.show > .btn-primary.dropdown-toggle {
    color: var(--text);
    background-color: var(--primary-button);
    border-color: transparent;
}

.btn-secondary, .btn-secondary:hover {
    color: #FFF;
    background-color: transparent;
    border: 1px solid #FFF;
}

.btn-secondary:focus,
.btn-secondary.active:focus,
.btn-secondary:active:focus,
.btn-check:focus + .btn-secondary,
.btn-check:active + .btn-secondary:focus,
.btn-check:checked + .btn-secondary:focus,
.show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: none;
}

.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.btn-check:focus + .btn-secondary,
.btn-check:active + .btn-secondary,
.btn-check:checked + .btn-secondary,
.show > .btn-secondary.dropdown-toggle {
    color: #FFF;
    background-color: transparent;
    border: 1px solid #FFF;
}