/* ======= Variables ======= */
/* :root {
  --brand-primary: #3A4B3F;
  --brand-secondary: #C3A86B;
  --neutral-dark: #090808;
  --neutral-light: #F6F6ED;
} */

:root{
    --outercircle-clr: #3B4F44;
}

/* ======= Circle Content ======= */

.c-circlecontent{
    background-color: var(--brand-primary) !important;
    border-radius: 50% !important;
    aspect-ratio: 1 !important;
}
.c-circlecontent::after{
    content: "";
    width: calc(100% + 16px) !important;
    height: calc(100% + 16px) !important;
    border-radius: 50%;
    /* background-color: hotpink; */
    border: 1px var(--brand-secondary) solid;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

@media (max-width: 1024px){
    .c-circlecontent{
        max-width: 320px;
    }
}