.ingredients-container{padding-top:2rem;padding-bottom:5rem;animation:.5s fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.breadcrumb{margin-bottom:2rem}.breadcrumb a{color:var(--text-muted);font-size:.9rem;text-decoration:none;transition:color .3s}.breadcrumb a:hover{color:var(--primary)}.ing-header{text-align:center;margin-bottom:3rem}.header-icon{margin-bottom:1rem;font-size:3.5rem;display:block}.ing-header h1{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.8rem;font-size:clamp(1.8rem,4vw,2.5rem)}.subtitle{color:var(--text-muted);font-size:1.05rem}.ing-grid{flex-direction:column;gap:2rem;display:flex}.ing-section{background:#fff;border:1px solid #8b45130f;border-radius:20px;padding:2rem;transition:all .3s;box-shadow:0 4px 20px #8b45130f}.ing-section:hover{box-shadow:0 8px 30px #8b45131a}.section-header{align-items:flex-start;gap:1rem;margin-bottom:1.5rem;display:flex}.section-emoji{flex-shrink:0;font-size:2.2rem}.section-header h2{color:var(--primary);margin-bottom:.2rem;font-size:1.3rem}.section-subtitle{color:var(--text-muted);margin:0;font-size:.85rem}.section-desc{color:var(--text-main);margin-bottom:1.5rem;line-height:1.7}.temp-selector{flex-wrap:wrap;gap:.8rem;margin-bottom:1rem;display:flex}.temp-btn{cursor:pointer;background:#fff;border:2px solid #8b45131a;border-radius:14px;flex-direction:column;flex:1;align-items:center;gap:.5rem;min-width:120px;padding:1rem;font-family:inherit;transition:all .3s;display:flex;box-shadow:0 6px 18px #8b45130f}.temp-btn:hover{border-color:#8b451333;transform:translateY(-2px)}.temp-btn.active{border-color:var(--primary);box-shadow:0 4px 15px #8b451326}.temp-btn.active.cold{background:linear-gradient(135deg,#3b82f60d 0%,#3b82f61a 100%);border-color:#3b82f6}.temp-btn.active.optimal{background:linear-gradient(135deg,#22c55e0d 0%,#22c55e1a 100%);border-color:#22c55e}.temp-btn.active.danger{background:linear-gradient(135deg,#ef44440d 0%,#ef44441a 100%);border-color:#ef4444}.temp-icon{font-size:1.5rem}.temp-label{color:var(--text-main);text-align:center;font-size:.8rem;font-weight:600}.temp-result{border-radius:14px;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:1.2rem 1.5rem;animation:.3s slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.temp-result.cold{background:linear-gradient(135deg,#3b82f614 0%,#3b82f608 100%);border-left:4px solid #3b82f6}.temp-result.optimal{background:linear-gradient(135deg,#22c55e14 0%,#22c55e08 100%);border-left:4px solid #22c55e}.temp-result.danger{background:linear-gradient(135deg,#ef444414 0%,#ef444408 100%);border-left:4px solid #ef4444}.result-icon{font-size:1.8rem}.temp-result p{color:var(--text-main);margin:0;font-size:1rem;font-weight:600}.yeast-tip{border-left:4px solid var(--accent);background:linear-gradient(135deg,#f4a46014 0%,#f4a46008 100%);border-radius:12px;align-items:flex-start;gap:.8rem;padding:1rem 1.2rem;display:flex}.yeast-tip span{flex-shrink:0;font-size:1.2rem}.yeast-tip p{color:var(--text-main);margin:0;font-size:.85rem;line-height:1.6}.element-grid{grid-template-columns:repeat(2,1fr);gap:1.2rem;margin-bottom:1.5rem;display:grid}.element-card{text-align:center;border-radius:16px;padding:1.5rem;transition:all .3s;box-shadow:0 8px 20px #8b45130f}.element-card.water{background:linear-gradient(135deg,#3b82f614 0%,#3b82f608 100%);border:1px solid #3b82f626}.element-card.salt{background:linear-gradient(135deg,#8b451314 0%,#8b451308 100%);border:1px solid #8b45131a}.element-card:hover{transform:translateY(-3px)}.element-icon{margin-bottom:.8rem;font-size:2rem}.element-card h4{color:var(--primary);margin-bottom:.5rem;font-size:1.1rem}.element-card p{color:var(--text-muted);margin:0;font-size:.85rem;line-height:1.5}.water-tip{border-left:4px solid var(--accent);color:var(--text-main);background:linear-gradient(90deg,#f4a46014 0%,#f4a46005 100%);border-radius:0 14px 14px 0;margin:0;padding:1.2rem 1.5rem;font-size:.9rem;font-style:normal;line-height:1.6}.water-tip:before{display:none}.fats-grid{grid-template-columns:repeat(3,1fr);gap:1.2rem;display:grid}.fat-card{text-align:center;background:linear-gradient(135deg,#8b451305 0%,#f4a4600d 100%);border:1px solid #8b45130f;border-radius:16px;padding:1.5rem;transition:all .3s;box-shadow:0 8px 20px #8b45130f}.fat-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #8b45131a}.fat-icon{margin-bottom:.8rem;font-size:2.5rem}.fat-card h4{color:var(--primary);margin-bottom:.5rem;font-size:1rem}.fat-effect{color:var(--text-main);margin-bottom:.8rem;font-size:.85rem;line-height:1.4}.fat-benefit{color:var(--accent);background:#f4a4601a;border-radius:20px;padding:.3rem .8rem;font-size:.75rem;font-weight:600;display:inline-block}.order-section{border-top:4px solid var(--accent)}.order-steps{flex-direction:column;align-items:center;gap:.5rem;display:flex}.order-step{background:#fff;border:2px solid #8b451314;border-radius:14px;align-items:center;gap:1rem;width:100%;max-width:400px;padding:1rem 1.5rem;transition:all .3s;display:flex;box-shadow:0 8px 20px #8b45130f}.order-step:hover{border-color:#8b451326;transform:translate(5px)}.order-step.highlight{background:linear-gradient(135deg,#4caf5014 0%,#4caf5008 100%);border-color:#4caf50}.step-number{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;font-weight:800;display:flex}.step-content{align-items:center;gap:.6rem;display:flex}.step-icon{font-size:1.3rem}.step-content span:last-child{color:var(--text-main);font-size:.9rem}.order-arrow{color:var(--accent);font-size:1.2rem;font-weight:700}@media (max-width:768px){.ingredients-container{padding-bottom:8rem}.header-icon{font-size:3rem}.section-header{text-align:center;flex-direction:column;align-items:center}.section-emoji{font-size:2rem}.temp-selector{flex-direction:column}.temp-btn{flex-direction:row;justify-content:flex-start;gap:1rem}.element-grid,.fats-grid{grid-template-columns:1fr}}@media (max-width:480px){.header-icon{font-size:2.5rem}.ing-section{padding:1.5rem}.temp-result{text-align:center;flex-direction:column;padding:1rem}.order-step{padding:.9rem 1rem}.step-number{width:28px;height:28px;font-size:.8rem}.step-content span:last-child{font-size:.85rem}}
