.btn-calc1.active-calc{background:var(--white)!important;color:var(--primary-red)!important;border:2px solid var(--primary-red)!important;box-shadow:none!important}.cement-hero{padding:140px 0 60px;background:var(--gradient-light);position:relative;overflow:hidden;text-align:center}.cement-hero-content{position:relative;z-index:2;max-width:900px;margin:0 auto;padding:0 20px}.center{text-align:center}.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start;margin-top:-40px;position:relative;z-index:10}.calc-card{background:var(--white);border-radius:var(--radius-xl);padding:30px;box-shadow:var(--shadow-lg);border:1px solid var(--medium-gray);transition:transform .3s ease}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.card-header h3{font-size:20px;margin:0}.unit-toggle-wrapper{position:relative;display:flex;background:var(--off-white);border-radius:30px;padding:4px;border:1px solid var(--medium-gray)}.unit-toggle-wrapper input{display:none}.unit-toggle-wrapper label{position:relative;z-index:2;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;color:var(--text-gray);transition:color .3s ease}.toggle-slider{position:absolute;top:4px;left:4px;width:50%;bottom:4px;height:auto;background:var(--white);border-radius:24px;box-shadow:0 2px 6px rgba(0,0,0,.1);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1}#unit-imperial:checked ~ .toggle-slider{transform:translateX(0);width:85px}#unit-metric:checked ~ .toggle-slider{transform:translateX(85px);width:85px}#unit-imperial:checked + label{color:var(--primary-red)}#unit-metric:checked + label{color:var(--primary-red)}.input-form{display:flex;flex-direction:column;gap:20px}.input-group label{font-size:13px;font-weight:600;color:var(--text-gray);margin-bottom:8px;display:block}.field-wrapper{position:relative}.field-wrapper input{width:100%;padding:14px 16px;padding-right:40px;border:1px solid var(--medium-gray);border-radius:12px;font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;outline:none;transition:all .2s}.field-wrapper input:focus{border-color:var(--primary-red);box-shadow:0 0 0 3px rgba(238,28,37,.1)}.field-icon{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--text-light);font-size:18px}.grade-info{margin-top:10px;padding:12px;background:#FFF5F6;border-radius:8px;border-left:3px solid var(--primary-red);display:flex;justify-content:space-between;font-size:13px;color:var(--primary-red)}.ratio-badge{font-weight:800;letter-spacing:.5px}.result-card{background:#2D2D2D;color:white;border:none;position:relative;overflow:hidden}.result-card h3{color:white}.result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:15px}.material-grid{display:grid;gap:16px;margin-bottom:30px}.mat-item{background:rgba(255,255,255,.08);border-radius:12px;padding:12px 16px;display:flex;align-items:center;gap:16px;backdrop-filter:blur(5px);transition:transform .2s}.mat-item:hover{transform:translateX(5px);background:rgba(255,255,255,.12)}.mat-icon{font-size:24px}.mat-info{display:flex;flex-direction:column}.mat-label{font-size:11px;text-transform:uppercase;color:rgba(255,255,255,.6);letter-spacing:1px}.mat-val{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;color:white;line-height:1.1}.mat-unit{font-size:11px;color:rgba(255,255,255,.4)}.chart-container{position:relative;width:200px;height:200px;margin:0 auto}.chart-center-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;font-size:12px;color:rgba(255,255,255,.5);pointer-events:none}.sweet-note{margin-top:40px;background:linear-gradient(135deg,#FDFBF7 0%,#FFF 100%);border:1px solid #E0E0E0;border-radius:20px;padding:24px;display:flex;gap:20px;align-items:center;max-width:800px;margin-left:auto;margin-right:auto}.note-decoration{font-size:32px}.note-content h4{color:#8D6E63;font-size:16px;margin-bottom:6px}.note-content p{font-size:13px;color:var(--text-gray);line-height:1.5}@media (max-width:768px){.calc-grid{grid-template-columns:1fr}.cement-hero{padding-top:100px}.chart-container{width:180px;height:180px}}