/* /modules-bitrix/ — product showcase */
:root{--mb-ink:#0b162a;--mb-muted:#687b95;--mb-line:#e4ebf4;--mb-blue:#2467ed;--mb-green:#69bf20}
html{scroll-behavior:smooth}
body{background:#fff}
.modules-page{padding-top:75px;color:var(--mb-ink)}
.modules-hero{
  padding:72px 24px 62px;
  background:
    radial-gradient(circle at 14% 26%,rgba(222,251,229,.9),transparent 33%),
    radial-gradient(circle at 84% 22%,rgba(215,231,255,.92),transparent 36%),
    linear-gradient(180deg,#fbfdff 0%,#f6f9fd 100%);
  border-bottom:1px solid #edf1f6;
}
.modules-wrap{max-width:1280px;margin:0 auto}
.modules-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 470px;gap:54px;align-items:center}
.modules-kicker{
  display:inline-flex;align-items:center;gap:8px;padding:8px 13px;margin-bottom:24px;
  border:1px solid #d4e0f2;border-radius:999px;background:#fff;color:#2864dc;
  font-size:13px;font-weight:750;box-shadow:0 3px 12px rgba(45,78,124,.04)
}
.modules-title{
  margin:0 0 20px;max-width:760px;font-size:58px;line-height:1.02;letter-spacing:-.05em;
  font-weight:900;color:#0a1528
}
.modules-title span{color:var(--mb-blue)}
.modules-lead{max-width:730px;margin:0 0 28px;color:#58708d;font-size:19px;line-height:1.6}
.modules-actions{display:flex;gap:12px;flex-wrap:wrap}
.modules-btn{
  min-height:52px;padding:0 24px;border-radius:999px;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:15px;font-weight:800
}
.modules-btn.primary{color:#fff;background:linear-gradient(90deg,#2467ed,#0bb7cf);box-shadow:0 12px 28px rgba(35,103,237,.18)}
.modules-btn.secondary{color:#2e405a;background:#fff;border:1px solid #cad6e7}
.modules-showcase{
  height:380px;border:1px solid #dfe8f2;border-radius:30px;background:rgba(255,255,255,.92);
  box-shadow:0 24px 55px rgba(42,74,120,.12);padding:26px;position:relative;overflow:hidden
}
.modules-showcase:before{content:"";position:absolute;width:270px;height:270px;border-radius:50%;right:-95px;top:-95px;background:rgba(205,225,255,.55)}
.modules-showcase-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid #e9eef5}
.modules-showcase-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:900}
.modules-showcase-logo{width:38px;height:38px;border-radius:12px;background:#6bc226;color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900}
.modules-showcase-badge{font-size:10px;font-weight:800;color:#2364df;background:#edf4ff;padding:7px 10px;border-radius:999px}
.modules-mini-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.modules-mini-card{min-height:112px;border:1px solid #e6edf5;border-radius:17px;background:#fff;padding:15px}
.modules-mini-icon{width:34px;height:34px;border-radius:11px;background:#edf4ff;color:#2467ed;display:grid;place-items:center;font-size:10px;font-weight:900;margin-bottom:10px}
.modules-mini-card.green .modules-mini-icon{background:#eefae8;color:#5ca622}
.modules-mini-card.orange .modules-mini-icon{background:#fff2e8;color:#ef7029}
.modules-mini-card.purple .modules-mini-icon{background:#f3efff;color:#7559d3}
.modules-mini-card b{display:block;font-size:13px}
.modules-mini-card small{display:block;margin-top:5px;color:#8b9ab0;font-size:10.5px;line-height:1.35}
.modules-section{padding:72px 24px}
.modules-section.alt{background:#f7f9fc}
.modules-heading{max-width:820px;margin-bottom:34px}
.modules-heading h2{margin:0 0 12px;font-size:40px;line-height:1.08;letter-spacing:-.04em;font-weight:900;color:#0d182c}
.modules-heading p{margin:0;color:#6a7d96;line-height:1.65}
.modules-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.module-product{
  display:grid;grid-template-columns:150px 1fr;min-height:270px;
  background:#fff;border:1px solid var(--mb-line);border-radius:26px;overflow:hidden;
  box-shadow:0 10px 30px rgba(43,70,108,.06)
}
.module-product-media{padding:22px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#f4f9ff,#eef6ff);position:relative}
.module-product.green .module-product-media{background:linear-gradient(145deg,#f3fbef,#e7f7e2)}
.module-product.orange .module-product-media{background:linear-gradient(145deg,#fff8f3,#ffede1)}
.module-product.purple .module-product-media{background:linear-gradient(145deg,#f8f6ff,#eee9ff)}
.module-product-icon{
  width:88px;height:88px;border-radius:26px;background:#2567ea;color:#fff;display:grid;place-items:center;
  box-shadow:0 16px 30px rgba(37,103,234,.18);font-size:20px;font-weight:900
}
.module-product.green .module-product-icon{background:linear-gradient(145deg,#7acb31,#55ac18)}
.module-product.orange .module-product-icon{background:linear-gradient(145deg,#ff8a43,#e96a1f)}
.module-product.purple .module-product-icon{background:linear-gradient(145deg,#8467df,#6847c6)}
.module-product-copy{padding:25px 26px;display:flex;flex-direction:column}
.module-product-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.module-status,.module-type{padding:6px 9px;border-radius:999px;font-size:10px;font-weight:850}
.module-status.live{background:#eaf9ee;color:#19934f}
.module-status.soon{background:#fff5e6;color:#c47712}
.module-status.dev{background:#eef3fb;color:#60728e}
.module-type{background:#edf4ff;color:#2765d8}
.module-product h3{font-size:23px;line-height:1.12;letter-spacing:-.025em;margin:0 0 10px;font-weight:900}
.module-product p{font-size:13px;line-height:1.55;color:#687b94;margin:0 0 18px}
.module-product-footer{margin-top:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.module-product-link{
  display:inline-flex;align-items:center;gap:7px;text-decoration:none;color:#1762e8;font-size:12.5px;font-weight:850
}
.module-product-link.muted{color:#8392a7;pointer-events:none}
.module-product-price{margin-left:auto;color:#263751;font-size:12px;font-weight:800}
.modules-note{margin-top:22px;padding:17px 20px;border:1px dashed #cfd9e7;border-radius:18px;background:#fbfcfe;color:#6f8198;font-size:12.5px;line-height:1.55}
.modules-detail-card{
  display:grid;grid-template-columns:1.05fr .95fr;gap:28px;padding:34px;
  background:#fff;border:1px solid var(--mb-line);border-radius:28px;box-shadow:0 12px 32px rgba(43,70,108,.06)
}
.modules-detail-copy h3{font-size:31px;letter-spacing:-.035em;margin:0 0 14px}
.modules-detail-copy p{color:#667a94;line-height:1.65;margin:0 0 20px}
.modules-feature-list{display:grid;grid-template-columns:1fr 1fr;gap:9px 16px}
.modules-feature-list span{display:flex;align-items:center;gap:8px;color:#566b84;font-size:12.5px}
.modules-check{width:20px;height:20px;border-radius:50%;background:#e9faef;color:#159f5d;display:grid;place-items:center;font-size:11px;font-weight:900;flex:0 0 20px}
.modules-detail-visual{border-radius:22px;background:linear-gradient(145deg,#f4f9ff,#eef7f3);padding:22px;display:flex;align-items:center}
.modules-chat-card{width:100%;background:#fff;border:1px solid #e1e9f2;border-radius:20px;padding:20px;box-shadow:0 16px 34px rgba(43,77,120,.1)}
.modules-chat-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:13px;border-bottom:1px solid #e9eef5}
.modules-chat-logo{display:flex;align-items:center;gap:9px;font-weight:900}
.modules-bubble{width:36px;height:36px;border-radius:50%;background:#75c82d;color:#fff;display:grid;place-items:center;font-size:13px;font-weight:900}
.modules-online{font-size:9px;color:#109864;background:#eafbf4;padding:6px 8px;border-radius:999px}
.modules-chat-row{height:56px;border:1px solid #e7edf4;border-radius:13px;display:flex;align-items:center;gap:10px;padding:0 11px;margin-top:9px}
.modules-avatar{width:32px;height:32px;border-radius:50%;background:#d9faec}
.modules-chat-row:nth-child(3) .modules-avatar,.modules-chat-row:nth-child(4) .modules-avatar{background:#eef2f7}
.modules-chat-row b{font-size:12px}
.modules-chat-row small{display:block;margin-top:3px;color:#92a1b6;font-size:10px}
@media(max-width:1050px){
  .modules-hero-grid,.modules-detail-card{grid-template-columns:1fr}
  .modules-showcase{height:350px}
  .modules-title{font-size:50px}
}
@media(max-width:820px){
  .modules-products{grid-template-columns:1fr}
}
@media(max-width:640px){
  .modules-page{padding-top:67px}
  .modules-hero,.modules-section{padding-left:16px;padding-right:16px}
  .modules-title{font-size:40px}.modules-lead{font-size:16px}
  .modules-showcase{display:none}
  .modules-heading h2{font-size:32px}
  .module-product{grid-template-columns:108px 1fr}
  .module-product-media{padding:16px}.module-product-icon{width:70px;height:70px;border-radius:20px;font-size:15px}
  .module-product-copy{padding:21px 18px}.module-product h3{font-size:20px}
  .modules-feature-list{grid-template-columns:1fr}
}