.example--messenger .example__wrapp { display: flex; align-items: center; gap: 64px; padding: 88px; border-radius: 16px; }
.example--messenger .example__content { flex: 1; min-width: 0; padding: 0; }
.example--messenger .example__title { margin-bottom: 45px; font-size: 48px; line-height: 1.2; font-weight: 700; }
.example--messenger .example__title > span { font-size: inherit; font-weight: inherit; }
.example--messenger .example__title::before, .example--messenger .example__title::after { display: none; }
.example--messenger .example__now { display: inline-block; margin-left: 20px; color: #cfcfcf; font-size: 15px; line-height: 1.2; font-weight: 500; vertical-align: baseline; }
.example--messenger .example__now::after { top: 35%; margin-left: 15px; width: 35px; height: 35px; }
.example--messenger .example__docs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
.example--messenger .tr-documents-document { display: block; position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.25); border-radius: 15px; background: rgba(248,248,248,.05); color: #fff; transition: border-color .2s ease-out; }
.example--messenger .tr-documents-document:hover { border-color: #fba76b; }
.example--messenger .tr-documents-document__image { display: block; padding: 22px 22px 40px; }
.example--messenger .tr-documents-document__paper { display: block; position: relative; aspect-ratio: 10/7; }
.example--messenger .tr-documents-document__preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; border-radius: 12px; }
.example--messenger .tr-documents-document__download { position: absolute; z-index: 1; right: 10px; bottom: 30px; width: 35px; height: 35px; }
.example--messenger .tr-documents-document__name { display: flex; align-items: flex-start; gap: 11px; position: absolute; inset: auto 0 0; min-height: 52px; padding: 15px 22px 16px; border-radius: 0 0 14px 14px; background: rgba(0,0,0,.3); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); }
.example--messenger .tr-documents-document__name img { width: 20px; height: 20px; flex: 0 0 20px; }
.example--messenger .tr-documents-document__name span { font-size: 14px; line-height: 1.5; }
.example--messenger .example__contact { width: 350px; flex: 0 0 350px; }
.example--messenger .tr-documents-contact { padding: 24px; border-radius: 16px; color: #262626; background: #fcfaf7; }
.example--messenger .tr-documents-contact__title { font-size: 20px; font-weight: 700; line-height: 1.4; }
.example--messenger .tr-documents-contact__copy { margin: 12px 0 0; font-size: 14px; line-height: 1.55; color: #66605b; }
.example--messenger .tr-documents-contact__actions { display: grid; gap: 12px; margin-top: 22px; }
.example--messenger .tr-documents-channel { display: flex; align-items: center; gap: 14px; min-height: 78px; padding: 16px; border-radius: 13px; background: #262626; color: #fff; text-decoration: none; transition: background .18s ease-out; }
.example--messenger .tr-documents-channel:hover { background: #37312d; color: #fff; }
.example--messenger .tr-documents-channel__icon { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 42px; background: #fff; border-radius: 12px; }
.example--messenger .tr-documents-channel__icon img { display: block; width: 31px; height: 31px; }
.example--messenger .tr-documents-channel__name { display: block; font-size: 16px; font-weight: 800; line-height: 1.4; }
.example--messenger .tr-documents-channel__hint { display: block; margin-top: 3px; color: #d4cfca; font-size: 12px; line-height: 1.4; }
.example--messenger .tr-documents-channel__arrow { width: 18px; height: 18px; margin-left: auto; flex: 0 0 18px; color: #fba76b; }
.example--messenger a:focus-visible { outline: 3px solid #fba76b; outline-offset: 5px; }
.example--messenger ::selection { background: #fba76b; color: #262626; }
@media (max-width: 1439px) {
  .example--messenger .example__wrapp { padding: 70px; gap: 55px; }
  .example--messenger .example__title { font-size: 44px; margin-bottom: 40px; }
  .example--messenger .example__now { font-size: 14px; }
  .example--messenger .example__now::after { width: 32px; height: 32px; margin-left: 12px; }
  .example--messenger .example__contact { width: 320px; flex-basis: 320px; }
  .example--messenger .tr-documents-document__image { padding: 20px 20px 38px; }
  .example--messenger .tr-documents-document__name { padding: 15px 20px 16px; }
  .example--messenger .tr-documents-document__download { width: 32px; height: 32px; bottom: 24px; }
}
@media (max-width: 1239px) {
  .example--messenger .example__wrapp { padding: 60px; gap: 50px; }
  .example--messenger .example__title { font-size: 30px; margin-bottom: 35px; }
  .example--messenger .example__now { font-size: 10px; margin-left: 15px; }
  .example--messenger .example__now::after { width: 22px; height: 22px; margin-left: 10px; }
  .example--messenger .example__contact { width: 300px; flex-basis: 300px; }
  .example--messenger .tr-documents-contact { padding: 22px; }
  .example--messenger .tr-documents-contact__title { font-size: 18px; }
  .example--messenger .tr-documents-document__image { padding: 15px 15px 52px; }
  .example--messenger .tr-documents-document__name { padding: 14px 15px 15px; }
  .example--messenger .tr-documents-document__name span { font-size: 13px; }
  .example--messenger .tr-documents-document__download { width: 24px; height: 24px; bottom: 10px; }
}
@media (max-width: 991px) {
  .example--messenger .example__wrapp { display: block; }
  .example--messenger .example__title { font-size: 26px; }
  .example--messenger .example__now { font-size: 13px; }
  .example--messenger .example__contact { width: 100%; margin-top: 32px; }
  .example--messenger .tr-documents-contact { padding: 24px; }
  .example--messenger .tr-documents-contact__title { font-size: 22px; }
  .example--messenger .tr-documents-contact__actions { grid-template-columns: 1fr 1fr; margin-top: 20px; }
  .example--messenger .tr-documents-document__download { width: 30px; height: 30px; bottom: 14px; }
  .example--messenger .tr-documents-document__name { min-height: 65px; }
}
@media (max-width: 767px) {
  .example--messenger .example__wrapp { padding: 36px 24px; }
  .example--messenger .example__title { font-size: 26px; margin-bottom: 28px; }
  .example--messenger .example__now { display: block; width: fit-content; margin: 18px 0 0; font-size: 15px; }
  .example--messenger .example__now br { display: none; }
  .example--messenger .example__now::after { width: 30px; height: 30px; top: 0; margin-left: 14px; }
  .example--messenger .example__docs { grid-template-columns: 1fr; gap: 14px; }
  .example--messenger .tr-documents-document__image { padding: 20px 20px 44px; }
  .example--messenger .tr-documents-document__paper { aspect-ratio: 1.65; }
  .example--messenger .tr-documents-document__download { width: 35px; height: 35px; bottom: 18px; }
  .example--messenger .tr-documents-document__name { min-height: 54px; padding: 16px 20px; }
  .example--messenger .tr-documents-document__name span { font-size: 14px; }
  .example--messenger .example__contact { margin-top: 28px; }
  .example--messenger .tr-documents-contact { padding: 22px; }
  .example--messenger .tr-documents-contact__title { font-size: 20px; }
  .example--messenger .tr-documents-contact__actions { grid-template-columns: 1fr; }
  .example--messenger .tr-documents-channel { padding: 16px 14px; gap: 12px; }
}
@media (max-width: 374px) {
  .example--messenger .example__wrapp { padding: 30px 18px; }
  .example--messenger .example__title { font-size: 24px; }
  .example--messenger .tr-documents-contact { padding: 20px 16px; }
  .example--messenger .tr-documents-contact__title { font-size: 18px; }
  .example--messenger .tr-documents-channel__icon { width: 38px; height: 38px; flex-basis: 38px; }
  .example--messenger .tr-documents-channel__name { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .example--messenger .tr-documents-document, .example--messenger .tr-documents-channel { transition: none; }
}
