.site-header { height: 76px; display: flex; align-items: center; gap: 54px; padding: 0 max(34px, calc((100vw - 1540px) / 2 + 34px)); border-bottom: 1px solid #e5e5e5; background: #fff; }
.wordmark { display: flex; align-items: center; gap: 9px; color: #111; text-decoration: none; letter-spacing: 1.1px; font-size: 12px; }
.wordmark-mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #ed6500; color: #fff; font: italic 15px Georgia, serif; }
.wordmark strong span { font-weight: 500; color: #777; }
.main-nav { display: flex; align-self: stretch; align-items: center; gap: 29px; flex: 1; }
.main-nav a { height: 100%; display: flex; align-items: center; position: relative; color: #676467; text-decoration: none; font-size: 11px; }
.main-nav a.active { color: #151515; font-weight: 700; }
.main-nav a.active:after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: #ed6500; }
.header-actions { display: flex; align-items: center; gap: 15px; }
.header-actions > button { display: grid; place-items: center; width: 25px; height: 25px; padding: 0; border: 0; background: none; color: #252525; }
.header-actions > button svg { width: 18px; height: 18px; }
.header-actions .talk-button { width: auto; height: auto; display: flex; gap: 9px; padding: 10px 13px; background: #171717; color: #fff; border-radius: 4px; font-size: 10px; font-weight: 700; }
.header-actions .talk-button svg { width: 14px; height: 14px; color: #ff984d; }
.catalog-shell { min-height: calc(100vh - 76px); padding-top: 35px; padding-bottom: 110px; }
.shop-tools { margin-top: 8px; margin-bottom: 28px; }
.product-grid { gap: 72px 42px; }
.image { height: 292px; border-radius: 12px; }
.product h2 { margin-top: 2px; font-size: 14px; }
.product-subtitle { margin-top: 6px; margin-bottom: 9px; font-size: 10px; }
.price { margin-top: 10px; }
.pagination { min-height: 165px; padding-top: 105px; align-items: flex-end; }
.consult-panel { width: 460px; min-height: 620px; border-radius: 16px; overflow: hidden; border-color: #ddd8d2; }
.consult-panel header { padding: 27px 29px 22px; }
.consult-panel h2 { font-size: 23px; letter-spacing: -1px; }
.consult-content { padding: 24px 29px; }
.consult-intro { font-size: 12px; line-height: 1.75; margin-bottom: 21px; }
.consult-message > div { font-size: 11px; line-height: 1.75; margin-bottom: 13px; }
.suggestions button { padding: 12px 0; font-size: 11px; }
.consult-panel form { margin: 0 29px; border-radius: 5px; overflow: hidden; }
.consult-panel textarea { height: 77px; padding: 12px; font-size: 11px; }
.consult-panel form button { padding: 11px 12px; font-size: 11px; }
.fine-print { margin: 12px 29px 19px; font-size: 8px; }
.result-product { display: grid; grid-template-columns: 93px 1fr; gap: 12px; align-items: center; margin: 17px 0 18px; padding: 9px; border: 1px solid #e0d8d0; border-radius: 9px; background: #fffdfb; }
.result-product img { display: block; width: 93px; height: 87px; object-fit: cover; border-radius: 6px; mix-blend-mode: multiply; background: #f3f0ec; }
.result-product span { display: block; margin-bottom: 3px; color: #a14b0a; font: 8px DM Mono, monospace; letter-spacing: .4px; }
.result-product strong { display: block; font-size: 14px; letter-spacing: -.3px; }
.result-product p { margin: 2px 0 7px; color: #767276; font: 9px DM Mono, monospace; }
.result-product button { display: flex; align-items: center; gap: 5px; padding: 0; border: 0; background: none; color: #034d8e; font-size: 9px; font-weight: 700; }
.result-product button svg { width: 13px; height: 13px; }
@media(max-width:1000px) { .site-header { padding: 0 25px; } .product-grid { gap: 55px 28px; } .image { height: 255px; } }
@media(max-width:700px) { .site-header { height: 62px; padding: 0 17px; } .main-nav, .header-actions > button:not(.talk-button) { display: none; } .header-actions { margin-left: auto; } .catalog-shell { min-height: calc(100vh - 62px); padding-top: 25px; } .product-grid { gap: 37px 14px; } .image { height: 195px; } .pagination { min-height: 100px; padding-top: 50px; } .consult-panel { width: calc(100% - 20px); min-height: 560px; } .consult-panel header, .consult-content { padding-left: 22px; padding-right: 22px; } .consult-panel form { margin-left: 22px; margin-right: 22px; } .fine-print { margin-left: 22px; } }
