/* Каналы связи с цветным фоном, меню «Каталог», нижнее меню телефона, карточки «Доставка и оплата». Подключается последним. */

/* Мессенджеры: плитки с фирменным фоном (шапка, подвал) */
.channel-mini{display:grid;place-items:center;position:relative;width:42px;height:42px;border-radius:13px;color:#fff;box-shadow:0 4px 12px #0a3d7a33;transition:transform .15s,box-shadow .15s}
.channel-mini:hover{transform:translateY(-2px);box-shadow:0 8px 16px #0a3d7a44}
.channel-mini .channel-icon{width:auto;height:auto;background:none;color:inherit;box-shadow:none}
.channel-mini .channel-icon svg{width:24px;height:24px}
.channel-mini .channel-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.channel-mini.channel-telegram{background:linear-gradient(135deg,#2aabee,#1b86c4);color:#fff}
.channel-mini.channel-whatsapp{background:linear-gradient(135deg,#34d36b,#128c4a);color:#fff}
.channel-mini.channel-max{background:#fff;border:2px solid #6953ce}
.channel-mini.channel-max .max-brand-icon{width:30px;height:30px;border-radius:8px}
.header-messengers{display:flex;gap:8px}
.header-messengers .channel-mini{width:42px;height:42px}
.footer-channels{display:flex;flex-direction:column;gap:10px}
.footer-channels>div{display:flex;gap:8px}

/* Карточки на страницах «Контакты» и «Доставка и оплата»: цветные кнопки */
.contact-cards .channel{border:0;color:#fff;box-shadow:0 12px 26px -12px #0a3d7aaa}
.contact-cards .channel .channel-icon{background:#fff}
.contact-cards .channel-text small{color:#ffffffe6;font-size:16px;font-weight:600;opacity:1}
.contact-cards .channel-phone{background:linear-gradient(135deg,#1a86ff,#0557c8)}
.contact-cards .channel-telegram{background:linear-gradient(135deg,#2aabee,#1779b0)}
.contact-cards .channel-whatsapp{background:linear-gradient(135deg,#2fcf68,#0f7f43)}
.contact-cards .channel-max{background:linear-gradient(135deg,#8b5cf6,#3b6cf0)}
.contact-cards .channel-email{background:linear-gradient(135deg,#4a7bab,#244c70)}
.contact-cards .channel-address{background:linear-gradient(135deg,#5b6b80,#34414f)}
.contact-cards .channel-phone .channel-icon,.contact-cards .channel-email .channel-icon,.contact-cards .channel-address .channel-icon{color:#0b5fbf}
.contact-cards .channel-telegram .channel-icon{color:#1b86c4}
.contact-cards .channel-whatsapp .channel-icon{color:#128c4a}

/* Телефон: меню шапки и шторка «Написать» — те же цветные кнопки */
.mobile-menu-channels .channel,.contact-sheet .channel{border:0;color:#fff;font-weight:700}
.mobile-menu-channels .channel-icon,.contact-sheet .channel-icon{background:#fff}
.mobile-menu-channels .channel small{color:#ffffffe6}
.channel-menu.channel-phone,.channel-sheet.channel-phone{background:linear-gradient(135deg,#1a86ff,#0557c8)}
.channel-menu.channel-telegram,.channel-sheet.channel-telegram{background:linear-gradient(135deg,#2aabee,#1779b0)}
.channel-menu.channel-whatsapp,.channel-sheet.channel-whatsapp{background:linear-gradient(135deg,#2fcf68,#0f7f43)}
.channel-menu.channel-max,.channel-sheet.channel-max{background:linear-gradient(135deg,#8b5cf6,#3b6cf0)}
.channel-menu.channel-email,.channel-sheet.channel-email{background:linear-gradient(135deg,#4a7bab,#244c70)}
.channel-menu.channel-phone .channel-icon,.channel-sheet.channel-phone .channel-icon,.channel-menu.channel-email .channel-icon,.channel-sheet.channel-email .channel-icon{color:#0b5fbf}
.channel-menu.channel-telegram .channel-icon,.channel-sheet.channel-telegram .channel-icon{color:#1b86c4}
.channel-menu.channel-whatsapp .channel-icon,.channel-sheet.channel-whatsapp .channel-icon{color:#128c4a}

/* Каталог в верхнем меню: панель и кнопка «Весь каталог» выделены, страница под панелью притемняется */
.catalog-menu-panel{border:2px solid #0872f9;border-top:0;box-shadow:0 34px 70px -12px #0a2e6aa6}
.catalog-menu-heading>a{display:inline-flex!important;align-items:center;gap:8px;padding:11px 20px!important;border-radius:50px;background:#0872f9;color:#fff!important;font-size:15px!important;font-weight:800;box-shadow:0 8px 18px -8px #0872f9}
.catalog-menu-heading>a:hover{background:#0557c8}
body:has(.catalog-dropdown[open]) #main-content{opacity:.35;transition:opacity .2s}
.catalog-menu-category{border:1px solid #9cc9f5}

/* Нижнее меню телефона: каталог, корзина, звонок, мессенджеры, профиль */
.contact-widget{}
@media(max-width:800px){
  .contact-widget{display:none!important}
  .bottom-nav{grid-template-columns:repeat(5,1fr)!important;padding-left:4px!important;padding-right:4px!important}
  .bottom-nav>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:45px;border:0;background:none;color:#9ab1c8;font:inherit;cursor:pointer}
  .bottom-nav>button.active{color:#4285dc;font-weight:600}
  .bottom-nav .bn-phone{color:#fff!important;font-weight:700!important}
  .bottom-nav .bn-phone>span{display:grid;place-items:center;width:42px;height:42px;margin-top:-18px;border-radius:50%;background:linear-gradient(135deg,#34d36b,#128c4a);box-shadow:0 6px 14px #128c4a66}
  .bottom-nav .bn-phone small{color:#128c4a;font-weight:700}
  .bottom-nav .bn-chat{color:#6953ce}
  .bottom-nav .bn-user{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .contact-sheet{position:fixed;left:10px;right:10px;bottom:84px;z-index:97;display:flex;flex-direction:column;gap:9px;padding:14px;border:1px solid #b5dafa;border-radius:20px;background:#fff;box-shadow:0 20px 50px #124a7a55}
  .contact-sheet[hidden]{display:none}
  .contact-sheet>strong{font-size:18px;color:#123a64}
  .contact-sheet .channel{display:flex;align-items:center;gap:14px;min-height:56px;padding:9px 14px;border-radius:14px;text-decoration:none;font-size:17px}
  .contact-sheet .channel-icon{width:40px;height:40px}
  .chat-launch{bottom:84px}
}
@media(min-width:801px){.bottom-nav,.contact-sheet{display:none!important}}

/* v46: каталог сразу раскрыт в мобильном меню и читаем в два столбца. */
@media(max-width:800px){
  .top-nav.menu-open .catalog-menu-heading{margin-bottom:14px!important}
  .top-nav.menu-open .catalog-menu-heading>strong{font-size:18px!important;line-height:1.25}
  .top-nav.menu-open .catalog-menu-heading>a{font-size:14px!important;padding:10px 14px!important}
  .top-nav.menu-open .catalog-menu-grid{gap:10px!important}
  .top-nav.menu-open .catalog-menu-category{min-height:104px!important;padding:13px 10px!important;gap:8px!important}
  .top-nav.menu-open .catalog-menu-category>img{width:45px!important;height:70px!important}
  .top-nav.menu-open .catalog-menu-category strong{font-size:15px!important;line-height:1.2}
  .top-nav.menu-open .catalog-menu-category small{font-size:12px!important;line-height:1.25}
}

/* «Доставка и оплата»: карточка с мини-иллюстрацией слева */
.panel.panel-has-icon{display:grid!important;grid-template-columns:96px minmax(0,1fr);column-gap:20px;row-gap:8px;align-items:start;align-content:start}
.panel-has-icon>.panel-icon-image{grid-row:1/span 12;grid-column:1;width:96px!important;height:96px!important;max-height:none!important;aspect-ratio:1;object-fit:contain!important;border-radius:0!important;background:none!important}
.panel-has-icon>*:not(img){grid-column:2;margin:0}
.panel-has-icon>h2{font-size:22px!important;line-height:1.25}
@media(max-width:560px){.panel.panel-has-icon{grid-template-columns:72px minmax(0,1fr);column-gap:14px}.panel-has-icon>.panel-icon-image{width:72px!important;height:72px!important}.panel-has-icon>h2{font-size:19px!important}}

/* Главная: блок «Доставка и оплата» */
.home-dp{padding:44px 0 20px}
.dp-head{max-width:720px;margin-bottom:24px}
.dp-head h2{margin:6px 0 8px;font-size:34px;line-height:1.15;color:#0b3f78}
.dp-head p{margin:0;font-size:18px;line-height:1.5;color:#33587a}
.dp-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.dp-col{padding:26px;border-radius:26px}
.dp-col h3{margin:0 0 16px;font-size:24px}
.dp-col ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.dp-col li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;align-items:center;padding:12px 14px;border-radius:18px}
.dp-col li img{width:76px;height:76px;object-fit:contain}
.dp-col li strong{display:block;font-size:18px;line-height:1.25}
.dp-col li p{margin:3px 0 0;font-size:16px;line-height:1.4}
.dp-delivery{background:linear-gradient(145deg,#1a86ff,#0557c8 70%,#0a3f94);color:#fff;box-shadow:0 22px 40px -22px #0557c8}
.dp-delivery li{background:#ffffff1f;backdrop-filter:blur(2px)}
.dp-delivery li p{color:#e3f0ff}
.dp-payment{background:#fff;border:2px solid #cfe4fa;color:#0b3f78;box-shadow:0 22px 40px -26px #0b5fbf55}
.dp-payment li{background:#f1f8ff}
.dp-payment li p{color:#3b607d}
.dp-link{margin-top:22px}
@media(max-width:800px){.home-dp{padding:30px 0 10px}.dp-grid{grid-template-columns:1fr}.dp-head h2{font-size:27px}.dp-col{padding:20px}.dp-col li{grid-template-columns:60px minmax(0,1fr);gap:12px}.dp-col li img{width:60px;height:60px}}
