/* Common finishing details for every section and the shared detail window. */
::selection { background: #c4000c22; color: #152b32; }
.section-heading .section-kicker, .faq-intro .section-kicker { letter-spacing: 1.9px; }
.section-heading .section-kicker::before, .faq-intro .section-kicker::before { width: 24px; height: 2px; border-radius: 2px; }
.section-heading h2, .faq-intro h2, .about-copy h2 { text-wrap: balance; }
.text-link > .icon { flex-shrink: 0; }
.button { transition: background .2s,border-color .2s,box-shadow .2s,transform .2s; }
.button:active { transform: translateY(0); }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #e42c40; outline-offset: 4px; }
#modal { border: 1px solid #e5eaeb; border-top: 3px solid var(--brand); border-radius: 14px; box-shadow: 0 28px 90px #09171d55; background: linear-gradient(145deg,#fff 75%,#fff9f9); scrollbar-width: thin; scrollbar-color: #ccd6d9 transparent; }
#modal::backdrop { background: #0d2029b8; }
#modal .modal-close { width: 34px; height: 34px; border: 1px solid #e5eaeb; border-radius: 9px; background: #f7f9f9!important; color: #485e66; transition: color .2s,border-color .2s,background .2s; }
#modal .modal-close:hover { color: var(--brand); border-color: #e5a3ae; background: #fff1f3!important; }
#modal .modal-close .icon { width: 18px; height: 18px; }
#modal-content > .eyebrow { display: flex; align-items: center; gap: 9px; font-size: 9px; letter-spacing: 1.7px; padding-right: 25px; }
#modal-content > .eyebrow::before { content: ''; flex-shrink: 0; width: 5px; height: 5px; border-radius: 1px; background: var(--brand); }
#modal-title { margin-bottom: 20px; }
#modal-content .modal-photo { border: 6px solid #f1f4f4; border-radius: 11px; }
#modal-content .detail-features { display: grid; gap: 7px; }
#modal-content .detail-features li { padding: 12px 13px; border: 1px solid #e7eded; border-radius: 7px; background: #f8fafa; font-size: 13px; line-height: 1.5; }
#modal-content .detail-features .icon { flex-shrink: 0; width: 22px; height: 22px; padding: 3px; border-radius: 5px; background: #fff0f2; }
#modal-content .button.primary { border-radius: 7px; box-shadow: 0 4px 12px #c4000c14; }
#modal-content .button.primary > .icon { width: 24px; height: 24px; padding: 4px; border: 1px solid #ffffff30; border-radius: 5px; }
#modal-content .quote-form { padding-top: 21px; border-top: 1px solid #e6ecec; }
#modal-content .quote-form label:focus-within { color: var(--brand); }
#modal-content .quote-form input, #modal-content .quote-form select, #modal-content .quote-form textarea, #site-search { background: #f8fafa; border-radius: 7px; transition: border-color .2s,box-shadow .2s,background .2s; }
#modal-content .quote-form :is(input,select,textarea):focus, #site-search:focus { outline: 2px solid transparent; border-color: var(--brand); background: #fff; box-shadow: 0 0 0 3px #c4000c0c; }
#modal-content .search-result { border: 1px solid #e5ebec; border-radius: 8px; background: #fafbfb; padding: 10px; transition: border-color .2s,background .2s; }
#modal-content .search-result:hover { background: #fff4f5; border-color: #e8b7c0; }
#modal-content .search-result img { border-radius: 5px; }
#modal-content .contact-list a { border-radius: 8px; border: 1px solid #e5ebec; background: #f8fafa; padding: 13px; }
#modal-content .contact-list .icon { flex-shrink: 0; }
#modal-content .related-products button { border-radius: 6px; background: #fff5f6; }
#back-to-top { width: 44px; height: 44px; border-radius: 9px; border: 1px solid #e3e9eb; background: #fff; box-shadow: 0 4px 18px #14273016; --page-turn: 0turn; }
#back-to-top::before { content: ''; position: absolute; inset: -3px; padding: 2px; border-radius: 12px; background: conic-gradient(var(--brand) var(--page-turn),#dfe7e9 var(--page-turn)); mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite: exclude; pointer-events: none; }
#back-to-top:hover { border-color: #e7adb6; background: #fff6f7; }
@media(max-width:640px) {
  #modal { border-radius: 11px; padding: 27px 21px; }
  #modal-content .detail-features li { padding: 10px; font-size: 12px; }
  #modal-content .modal-photo { height: 180px; border-width: 4px; }
  #modal-content .search-result span { font-size: 13px; }
  #modal-content .contact-list a { font-size: 12px; padding: 11px; overflow-wrap: anywhere; }
  #back-to-top { right: 15px; bottom: 15px; }
}
@media(prefers-reduced-motion:reduce) {
  .button, #modal *, #back-to-top { transition: none!important; }
  .button:hover { transform: none; }
}