.contacts-page { overflow-x: hidden; }
.contact-hero { position: relative; overflow: hidden; padding: 94px 0 86px; background: radial-gradient(circle at 82% 25%, rgba(61,216,207,.22), transparent 25%), radial-gradient(circle at 63% 76%, rgba(126,67,231,.2), transparent 34%), linear-gradient(135deg,#fbf9ff 0%,#f2edff 57%,#ecfbfb 100%); }
.contact-hero-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(390px,.95fr); gap: clamp(44px,7vw,104px); align-items: center; }
.contact-hero-copy { min-width: 0; }
.contact-hero-copy h1 { max-width: 720px; margin: 20px 0 24px; }
.contact-hero-copy .hero-lead { max-width: 710px; }
.contact-hero-copy .actions { margin-top: 34px; }
.contact-visual { position: relative; width: min(100%,510px); aspect-ratio: 1; margin-inline: auto; }
.contact-visual::before,.contact-visual::after { content:""; position:absolute; border-radius:50%; inset:10%; border:1px solid rgba(114,72,218,.2); }
.contact-visual::after { inset:23%; border-style:dashed; border-color:rgba(26,180,190,.32); }
.contact-core { position:absolute; z-index:2; left:50%; top:50%; width:154px; aspect-ratio:1; display:grid; place-content:center; text-align:center; transform:translate(-50%,-50%); border-radius:43% 57% 50% 50%; color:#fff; background:linear-gradient(145deg,#773be3,#16b6bd); box-shadow:0 24px 55px rgba(74,40,151,.27); }
.contact-core span { font-size:2.2rem; font-weight:900; letter-spacing:-.06em; }
.contact-core small { font-size:.8rem; font-weight:750; opacity:.88; }
.contact-bubble { position:absolute; z-index:3; display:flex; align-items:center; gap:12px; padding:13px 17px; border:1px solid rgba(255,255,255,.8); border-radius:999px; background:rgba(255,255,255,.86); box-shadow:0 16px 40px rgba(65,41,115,.15); backdrop-filter:blur(12px); color:#301b57; font-size:.84rem; font-weight:760; white-space:nowrap; }
.contact-bubble b { display:grid; place-items:center; min-width:42px; height:42px; padding-inline:7px; border-radius:50%; color:#fff; font-size:.72rem; background:linear-gradient(145deg,#7d43e7,#20b8c5); }
.contact-bubble .social-logo-box { width:42px; min-width:42px; height:42px; padding:0; border-radius:0; color:inherit; background:none; box-shadow:none; }
.contact-bubble .social-logo { width:42px; height:42px; animation:contact-icon-float 4.8s ease-in-out infinite; }
.bubble-telegram { left:0; top:17%; }
.bubble-max { right:0; top:35%; }
.bubble-vk { left:8%; bottom:12%; }
.direct-contact-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.direct-contact-card { position:relative; display:flex; align-items:center; gap:22px; min-height:184px; padding:30px; overflow:hidden; border:1px solid rgba(116,76,208,.14); border-radius:30px; color:#251442; box-shadow:0 18px 50px rgba(55,35,105,.1); transition:transform .25s ease,box-shadow .25s ease; }
.direct-contact-card:hover,.direct-contact-card:focus-visible { transform:translateY(-6px); box-shadow:0 24px 58px rgba(55,35,105,.17); }
.direct-telegram { background:linear-gradient(135deg,#eef9ff,#f6f2ff); }
.direct-max { background:linear-gradient(135deg,#f4efff,#edfdfb); }
.contact-icon { width:56px; height:56px; padding:0; border-radius:0; background:none; box-shadow:none; }
.direct-contact-card > span:last-child { display:grid; gap:7px; min-width:0; }
.direct-contact-card small { color:#766887; font-weight:700; }
.direct-contact-card b { font-size:1.18rem; line-height:1.3; }
.direct-contact-card em { color:#6a38d5; font-style:normal; font-weight:820; }
.contact-channels-section { background:#fbfaff; }
.contact-channel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.channel-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; min-height:124px; padding:22px 24px; border:1px solid rgba(110,77,178,.13); border-radius:26px; background:#fff; color:#2d1b4a; box-shadow:0 12px 34px rgba(48,29,88,.07); transition:border-color .2s,transform .2s; }
.channel-card:hover,.channel-card:focus-visible { transform:translateY(-4px); border-color:rgba(111,61,218,.38); }
.channel-mark { width:56px; height:56px; padding:0; border-radius:0; background:none; box-shadow:none; }
.channel-card > span:nth-child(2) { display:grid; gap:5px; min-width:0; }
.channel-card b { font-size:1.06rem; }
.channel-card small { color:#756985; line-height:1.45; }
.channel-card i { color:#7040d8; font-size:1.35rem; font-style:normal; }
.contact-topics-panel { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:center; gap:42px; padding:clamp(30px,5vw,58px); border-radius:34px; background:linear-gradient(135deg,#2d1558,#6b36cf 58%,#169ba4); color:#fff; box-shadow:0 24px 60px rgba(54,28,108,.22); }
.contact-topics-panel h2 { margin:12px 0 10px; color:#fff; }
.contact-topics-panel p { margin:0; color:rgba(255,255,255,.82); }
.contact-topics-panel .kicker { color:#d9ceff; }
.contact-topic-list { display:flex; flex-wrap:wrap; gap:12px; }
.contact-topic-list span { padding:12px 16px; border:1px solid rgba(255,255,255,.22); border-radius:999px; background:rgba(255,255,255,.12); font-weight:760; }
@media (max-width:900px) { .contact-hero-grid { grid-template-columns:1fr; }.contact-visual { width:min(100%,460px); }.contact-topics-panel { grid-template-columns:1fr; }.direct-contact-grid,.contact-channel-grid { grid-template-columns:1fr; } }
@media (max-width:560px) { .contact-hero { padding:64px 0 54px; }.contact-hero-copy .actions { display:grid; }.contact-hero-copy .button { width:100%; }.contact-visual { width:min(100%,360px); }.contact-core { width:112px; }.contact-core span { font-size:1.7rem; }.contact-bubble { gap:8px; padding:9px 12px; font-size:.72rem; }.contact-bubble b { min-width:34px; height:34px; font-size:.62rem; }.contact-bubble .social-logo-box,.contact-bubble .social-logo { width:34px; min-width:34px; height:34px; }.bubble-telegram { left:-3%; }.bubble-max { right:-2%; }.bubble-vk { left:2%; }.direct-contact-card { min-height:0; padding:22px; gap:16px; border-radius:24px; }.contact-icon,.channel-mark { width:48px; height:48px; }.contact-icon .social-logo,.channel-mark .social-logo { width:48px; height:48px; }.direct-contact-card b { font-size:1rem; }.channel-card { min-height:108px; padding:18px; gap:14px; }.contact-topics-panel { border-radius:26px; }.contact-topic-list { display:grid; }.contact-topic-list span { text-align:center; } }
@media (max-width:350px) { .contact-bubble span { display:none; }.contact-bubble { padding:7px; }.contact-visual { width:280px; }.channel-card { grid-template-columns:auto minmax(0,1fr); }.channel-card i { display:none; } }
@keyframes contact-icon-float { 0%,100% { transform:translateY(0) rotate(-2deg); } 50% { transform:translateY(-3px) rotate(2deg); } }
@media (prefers-reduced-motion:reduce) { .direct-contact-card,.channel-card,.contact-bubble .social-logo { transition:none; animation:none; } }
