.s-profile{padding:3.75rem 0}@media only screen and (max-width: 987px){.s-profile{padding:2.5rem 0}}.s-profile__header{margin-bottom:1.875rem;padding:2.5rem;background:linear-gradient(135deg, var(--color-brand-3) 0%, var(--color-brand-2) 100%);border-radius:.75rem;color:var(--color-white)}@media only screen and (max-width: 987px){.s-profile__header{padding:1.5rem}}.s-profile__user-info{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:1.5rem}@media only screen and (max-width: 987px){.s-profile__user-info{flex-direction:column;text-align:center}}.s-profile__avatar{flex-shrink:0}.s-profile__avatar img{width:5rem;height:5rem;border:.188rem solid hsla(0,0%,100%,.3);border-radius:50%}@media only screen and (max-width: 987px){.s-profile__avatar img{width:4rem;height:4rem}}.s-profile__user-details{flex:1}.s-profile__username{font:400 var(--font-size-t-lg)/1.25 var(--font-text);margin:0 0 .5rem;color:var(--color-brand-1);text-transform:capitalize}@media only screen and (max-width: 987px){.s-profile__username{font:400 var(--font-size-t-md)/1.25 var(--font-text);margin:0 0 .375rem}}.s-profile__email{font:400 var(--font-size-t-sm)/1.25 var(--font-text);margin:0 0 .25rem;opacity:.9}.s-profile__member-since{font:400 var(--font-size-t-xs)/1.25 var(--font-text);margin:0;opacity:.8}.s-profile__tabs{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.5rem;margin-bottom:2rem;border-bottom:.125rem solid var(--color-light-grey)}@media only screen and (max-width: 987px){.s-profile__tabs{flex-wrap:wrap;gap:.25rem}}.s-profile__tab{font:400 var(--font-size-t-sm)/1.25 var(--font-text);padding:.875rem 1.5rem;background:none;border:none;border-bottom:.188rem solid rgba(0,0,0,0);cursor:pointer;color:var(--color-dark-grey);transition:all .3s}@media only screen and (max-width: 987px){.s-profile__tab{padding:.75rem 1rem}}.s-profile__tab:hover{color:var(--color-brand-3)}.s-profile__tab.active{border-bottom-color:var(--color-brand-3);color:var(--color-brand-3);font-weight:600}.s-profile__tab span{display:inline-block}.s-profile__content{min-height:25rem}.s-profile__panel{display:none}.s-profile__panel.active{display:block;animation:fade-in .3s ease-in}@keyframes fade-in{from{opacity:0;transform:translateY(0.625rem)}to{opacity:1;transform:translateY(0)}}
