JSFiddle - React, Tailwind, and code Playground

HTML

<p>The 1st parapraph</p>
<div class="wrapper">
    <p>The 2nd parapraph</p>
    <p>The 3rd parapraph</p>
</div>

CSS

p {
    margin: 0;
    padding: .5em;
}
.wrapper:hover p:first-child {
    background: red;    
}
.wrapper p:first-child:hover {
    background: none;    
}