.color-converter-container{max-width:900px;margin:0 auto;padding:20px;font-family:Arial,sans-serif;color:#333}.color-converter-container h1{text-align:center;margin-bottom:30px;color:#2c3e50}.color-converter-container h2{color:#2c3e50;margin-bottom:20px}.color-converter-container .converter-content{display:flex;flex-direction:column;gap:30px;margin-bottom:40px}@media(min-width:768px){.color-converter-container .converter-content{flex-direction:row}}.color-converter-container .color-preview{flex:1;height:300px;border-radius:8px;box-shadow:0 4px 10px rgba(0,0,0,.1);display:flex;align-items:flex-end}.color-converter-container .color-preview .color-details{width:100%;background-color:hsla(0,0%,100%,.85);padding:15px;border-radius:0 0 8px 8px}.color-converter-container .color-preview .color-details p{margin:5px 0;font-weight:600}.color-converter-container .color-preview .color-details .copy-button{margin-top:10px;margin-right:8px;padding:8px 12px;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.color-converter-container .color-preview .color-details .copy-button:hover{background-color:#2980b9}.color-converter-container .controls-section{flex:1;display:flex;flex-direction:column;gap:30px}.color-converter-container .input-section,.color-converter-container .output-section{background-color:#f9f9f9;padding:20px;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.05)}.color-converter-container .slider-container{margin-bottom:20px}.color-converter-container .slider-container label{display:block;margin-bottom:8px;font-weight:600}.color-converter-container .slider-container input[type=range]{width:100%;margin-bottom:10px}.color-converter-container .slider-container input[type=number]{width:70px;padding:5px;border:1px solid #ddd;border-radius:4px}.color-converter-container .cmyk-values .cmyk-value{margin-bottom:15px;position:relative}.color-converter-container .cmyk-values .cmyk-value .cmyk-label{display:inline-block;width:30px;font-weight:600}.color-converter-container .cmyk-values .cmyk-value .cmyk-number{display:inline-block;width:50px;margin-left:10px}.color-converter-container .cmyk-values .cmyk-value .cmyk-bar{height:20px;border-radius:3px;margin-top:8px;transition:width .3s ease}.color-converter-container .info-section{background-color:#f5f5f5;padding:25px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.06)}.color-converter-container .info-section h2{text-align:center;margin-bottom:25px}.color-converter-container .info-section .info-content{display:flex;flex-direction:column;gap:30px}@media(min-width:768px){.color-converter-container .info-section .info-content{flex-direction:row}}.color-converter-container .info-section .info-content .info-column{flex:1}.color-converter-container .info-section .info-content .info-column h3{color:#2c3e50;margin-bottom:15px}.color-converter-container .info-section .info-content .info-column p{margin-bottom:15px;line-height:1.6}.color-converter-container .info-section .info-content .info-column ul{padding-left:20px}.color-converter-container .info-section .info-content .info-column ul li{margin-bottom:8px;line-height:1.5}