.qr-hero{text-align:center;padding:90px 24px 70px;background:radial-gradient(circle at 50% 0,#e5f4ea,transparent 48%),#f7faf8}.qr-hero>a{display:block;color:#087c38;font-size:12px;text-decoration:none;margin-bottom:28px}.qr-hero>span,.qr-use header span{color:#07953b;font-size:11px;font-weight:800;letter-spacing:1.5px}.qr-hero h1{font-size:clamp(52px,6vw,82px);line-height:1;letter-spacing:-4px;margin:14px 0 22px}.qr-hero p{font-size:17px;line-height:1.7;color:#647068;max-width:780px;margin:auto}.qr-hero>small{display:block;margin-top:17px;color:#78847c;font-size:10px}.qr-builder{padding:70px clamp(24px,6vw,90px);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:24px;align-items:start}.qr-controls{border:1px solid #dce5df;border-radius:14px;padding:30px}.qr-step{display:flex;gap:14px;align-items:start}.qr-step>b{color:#07953b;font-size:11px}.qr-step h2{font-size:27px;margin:0}.qr-step p{font-size:12px;color:#6d7971}.qr-types{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0}.qr-types button{border:1px solid #d7e1da;background:#fff;border-radius:18px;padding:8px 13px;font-size:10px}.qr-types button.active{background:#06452a;color:#fff;border-color:#06452a}.qr-controls label{display:block;font-size:11px;font-weight:800;margin:11px 0}.qr-controls input,.qr-controls select{display:block;width:100%;height:46px;border:1px solid #d4dfd7;border-radius:7px;background:#fff;padding:0 12px;margin-top:7px}.qr-check{display:flex!important;align-items:center;gap:8px}.qr-check input{width:auto;height:auto;margin:0}.qr-step.customize{border-top:1px solid #e2e8e4;margin-top:27px;padding-top:27px}.qr-options{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}.qr-options input[type=color]{padding:4px}.qr-options input[type=range]{height:auto;padding:0;accent-color:#07953b}.qr-options label:last-child{grid-column:1/-1}.qr-options label small{color:#7c877f;font-weight:400}.qr-preview-panel{position:sticky;top:20px;background:#073f27;color:#fff;border-radius:15px;padding:30px;text-align:center}.qr-preview-panel>span{font-size:9px;color:#61dd8d;font-weight:800;letter-spacing:1.3px}.qr-preview{background:#fff;border-radius:12px;padding:22px;margin:20px auto 12px;max-width:390px}.qr-preview svg{display:block;width:100%;height:auto}.qr-preview-panel>p{font-size:10px;color:#b9d1c1}.qr-downloads{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:18px 0}.qr-downloads button{height:43px;border:0;border-radius:7px;background:#17a94b;color:#fff;font-weight:800}.qr-downloads button:last-child{background:#fff;color:#06452a}.qr-preview-panel>small{font-size:9px;color:#a9c3b2;line-height:1.5}.qr-use{background:#f5f8f6;padding:75px clamp(24px,6vw,90px)}.qr-use header{text-align:center}.qr-use h2{font-size:38px;margin:10px}.qr-use>div{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:35px}.qr-use article{background:#fff;border:1px solid #dfe7e1;border-radius:11px;padding:24px}.qr-use article>b{font-size:10px;color:#07953b}.qr-use h3{font-size:17px;margin:25px 0 10px}.qr-use p{font-size:12px;line-height:1.6;color:#68746c}.qr-guide{padding:75px clamp(24px,10vw,160px);max-width:1150px;margin:auto}.qr-guide h2{font-size:32px;margin-top:45px}.qr-guide ol{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:0;list-style-position:inside}.qr-guide li{background:#f5f8f6;border-radius:9px;padding:18px;font-size:11px;line-height:1.5}.qr-guide details{border-bottom:1px solid #dfe6e1}.qr-guide summary{padding:18px 0;font-size:13px;font-weight:800;display:flex;justify-content:space-between}.qr-guide details p{font-size:13px;line-height:1.7;color:#657169}@media(max-width:900px){.qr-builder{grid-template-columns:1fr}.qr-preview-panel{position:static}.qr-use>div{grid-template-columns:1fr 1fr}.qr-guide ol{grid-template-columns:1fr 1fr}}@media(max-width:520px){.qr-hero{padding:60px 19px}.qr-hero h1{font-size:46px;letter-spacing:-2.5px}.qr-builder{padding:45px 14px}.qr-controls,.qr-preview-panel{padding:20px}.qr-options{grid-template-columns:1fr}.qr-options label:last-child{grid-column:auto}.qr-use{padding:55px 14px}.qr-use>div,.qr-guide ol{grid-template-columns:1fr}.qr-guide{padding:55px 19px}.qr-downloads{grid-template-columns:1fr}}
