.home-hero{display:flex;flex-direction:column;align-items:center;padding-bottom:100px;padding-top:40px}.home-hero-text{width:100%;text-align:left;margin-bottom:20px}.home-hero-text h1{font-size:26px;font-weight:600;line-height:1.4}.home-hero-text .home-highlight{color:#8dc63f;font-weight:400;font-style:italic}.home-hero-text p{margin:15px 0;font-size:14px;color:#444}.home-hero-btn{padding:10px 24px;border:1px solid #8dc63f;background:transparent;border-radius:25px;cursor:pointer;font-weight:500;transition:.3s}.home-hero-btn:hover{background:#8dc63f;color:#fff}.home-carousel-section{width:100%;display:flex;flex-direction:column;align-items:center}.home-slider{width:100%;overflow:hidden}.home-slides{display:none;justify-content:center;align-items:flex-end;gap:15px}.home-slides.active{display:flex}.home-slide.small{width:200px;height:280px;border-radius:12px;overflow:hidden}.home-slide-main{flex:0 0 200px;height:280px;border-radius:15px;overflow:hidden;box-shadow:0 8px 20px #00000026;position:relative;z-index:2}.home-slide-bg{position:relative;width:100%;height:100%;background-color:#050505;display:flex;justify-content:center;align-items:center;overflow:visible}.home-slide-bg:before{content:"";position:absolute;width:120%;height:120%;background:radial-gradient(circle,#9bb5374d 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;border-radius:50%}.home-slide-bg img{width:100%;height:60%;position:relative;z-index:2;background-color:transparent;border-radius:50%}.home-slide-text{position:absolute;top:80%;width:70%;text-align:center;z-index:3}.home-slide-text p:first-child{font-weight:300;font-style:normal;font-size:10px;line-height:14px;letter-spacing:0%;text-align:center;text-transform:uppercase;margin:2px 0;color:var(--white-50-opacity)}.home-slide-text p:last-child{font-size:8px;color:#f8f8f833;margin:2px 0}.home-slide-partial{flex:0 0 200px;height:280px;border-radius:15px;overflow:hidden;margin-right:-150px;position:relative;z-index:1}.home-slide-partial img,.home-slide.small img{width:100%;height:100%;object-fit:cover;display:block}.home-slide-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,#000000d9,#0000);color:#fff;padding:20px 10px 10px;text-align:center}.home-dots{display:flex;justify-content:center;margin-top:1rem}.home-dot{width:8px;height:8px;border-radius:50%;background-color:#ccc;margin:0 4px;cursor:pointer;transition:background-color .3s ease}.home-dot.active{background-color:#8dc63f}.home-popup{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;justify-content:center;align-items:center;z-index:1000}.home-popup-content{background:#fff;padding:30px 25px;border-radius:12px;max-width:400px;width:90%;box-shadow:0 10px 30px #0003;position:relative}.home-popup-close{position:absolute;top:12px;right:15px;font-size:24px;cursor:pointer}.home-popup h2{margin-bottom:20px;font-size:22px;font-weight:600}.home-popup-form label{display:block;margin-bottom:5px;font-size:14px;font-weight:500;color:var(--onyx-50-opacity)}.home-popup-form input,.home-popup-form textarea{width:100%;height:48px;padding:8px 10px;margin-bottom:15px;border:1px solid #ccc;border-radius:15px;font-size:14px}.home-popup-form textarea{resize:vertical;min-height:80px}.home-popup-form button{width:100%;padding:12px;background-color:#a8c43b;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer}.home-popup-form button:hover{background-color:#95b12f}@media (min-width: 768px){.home-hero{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:40px;width:100%}.home-slide-partial img{height:100%}.home-hero-text{flex:0 0 auto;max-width:500px;text-align:left;margin:0;padding-right:30px}.home-hero-text h1{font-size:36px;line-height:1.2;white-space:normal}.home-hero-text p{font-size:16px;line-height:1.5;white-space:normal}.home-slides{justify-content:flex-start;position:relative}.home-slide.small{width:137px;height:442px;border-radius:12px}.home-slide-main{flex:0 0 351px;height:442px;border-radius:15px;box-shadow:0 8px 20px #00000026;position:relative;z-index:2;overflow:hidden}.home-slide-bg img{width:90%;height:70%}.home-slide-partial{flex:0 0 351px;height:442px;border-radius:15px;border-right:none;position:relative;margin-right:-250px;z-index:1;overflow:hidden}.home-slide-text{top:85%;width:80%}.home-slide-text p:first-child{font-size:14px}.home-slide-text p:last-child{font-size:12px}}@media (min-width: 1280px){.home-hero{flex-direction:row;align-items:center;justify-content:space-between;width:1080px}.home-hero-text{flex:0 0 auto;max-width:446px;text-align:left;margin:0;padding-right:30px}.home-hero-text h1{font-size:36px;line-height:1.2;white-space:normal}.home-hero-text p{font-size:16px;line-height:1.5;white-space:normal}.home-hero-btn{width:127px;height:40px;font-size:16px}.home-slides{justify-content:flex-start}.home-slide.small{width:137px;height:468px;border-radius:12px}.home-slide-main{flex:0 0 351px;height:468px;border-radius:15px;box-shadow:0 8px 20px #00000026;position:relative;z-index:2}.home-slide-partial{flex:0 0 351px;height:468px;border-radius:15px;overflow:hidden;margin-right:-150px;position:relative;z-index:1}.home-slide-partial img{width:100%;height:100%;object-fit:cover}.home-slide-text{top:85%;width:80%}.home-slide-text p:first-child{font-size:14px}.home-slide-text p:last-child{font-size:12px}}@media only screen and (min-width: 1440px){.home-hero{flex-direction:row;align-items:center;justify-content:space-between;width:1440px}.home-hero-text{max-width:460px}.home-hero-text h1{font-size:42px}.home-hero-text p{font-size:20px}.home-slide.small{width:189px;height:550px;border-radius:12px}.home-slide-main{flex:0 0 451px;height:550px;border-radius:15px;box-shadow:0 8px 20px #00000026;position:relative;z-index:2}.home-slide-partial{flex:0 0 351px;height:550px;border-radius:15px;overflow:hidden;margin-right:-150px;position:relative;z-index:1}.home-slide-text{top:85%;width:80%}.home-slide-text p:first-child{font-size:14px}.home-slide-text p:last-child{font-size:12px}}.category-container{padding:0;border-radius:16px;margin:auto}.category-list{list-style:none;padding-top:20px;width:326px;max-height:198px;overflow-y:auto}.category-list li{margin-bottom:12px}.category-btn{background:none;border:none;padding:0;color:#b4b4b4;cursor:pointer;transition:color .2s ease-in-out}.category-btn:hover{color:#9bb537}.category-btn.active{color:#9bb537;font-weight:500}@media (min-width: 768px){.category-container{margin-top:40px}.category-list{width:176px;max-height:416px;margin-bottom:50px}}@media (min-width: 1280px){.category-container{margin-top:50px}.category-list{width:235px;max-height:416px;margin-bottom:50px}}.popular-recipe-wrapper{display:flex;flex-direction:column;gap:24px;margin-top:20px;width:332px;height:158px;overflow:hidden}.popular-recipes-card{display:flex;flex-direction:row;gap:16px;height:67px;cursor:pointer}.popular-recipes-image{width:64px;height:64px;border-radius:8px}.popular-recipes-description,.popular-recipes-title{width:255px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.popular-recipes-info{display:flex;flex-direction:column}.popular-recipes-info{display:flex;flex-direction:column;gap:3px}@media (min-width: 768px){.popular-recipe-wrapper{gap:16px;margin-top:32px;width:176px;height:316px}.popular-recipes-card{gap:8px}.popular-recipes-image{width:48px;height:48px}.popular-recipes-description,.popular-recipes-title{width:120px}.popular-recipes-title{width:110px;-webkit-line-clamp:1}.popular-recipes-info{gap:6px}}@media (min-width: 1280px){.popular-recipe-wrapper{gap:32px;width:235px;height:364px}.popular-recipes-card{gap:16px}.popular-recipes-image{width:64px;height:64px}.popular-recipes-description,.popular-recipes-title{width:155px}}.filters{width:375px;display:flex;flex-direction:row;flex-wrap:wrap;gap:14px;padding:26px 0;border-radius:16px;margin:auto}.filter-group{display:flex;flex-direction:column;gap:8px}.filter-label{font-size:14px;color:#374151;font-weight:600;letter-spacing:.025em}.input-wrapper{position:relative}.search-btn{position:absolute;left:12px;top:50%;transform:translateY(-50%);background:none;border:none;padding:0;display:flex;align-items:center;cursor:pointer}.filter-input{display:block;width:335px;height:46px;padding:0 16px 0 40px;border:2px solid #e5e7eb;border-radius:12px;background-color:#f9fafb;font-size:16px;color:#374151;outline:none}.filter-input:focus{border-color:var(--pistachio);background-color:#fff;box-shadow:0 0 0 3px #3b82f61a}.filter-input::placeholder{color:#9ca3af}.custom-dropdown{position:relative;width:160px}.dropdown-toggle{width:100%;height:46px;padding:0 40px 0 16px;border:2px solid #e5e7eb;border-radius:12px;background-color:#f9fafb;font-size:16px;color:#374151;text-align:left;cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.dropdown-toggle:focus{border-color:var(--pistachio);background-color:#fff;box-shadow:0 0 0 3px #3b82f61a}.dropdown-menu{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:2px solid #e5e7eb;border-radius:12px;max-height:180px;overflow-y:auto;z-index:10;list-style:none;margin:0;padding:8px 0;box-shadow:0 8px 24px #0000000f}.custom-dropdown.open .dropdown-menu{display:block}.dropdown-menu li{margin:0;padding:0}.dropdown-menu li button{all:unset;display:block;width:100%;padding:10px 14px;font:inherit;font-size:16px;color:#374151;line-height:1.2;cursor:pointer;border-radius:8px;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.dropdown-menu li button:hover,.dropdown-menu li button:focus{background:#f3f4f6;outline:none}.dropdown-menu li button:active{background:#e5e7eb}.dropdown-menu li.selected button,.dropdown-menu li button.selected{font-weight:600}.dropdown-menu::-webkit-scrollbar{width:6px}.dropdown-menu::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.dropdown-menu::-webkit-scrollbar-track{background:#f0f0f0}.reset-filter{display:flex;align-items:center;justify-content:center;height:16px;margin-top:80px;padding:0 20px;border:none;border-radius:12px;background:#fff;color:var(--onyx-50-opacity);font-size:16px;font-weight:600;cursor:pointer;gap:8px}.reset-filter .close-btn{color:var(--pistachio)}.reset-filter:hover{background:transparent;color:var(--pistachio);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.reset-filter:active{color:var(--onyx-50-opacity);transform:translateY(0);box-shadow:none}.heart-btn svg path{transition:fill .15s ease,stroke .15s ease}.heart-btn:not(.active) svg path{fill:transparent}.heart-btn.active svg path{fill:#e53935}@media (min-width: 768px){.filters{width:496px;margin:auto;flex-wrap:wrap;gap:16px;padding:24px 0}.recipes-flex{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.recipes-flex .recipe-card{flex:0 0 calc(25% - 12px);max-width:calc(25% - 12px)}.filter-group.search-group,.filter-group.time-group{width:calc(50% - 8px);height:48px}.filter-group.area-group,.filter-group.ingredients-group{width:calc(50% - 8px)}.filter-input{width:100%}.reset-filter{margin-top:0;align-self:flex-end;margin-left:320px}}@media (min-width: 1024px){.filters{width:780px;display:flex;flex-wrap:wrap;gap:16px;padding:24px 0;margin-left:24px}.filter-group-search{width:278px}.filter-group:nth-of-type(2){width:125px}.filter-group:nth-of-type(3){width:141px}.filter-group:nth-of-type(4){width:188px}.filter-input{width:100%}.reset-filter{margin-top:8px;margin-left:auto}.pagination{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;padding-top:40px}button.reset-filter{margin-left:600px;margin-top:10px}#recipes-flex,#recipes-container,.recipes-list{display:flex;flex-wrap:wrap;gap:16px;justify-content:flex-start;width:782px;margin-inline:auto}#recipes-flex>.recipe-card,#recipes-container>.recipe-card,.recipes-list>.recipe-card{box-sizing:border-box;margin:0;flex:0 0 calc((100% - 32px) / 3);max-width:calc((100% - 32px) / 3)}.recipe-card img{display:block;width:100%;height:auto}}
