.wrap{--secondary:#edeae3;--primary:#153147;--white:#fff;--font-title:"Montserrat", sans-serif;--font-text:"Lato", sans-serif}.expert-h2{font-family:var(--font-title);color:var(--white);line-height:1.1}.expert-p{font-family:var(--font-text);color:var(--white);font-size:1rem;line-height:1.5}.flow>*+*{margin-top:var(--flow-space,1em)}.card{place-items:center;width:80vw;max-width:21.875rem;height:28.125rem;display:grid;overflow:hidden}.card>*{grid-area:1/1/2/2}.card__background{object-fit:cover;max-width:100%;height:100%}.card__content{--flow-space:.9375rem;background:linear-gradient(#0000 0%,#0000004d 10%,#000 100%);flex-direction:column;justify-content:space-between;align-self:flex-end;height:55%;padding:12% 1.25rem 1.875rem;display:flex}.card__content--container{--flow-space:1.25rem}.card__title{width:-moz-fit-content;position:relative}.card__title:after{content:"";background-color:var(--secondary);width:calc(100% + 1.25rem);height:.3125rem;position:absolute;bottom:-.75rem;left:-1.25rem}.card__button{background-color:var(--secondary);width:-moz-fit-content;min-width:155px;font-weight:400;font-family:var(--font-title);color:var(--primary);border:none;border-radius:.45em;padding:3.5px 8px;font-size:1.125rem}.card__button:focus{outline-offset:-5px;outline:2px solid #000}@media (any-hover:hover) and (any-pointer:fine){.card__content{transition:transform .5s ease-out .5s;transform:translateY(65%)}.card__title:after{opacity:0;transform-origin:100%;transition:opacity 1s ease-in .5s,transform .5s ease-out .5s;transform:scaleX(0)}.card__background{transition:transform .5s ease-in}.card__content--container>:not(.card__title),.card__button{opacity:0;transition:transform .5s ease-out,opacity .5s ease-out}.card:hover .card__content,.card:focus-within .card__content{transition:transform .5s ease-in;transform:translateY(0)}.card:focus-within .card__content{transition-duration:0s}.card:hover .card__background,.card:focus-within .card__background{transform:scale(1.15)}.card:hover .card__content--container>:not(.card__title),.card:hover .card__button,.card:focus-within .card__content--container>:not(.card__title),.card:focus-within .card__button{opacity:1;transition:opacity .5s ease-in 1s}.card:hover .card__title:after,.card:focus-within .card__title:after{opacity:1;transform-origin:0;transition:opacity .5s ease-in .5s,transform .5s ease-in .5s;transform:scaleX(1)}}
