import React from 'react'

interface CardProps {
  image: string
  text: string
}

const Card: React.FC<CardProps> = ({ image, text }) => {
  return (
    <div className="relative w-[300px]  overflow-hidden bg-brand shadow-lg rounded-t-lg">
      <div className="relative">
        <img
          className="w-[300px] h-[400px] object-cover"
          src={image}
          alt="Card image"
        />
        <p className="text-base  font-normal absolute bottom-0 left-0 w-full p-4 text-center  uppercase md:text-start text-brand bg-opacity-50 md:font-extrabold bg-white font-lato ">
          {text}
        </p>
      </div>
    </div>
  )
}

export default Card
