/* Omnichannel Chat: only artwork and content-specific layouts. */
.centraly-page-one .platform-window {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  background: #f7faf8;
}

.centraly-page-one .window-head {
  display: flex;
  gap: 6px;
  align-items: center;
  min-height: 40px;
  padding: 9px 12px;
  color: #dce8df;
  background: #1c2b21;
  font-size: .67rem;
}

.centraly-page-one .dot { width: 8px; height: 8px; border-radius: 50%; background: #7cb564; }
.centraly-page-one .dot:nth-child(2) { background: #d9b763; }
.centraly-page-one .dot:nth-child(3) { background: #ca765f; }
.centraly-page-one .window-title { margin-inline-start: 6px; }
.centraly-page-one .window-body { display: grid; grid-template-columns: 60px 1fr; min-height: 405px; }
.centraly-page-one .side { display: flex; gap: 12px; align-items: center; flex-direction: column; padding: 14px 8px; background: #24382a; }
.centraly-page-one .side-logo img { width: 34px; height: 34px; object-fit: contain; }
.centraly-page-one .side-icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; font-size: .88rem; }
.centraly-page-one .side-icon.active { background: rgba(124,181,100,.25); }
.centraly-page-one .main { min-width: 0; padding: 14px; }
.centraly-page-one .metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.centraly-page-one .metric { padding: 10px; border: 1px solid rgba(40,64,41,.09); border-radius: 11px; background: #fff; }
.centraly-page-one .metric span,
.centraly-page-one .metric strong { display: block; }
.centraly-page-one .metric span { color: #78847c; font-size: .57rem; }
.centraly-page-one .metric strong { color: #284029; font-size: .96rem; }
.centraly-page-one .conversation { display: grid; gap: 7px; margin: 12px 0; }
.centraly-page-one .bubble { max-width: 82%; padding: 7px 10px; border-radius: 11px; font-size: .6rem; line-height: 1.55; }
.centraly-page-one .bubble.customer { justify-self: start; color: #33443a; background: #e6f0ee; }
.centraly-page-one .bubble.agent { justify-self: end; color: #fff; background: #284029; }
.centraly-page-one .mini-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.centraly-page-one .mini-card { min-width: 0; padding: 10px; border: 1px solid rgba(40,64,41,.09); border-radius: 11px; background: #fff; }
.centraly-page-one .mini-card h4 { margin: 0 0 7px; font-size: .64rem; }
.centraly-page-one .mini-row { display: flex; justify-content: space-between; padding: 4px 0; color: #5f6e64; font-size: .55rem; }
.centraly-page-one .badge { color: #284029; font-weight: 800; }
.centraly-page-one .bars { display: flex; gap: 6px; align-items: end; height: 72px; }
.centraly-page-one .bars i { flex: 1; border-radius: 5px 5px 2px 2px; }
.centraly-page-one .bars .bar-1 { height: 38%; background: #dbe8b0; }
.centraly-page-one .bars .bar-2 { height: 52%; background: #c9dc79; }
.centraly-page-one .bars .bar-3 { height: 70%; background: #b4ce57; }
.centraly-page-one .bars .bar-4 { height: 90%; background: var(--centraly-accent); }

.centraly-page-one .chat-hero-benefits {
  background:
    radial-gradient(circle at 10% 0, rgba(124,181,100,.12), transparent 30%),
    var(--centraly-soft);
}
.centraly-page-one .chat-capabilities {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 16px;
}
.centraly-page-one .chat-capability-card {
  display: flex;
  gap: 13px;
  align-items: center;
  min-height: 88px;
  padding: 17px;
  border: 1px solid var(--centraly-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(31,54,39,.07);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.centraly-page-one .chat-capability-card:hover { transform: translateY(-4px); border-color: rgba(124,181,100,.5); box-shadow: var(--centraly-shadow); }
.centraly-page-one .chat-capability-card > span { display: grid; flex: 0 0 46px; width: 46px; height: 46px; place-items: center; border-radius: 14px; color: var(--centraly-primary); background: var(--centraly-tint); font-size: 1.15rem; }
.centraly-page-one .chat-capability-card strong { color: var(--centraly-heading); font-size: .84rem; line-height: 1.65; }
.centraly-page-one .chat-outcomes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; overflow: hidden; margin-top: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 22px; background: rgba(255,255,255,.12); box-shadow: 0 20px 50px rgba(31,54,39,.14); }
.centraly-page-one .chat-outcomes article { display: flex; gap: 12px; align-items: flex-start; padding: 22px; background: linear-gradient(135deg,#1d2d22,var(--centraly-primary)); }
.centraly-page-one .chat-outcomes .check { flex: 0 0 24px; width: 24px; height: 24px; }
.centraly-page-one .chat-outcomes strong { display: block; color: #fff; font-size: .88rem; }
.centraly-page-one .chat-outcomes p { margin: 4px 0 0; color: rgba(255,255,255,.62); font-size: .74rem; line-height: 1.7; }
.centraly-page-one .chat-channel-ribbon { margin-top: 18px; padding: 22px; border: 1px solid rgba(124,181,100,.3); border-radius: 22px; color: var(--centraly-muted); background: linear-gradient(135deg,#e4f0e1,#f5faf3); box-shadow: 0 18px 44px rgba(31,54,39,.09); }
.centraly-page-one .chat-channel-ribbon p { margin-bottom: 12px; color: var(--centraly-heading); font-size: .82rem; font-weight: 800; text-align: center; }
.centraly-page-one .channel-mini { display: flex; flex-wrap: wrap; gap: 7px; }
.centraly-page-one .chat-channel-ribbon .channel-mini { justify-content: center; }
.centraly-page-one .channel-mini span { padding: 7px 11px; border: 1px solid rgba(40,64,41,.1); border-radius: 999px; color: var(--centraly-primary); background: rgba(255,255,255,.82); box-shadow: 0 5px 14px rgba(31,54,39,.05); font-size: .68rem; }

.centraly-page-one .channels-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; }
.centraly-page-one .channel-card .channel-icon { color: var(--centraly-primary); background: #fff; }
.centraly-page-one .channel-card .channel-icon :is(img,svg) { display: block; width: 29px; height: 29px; object-fit: contain; }
.centraly-page-one .channel-card .channel-icon-generic { color: var(--centraly-primary); background: var(--centraly-tint); }

.centraly-page-one .integrations-shell,
.centraly-page-one .addons {
  overflow: hidden;
  padding: 34px;
  border-radius: var(--centraly-radius-lg);
  color: rgba(255,255,255,.74);
  background: radial-gradient(circle at 12% 10%, rgba(124,181,100,.22), transparent 28%), linear-gradient(135deg,#18251d,#284029);
  box-shadow: 0 28px 70px rgba(31,54,39,.2);
}
.centraly-page-one .integrations-head,
.centraly-page-one .addons-top,
.centraly-page-one .integration-cta { display: flex; gap: 22px; align-items: center; justify-content: space-between; }
.centraly-page-one :where(.integrations-head,.addons-top) h2 { margin-bottom: 5px; color: #fff; font-size: clamp(1.6rem,3vw,2.1875rem); }
.centraly-page-one :where(.integrations-head,.addons-top) p { margin-bottom: 0; }
.centraly-page-one .addons-label { padding: 8px 12px; border-radius: 999px; background: rgba(255,255,255,.1); font-size: .72rem; font-weight: 900; }
.centraly-page-one .integration-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 28px; }
.centraly-page-one .integration-card,
.centraly-page-one .addon { padding: 20px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(255,255,255,.06); }
.centraly-page-one :where(.integration-card,.addon) h3 { margin-bottom: 8px; color: #fff; font-size: 1rem; }
.centraly-page-one :where(.integration-card,.addon) p { margin-bottom: 0; color: rgba(255,255,255,.64); font-size: .8rem; }
.centraly-page-one .integration-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.centraly-page-one .integration-tags span { padding: 4px 8px; border-radius: 999px; color: #dcedd6; background: rgba(124,181,100,.14); font-size: .65rem; }
.centraly-page-one .integration-cta { margin-top: 20px; padding: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(255,255,255,.06); }
.centraly-page-one .integration-cta strong { color: #fff; }
.centraly-page-one .integration-cta p { margin-bottom: 0; font-size: .82rem; }

.centraly-page-one .solution-card ul { margin: 15px 0 0; padding-inline-start: 20px; color: var(--centraly-muted); font-size: .84rem; }
.centraly-page-one .plan-code { color: var(--centraly-primary); font-size: .73rem; font-weight: 900; }
.centraly-page-one .plan .check { display: none; }
.centraly-page-one .plan-note { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--centraly-border); color: var(--centraly-muted); font-size: .7rem; }
.centraly-page-one .notes { margin-top: 24px; padding: 24px; border: 1px solid var(--centraly-border); border-radius: 20px; background: var(--centraly-soft); }
.centraly-page-one .notes h3 { margin-bottom: 10px; font-size: 1rem; }
.centraly-page-one .notes ul { margin: 0; padding-inline-start: 20px; color: var(--centraly-muted); font-size: .82rem; }

.centraly-page-one .addons-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.centraly-page-one .addon-price { margin: 10px 0 7px; color: #bfe3ae; font-size: 1.7rem; font-weight: 900; }
.centraly-page-one .addon-price span { font-size: .7rem; }

body.centraly-chat-template main + [data-block^="hook:"] { display: none !important; }
.centraly-page-one .centraly-cta-section { padding: 0; }
.centraly-page-one .centraly-cta-section > .container { width: 100%; max-width: none; }
.centraly-page-one .centraly-cta-section .centraly-cta { min-height: 260px; padding: 62px max(24px,calc((100vw - var(--centraly-container))/2)); border-radius: 0; box-shadow: none; }

@media (max-width: 1199px) {
  .centraly-page-one .chat-capabilities { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .centraly-page-one .channels-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .centraly-page-one .addons-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1024px) {
  .centraly-page-one .integration-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 768px) {
  .centraly-page-one .chat-outcomes { grid-template-columns: 1fr; }
  .centraly-page-one .channels-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .centraly-page-one .integrations-shell,
  .centraly-page-one .addons { padding: 26px; }
  .centraly-page-one .integrations-head,
  .centraly-page-one .addons-top,
  .centraly-page-one .integration-cta { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 640px) {
  .centraly-page-one .chat-capabilities { grid-template-columns: 1fr; }
  .centraly-page-one .window-body { grid-template-columns: 44px 1fr; min-height: 365px; }
  .centraly-page-one .side { padding-inline: 5px; }
  .centraly-page-one .side-icon { width: 30px; height: 30px; }
  .centraly-page-one .main { padding: 9px; }
  .centraly-page-one .metrics { gap: 5px; }
  .centraly-page-one .metric { padding: 7px 5px; }
  .centraly-page-one .mini-grid { grid-template-columns: 1fr; }
  .centraly-page-one .mini-card:last-child { display: none; }
  .centraly-page-one .channels-grid,
  .centraly-page-one .integration-grid,
  .centraly-page-one .addons-grid { grid-template-columns: 1fr; }
  .centraly-page-one .integrations-shell,
  .centraly-page-one .addons { padding: 22px; }
  .centraly-page-one .centraly-cta-section .centraly-cta { min-height: 0; padding: 48px 20px; }
}
