.of-head{display:flex;align-items:center;gap:16px;margin:22px 0 16px}
.of-head h1{margin:0 0 4px;font-size:26px}.of-head p{margin:0}
.of-logo{width:84px;height:84px;border-radius:18px;object-fit:cover;background:#eee;flex:none}
.of-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start;margin-bottom:34px;position:relative}
.of-main{display:grid;gap:16px}
.of-step h2{display:flex;align-items:center;gap:10px;font-size:18px;margin:0 0 6px}
.of-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:800}
.of-fields{display:grid;gap:12px}.of-fields.two{grid-template-columns:1fr 1fr}
.of-help{font-size:13px;color:var(--muted);background:#f9fafb;border:1px dashed var(--line);border-radius:10px;padding:9px 12px;margin:12px 0 0}
.of-err{display:block;color:var(--danger);font-size:12px;min-height:0;margin-top:4px}.of-err:empty{display:none}
.of-group{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:16px 0 8px}
.of-products{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.of-prod{margin:0;cursor:pointer;display:block}
.of-prod input{position:absolute;opacity:0;pointer-events:none}
.of-prod-body{display:flex;flex-direction:column;gap:6px;height:100%;padding:13px;border:2px solid var(--line);border-radius:14px;background:#fff;transition:.15s}
.of-prod:hover .of-prod-body{border-color:#bbb}
.of-prod input:checked + .of-prod-body{border-color:var(--accent);background:#fff5f5;box-shadow:0 0 0 3px rgba(215,25,32,.12)}
.of-prod input:focus-visible + .of-prod-body{outline:2px solid var(--accent);outline-offset:2px}
.of-prod-name{font-weight:700;font-size:14px;line-height:1.3}.of-prod-price{font-weight:800;color:var(--accent)}
.of-summary{position:sticky;top:84px}.of-summary h2{font-size:18px}
.of-summary dl{margin:0 0 12px;display:grid;grid-template-columns:70px 1fr;gap:8px 10px;font-size:14px}
.of-summary dt{color:var(--muted)}.of-summary dd{margin:0;font-weight:600;word-break:break-word}
.of-total{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--line);margin-bottom:12px}.of-total b{font-size:22px}
.of-submit{width:100%;padding:14px}.of-note{font-size:12px;color:var(--muted);margin:10px 0 0}
@media(max-width:860px){.of-layout{grid-template-columns:1fr}.of-summary{position:sticky;bottom:0;top:auto;z-index:5;border-radius:18px 18px 0 0;box-shadow:0 -8px 24px rgba(0,0,0,.12)}.of-summary dl,.of-note,.of-summary h2{display:none}.of-total{border:0;padding:0 0 10px}}
@media(max-width:520px){.of-fields.two{grid-template-columns:1fr}.of-head h1{font-size:21px}.of-logo{width:64px;height:64px}}
.of-products + .of-group{margin-top:22px}