.component-methode-card{display:flex;flex-direction:row;height:100%;overflow:hidden;color:var(--color-text);background-color:#fff;border:solid 1px var(--color-grey-darker);border-radius:20px;transition:box-shadow 200ms ease,transform 200ms ease}@media screen and (min-width: 576px){.component-methode-card{flex-direction:column}}.component-methode-card:hover,.component-methode-card:focus-visible{text-decoration:none;transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,0,0,.1)}.component-methode-card:hover .component-methode-card__title,.component-methode-card:focus-visible .component-methode-card__title{color:var(--primary-color)}.component-methode-card__image{flex:0 0 120px;aspect-ratio:1/1;background-color:var(--theme-neutral)}@media screen and (min-width: 576px){.component-methode-card__image{flex-basis:auto;aspect-ratio:300/187}}.component-methode-card__image img{width:100%;height:100%;object-fit:cover;border-radius:0}.component-methode-card__content{flex:1;display:flex;flex-direction:column;justify-content:center;padding:.75rem 1rem;border-left:solid 4px var(--theme-color)}@media screen and (min-width: 576px){.component-methode-card__content{justify-content:flex-start;padding:1rem 1.25rem 1.25rem;border-left:none;border-top:solid 4px var(--theme-color)}}.component-methode-card__brand{margin:0;font-size:.875rem;font-weight:600;line-height:1.4;color:#555}.component-methode-card__title{margin:0 0 .5rem;font-size:1.125rem;font-weight:700;line-height:1.3;transition:color 200ms ease}@media screen and (min-width: 992px){.component-methode-card__title{font-size:1.125rem;line-height:1.3}}.component-methode-card__types{margin:0;font-size:.875rem;line-height:1.4;color:#555}
