*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:Georgia,'Times New Roman',serif;line-height:1.8;color:#2c3e50;background:linear-gradient(to bottom,#e1f5fe 0%,#b3e5fc 50%,#81d4fa 100%);font-size:18px;}
.container{max-width:1200px;margin:0 auto;padding:0 20px;}
.navbar{background:linear-gradient(to right,#0277bd 0%,#0288d1 100%);padding:1.5rem 0;box-shadow:0 4px 15px rgba(2,119,189,0.3);position:sticky;top:0;z-index:1000;}
.navbar .container{display:flex;justify-content:space-between;align-items:center;}
.logo h1{color:white;font-size:2.5rem;font-weight:700;letter-spacing:1px;}
.nav-links{display:flex;list-style:none;gap:2.5rem;}
.nav-links a{color:#e1f5fe;text-decoration:none;font-weight:600;transition:all 0.3s;font-size:1.1rem;}
.nav-links a:hover{color:white;transform:translateY(-2px);}
.hero{background:linear-gradient(135deg,#0288d1 0%,#0277bd 100%);color:white;padding:120px 20px;text-align:center;}
.hero-content h2{font-size:3.5rem;margin-bottom:1.5rem;font-weight:700;line-height:1.3;}
.hero-content p{font-size:1.4rem;margin-bottom:2.5rem;max-width:800px;margin-left:auto;margin-right:auto;line-height:1.8;}
.cta-button{display:inline-block;background:white;color:#0277bd;padding:18px 50px;border-radius:10px;text-decoration:none;font-weight:700;font-size:1.3rem;transition:all 0.3s;border:3px solid #b3e5fc;}
.cta-button:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(0,0,0,0.2);}
.recipes-section{padding:90px 20px;}
.section-title{text-align:center;font-size:3.2rem;margin-bottom:4rem;color:#0277bd;font-weight:700;}
.recipe-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:3rem;}
.recipe-card{background:white;border-radius:15px;overflow:hidden;box-shadow:0 8px 25px rgba(2,119,189,0.15);transition:all 0.3s;border:2px solid #b3e5fc;cursor:pointer;}
.recipe-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px rgba(2,119,189,0.25);}
.recipe-card img{width:100%;height:280px;object-fit:cover;}
.recipe-content{padding:2.5rem;}
.recipe-content h3{font-size:1.8rem;margin-bottom:1rem;color:#0277bd;font-weight:700;line-height:1.4;}
.recipe-content p{color:#555;margin-bottom:1.5rem;font-size:1.1rem;line-height:1.8;}
.recipe-meta{display:flex;gap:2rem;color:#0288d1;font-weight:600;font-size:1.1rem;}
.view-recipe-btn{margin-top:1.5rem;padding:15px 35px;background:linear-gradient(to right,#0288d1 0%,#0277bd 100%);color:white;border:none;border-radius:10px;font-weight:700;cursor:pointer;transition:all 0.3s;font-family:inherit;font-size:1.1rem;}
.view-recipe-btn:hover{transform:scale(1.05);box-shadow:0 8px 20px rgba(2,136,209,0.4);}
.recipe-details{max-height:0;overflow:hidden;transition:max-height 0.5s ease-out;background:#e1f5fe;border-radius:12px;margin-top:0;}
.recipe-details.active{max-height:2500px;transition:max-height 0.8s ease-in;padding:3rem 2.5rem;margin-top:1.5rem;}
.recipe-section{margin-bottom:2.5rem;}
.recipe-section:last-child{margin-bottom:0;}
.recipe-section h4{color:#0277bd;font-size:1.6rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:0.8rem;font-weight:700;}
.recipe-section ul,.recipe-section ol{padding-left:2rem;color:#2c3e50;}
.recipe-section li{margin-bottom:1rem;line-height:1.8;font-size:1.1rem;}
footer{background:linear-gradient(to right,#0277bd 0%,#0288d1 100%);color:#e1f5fe;padding:4rem 20px 2rem;}
.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:3rem;margin-bottom:3rem;}
.footer-section h3,.footer-section h4{margin-bottom:1.5rem;color:white;font-weight:700;font-size:1.4rem;}
.footer-section p{font-size:1.1rem;line-height:1.8;}
.footer-section ul{list-style:none;}
.footer-section ul li{margin-bottom:1rem;}
.footer-section a{color:#b3e5fc;text-decoration:none;transition:color 0.3s;font-size:1.1rem;}
.footer-section a:hover{color:white;}
.copyright{text-align:center;padding-top:2rem;border-top:2px solid rgba(255,255,255,0.2);font-size:1rem;}
@media(max-width:768px){body{font-size:16px;}.navbar .container{flex-direction:column;gap:1.5rem;}.nav-links{flex-wrap:wrap;justify-content:center;gap:1.5rem;}.hero-content h2{font-size:2.5rem;}.hero-content p{font-size:1.2rem;}.recipe-grid{grid-template-columns:1fr;}.section-title{font-size:2.5rem;}.recipe-content h3{font-size:1.6rem;}}