@charset "UTF-8";

:root {
    /* COLOURS */
    --r-white: rgb(255, 250, 252);
    --r-white-75: rgba(255, 250, 252, 0.75);
    --r-white-50: rgba(255, 250, 252, 0.5);
    --r-white-15: rgba(255, 250, 252, 0.15);
    --r-black: #212529;
    --r-violet: hsl(288, 31%, 63%);
    --r-violet-25: hsla(288, 31%, 63%, 0.25);
    --text-shadow: 1px 1px 2px rgba(33, 37, 41, 0.10);
    --text-shadow-2: 2px 2px 2px rgba(10, 10, 10, .5);
    --icon-shadow: 0 0 8px rgba(255, 252, 253, 0.15);
}

.bg-r-black {
    background-color: var(--r-black);
}

body * {
    color: var(--r-white);
}

.nav-tooltip-style {
    --bs-tooltip-bg: hsla(288, 31%, 63%, 0.726);
    --bs-tooltip-color: var(--r-white);
}

.tooltip-inner {
    font-weight: 600;
    letter-spacing: .5px;
    text-shadow: var(--text-shadow);
}

.top-30 {
    top: 35%;
}

.font-dm-sans {
    font-family: "DM Sans", sans-serif !important;
} 

.font-serif {
    font-family: 'Playfair Display', serif;
}

.text-shadow {
    text-shadow: var(--text-shadow);
}

.text-shadow-2 {
    text-shadow: var(--text-shadow-2);
}

.icon-shadow {
    text-shadow: var(--icon-shadow);
}

.btn-outline-violet {
    --bs-btn-color: var(--r-violet);
    --bs-btn-border-color: var(--r-violet);
    --bs-btn-focus-shadow-rgb: 255, 250, 252;
    --bs-btn-active-color: var(--r-black);
    --bs-btn-active-bg: var(--r-violet);
    --bs-btn-active-border-color: var(--r-violet);
    --bs-btn-active-shadow: inset 0 3px 5px var(--r-violet-25);
    --bs-btn-disabled-color: var(--r-white-50);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--r-violet-25);
    --bs-gradient: none;
}

#btnCV:hover {
    color: var(--r-white);
    border-color: var(--r-white);
    background-color: var(--r-violet-25); 
    backdrop-filter: blur(4px); 
    -webkit-backdrop-filter: blur(4px);
}

.card {
    border-bottom: 2px solid var(--r-white-15);
    border-right: 2px solid var(--r-white-15);
}

.card:has(.btn:hover) {
    cursor: pointer;
    box-shadow: 0px 0px 4px 4px var(--r-violet);
    transition: all .2s ease-in-out;
    background-color: var(--r-violet-25) !important;
}

header ul li {
    transition: all .3s ease-in-out;
}

header ul li:hover {
    transform: rotate(360deg);
}
/* 
header ul li:hover i {
    color: var(--r-violet) !important;
} */

.progress-bar,
footer {
    text-shadow: none !important;
}

.progress, .progress-stacked {
    background-color: var(--r-white-50);
}

@media (prefers-reduced-motion: reduce) {
    .progress-bar-animated {
        animation: 1s linear infinite progress-bar-stripes !important;
    }
}

.fw-200 {
    font-weight: 200;
    letter-spacing: .5px;
}

.fw-200-1 {
    font-weight: 250;
    color: var(--r-white-75);
}

p.fw-200-1 > span {
    color: var(--r-white);
    font-weight: 400;
}

.fw-300 {
    font-weight: 300;
    letter-spacing: .5px;
    color: var(--r-white-75);
}

.fs-85 {
    font-size: .85rem;
    letter-spacing: .5px;
}

/* footer {
   background: rgba(248, 249, 250, 0.85); 
}*/

/* 
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    header {
        height: 114vh !important;
    }
}
 */