*{margin:0;padding:0;box-sizing:border-box;font-family:popins,sans-serif}body,#root{width:100%;min-height:100vh;display:flex;flex-direction:column;background-color:#f5f5f5}.navbar{padding:8px 40px;background-color:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 12px #00000014;position:sticky;top:0;width:100%;z-index:1000}.nav-logo-sec{display:flex;align-items:center}.logo{width:48px;height:auto}.logo-txt{font-size:22px;font-weight:700;color:#333}.nav-links-sec ul{display:flex;gap:24px;list-style:none}.normal-link{color:#777;text-decoration:none;font-size:16px;font-weight:600;transition:color .3s ease}.normal-link:hover{color:#5ea887}.active-link{text-decoration:none;font-size:16px;font-weight:600;color:#4c8c72;border-bottom:2px solid #4c8c72;padding-bottom:2px}.hamburger{display:none;flex-direction:column;cursor:pointer;gap:5px}.hamburger span{width:28px;height:3px;background:#333;border-radius:4px;transition:.3s ease}.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}@media (max-width: 768px){.navbar{padding:8px 20px 8px 12px}.hamburger{display:flex}.nav-links-sec{position:absolute;top:70px;right:0;width:220px;background:#fff;box-shadow:0 4px 12px #00000026;border-radius:8px;padding:16px;display:none;flex-direction:column}.nav-links-sec.open{display:flex;animation:slideIn .3s ease}.nav-links-sec ul{flex-direction:column;gap:16px}.logo{width:40px}.logo-txt{font-size:18px}}@keyframes slideIn{0%{transform:translateY(-15px);opacity:0}to{transform:translateY(0);opacity:1}}.card{max-width:100%;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 10px #0000001a;transition:all .3s ease;cursor:pointer;border:1px solid #999}.card:hover{transform:translateY(-6px);box-shadow:0 8px 20px #00000026}.card-img{width:100%;object-fit:cover}.card-tittle{display:flex;flex-direction:column;padding:14px;gap:10px}.card-para{font-size:18px;font-weight:600;line-height:1.35;min-height:2.7em;color:#333;margin:0}.card-detail{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;font-weight:500;color:#555}.search-sec{display:flex;justify-content:center;align-items:center;gap:8px;margin:26px 0;flex-wrap:wrap}.input{max-width:400px;flex:1;padding:12px 14px;border-radius:8px;outline:none;border:2px solid #cccccc;font-size:16px;font-weight:500;transition:all .3s ease;background-color:#fff}.input::placeholder{font-weight:400;color:#aaa}.input:focus{border-color:#5ea887;box-shadow:0 0 8px #5ea88766}.search-btn{padding:12px 20px;border-radius:8px;border:none;background-color:#5ea887;font-size:16px;font-weight:600;color:#fff;cursor:pointer;transition:all .3s ease}.search-btn:hover{background-color:#4c8c72;transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.search-btn:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}.no-result-wraper{display:flex;justify-content:center;align-items:center;padding:3rem 1rem}.no-results{background:linear-gradient(145deg,#fff,#f9f9f9);width:60%;max-width:500px;padding:2.5rem;text-align:center;border-radius:20px;line-height:1.8rem;box-shadow:0 4px 14px #00000026;transition:all .3s ease}.no-results h2{color:#5ea887;margin-bottom:.5rem;font-size:1.8rem}.no-results p{color:#666;font-size:1rem}.no-results:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 8px 20px #00000040}@media (max-width: 768px){.no-results{width:100%}}.home-sec{width:100%;flex:1;padding:16px}.home-tittle{color:#333;text-align:center;font-size:2.2rem;font-weight:700;position:relative;letter-spacing:.5px;margin:28px 0 18px}.home-tittle:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:60px;height:3px;background-color:#5ea887;border-radius:2px}.card-sec{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;padding:20px}@media (max-width: 768px){.home-tittle{font-size:1.8rem}.card-sec{padding:20px 4px}}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;color:#5ea887;font-size:1.2rem;font-weight:500}.spinner{width:60px;height:60px;border:6px solid #e0e0e0;border-top:6px solid #5ea887;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:12px}@keyframes spin{to{transform:rotate(360deg)}}.about{display:flex;justify-content:center;background:linear-gradient(135deg,#f9f9f9,#f1fdf6);min-height:calc(100vh - 120px);padding:2rem 1rem;animation:fadeIn .6s ease-in-out}.about-sec{max-width:900px;width:100%;background-color:#fff;padding:2.5rem;border-radius:1.2rem;box-shadow:0 6px 18px #0000001f;transition:transform .3s ease,box-shadow .3s ease}.about-sec:hover{transform:translateY(-4px);box-shadow:0 10px 24px #00000026}.about-tittle{text-align:center;color:#5ea887;font-size:2.4rem;font-weight:700;margin-bottom:1.5rem;position:relative}.about-tittle:after{content:"";display:block;margin:.6rem auto 0;width:80px;height:3px;background-color:#5ea887;border-radius:2px}.about-subHeading{font-size:1.6rem;margin-top:2.5rem;margin-bottom:.8rem;color:#333;border-left:4px solid #5ea887;padding-left:.8rem;font-weight:600}.about-para{color:#444;font-size:1.1rem;line-height:1.8;margin-bottom:1rem}.about-links{list-style:none;padding:0;margin-top:1.2rem}.about-links li{margin:.7rem 0;font-size:1.05rem;color:#333}.about-links a{color:#5ea887;font-weight:600;text-decoration:none;position:relative;transition:color .3s ease}.about-links a:after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:#5ea887;transition:width .3s ease}.about-links a:hover{color:#4b8f72}.about-links a:hover:after{width:100%}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.about-sec{padding:1.8rem}.about-tittle{font-size:2rem}.about-subHeading{font-size:1.4rem}.about-para{font-size:1rem;line-height:1.6}.about-links li{font-size:1rem}}@media (max-width: 480px){.about-sec{padding:1.2rem}.about-tittle{font-size:1.7rem}.about-subHeading{font-size:1.2rem;padding-left:.5rem}.about-para{font-size:.95rem;line-height:1.5}.about-links li{font-size:.95rem}}.favorites-page{min-height:100vh;padding:2rem 1rem;background:linear-gradient(135deg,#f9f9f9,#f1fdf8);display:flex;flex-direction:column;align-items:center}.favorites-title{text-align:center;font-size:2.4rem;margin-bottom:30px;color:#5ea887;font-weight:700;position:relative}.favorites-title:after{content:"";display:block;width:60px;height:4px;background:#5ea887;margin:8px auto 0;border-radius:2px}.favorites-empty{text-align:center;margin-top:60px;padding:2rem;background:#fff;border-radius:16px;box-shadow:0 6px 18px #00000014;max-width:500px;margin-left:auto;margin-right:auto}.favorites-empty h2{font-size:1.8rem;color:#ff4d4d;margin-bottom:12px}.favorites-empty p{font-size:1rem;color:#666;margin-bottom:20px}.browse-btn{padding:12px 20px;background:#5ea887;border:none;border-radius:8px;color:#fff;font-weight:600;font-size:1rem;cursor:pointer;transition:.3s ease}.browse-btn:hover{background:#4a8f6f}@media (max-width: 480px){.favorites-empty{padding:1.5rem}.favorites-empty h2{font-size:1.4rem}}.fav-card-sec{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.8rem;width:100%;max-width:1200px;margin-top:1rem;justify-content:center;padding:0 1rem}@media (max-width: 992px){.fav-card-sec{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.2rem}}@media (max-width: 768px){.favorites-title{font-size:1.8rem}.fav-card-sec{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}}@media (max-width: 480px){.fav-card-sec{grid-template-columns:1fr}}.error-wrapper{display:flex;justify-content:center;align-items:center;padding:3rem 1rem;min-height:60vh;background:#f5f5f5}.error-box{background:linear-gradient(135deg,#ffe8e8,#fff);width:90%;max-width:520px;padding:2.5rem 2rem;text-align:center;border-radius:18px;line-height:1.7rem;box-shadow:0 6px 18px #00000014;transition:all .3s ease}.error-box h2{color:#d9534f;margin-bottom:.8rem;font-size:2rem;font-weight:700;letter-spacing:.5px}.error-box strong{display:block;margin-bottom:.8rem;color:#333;font-size:1.1rem}.error-box p{color:#555;font-size:1rem;margin-bottom:.6rem}.error-box small{color:#777;font-size:.9rem}.error-box:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 10px 24px #d9534f40}@media (max-width: 600px){.error-box{padding:1.8rem 1.2rem}.error-box h2{font-size:1.6rem}.error-box strong{font-size:1rem}}.footer-sec{background-color:#fff;padding:16px 18px;text-align:center;font-weight:500;font-size:16px;color:#777;border-top:1px solid #e0e0e0;margin-top:40px;box-shadow:0 0 12px #00000014}.footer-sec p{margin:0;line-height:1.6}.footer-name{color:#4c8c72;font-size:18px;font-weight:600;transition:color .3s ease;cursor:pointer}.footer-name:hover{color:#5ea887}.recipe-page{max-width:1100px;margin:0 auto;padding:20px;font-family:Segoe UI,sans-serif}.back-btn{display:inline-block;margin-bottom:20px;padding:10px 18px;font-size:1rem;font-weight:600;color:#fff;background:#5ea887;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease}.back-btn:hover{background:#4d9274}.recipe-header{display:flex;flex-wrap:wrap;gap:20px;background:#fff;padding:20px;border-radius:16px;box-shadow:0 4px 14px #0000001a;align-items:flex-start}.recipe-image{flex:1 1 350px;max-width:450px;width:100%;border-radius:16px;object-fit:cover}.recipe-info{flex:1 1 400px;display:flex;flex-direction:column;justify-content:center}.recipe-title{font-size:2rem;font-weight:700;color:#333;margin-bottom:12px}.diets{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}.diet-badge{background:#eafaf3;color:#5ea887;font-size:.9rem;font-weight:600;padding:6px 12px;border-radius:20px;border:1px solid #5ea887;transition:all .2s ease}.diet-badge:hover{background:#5ea887;color:#fff;cursor:default}.no-diets{color:#777;font-size:.95rem}.recipe-meta{display:flex;flex-direction:column;flex-wrap:wrap;gap:16px;margin-bottom:12px;font-size:1rem;color:#5ea887;font-weight:600}.recipe-meta span strong{color:#333;font-weight:700}.addToFav{padding:12px 20px;border:none;background:linear-gradient(135deg,#ff1a1a);font-size:16px;font-weight:600;color:#fff;border-radius:10px;cursor:pointer;box-shadow:0 4px 10px #ff4d4d66;transition:all .3s ease}.addToFav:hover{background:linear-gradient(135deg,#ff1a1a,#e60000);box-shadow:0 6px 14px #ff1a1a99;transform:translateY(-2px)}.addToFav:active{transform:translateY(0);box-shadow:0 3px 8px #ff1a1a80}.notAddtoFav{padding:12px 20px;border:none;background:linear-gradient(135deg,#ff4d4d);font-size:16px;font-weight:600;color:#fff;border-radius:10px;cursor:pointer}.recipe-summary-box{margin-top:25px;background:#fefefe;padding:20px;border-left:6px solid #5ea887;border-radius:12px}.recipe-summary-box h2{color:#5ea887;margin-bottom:10px}.recipe-summary{font-size:1rem;color:#555;line-height:1.6}.recipe-body{margin-top:30px;background:#f9f9f9;padding:20px;border-radius:16px;box-shadow:0 0 8px #0000001a}.recipe-body h2{margin-bottom:15px;color:#5ea887;font-size:1.5rem}.ingredients{list-style:disc inside;padding-left:15px;color:#444;line-height:1.6}.ingredients li{margin-bottom:8px}.instructions-text{font-size:1rem;color:#444;line-height:1.8}.recipe-body ol{padding:0 30px}@media (max-width: 768px){.recipe-header{flex-direction:column;align-items:center;text-align:center}.recipe-image{max-width:100%}.recipe-info{flex:1 1 100%;margin-top:15px}.recipe-title{font-size:1.6rem}.recipe-meta{justify-content:center;font-size:1rem}.recipe-summary-box,.recipe-body{padding:16px;text-align:left}}