/* ============================================================
   odoo.css — IceCode Solutions | Odoo Page Only
   base.css + navbar.css handle everything else
   ============================================================ */

/* ── Odoo Top Line ── */
.odoo-topline { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.odoo-line    { width: 46px; height: 3px; background: #31d1c6; border-radius: 999px; }
.odoo-tag     { color: #31d1c6; font-weight: 900; font-size: 14px; }
.odoo-title   { font-weight: 900; font-size: clamp(28px, 3vw, 42px); color: var(--ice-dark); margin: 6px 0 14px; }
.odoo-accent  { color: #6b2b83; }
.odoo-subtitle{ color: var(--text-body); line-height: 1.95; font-size: 16px; max-width: 580px; }

.odoo-points  { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.odoo-points li { display: flex; align-items: center; gap: 10px; color: #2f4a63; font-weight: 800; }
.odoo-points i  { color: #2fb7ad; font-size: 18px; }

/* ── Visual ── */
.odoo-visual {
  position: relative; height: 360px;
  border-radius: 22px; background: #f6f8fb;
  border: 1px solid #edf2f7;
  box-shadow: 0 25px 70px rgba(0,0,0,.08);
  overflow: hidden;
}
.odoo-visual::after {
  content: ""; position: absolute;
  inset: -160px -220px auto auto;
  width: 520px; height: 520px;
  border-radius: 50%; background: rgba(31,110,212,.06);
}
.odoo-center { position: absolute; inset: 0; display: grid; place-items: center; z-index: 2; }
.odoo-center-inner {
  width: 150px; height: 150px; border-radius: 50%;
  background: #fff; border: 1px solid #eef3f8;
  box-shadow: 0 18px 55px rgba(0,0,0,.12);
  display: grid; place-items: center; text-align: center;
}
.odoo-center-badge { font-weight: 900; color: var(--ice-dark); font-size: 20px; }
.odoo-center-sub   { margin-top: -10px; font-weight: 900; color: #6b2b83; }

/* ── Module Cards ── */
.module-card {
  position: absolute; z-index: 3;
  width: 170px; padding: 14px;
  border-radius: 16px; background: #fff;
  border: 1px solid #eef3f8;
  box-shadow: 0 16px 45px rgba(0,0,0,.10);
  display: flex; gap: 12px; align-items: center;
}
.module-icon {
  width: 44px; height: 44px; border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(46,197,255,.12);
  border: 1px solid rgba(46,197,255,.22);
  color: #0b66c8; font-size: 20px; flex-shrink: 0;
}
.module-title { font-weight: 900; color: var(--ice-dark); }
.m1 { top: 70px; right: 50px; }
.m2 { top: 70px; left: 50px; }
.m3 { bottom: 70px; right: 70px; }
.m4 { bottom: 70px; left: 70px; }

/* ── Cards ── */
.feature-card, .service-card, .step-card, .mini-card {
  background: #fff;
  border: 1px solid #e8eef6;
  border-radius: 18px; padding: 22px;
  box-shadow: 0 18px 55px rgba(0,0,0,.06);
}
.feature-card h5, .service-card h5, .step-card h6, .mini-card h6 {
  font-weight: 900; color: var(--ice-dark);
}
.feature-card p, .service-card p, .step-card p, .mini-card p {
  color: var(--text-body); line-height: 1.9; margin: 0;
}
.mini-card { text-align: center; height: 100%; }
.mini-card i { font-size: 28px; color: #2ec5ff; }
.mini-card h6 { margin-top: 12px; }
.step-card { height: 100%; }
.step-num {
  width: 46px; height: 46px; border-radius: 14px;
  display: grid; place-items: center;
  margin: 0 auto 12px;
  background: rgba(46,197,255,.12);
  border: 1px solid rgba(46,197,255,.22);
  color: #0b66c8; font-weight: 900;
}

/* ── Responsive ── */
@media (max-width: 992px) {
  .odoo-visual { height: 320px; }
  .module-card { width: 155px; }
  .m1 { top: 30px; right: 20px; }
  .m2 { top: 30px; left: 20px; }
  .m3 { bottom: 30px; right: 20px; }
  .m4 { bottom: 30px; left: 20px; }
}