@media only screen and (min-width: 0rem) {#converter-tool {padding: clamp(7rem, 12vw, 9rem) 1rem clamp(3.75rem, 7.82vw, 6.25rem);}#converter-tool .cs-container {width: 100%;max-width: 50rem;margin: auto;display: flex;flex-direction: column;align-items: center;gap: clamp(1.5rem, 3vw, 2rem);}#converter-tool .tool-header {text-align: center;width: 100%;display: flex;flex-direction: column;align-items: center;gap: 0.5rem;}#converter-tool .tool-title {font-size: clamp(1.75rem, 4vw, 2.5rem);font-weight: 900;color: var(--headerColor);margin: 0;}#converter-tool .tool-subtitle {font-size: 1rem;color: var(--bodyTextColor);margin: 0;max-width: 34.375rem;}.upload-zone {width: 100%;min-height: 17.5rem;border: 3px dashed var(--primary);border-radius: 1rem;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: border-color 0.3s, background-color 0.3s, transform 0.3s;padding: 3rem 1.5rem;background: #fff;}.upload-zone:hover, .upload-zone.drag-over {border-color: var(--primary);background-color: rgba(255, 106, 62, 0.06);transform: scale(1.01);}.upload-zone:focus-visible {outline: 3px solid var(--primary);outline-offset: 2px;}.upload-zone-content {text-align: center;display: flex;flex-direction: column;align-items: center;gap: 0.5rem;}.upload-icon {color: var(--primary);margin-bottom: 0.5rem;width: 4rem;height: 4rem;}.upload-text {font-size: 1.25rem;font-weight: 700;color: var(--headerColor);margin: 0;}.upload-link {color: var(--primary);text-decoration: underline;}.upload-hint {font-size: 0.875rem;color: var(--bodyTextColor);margin: 0;}.upload-file-list {list-style: none;padding: 0;margin: 0.5rem 0 0;width: 100%;max-width: 28.125rem;}.upload-file-list li {font-size: 0.8125rem;color: var(--bodyTextColor);padding: 0.25rem 0;border-bottom: 1px solid #e8e8e8;word-break: break-all;}.upload-file-list li:last-child {border-bottom: none;}.upload-thumbnail-grid {display: flex;flex-wrap: wrap;gap: 0.5rem;justify-content: center;margin-top: 0.75rem;}.upload-thumbnail {width: 4rem;height: 4rem;border-radius: 0.375rem;overflow: hidden;position: relative;border: 1px solid #e8e8e8;}.upload-thumbnail img {width: 100%;height: 100%;object-fit: cover;}.upload-thumbnail .thumb-size {position: absolute;bottom: 0;left: 0;right: 0;font-size: 0.625rem;text-align: center;background: rgba(0, 0, 0, 0.6);color: #fff;padding: 0.125rem;}.upload-thumb-more {display: flex;align-items: center;justify-content: center;font-size: 0.8125rem;font-weight: 700;color: var(--bodyTextColor);background: #f0f0f0;}.converter-settings {width: 100%;background: #fff;border-radius: 0.75rem;padding: 1.5rem;display: flex;flex-direction: column;gap: 1.25rem;border: 2px solid var(--primary);box-shadow: 0 2px 8px rgba(255, 106, 62, 0.08);align-items: center;}.converter-settings .cs-button-solid {background-color: var(--buttonColorGreen);min-width: 15.625rem;font-size: 1.125rem;line-height: clamp(3rem, 6vw, 3.75rem);}.converter-settings .cs-button-solid:before {background: #228B22;}.setting-group {display: flex;flex-direction: column;gap: 0.5rem;}.setting-group label {font-size: 1rem;font-weight: 700;color: var(--headerColor);}.setting-group input[type="range"] {width: 100%;height: 0.375rem;-webkit-appearance: none;appearance: none;background: #c5d2d6;border-radius: 0.1875rem;outline: none;}.setting-group input[type="range"]::-webkit-slider-thumb {-webkit-appearance: none;appearance: none;width: 1.375rem;height: 1.375rem;background: var(--primary);border-radius: 50%;cursor: pointer;}.setting-group input[type="range"]::-moz-range-thumb {width: 1.375rem;height: 1.375rem;background: var(--primary);border-radius: 50%;cursor: pointer;border: none;}#converter-tool .cs-button-solid {font-size: 1rem;line-height: clamp(2.875rem, 5.5vw, 3.5rem);text-decoration: none;font-weight: 700;text-align: center;color: #fff;min-width: 12.5rem;padding: 0 2rem;background-color: var(--primary);border-radius: 0.25rem;border: none;cursor: pointer;display: inline-block;position: relative;z-index: 1;}#converter-tool .cs-button-solid:before {content: "";position: absolute;height: 100%;width: 0%;background: #000;top: 0;left: 0;z-index: -1;border-radius: 0.25rem;transition: width 0.3s;}#converter-tool .cs-button-solid:hover:before {width: 100%;}#converter-tool .cs-button-solid:disabled {opacity: 0.6;cursor: not-allowed;}#converter-tool .cs-button-solid:disabled:before {width: 0%;}.converter-results {width: 100%;display: flex;flex-direction: column;align-items: center;gap: 1rem;}.results-heading {font-size: var(--mediumHeaderFontSize);font-weight: 900;color: var(--headerColor);margin: 0;}.results-list {width: 100%;display: flex;flex-direction: column;gap: 0.75rem;}.processing-progress {width: 100%;display: flex;flex-direction: column;align-items: center;gap: 0.5rem;padding: 1rem 0;}.progress-bar {width: 100%;height: 0.5rem;background: #e8e8e8;border-radius: 0.25rem;overflow: hidden;}.progress-fill {height: 100%;background: var(--primary);border-radius: 0.25rem;width: 0%;transition: width 0.3s ease;}.progress-text {font-size: 0.875rem;color: var(--bodyTextColor);margin: 0;}.result-card {width: 100%;background: #fff;border: 1px solid #e8e8e8;border-radius: 0.75rem;padding: 1.25rem;display: flex;flex-direction: column;gap: 1rem;align-items: flex-start;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);animation: fadeSlideUp 0.3s ease forwards;}.result-info {width: 100%;display: flex;flex-direction: column;gap: 0.25rem;}.result-name {font-size: 1rem;font-weight: 700;color: var(--headerColor);margin: 0;word-break: break-all;}.result-sizes {display: flex;flex-wrap: wrap;align-items: center;gap: 0.5rem;font-size: 0.875rem;color: var(--bodyTextColor);}.size-arrow {color: var(--primary);font-weight: 700;}.size-savings {font-weight: 700;color: var(--buttonColorGreen);background: rgba(49, 180, 74, 0.1);padding: 0.25rem 0.75rem;border-radius: 0.75rem;font-size: 0.875rem;}.size-savings.size-increase {color: #e53e3e;background: rgba(229, 62, 62, 0.1);}.result-dimensions {font-size: 0.8125rem;color: var(--bodyTextColor);margin: 0;}.result-preview {width: 100%;display: flex;flex-direction: column;gap: 1rem;}.preview-original, .preview-processed {flex: 1;display: flex;flex-direction: column;align-items: center;gap: 0.5rem;}.preview-label {font-size: 0.75rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.05em;color: var(--bodyTextColor);background: #f0f0f0;padding: 0.125rem 0.625rem;border-radius: 0.25rem;}.result-preview img {max-width: 100%;max-height: 12.5rem;object-fit: contain;border-radius: 0.25rem;border: 1px solid #e8e8e8;}.result-download {font-size: 0.875rem !important;line-height: 2.5rem !important;min-width: auto !important;padding: 0 1.25rem !important;}.clear-btn {font-size: 1rem;font-weight: 700;color: var(--bodyTextColor);background: none;border: 2px solid #c5d2d6;border-radius: 0.25rem;padding: 0.625rem 1.5rem;cursor: pointer;transition: border-color 0.3s, color 0.3s;}.clear-btn:hover {border-color: var(--primary);color: var(--primary);}.trust-badges {display: flex;flex-wrap: wrap;justify-content: center;gap: 1rem 1.5rem;width: 100%;}.trust-badge {display: flex;align-items: center;gap: 0.375rem;font-size: 0.8125rem;font-weight: 600;color: var(--bodyTextColor);}.trust-badge svg {color: var(--buttonColorGreen);flex-shrink: 0;}.upload-zone:hover .upload-icon {animation: gentleBounce 0.6s ease;}@keyframes gentleBounce {0%, 100% {transform: translateY(0);}50% {transform: translateY(-6px);}}.converter-settings, .converter-results {animation: fadeIn 0.3s ease;}@keyframes fadeIn {from {opacity: 0;}to {opacity: 1;}}@keyframes fadeSlideUp {from {opacity: 0;transform: translateY(10px);}to {opacity: 1;transform: translateY(0);}}.result-download:hover {transform: scale(1.05);}}@media only screen and (min-width: 0rem) and (prefers-reduced-motion: reduce) {*, *::before, *::after {animation-duration: 0.01ms !important;transition-duration: 0.01ms !important;}}@media only screen and (min-width: 48rem) {.upload-zone {min-height: 20rem;}.upload-thumbnail {width: 5rem;height: 5rem;}.converter-settings {flex-direction: row;flex-wrap: wrap;align-items: flex-end;}.converter-settings .setting-group {flex: 1;min-width: 11.25rem;}.result-card {flex-direction: row;flex-wrap: wrap;align-items: center;justify-content: space-between;}.result-preview {flex-direction: row;}}@media only screen and (min-width: 0rem) {#how-it-works {padding: var(--sectionPadding);background: #fafbfc;}#how-it-works .cs-container {width: 100%;max-width: 80rem;margin: auto;display: flex;flex-direction: column;align-items: center;text-align: center;gap: clamp(2rem, 4vw, 3rem);}#how-it-works .cs-title {max-width: none;}.steps-grid {width: 100%;display: flex;flex-direction: column;gap: 1.25rem;}.step-card {background: #fff;border-radius: 0.75rem;padding: 2rem 1.5rem;border: 1px solid #e8e8e8;display: flex;flex-direction: column;align-items: center;gap: 0.75rem;text-align: center;}.step-card h3 {font-size: 1.25rem;font-weight: 900;color: var(--headerColor);margin: 0;}.step-card p {font-size: 1rem;line-height: 1.5em;color: var(--bodyTextColor);margin: 0;max-width: 21.875rem;}.step-number {font-size: 1.5rem;font-weight: 900;color: #fff;background: var(--primary);width: 3rem;height: 3rem;border-radius: 50%;display: flex;align-items: center;justify-content: center;}}@media only screen and (min-width: 48rem) {.steps-grid {flex-direction: row;justify-content: center;}.steps-grid .step-card {flex: 1;max-width: 23.75rem;}}@media only screen and (min-width: 0rem) {#format-guide {padding: var(--sectionPadding);}#format-guide .cs-container {width: 100%;max-width: 50rem;margin: auto;}#format-guide .cs-content {display: flex;flex-direction: column;gap: 1rem;}#format-guide .cs-content h3 {font-size: var(--mediumHeaderFontSize);font-weight: 900;color: var(--headerColor);margin: 1rem 0 0;}#format-guide .cs-content a {color: var(--primary);text-decoration: underline;}#format-guide .cs-content a:hover {color: var(--headerColor);}#format-guide .cs-text {max-width: none;}}@media only screen and (min-width: 0rem) {#faq-1141 {padding: var(--sectionPadding);background: #fafbfc;}#faq-1141 .cs-container {width: 100%;max-width: 50rem;margin: auto;display: flex;flex-direction: column;align-items: center;gap: clamp(2rem, 4vw, 3rem);}#faq-1141 .cs-content {text-align: center;width: 100%;display: flex;flex-direction: column;align-items: center;}#faq-1141 .cs-title {max-width: none;}#faq-1141 .cs-faq-group {width: 100%;padding: 0;margin: 0;display: flex;flex-direction: column;gap: 0.75rem;}#faq-1141 .cs-faq-item {list-style: none;width: 100%;background: #fff;border: 1px solid #e8e8e8;border-radius: 0.5rem;transition: border-color 0.3s;overflow: hidden;}#faq-1141 .cs-faq-item:hover {border-color: var(--primary);}#faq-1141 .cs-faq-item.active {border-color: var(--primary);}#faq-1141 .cs-faq-item.active .cs-button {color: var(--primary);}#faq-1141 .cs-faq-item.active .cs-button:after {transform: translateY(-50%) rotate(180deg);}#faq-1141 .cs-faq-item.active .cs-item-p {height: auto;padding: 0 1.25rem 1rem;opacity: 1;}#faq-1141 .cs-button {font-size: clamp(1rem, 1.5vw, 1.25rem);line-height: 1.4em;text-align: left;font-weight: 700;padding: 1rem 3rem 1rem 1.25rem;border: none;background: transparent;color: var(--headerColor);display: block;width: 100%;cursor: pointer;position: relative;transition: color 0.3s;}#faq-1141 .cs-button:after {content: "";width: 0;height: 0;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 6px solid currentColor;position: absolute;top: 50%;right: 1.25rem;transform: translateY(-50%);transition: transform 0.3s;}#faq-1141 .cs-button-text {display: block;}#faq-1141 .cs-item-p {font-size: 1rem;line-height: 1.6em;height: 0;margin: 0;padding: 0 1.25rem;opacity: 0;color: var(--bodyTextColor);overflow: hidden;transition: opacity 0.3s, padding 0.3s;}}@media only screen and (min-width: 0rem) {#cta-page {padding: var(--sectionPadding);background: var(--primary);}#cta-page .cs-container {width: 100%;max-width: 50rem;margin: auto;}#cta-page .cs-content {text-align: center;display: flex;flex-direction: column;align-items: center;gap: 1rem;}#cta-page .cs-topper {color: #fff;opacity: 0.85;}#cta-page .cs-title {color: #fff;max-width: none;}#cta-page .cs-text {color: #fff;max-width: 37.5rem;opacity: 0.9;}#cta-page .cs-button-solid {background-color: #fff;color: var(--primary);font-size: 1rem;line-height: clamp(2.875rem, 5.5vw, 3.5rem);font-weight: 700;text-decoration: none;padding: 0 2rem;border-radius: 0.25rem;display: inline-block;position: relative;z-index: 1;}#cta-page .cs-button-solid:before {content: "";position: absolute;height: 100%;width: 0%;background: #000;top: 0;left: 0;z-index: -1;border-radius: 0.25rem;transition: width 0.3s;}#cta-page .cs-button-solid:hover {color: #fff;}#cta-page .cs-button-solid:hover:before {width: 100%;}}