.apm-contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--apm-space-lg); align-items: stretch; } @media (max-width: 1080px) { .apm-contact-grid { grid-template-columns: minmax(0, 1fr); } } .apm-contact-card { border: 1px solid var(--apm-dark-border-soft); border-radius: var(--apm-radius-xl); background: linear-gradient(180deg, rgba(20, 27, 50, 0.7), rgba(11, 16, 32, 0.9)); padding: var(--apm-space-2xl) var(--apm-space-2xl); } .apm-contact-list { display: grid; gap: 10px; margin: 0 0 var(--apm-space-lg); padding: 0; list-style: none; } .apm-contact-list a { display: flex; align-items: center; gap: 14px; min-height: 60px; padding-inline: 18px; border: 1px solid var(--apm-dark-border-strong); border-radius: var(--apm-radius-lg); background: rgba(14, 20, 42, 0.6); color: var(--apm-white); transition: border-color 0.22s var(--apm-ease), background 0.22s var(--apm-ease); } .apm-contact-list a:hover, .apm-contact-list a:focus-visible { border-color: var(--apm-channel, var(--apm-brand-light)); background: rgba(255, 255, 255, 0.05); color: var(--apm-white); }  .apm-contact-list a:hover .apm-contact-list__icon, .apm-contact-list a:focus-visible .apm-contact-list__icon { color: var(--apm-channel, var(--apm-brand-light)); background: rgba(255, 255, 255, 0.1); }  .apm-contact-list li[data-channel="whatsapp"] a { --apm-channel: #25d366; } .apm-contact-list li[data-channel="telegram"] a { --apm-channel: #229ed9; }  .apm-contact-list li[data-channel="email"] a { --apm-channel: var(--apm-brand-light); }  .apm-contact-list a:focus-visible { outline: var(--apm-focus-width) solid var(--apm-channel, var(--apm-brand-light)); outline-offset: var(--apm-focus-offset); } @media (prefers-reduced-motion: reduce) { .apm-contact-list a { transition: none; } }  .apm-contact-list .apm-contact-list__icon { display: flex; align-items: center; justify-content: center; inline-size: 40px; block-size: 40px; flex: 0 0 auto; padding: 0; border-radius: var(--apm-radius-md); background: rgba(255, 255, 255, 0.06); }  .apm-contact-list .apm-contact-list__icon svg { display: block; inline-size: 20px; block-size: 20px; flex: 0 0 auto; }  .apm-contact-list__body { flex: 1 1 auto; min-width: 0; }  .apm-contact-list .apm-arrow { flex: 0 0 auto; align-self: center; line-height: 1; } .apm-contact-list strong { display: block; font-size: 15.5px; font-weight: 700; color: var(--apm-white); } .apm-contact-list span:not(.apm-contact-list__icon):not(.apm-arrow):not(.apm-contact-list__body) { display: block; font-size: 13px; color: var(--apm-dark-text-subtle); } .apm-sla { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; } .apm-sla li { display: inline-flex; align-items: center; gap: 9px; font-family: var(--apm-font-mono); font-size: 11.5px; letter-spacing: 0.08em; color: var(--apm-dark-text-body); background: rgba(61, 80, 224, 0.14); border: 1px solid rgba(124, 138, 240, 0.28); border-radius: var(--apm-radius-pill); padding: 9px var(--apm-space-md); } .apm-chat { border: 1px solid rgba(124, 138, 240, 0.3); border-radius: var(--apm-radius-xl); background: linear-gradient(180deg, var(--apm-brand-hover), var(--apm-brand-strong)); padding: var(--apm-space-xl); } .apm-chat__who { display: flex; align-items: center; gap: 10px; margin-block-end: 20px; } .apm-chat__avatar { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 auto; border-radius: var(--apm-radius-pill); background: rgba(255, 255, 255, 0.16); color: var(--apm-white); font-size: 14px; font-weight: 800; } .apm-chat__thread { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; } .apm-chat__thread li { max-width: 86%; margin: 0; padding: var(--apm-space-sm) 15px; font-size: 14.5px; line-height: 1.5; border-radius: var(--apm-radius-lg); }  .apm-chat__thread li.is-them { justify-self: end; color: var(--apm-dark); background: var(--apm-white); border-end-end-radius: var(--apm-space-2xs); } .apm-chat__thread li.is-us { justify-self: start; color: var(--apm-white); background: rgba(11, 16, 32, 0.34); border-end-start-radius: var(--apm-space-2xs); } @media(max-width:640px){.apm-contact-card{padding:var(--apm-space-lg)}} .apm-contact-grid > * { min-width: 0; } .apm-contact-grid .apm-contact-card, .apm-contact-grid .apm-chat { display: flex; flex-direction: column; padding: clamp(24px, 3vw, 40px); } .apm-contact-grid .apm-sla { margin-block-start: auto; } .apm-contact-grid .apm-chat > p:last-child { margin-block-start: auto; padding-block-start: 24px; } .apm-contact-list__body { overflow-wrap: anywhere; }