@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}:root{--red-color: rgb(234, 83, 83);--cyan-color: rgb(69, 211, 211);--orange-color: rgb(252, 175, 74);--blue-color: rgb(84, 158, 242);--primary-background: #ffffff;--primary-text: rgb(76, 78, 97);--secondary-text: rgb(105, 112, 119)}body{background-color:var(--primary-background);display:flex;justify-content:center;align-items:flex-start;padding:75px 15px;font-size:15px;min-height:100vh}main{width:100%;max-width:1200px;display:flex;flex-direction:column;align-items:center}.header{text-align:center;margin-bottom:40px;max-width:600px}.header h2{font-size:2rem;margin-bottom:10px;color:var(--primary-text)}.light-head{font-weight:300;color:var(--secondary-text)}.header p{color:var(--secondary-text);font-size:1rem;line-height:1.6}.card-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:27px;width:100%}.card{background-color:var(--primary-background);padding:25px;border-radius:5px;box-shadow:0 6px 10px #cdcdcdcc;max-width:350px;width:100%;transition:transform .3s ease}.card:hover{transform:translateY(-5px)}.cyan-card{border-top:4px solid var(--cyan-color)}.red-card{border-top:4px solid var(--red-color)}.orange-card{border-top:4px solid var(--orange-color)}.blue-card{border-top:4px solid var(--blue-color)}.card-head{margin-bottom:10px}.card-head h3{font-size:1.2rem;margin-bottom:5px;color:var(--primary-text)}.card-head p{color:var(--secondary-text);font-size:.95rem}.card-icon{text-align:end;padding:10px;margin-bottom:10px}@media screen and (min-width: 940px){.card-container{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto;gap:20px}.cyan-card{grid-area:2 / 1 / 4 / 2}.red-card{grid-area:1 / 2 / 3 / 3}.orange-card{grid-area:3 / 2 / 5 / 3}.blue-card{grid-area:2 / 3 / 4 / 4}.header{margin-bottom:25px}.header h2{font-size:2rem}body{align-items:center;padding:0}}@media screen and (max-width: 600px){.header h2{font-size:1.5rem}.header p{font-size:.95rem}.card{max-width:100%}}
