@import"https://fonts.googleapis.com/css2?family=Electrolize&family=Oxanium:wght@200..800&display=swap";*{font-family:Oxanium,serif;font-optical-sizing:auto;font-weight:700;box-sizing:border-box;margin:0;padding:0}:root{--color-black: #222;--color-blackAlpha: #00000090;--color-white: #fff;--color-gray: #aaa;--color-grayAlpha: #aaaaaa30}.title{font-size:3rem;background-color:var(--color-black);color:var(--color-white);padding:1rem}.navbar{display:flex;justify-content:space-between;align-items:center;padding:3rem 2rem;background-color:var(--color-black)}.navbar ul{display:flex;list-style:none}.navbar li{margin-right:1rem}.navbar a{font-size:1.5rem;text-decoration:none;color:var(--color-white)}.navbar a:hover{color:var(--color-gray)}.footer__content{background-color:var(--color-black);color:var(--color-white);padding:1rem;text-align:end}.cards__container{display:flex;flex-wrap:wrap}.articlelist__container{width:100%;min-height:100vh;background-color:var(--color-grayAlpha);padding:2rem;box-sizing:border-box}.articlelist__container h1{font-size:2.5rem;padding:1.5rem;margin-bottom:1rem;text-align:center}.articlelist{display:flex;justify-content:center}.articlelist ul{display:flex;flex-wrap:wrap;gap:1rem;list-style:none;padding:0;margin:0 auto;max-width:1200px}.articlelist ul li{position:relative;width:100%;max-width:350px;height:200px;border-radius:10px;overflow:hidden;box-shadow:0 4px 10px var(--color-black);cursor:pointer;transition:transform .3s ease}.articlelist ul li:hover{transform:scale(1.05)}.articlelist ul li img{width:100%;height:100%;object-fit:cover;border-radius:10px;transition:transform .3s ease}.articlelist ul li:hover img{transform:scale(1.1)}.articlelist ul li .text-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--color-blackAlpha);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);color:var(--color-white);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;opacity:0;transition:opacity .3s ease;padding:1rem}.articlelist ul li:hover .text-overlay{opacity:1}.articlelist ul li .text-overlay h2{font-size:1rem;margin:0}.articlelist ul li .text-overlay p{font-size:.8rem;margin:.5rem 0 0}.articlelist ul li a{position:absolute;bottom:10px;right:10px;font-size:.8rem;color:var(--color-white);text-decoration:none;background:var(--color-gray);padding:.3rem .5rem;border-radius:5px;transition:background .3s ease}.articlelist ul li a:hover{background:var(--color-black)}.placeholder{font-size:1.5rem;text-transform:uppercase}@media (max-width: 768px){.articlelist ul li{max-width:100%;height:180px}.articlelist ul li .text-overlay h2{font-size:.9rem}.articlelist ul li .text-overlay p,.articlelist ul li a{font-size:.7rem}.placeholder{font-size:1.2rem}}@media (max-width: 480px){.articlelist__container h1{font-size:2rem}.articlelist ul{gap:.5rem}.articlelist ul li{height:150px}.articlelist ul li .text-overlay h2{font-size:.8rem}.articlelist ul li .text-overlay p,.articlelist ul li a{font-size:.6rem}.placeholder{font-size:1rem}}.recommendations__container{width:100%;min-height:80vh;padding:2rem}.recommendations__container h1{font-size:3rem;padding:2rem}.recommendations{display:flex;justify-content:center}.email__subscription__form{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:20px;transition:transform .3s ease}.email__subscription__form input{padding:.5rem;border:none;resize:none;outline:none;border-radius:10px;font-size:1rem;width:50%;height:5rem;background:var(--color-grayAlpha)}.email__subscription__form input:focus{background:var(--color-white);box-shadow:0 0 10px var(--color-black)}.email__subscription__form button{padding:1.5rem 1rem;border:none;width:200px;border-radius:10px;font-size:1rem;cursor:pointer;transition:background .3s ease}.recommendations__form button:hover{background:var(--color-black);color:var(--color-white);box-shadow:0 0 10px var(--color-black)}.recommendations__list{width:100%;padding:0 20px;background:var(--color-grayAlpha)}.recommendations__list h2{font-size:3rem;padding:20px}.recommendations__list ul{list-style:none;padding:0;margin:0}.recommendations__list li{display:flex;flex-direction:column;gap:1rem;padding:20px;border-bottom:1px solid var(--color-gray)}.recommendations__list li h3{font-size:2rem;margin:0}.recommendations__list li p{font-size:1.5rem;margin:0}.recommendations__list li a{font-size:1.5rem;color:var(--color-gray);text-decoration:none;width:fit-content;padding:.5rem 1rem}.recommendations__list li a:hover{color:var(--color-black)}.carousel__container{position:relative;width:100%;max-width:800px;min-height:80vh;margin:0 auto;overflow:hidden}.carousel{padding:20px;display:flex;transition:transform .5s ease-in-out}.carousel__item{position:relative;flex:0 0 100%;text-align:center;overflow:hidden;border-radius:10px;box-shadow:0 0 10px var(--color-black)}.carousel__item img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease-in-out}.carousel__item:hover img{transform:scale(1.1)}.carousel__text{position:absolute;bottom:0;left:0;right:0;background:var(--color-blackAlpha);color:var(--color-white);padding:20px;transform:translateY(100%);transition:transform .3s ease-in-out,opacity .3s ease-in-out;opacity:0}.carousel__item:hover .carousel__text{transform:translateY(0);opacity:1}.carousel__controls{position:absolute;top:50%;transform:translateY(-50%);display:flex;justify-content:space-between;width:100%;pointer-events:none}.carousel__controls button{background:transparent;border:none;cursor:pointer;font-size:3rem;color:var(--color-gray);pointer-events:all;transition:color .3s ease}.carousel__controls button:hover{color:var(--color-black)}.carousel__item h3{font-size:1.5rem;margin:10px 0}.carousel__item p{font-size:1.2rem;color:var(--color-white)}.carousel__item a{text-decoration:none;color:var(--color-white);font-weight:700}.carousel__item a:hover{text-decoration:underline}@media (max-width: 768px){.carousel__container{max-width:600px}.carousel__item h3{font-size:1.2rem}.carousel__item p{font-size:1rem}.carousel__controls button{font-size:2rem}.carousel__controls{display:none}}@media (max-width: 480px){.carousel__container{max-width:100%}.carousel__item h3{font-size:1rem}.carousel__item p{font-size:.9rem}.carousel__controls button{font-size:1.5rem}}.about__container{width:100%;height:80vh;display:flex;flex-direction:column;justify-content:center;padding:2rem;background:var(--color-grayAlpha)}.about__container h1{font-size:3rem;margin-bottom:1rem}.about__container p{font-size:1.2rem;margin-bottom:2rem;padding-left:1rem}.article__container{padding:20px;margin:20px auto;max-width:1200px;background-color:var(--color-grayAlpha);box-shadow:0 0 10px var(--color-black);border-radius:10px}.article__container h1{font-size:2.5rem;margin-bottom:20px;text-align:center}.article__container p{font-size:1rem;margin-bottom:15px}.article__container .content__article{font-size:1.5rem}.article__container img{margin-bottom:20px;border-radius:10px;width:100%;max-height:300px;object-fit:cover}.article__container .article__tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.article__tags ul{display:flex;flex-wrap:wrap;gap:10px;padding-left:0;justify-content:center}.article__tags li{margin-right:0;list-style:none;border:2px solid var(--color-gray);box-shadow:0 0 10px var(--color-gray);border-radius:10px;padding:5px 15px;font-size:.9rem}@media (max-width: 768px){.article__container{padding:10px;margin:10px}.article__container h1{font-size:2rem}.article__container p{font-size:.9rem}.article__container .content__article{font-size:1.2rem}.article__tags li{font-size:.8rem}}@media (max-width: 480px){.article__container h1{font-size:1.8rem}.article__container p{font-size:.8rem}.article__container .content__article{font-size:1rem}.article__tags li{font-size:.7rem;padding:5px 10px}}
