.keychain-design-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.keychain-design-photo{margin:0;position:sticky;top:115px}.keychain-design-photo img{width:100%;height:auto;border:1px solid var(--line);border-radius:6px}.keychain-design-photo figcaption{font-size:12px;color:var(--muted);margin-top:12px}.keychain-design-form{scroll-margin-top:112px}.keychain-design-form h2{font-size:43px;margin-bottom:20px}.keychain-design-form>.eyebrow{color:var(--blue)}.keychain-design-price{font-size:38px;font-weight:700;line-height:1.2;margin-bottom:16px}.keychain-design-price span{display:inline-block;font-size:14px;font-weight:400;margin-left:6px}.keychain-design-form .field{margin:23px 0}.keychain-design-form input[name=letters]{text-transform:uppercase;letter-spacing:.06em;font-size:20px;font-weight:700}.keychain-design-form input[name=quantity]{max-width:130px}.keychain-letter-help{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-top:9px;color:var(--muted);font-size:12px}.keychain-letter-help>[data-letter-count]{flex-shrink:0;font-weight:700}.keychain-letter-preview{min-height:65px;padding:15px 18px;border-left:3px solid var(--yellow);background:#fff8e2;font-weight:700;font-size:25px;letter-spacing:.08em;overflow-wrap:anywhere}.keychain-setup-note{padding:15px 18px;background:#edf3f7;border-left:3px solid var(--blue);font-size:13px}.keychain-form-error{font-size:14px;color:#a52a1b}.keychain-summary{margin-top:30px;padding:28px;background:#eef4f1;border:1px solid #c8d7ce}.keychain-summary[hidden]{display:none}.keychain-summary h3{font-size:30px;margin-bottom:20px}.keychain-summary dl{margin:0 0 20px}.keychain-summary dl>div{display:grid;grid-template-columns:130px 1fr;gap:15px;padding:10px 0;border-bottom:1px solid #d5e1d8;font-size:14px}.keychain-summary dt{font-weight:700}.keychain-summary dd{margin:0;overflow-wrap:anywhere}.keychain-summary>p{font-size:13px}.form-hint{display:block;font-size:12px;color:var(--muted);margin-top:8px}.keychain-design-form input,.keychain-design-form textarea{width:100%}.keychain-design-form label{display:block;font-weight:700;font-size:14px;margin-bottom:8px}
@media(max-width:900px){.keychain-design-grid{gap:35px}.keychain-design-form h2{font-size:37px}}
@media(max-width:650px){.keychain-design-grid{grid-template-columns:1fr;gap:35px}.keychain-design-photo{position:static}.keychain-design-form{scroll-margin-top:95px}.keychain-design-form h2{font-size:39px}.keychain-design-price{font-size:34px}.keychain-design-price span{font-size:12px}.keychain-letter-help{gap:12px}.keychain-summary{padding:22px}.keychain-summary dl>div{grid-template-columns:110px 1fr}}