.ds-card{--card-bg:var(--color-surface-default);--card-radius:var(--radius-none);--card-accent:var(--color-border-default);background:var(--card-bg);border-radius:var(--card-radius);overflow:hidden;position:relative;transition:all .2s ease}.ds-card:before{background:var(--card-accent);content:"";position:absolute}.ds-card--border-left:before{bottom:0;left:0;top:0;width:4px}.ds-card--border-right:before{bottom:0;right:0;top:0;width:4px}.ds-card--border-top:before{height:2px;left:0;right:0;top:0}.ds-card--border-bottom:before{bottom:0;height:4px;left:0;right:0}.ds-card:is([ds-data-context=company-degree]){--card-radius:var(--radius-default)}.ds-card:is([ds-data-context=company-degree],[ds-data-context=course-my-degree]){--card-accent:var(--color-brand-secondary-light);--card-bg:var(--color-surface-brand);transition:background-color 1s ease,transform 1s ease}.ds-card:is([ds-data-context=company-degree],[ds-data-context=course-my-degree]):hover{--card-bg:var(--linear-gradient-primary);--card-accent:var(--linear-gradient-primary);transform:translateY(-4px)}.ds-card:is([ds-data-context=company-degree],[ds-data-context=course-my-degree]):hover *{color:var(--color-surface-brand);transition:color .1s ease,transform .1s ease}.ds-card[ds-data-context=company-degree]:hover .ds-progress{--progress-bar-color:var(--color-surface-brand);--progress-bar-color-foreground:hsla(0,0%,100%,.3)}.ds-card[ds-data-context=guide-alura],.ds-card[ds-data-context=guide]{--card-accent:var(--color-brand-secondary-light);--card-bg:var(--color-surface-brand);--card-radius:var(--radius-lg);transition:background-color 1s ease,transform 1s ease}.ds-card[ds-data-context=guide-alura]:hover,.ds-card[ds-data-context=guide]:hover{--card-bg:var(--linear-gradient-primary);--card-accent:var(--linear-gradient-primary)}.ds-card[ds-data-context=guide-alura]:hover *,.ds-card[ds-data-context=guide]:hover *{color:var(--color-surface-brand);transition:color .1s ease,transform .1s ease}.ds-card[ds-data-context=guide-alura]:hover .ds-progress,.ds-card[ds-data-context=guide]:hover .ds-progress{--progress-bar-color:var(--color-surface-brand);--progress-bar-color-foreground:hsla(0,0%,100%,.3)}.ds-card[ds-data-context=guide-alura],.ds-card[ds-data-context=guide-alura]:hover{--card-accent:var(--color-brand-primary)}@media (max-width:767px) and (min-width:491px){.ds-card[ds-data-context=company-degree]{width:calc(50% - var(--layout-gap-x, var(--layout-gap, 0px))*1/2)}}@media (max-width:490px){.ds-card[ds-data-context=company-degree]{width:100%}}