.tagline-txt[data-astro-cid-76rejwwz]{color:var(--clr-secondary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);letter-spacing:.08em;text-transform:uppercase}.wc-hero[data-astro-cid-76rejwwz]{padding-block:var(--size-8);background:#e6e7ea;& .breadcrumb{color:var(--clr-primary-700);font-size:var(--fs-400);align-items:center;gap:.6rem;margin-block-end:var(--size-4);display:flex;& a{color:var(--clr-secondary-900);text-decoration:none;&:hover{text-decoration:underline}}}& .hero-grid{gap:var(--size-10);grid-template-columns:1fr 36rem;align-items:center;display:grid}& .hero-left{gap:var(--size-3);flex-direction:column;display:flex;& .hero-cat{color:var(--clr-primary-700);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);letter-spacing:.05em;align-items:center;gap:.5rem;display:flex}& h1{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1.15;& em{color:var(--clr-secondary-900);font-style:italic}}& .hero-desc{color:var(--clr-primary-700);font-size:var(--fs-500);line-height:var(--lh-400)}& .trust-strip{gap:var(--size-2);grid-template-columns:1fr 1fr;margin-block-start:var(--size-1);display:grid;& .trust-item{border-radius:var(--border-radius-btn);background:#fff;align-items:flex-start;gap:.8rem;padding:1rem 1.2rem;display:flex;& .trust-icon{width:2.8rem;min-width:2.8rem;height:2.8rem;color:var(--clr-secondary-900);background:#af8d5a1f;border-radius:50%;justify-content:center;align-items:center;display:flex}& .trust-label{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold)}& .trust-sub{color:var(--clr-primary-700);font-size:var(--fs-300)}}}}& .hero-right{& .stat-card{background:var(--clr-primary-900);border-radius:var(--border-radius-card);padding:var(--size-4);gap:var(--size-2);flex-direction:column;display:flex;& .stat-row{align-items:flex-start;gap:var(--size-2);display:flex;& .stat-icon{width:3.6rem;min-width:3.6rem;height:3.6rem;color:var(--clr-secondary-900);background:#af8d5a26;border-radius:50%;justify-content:center;align-items:center;display:flex}& .stat-val{color:#fff;font-family:var(--ff-header);font-size:var(--fs-600);font-weight:var(--fw-bold)}& .stat-lbl{color:#fff9;font-size:var(--fs-300)}}& .stat-div{border:none;border-top:1px solid #ffffff1a}}}@media (width<=1024px){& .hero-grid{gap:var(--size-6);grid-template-columns:1fr}& .hero-left h1{font-size:var(--fs-700)}}@media (width<=600px){& .hero-left .trust-strip{grid-template-columns:1fr}}@media (width<=768px){padding-block:var(--size-6)}}.wc-tool[data-astro-cid-76rejwwz]{padding-block:var(--size-8);background:#fff;& .tool-layout{gap:var(--size-6);grid-template-columns:1fr 36rem;align-items:start;display:grid}& .converter-card{background:var(--clr-primary-100);border-radius:var(--border-radius-card);padding:var(--size-4);gap:var(--size-3);flex-direction:column;display:flex;& .privacy-note{color:var(--clr-primary-700);font-size:var(--fs-300);line-height:var(--lh-400);& strong{color:var(--clr-primary-900)}}& .drop-zone{border-radius:var(--border-radius-card);cursor:pointer;padding:var(--size-5) var(--size-4);text-align:center;background:#fff;border:2px dashed #00000026;flex-direction:column;align-items:center;gap:.8rem;transition:border-color .2s,background .2s;display:flex;&:hover,&.dz--drag{border-color:var(--clr-secondary-900);background:#af8d5a0a}& .file-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}& .dz-icon{border-radius:var(--border-radius-card);width:5.6rem;height:5.6rem;color:var(--clr-secondary-900);background:#af8d5a1f;justify-content:center;align-items:center;display:flex}& .dz-title{color:var(--clr-primary-900);font-size:var(--fs-500);font-weight:var(--fw-semi-bold)}& .dz-sub{color:var(--clr-primary-700);font-size:var(--fs-400)}& .dz-pick-btn{background:var(--clr-primary-900);border-radius:var(--border-radius-btn);color:#fff;font-size:var(--fs-400);font-weight:var(--fw-semi-bold);pointer-events:none;padding:.9rem 2rem}& .dz-formats{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex;& .fmt-badge{background:var(--clr-primary-100);color:var(--clr-primary-700);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);border:1px solid #0000001f;border-radius:99px;padding:.3rem .8rem;&.fmt-badge--webp{color:var(--clr-secondary-900);background:#af8d5a1f;border-color:#af8d5a4d}}}}& .fi-item{align-items:center;gap:var(--size-2);border-radius:var(--border-radius-btn);background:#fff;margin-block-end:.4rem;padding:.8rem 1.2rem;display:flex}& .fi-thumb{background:var(--clr-primary-100);border-radius:.4rem;width:4rem;min-width:4rem;height:4rem;overflow:hidden;& img{object-fit:cover;width:100%;height:100%;display:block}}& .fi-info{flex:1;min-width:0}& .fi-name{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}& .fi-size{color:var(--clr-primary-700);font-size:var(--fs-300)}& .fi-status{font-size:var(--fs-300);color:var(--clr-primary-700);white-space:nowrap;align-items:center;gap:.4rem;display:flex;&[data-row-status=done]{color:#27ae60}&[data-row-status=fail]{color:#c0392b}&[data-row-status=processing]{color:var(--clr-secondary-900)}}& .fi-remove{color:var(--clr-primary-700);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.4rem;transition:color .2s,background .2s;display:flex;&:hover{color:#c0392b;background:#c0392b14}}& .result-status{border-radius:var(--border-radius-btn);font-size:var(--fs-400);align-items:center;gap:.6rem;padding:1rem 1.4rem;display:flex;&[data-state=success]{color:#27ae60;background:#27ae601a}&[data-state=error]{color:#c0392b;background:#c0392b1a}&[data-state=processing]{color:var(--clr-secondary-900);background:#af8d5a1a}}& .settings-panel{& .settings-grid{gap:var(--size-2);grid-template-columns:1fr 1fr;display:grid;& .setting-group{flex-direction:column;gap:.6rem;display:flex}& .setting-full{grid-column:1/-1}& .setting-label{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);justify-content:space-between;align-items:center;display:flex}& .setting-sub{color:var(--clr-primary-700);font-size:var(--fs-300);font-weight:var(--fw-regular)}& .slider-wrap{align-items:center;gap:var(--size-2);display:flex;& .qual-slider{accent-color:var(--clr-secondary-900);flex:1;height:.4rem}& .slider-val{color:var(--clr-primary-900);font-size:var(--fs-500);font-weight:var(--fw-bold);text-align:right;min-width:3rem}}& .limits-hint{color:var(--clr-primary-700);font-size:var(--fs-300)}& .tip-inline{border-radius:var(--border-radius-btn);border-left:3px solid var(--clr-secondary-900);color:var(--clr-primary-900);font-size:var(--fs-400);line-height:var(--lh-400);background:#af8d5a1a;align-items:flex-start;gap:.8rem;padding:1rem 1.2rem;display:flex;& svg{color:var(--clr-secondary-900)}& strong{font-weight:var(--fw-bold)}}& .input-field{border-radius:var(--border-radius-btn);color:var(--clr-primary-900);font-family:var(--ff-base);font-size:var(--fs-400);border:1px solid #00000026;outline:none;width:100%;padding:.9rem 1.2rem;transition:border-color .2s;&:focus{border-color:var(--clr-secondary-900)}&::placeholder{color:#0000004d}}& .checkbox-row{color:var(--clr-primary-900);font-size:var(--fs-400);cursor:pointer;align-items:center;gap:.6rem;display:flex;& input{accent-color:var(--clr-secondary-900)}}}}& .action-bar{align-items:center;gap:var(--size-2);flex-wrap:wrap;display:flex;& .btn-convert{background:var(--clr-secondary-900);border-radius:var(--border-radius-btn);color:#fff;cursor:pointer;font-family:var(--ff-base);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);border:none;align-items:center;gap:.6rem;padding:1.2rem 2rem;transition:opacity .2s;display:flex;&:hover:not(:disabled){opacity:.9}&:disabled{cursor:not-allowed;opacity:.4}}& .btn-clear{border-radius:var(--border-radius-btn);color:var(--clr-primary-700);cursor:pointer;font-family:var(--ff-base);font-size:var(--fs-400);background:0 0;border:1px solid #00000026;align-items:center;gap:.5rem;padding:1.2rem 1.6rem;transition:border-color .2s,color .2s;display:flex;&:hover{color:#c0392b;border-color:#c0392b}&:disabled{opacity:.4;cursor:not-allowed}}}}& .tool-sidebar{gap:var(--size-3);flex-direction:column;display:flex;position:sticky;top:9.6rem;& .how-card{background:var(--clr-primary-100);border-radius:var(--border-radius-card);padding:var(--size-3);& .how-title{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-500);font-weight:var(--fw-bold);margin-block-end:var(--size-2)}& .how-steps{gap:var(--size-2);flex-direction:column;display:flex;& .how-step{gap:var(--size-2);display:flex;& .how-num{background:var(--clr-primary-900);color:#fff;width:2.4rem;min-width:2.4rem;height:2.4rem;font-size:var(--fs-300);font-weight:var(--fw-bold);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}& .how-step-text{color:var(--clr-primary-700);font-size:var(--fs-400);line-height:var(--lh-400);& strong{color:var(--clr-primary-900);font-weight:var(--fw-semi-bold);margin-block-end:.2rem;display:block}}}}}& .faq-card{background:var(--clr-primary-100);border-radius:var(--border-radius-card);overflow:hidden;& .faq-item{border-bottom:1px solid #00000012;&:last-child{border-bottom:none}}& .faq-q{cursor:pointer;justify-content:space-between;align-items:center;gap:var(--size-2);padding:var(--size-2) var(--size-3);text-align:left;background:0 0;border:none;width:100%;display:flex;& .faq-q-text{color:var(--clr-primary-900);font-family:var(--ff-base);font-size:var(--fs-400);font-weight:var(--fw-semi-bold)}& .faq-chevron{color:var(--clr-primary-700);flex-shrink:0;transition:transform .2s}}& .webp-faq-open .faq-q .faq-chevron{transform:rotate(180deg)}& .faq-answer{color:var(--clr-primary-700);font-size:var(--fs-400);line-height:var(--lh-400);max-height:0;padding-inline:var(--size-3);transition:max-height .25s,padding .25s;overflow:hidden}& .webp-faq-open .faq-answer{max-height:20rem;padding-block:var(--size-1) var(--size-2)}}& .sidebar-cta-card{background:var(--clr-primary-900);border-radius:var(--border-radius-card);padding:var(--size-3);gap:var(--size-2);flex-direction:column;display:flex;& .scc-label{color:var(--clr-secondary-800);font-size:var(--fs-300);font-weight:var(--fw-semi-bold);letter-spacing:.05em;background:#af8d5a33;border:1px solid #af8d5a4d;border-radius:99px;width:fit-content;padding:.4rem 1rem}& .scc-title{color:#fff;font-family:var(--ff-header);font-size:var(--fs-500);font-weight:var(--fw-bold);line-height:1.3}& .scc-desc{color:#ffffffa6;font-size:var(--fs-400);line-height:var(--lh-400)}& .scc-trust{color:#fff6;font-size:var(--fs-300);text-align:center}}}@media (width<=1100px){& .tool-layout{grid-template-columns:1fr}& .tool-sidebar{position:static}}@media (width<=768px){padding-block:var(--size-6)}}.vena-section[data-astro-cid-76rejwwz]{padding-block:var(--size-10);background:#e6e7ea;& .vena-header{text-align:center;align-items:center;gap:var(--size-2);flex-direction:column;margin-block-end:var(--size-8);display:flex;& h2{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1.2}& .vena-desc{color:var(--clr-primary-700);font-size:var(--fs-500);line-height:var(--lh-400);max-width:52ch}}& .vena-grid{gap:var(--size-4);grid-template-columns:1fr 1fr;margin-block-end:var(--size-8);display:grid;& .vena-card{border-radius:var(--border-radius-card);background:#fff;overflow:hidden;& .vena-img{aspect-ratio:16/7;justify-content:center;align-items:center;display:flex;position:relative;&.vena-img--orig{background:#f0ece6}&.vena-img--webp{background:#af8d5a14}& .vena-lbl{color:#fff;font-size:var(--fs-300);font-weight:var(--fw-semi-bold);background:#0000008c;border-radius:99px;padding:.3rem .9rem;position:absolute;top:1rem;left:1rem;&.vena-lbl--gold{background:#af8d5acc}}}& .vena-body{padding:var(--size-3);& .vena-title{color:var(--clr-primary-900);font-size:var(--fs-400);font-weight:var(--fw-semi-bold);margin-block-end:var(--size-2)}& .vena-bars{gap:var(--size-1);flex-direction:column;display:flex;& .bar-row{align-items:center;gap:var(--size-1);display:flex;& .bar-name{color:var(--clr-primary-700);font-size:var(--fs-300);flex-shrink:0;width:10rem}& .bar-track{background:#00000014;border-radius:99px;flex:1;height:.8rem;overflow:hidden;& .bar-fill{border-radius:99px;height:100%}}& .bar-val{font-size:var(--fs-300);font-weight:var(--fw-bold);text-align:right;min-width:4rem}}}}}}& .chart-wrap{border-radius:var(--border-radius-card);padding:var(--size-4);background:#fff;& .chart-title{color:var(--clr-primary-700);font-size:var(--fs-400);margin-block-end:var(--size-4)}& .chart-bars{gap:var(--size-4);align-items:flex-end;height:14rem;display:flex;& .chart-group{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;gap:.6rem;height:100%;display:flex;& .chart-bar-pair{align-items:flex-end;gap:.4rem;width:100%;display:flex;& .chart-bar{border-radius:.3rem .3rem 0 0;flex:1;min-height:.4rem;transition:height .4s;&.chart-bar--orig{background:#e8e0d6}&.chart-bar--webp{background:var(--clr-secondary-900)}}}& .chart-lbl{color:var(--clr-primary-700);font-size:var(--fs-300);text-align:center}}}& .chart-legend{gap:var(--size-4);margin-block-start:var(--size-3);display:flex;& .legend-item{color:var(--clr-primary-700);font-size:var(--fs-300);align-items:center;gap:.5rem;display:flex;& .legend-dot{border-radius:50%;flex-shrink:0;width:1rem;height:1rem}}}}@media (width<=768px){padding-block:var(--size-8);& .vena-header h2{font-size:var(--fs-700)}& .vena-grid{grid-template-columns:1fr}& .chart-bars{gap:var(--size-2)}}}.formats-section[data-astro-cid-76rejwwz]{padding-block:var(--size-10);background:#fff;& .formats-header{text-align:center;align-items:center;gap:var(--size-2);flex-direction:column;margin-block-end:var(--size-8);display:flex;& h2{color:var(--clr-primary-900);font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1.2}& .formats-desc{color:var(--clr-primary-700);font-size:var(--fs-500);line-height:var(--lh-400);max-width:52ch}}& .formats-table{border-radius:var(--border-radius-card);border:1px solid #00000014;overflow:hidden;& .ft-head{background:var(--clr-primary-900);grid-template-columns:2fr 1.5fr 1.5fr 1fr;gap:0;display:grid;& div{color:#ffffffb3;font-size:var(--fs-300);font-weight:var(--fw-semi-bold);letter-spacing:.05em;text-transform:uppercase;padding:1rem 1.4rem}}& .ft-row{border-bottom:1px solid #0000000f;grid-template-columns:2fr 1.5fr 1.5fr 1fr;transition:background .15s;display:grid;&:last-child{border-bottom:none}&:hover{background:var(--clr-primary-100)}& .ft-cell{color:var(--clr-primary-700);font-size:var(--fs-400);padding:1.2rem 1.4rem;&.ft-cell--type{color:var(--clr-primary-900);font-weight:var(--fw-semi-bold)}&.ft-cell--max{color:var(--clr-secondary-900);font-weight:var(--fw-semi-bold)}}}}@media (width<=768px){padding-block:var(--size-8);& .formats-header h2{font-size:var(--fs-700)}& .formats-table{& .ft-head{grid-template-columns:1fr 1fr;& div:nth-child(n+3){display:none}}& .ft-row{grid-template-columns:1fr 1fr;& .ft-cell:nth-child(n+3){display:none}}}}}.wc-cta[data-astro-cid-76rejwwz]{background:var(--clr-primary-900);padding-block:var(--size-10);& .cta-card{text-align:center;align-items:center;gap:var(--size-3);flex-direction:column;max-width:76rem;margin-inline:auto;display:flex;& h2{color:#fff;font-family:var(--ff-header);font-size:var(--fs-800);font-weight:var(--fw-bold);line-height:1.2}& p{color:#ffffffb3;font-size:var(--fs-500);line-height:var(--lh-400);max-width:52ch}& .cta-btns{gap:var(--size-2);flex-wrap:wrap;justify-content:center;margin-block-start:var(--size-1);display:flex}}@media (width<=768px){padding-block:var(--size-8);& .cta-card h2{font-size:var(--fs-700)}}}
