:root{--primary-color:#0070f3;--secondary-color:#1c1c1e;--accent-color:#69a4a1;--base-color:#fff;--base-color-second:#eaf1f4;--base-color-third:#f8fafa;--base-color-dark:#667d8b;--font-size-base:16px;--font-size-s:14px;--font-size-xs:12px;--spacing-base:8px;--text-black:#1c1c1e;--text-gray:#b3bec2;--text-rightGray:#f2f2f2;--text-wh:#fff;--link-color:#0f83fd}.p-about{justify-content:space-around;gap:2rem;display:flex}.p-about__l{width:60%;max-width:600px}.p-about__r{justify-content:center;align-items:center;gap:2.5rem;width:40%;display:flex}.p-about__tap{position:absolute;top:-30%;left:50%;transform:translate(-50%)}.p-about__skill svg{border:3px solid #f2f2f2;border-radius:15px;padding:.5rem;font-size:6vw;transition:transform .2s ease-out;box-shadow:0 0 16px #9dbcd01a}.p-about__skill svg:hover{cursor:pointer;transform:translateY(-4px);box-shadow:0 0 8px #9dbcd033}.p-about__skill:first-child{transform:rotate(10deg)}.p-about__skill:nth-child(2){transform:rotate(-10deg)}.p-about__skill:nth-child(3){transform:rotate(10deg)}.p-about__skill:nth-child(4){transform:rotate(-10deg)}.p-about__skill.react{color:#00d8fe}.p-about__skill.typescript{color:#3078c6}.p-about__skill.docker{color:#2496ed}.p-about__skill.js{color:#f7df1c}.p-about__skill.css{color:#2865f0}.p-about__skill.html{color:#e44d27}.p-about__skill.graphql{color:#e535ab}.p-about__skill.tailwind{color:#1fb1ba}.p-about__skill.firebase{color:#f7c52d}.p-about__skills{pointer-events:none;flex-direction:column;gap:1.5rem;display:flex;position:relative}.p-about__skills:hover{cursor:auto}@media (max-width:768px){.p-about{flex-direction:column}.p-about__l,.p-about__r{width:100%}.p-about__r{max-width:420px;margin:auto}.p-about__skills{gap:2rem;width:20%}.p-about__skill svg{width:100%;height:auto}}.p-latestPosts{overflow:hidden}@media (max-width:768px){.p-latestPosts .embla__controls,.p-latestPosts .c-card-vertical__wrap:nth-child(5),.p-latestPosts .c-card-vertical__wrap:nth-child(6),.p-latestPosts .c-card-vertical__wrap:nth-child(7),.p-latestPosts .c-card-vertical__wrap:nth-child(8){display:none}}.p-catPostsWrap{flex-wrap:wrap;align-items:flex-start;gap:4rem;display:flex}.p-catPostsWrap>*{width:calc(50% - 2rem)}@media (max-width:1080px){.p-catPostsWrap{flex-direction:column}.p-catPostsWrap>*{width:100%}}.p-newsSec{padding-top:2.5rem}@media (max-width:1080px){.p-latestPosts{padding-top:0;padding-bottom:4rem}.p-popularPosts{padding-bottom:0}}
