#root{width:100vw;height:100vh;margin:0;padding:0;text-align:center;background:linear-gradient(135deg,#ff6e7f,#f9d423);min-height:100vh;min-width:100vw;overflow:hidden;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center}body,html{width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}.cardContainer{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));grid-template-rows:repeat(2,1fr);gap:2rem;width:90vw;max-width:1100px;height:480px;justify-items:center;align-items:center;margin:4.5rem auto 0;background:none;overflow:visible}.cardContainer>div{background:#fff2;box-shadow:0 8px 24px #0000002e;padding:1.2rem .5rem 1rem;transition:transform .18s,box-shadow .18s;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;width:180px;height:220px;border-radius:18px}.cardContainer>div:hover,.cardContainer>div:focus{transform:scale(1.08);box-shadow:0 12px 32px #00000038;border-color:#ffb86c}.cardContainer img{width:110px;height:110px;object-fit:cover;border-radius:50%;background:#fff;border:3px solid #fff;box-shadow:0 2px 8px #0002;margin-bottom:2.5rem;display:block}.cardContainer h3{font-size:1.1rem;color:#fff;text-align:center;text-shadow:0 1px 2px #0008;margin:0;padding:.4rem .6rem;background:#0000002e;border-radius:8px;max-width:90%;word-wrap:break-word}div>p{color:#fff;font-size:1.2rem;margin:.2rem 0;letter-spacing:1px;text-shadow:0 1px 4px #0007}h1{position:relative;z-index:2;font-size:2.5rem;color:#fff;margin:2.5rem 0 .5rem;letter-spacing:2px;text-shadow:0 2px 8px #000a;background:#0000002e;padding:.5rem 2rem;border-radius:12px;display:inline-block}h3{position:relative;z-index:2;color:#fff;margin:.5rem 0 1.5rem;font-weight:500;text-shadow:0 1px 6px #000a;background:#0000001f;padding:.4rem 1.5rem;border-radius:8px;display:inline-block}@media (max-width: 900px){.cardContainer{width:98vw;gap:1.2rem}.cardContainer>div{width:140px;height:170px}.cardContainer img{width:80px;height:80px}}@media (max-width: 600px){.cardContainer{grid-template-columns:repeat(2,1fr);width:99vw;gap:.7rem;margin:1rem 0;padding:0}.cardContainer>div{width:110px;height:130px;padding:.5rem .2rem}.cardContainer img{width:54px;height:54px;margin-bottom:.5rem}.cardContainer h3{font-size:.8rem;max-width:70px}}