:root {
  --cc-primary: #ff9900;
  --cc-primary-dark: #e88900;
  --cc-dark: #0f172a;
  --cc-dark-2: #1e293b;
  --cc-text: #111827;
  --cc-muted: #64748b;
  --cc-soft: #f8fafc;
  --cc-border: #e2e8f0;
  --cc-white: #ffffff;
  --cc-radius: 22px;
  --cc-shadow: 0 22px 60px rgba(15, 23, 42, 0.08);
  --cc-shadow-soft: 0 12px 34px rgba(15, 23, 42, 0.06);
}

html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

body.cc-public-body {
  background: #ffffff;
  color: var(--cc-text);
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

* {
  box-sizing: border-box;
}

a {
  text-decoration: none;
  transition: all 0.22s ease;
}

img {
  max-width: 100%;
  display: block;
}

.container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}

/* Bootstrap fallback */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
}

[class*="col-"] {
  padding-left: 15px;
  padding-right: 15px;
  width: 100%;
}

.align-items-center {
  align-items: center;
}

.text-center {
  text-align: center;
}

.mb-4 {
  margin-bottom: 1.5rem;
}

.mb-5 {
  margin-bottom: 3rem;
}

.mt-5 {
  margin-top: 3rem;
}

@media (min-width: 768px) {
  .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (min-width: 992px) {
  .col-lg-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-lg-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-lg-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-lg-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .mt-lg-0 {
    margin-top: 0 !important;
  }

  .mb-lg-0 {
    margin-bottom: 0 !important;
  }
}

/* HEADER */
.cc-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.cc-navbar {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.cc-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--cc-text);
  flex-shrink: 0;
}

.cc-brand-logo {
  width: auto;
  height: 42px;
}

.cc-brand-text {
  color: var(--cc-text);
  font-size: 21px;
  font-weight: 800;
  letter-spacing: -0.4px;
}

.cc-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 26px;
  flex: 1;
}

.cc-nav-link {
  color: #475569;
  font-size: 14px;
  font-weight: 700;
}

.cc-nav-link:hover {
  color: var(--cc-text);
}

.cc-header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.cc-login-link {
  color: var(--cc-text);
  font-size: 14px;
  font-weight: 800;
}

/* BUTTONS */
.cc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 13px 24px;
  border-radius: 14px;
  border: 1px solid transparent;
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}

.cc-btn-sm {
  min-height: 42px;
  padding: 10px 18px;
}

.cc-btn-primary {
  background: var(--cc-primary);
  border-color: var(--cc-primary);
  color: #111827;
  box-shadow: 0 12px 28px rgba(255, 153, 0, 0.22);
}

.cc-btn-primary:hover {
  background: var(--cc-primary-dark);
  border-color: var(--cc-primary-dark);
  color: #111827;
  transform: translateY(-1px);
}

.cc-btn-secondary,
.cc-btn-white {
  background: #ffffff;
  border-color: var(--cc-border);
  color: var(--cc-text);
}

.cc-btn-secondary:hover,
.cc-btn-white:hover {
  background: #f8fafc;
  color: var(--cc-text);
  border-color: rgba(255, 153, 0, 0.45);
  transform: translateY(-1px);
}

/* HERO */
.cc-hero {
  position: relative;
  padding: 82px 0 74px;
  background:
    radial-gradient(circle at 6% 12%, rgba(255, 153, 0, 0.12), transparent 25%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.cc-hero::after {
  content: "";
  position: absolute;
  right: -220px;
  top: 110px;
  width: 520px;
  height: 520px;
  border-radius: 999px;
  background: rgba(255, 153, 0, 0.06);
  pointer-events: none;
}

.cc-hero .container {
  position: relative;
  z-index: 2;
}

.cc-hero-content {
  max-width: 610px;
}

.cc-eyebrow,
.cc-section-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #9a5b00;
  background: rgba(255, 153, 0, 0.11);
  border: 1px solid rgba(255, 153, 0, 0.22);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: 0.35px;
  text-transform: uppercase;
}

.cc-hero-title {
  margin: 22px 0 20px;
  color: var(--cc-text);
  font-size: 54px;
  line-height: 1.06;
  font-weight: 900;
  letter-spacing: -1.35px;
}

.cc-hero-lead {
  max-width: 580px;
  margin: 0 0 12px;
  color: #334155;
  font-size: 19px;
  line-height: 1.75;
  font-weight: 650;
}

.cc-hero-sub {
  max-width: 540px;
  margin: 0 0 30px;
  color: var(--cc-muted);
  font-size: 16px;
  line-height: 1.7;
  font-weight: 600;
}

.cc-hero-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 26px;
}

.cc-hero-points {
  display: flex;
  align-items: center;
  gap: 14px 18px;
  flex-wrap: wrap;
}

.cc-hero-points span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.cc-hero-points i {
  color: #16a34a;
  font-size: 12px;
}

/* PRODUCT MOCKUP */
.cc-hero-visual {
  position: relative;
  display: flex;
  justify-content: flex-end;
}

.cc-product-card {
  width: 100%;
  max-width: 570px;
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.14);
}

.cc-product-topbar {
  min-height: 58px;
  padding: 0 20px;
  border-bottom: 1px solid #edf2f7;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
}

.cc-window-dots {
  display: flex;
  align-items: center;
  gap: 7px;
}

.cc-window-dots span {
  width: 10px;
  height: 10px;
  display: block;
  border-radius: 999px;
}

.cc-window-dots span:nth-child(1) {
  background: #ef4444;
}

.cc-window-dots span:nth-child(2) {
  background: #f59e0b;
}

.cc-window-dots span:nth-child(3) {
  background: #10b981;
}

.cc-product-title {
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

.cc-product-body {
  display: grid;
  grid-template-columns: 142px 1fr;
  min-height: 390px;
}

.cc-product-sidebar {
  padding: 18px 12px;
  background: #f8fafc;
  border-right: 1px solid #edf2f7;
}

.cc-product-sidebar div {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px 12px;
  margin-bottom: 8px;
  color: #64748b;
  border-radius: 13px;
  font-size: 12px;
  font-weight: 850;
}

.cc-product-sidebar div.active {
  background: #ffffff;
  color: #111827;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.cc-product-main {
  padding: 18px;
  background: #ffffff;
}

.cc-product-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.cc-product-kpis div,
.cc-product-chart,
.cc-product-grid div {
  background: #f8fafc;
  border: 1px solid #eef2f7;
}

.cc-product-kpis div {
  min-height: 82px;
  border-radius: 18px;
  padding: 16px;
}

.cc-product-kpis small {
  display: block;
  margin-bottom: 7px;
  color: #64748b;
  font-size: 11px;
  font-weight: 850;
}

.cc-product-kpis strong {
  display: block;
  color: #0f172a;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.cc-product-chart {
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 14px;
}

.cc-product-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  color: #334155;
  font-size: 13px;
  font-weight: 900;
}

.cc-product-chart-head small {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.cc-bars {
  height: 124px;
  display: flex;
  align-items: flex-end;
  gap: 11px;
}

.cc-bars span {
  flex: 1;
  display: block;
  background: linear-gradient(180deg, #ff9900 0%, #db8200 100%);
  border-radius: 10px 10px 4px 4px;
}

.h-40 { height: 40%; }
.h-52 { height: 52%; }
.h-60 { height: 60%; }
.h-65 { height: 65%; }
.h-82 { height: 82%; }
.h-92 { height: 92%; }

.cc-product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.cc-product-grid div {
  min-height: 54px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.cc-floating-note {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 16px;
  background: #ffffff;
  border: 1px solid #edf2f7;
  border-radius: 16px;
  box-shadow: 0 14px 35px rgba(15, 23, 42, 0.11);
  color: #334155;
  font-size: 13px;
  font-weight: 900;
}

.cc-floating-note i {
  color: var(--cc-primary);
}

.cc-note-left {
  top: 52px;
  left: -24px;
}

.cc-note-right {
  right: -20px;
  bottom: 52px;
}

/* SECTIONS */
.cc-section,
.cc-intro-section,
.cc-contact-section {
  padding: 86px 0;
}

.cc-section {
  background: #ffffff;
}

.cc-section-soft {
  background: #f8fafc;
}

.cc-section-heading {
  max-width: 820px;
  margin: 0 auto 52px;
}

.cc-section-heading h2,
.cc-left-title,
.cc-intro-card h2 {
  margin: 14px 0 14px;
  color: #0f172a;
  font-size: 40px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -0.75px;
}

.cc-section-heading p,
.cc-left-text,
.cc-intro-card p {
  margin: 0;
  color: var(--cc-muted);
  font-size: 16px;
  line-height: 1.75;
  font-weight: 600;
}

/* INTRO */
.cc-intro-section {
  background: #ffffff;
  padding-top: 34px;
}

.cc-intro-card {
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 28px;
  padding: 46px;
  box-shadow: var(--cc-shadow-soft);
}

/* SOLUTIONS */
.cc-solution-card {
  height: 100%;
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 24px;
  padding: 30px 26px;
  box-shadow: var(--cc-shadow-soft);
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.cc-solution-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 153, 0, 0.35);
  box-shadow: var(--cc-shadow);
}

.cc-solution-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: rgba(255, 153, 0, 0.11);
  color: #d67f00;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 23px;
  margin-bottom: 18px;
}

.cc-solution-card h3,
.cc-industry-card h3 {
  margin: 0 0 10px;
  color: #0f172a;
  font-size: 20px;
  font-weight: 900;
}

.cc-solution-card strong {
  display: block;
  color: #334155;
  font-size: 14px;
  line-height: 1.55;
  font-weight: 900;
  margin-bottom: 9px;
}

.cc-solution-card p,
.cc-industry-card p {
  margin: 0;
  color: var(--cc-muted);
  font-size: 14px;
  line-height: 1.7;
  font-weight: 600;
}

/* INDUSTRIES */
.cc-industry-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.cc-industry-card {
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 24px;
  padding: 30px 24px;
  text-align: center;
  box-shadow: var(--cc-shadow-soft);
}

.cc-industry-card i {
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: rgba(255, 153, 0, 0.1);
  color: #d67f00;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
  margin-bottom: 18px;
}

/* WHY */
.cc-why-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.cc-why-grid div {
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 22px;
  padding: 24px;
  box-shadow: var(--cc-shadow-soft);
}

.cc-why-grid i {
  color: #16a34a;
  font-size: 20px;
  margin-bottom: 12px;
}

.cc-why-grid strong {
  display: block;
  margin-bottom: 8px;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.45;
  font-weight: 900;
}

.cc-why-grid span {
  display: block;
  color: var(--cc-muted);
  font-size: 14px;
  line-height: 1.7;
  font-weight: 600;
}

/* ERP COMPARE */
.cc-erp-section {
  background: #ffffff;
}

.cc-erp-box {
  background:
    radial-gradient(circle at 88% 14%, rgba(255, 153, 0, 0.12), transparent 28%),
    #0f172a;
  color: #ffffff;
  border-radius: 30px;
  padding: 58px;
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.18);
}

.cc-erp-box .cc-section-label {
  color: #ffd18a;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}

.cc-erp-box h2 {
  margin: 14px 0 16px;
  color: #ffffff;
  font-size: 38px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -0.65px;
}

.cc-erp-box p {
  margin: 0;
  color: rgba(255, 255, 255, 0.75);
  font-size: 15px;
  line-height: 1.8;
  font-weight: 600;
}

.cc-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.cc-compare-card {
  border-radius: 22px;
  padding: 24px;
}

.cc-compare-card h3 {
  margin: 0 0 18px;
  font-size: 18px;
  font-weight: 900;
}

.cc-compare-card span {
  display: block;
  position: relative;
  padding-left: 20px;
  margin-top: 11px;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 700;
}

.cc-compare-card span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 999px;
}

.cc-compare-card.muted {
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.cc-compare-card.muted span {
  color: rgba(255, 255, 255, 0.68);
}

.cc-compare-card.muted span::before {
  background: #94a3b8;
}

.cc-compare-card.active {
  background: #ffffff;
  color: #0f172a;
}

.cc-compare-card.active span {
  color: #334155;
}

.cc-compare-card.active span::before {
  background: var(--cc-primary);
}

/* JOURNEY */
.cc-journey {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.cc-journey div {
  position: relative;
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 22px;
  padding: 24px 18px;
  text-align: center;
  box-shadow: var(--cc-shadow-soft);
}

.cc-journey div:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -15px;
  top: 50%;
  width: 12px;
  height: 12px;
  border-top: 2px solid #cbd5e1;
  border-right: 2px solid #cbd5e1;
  transform: translateY(-50%) rotate(45deg);
}

.cc-journey strong {
  display: block;
  margin-bottom: 8px;
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
}

.cc-journey span {
  display: block;
  color: var(--cc-muted);
  font-size: 13px;
  font-weight: 650;
}

/* FAQ */
.cc-faq {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.cc-faq-item {
  background: #ffffff;
  border: 1px solid var(--cc-border);
  border-radius: 18px;
  padding: 22px 24px;
  box-shadow: var(--cc-shadow-soft);
}

.cc-faq-item strong {
  display: block;
  margin-bottom: 8px;
  color: #0f172a;
  font-size: 16px;
  font-weight: 900;
}

.cc-faq-item p {
  margin: 0;
  color: var(--cc-muted);
  font-size: 14px;
  line-height: 1.7;
  font-weight: 600;
}

/* CONTACT */
.cc-contact-section {
  background: #ffffff;
}

.cc-contact-box {
  background:
    radial-gradient(circle at 92% 10%, rgba(255, 153, 0, 0.18), transparent 28%),
    linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  color: #ffffff;
  border-radius: 30px;
  padding: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.18);
}

.cc-contact-box .cc-section-label {
  color: #ffd18a;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}

.cc-contact-box h2 {
  margin: 14px 0 12px;
  color: #ffffff;
  font-size: 36px;
  line-height: 1.15;
  font-weight: 900;
}

.cc-contact-box p {
  margin: 0;
  max-width: 620px;
  color: rgba(255, 255, 255, 0.75);
  font-size: 15px;
  line-height: 1.75;
  font-weight: 600;
}

.cc-contact-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* FOOTER */
.cc-footer {
  background: #ffffff;
  border-top: 1px solid var(--cc-border);
  padding: 56px 0 26px;
}

.cc-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 40px;
}

.cc-footer-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.cc-footer-brand img {
  width: auto;
  height: 40px;
}

.cc-footer-brand strong {
  color: #0f172a;
  font-size: 20px;
  font-weight: 900;
}

.cc-footer-main p {
  margin: 0;
  max-width: 430px;
  color: var(--cc-muted);
  font-size: 14px;
  line-height: 1.7;
  font-weight: 600;
}

.cc-footer-grid > div > strong {
  display: block;
  margin-bottom: 12px;
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.cc-footer-grid a {
  display: block;
  margin-top: 8px;
  color: var(--cc-muted);
  font-size: 14px;
  font-weight: 700;
}

.cc-footer-grid a:hover {
  color: #0f172a;
}

.cc-footer-bottom {
  margin-top: 38px;
  padding-top: 20px;
  border-top: 1px solid var(--cc-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: var(--cc-muted);
  font-size: 13px;
  font-weight: 600;
}

/* RESPONSIVE */
@media (max-width: 1199.98px) {
  .cc-menu {
    gap: 18px;
  }

  .cc-hero-title {
    font-size: 48px;
  }

  .cc-floating-note {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .cc-menu {
    display: none;
  }

  .cc-navbar {
    min-height: 74px;
  }

  .cc-login-link {
    display: none;
  }

  .cc-hero {
    padding: 58px 0 60px;
  }

  .cc-hero-title {
    font-size: 40px;
  }

  .cc-hero-visual {
    justify-content: flex-start;
  }

  .cc-product-card {
    max-width: 100%;
  }

  .cc-industry-grid,
  .cc-why-grid,
  .cc-compare-grid,
  .cc-journey {
    grid-template-columns: 1fr;
  }

  .cc-journey div:not(:last-child)::after {
    display: none;
  }

  .cc-erp-box,
  .cc-contact-box,
  .cc-intro-card {
    padding: 34px;
  }

  .cc-contact-box {
    flex-direction: column;
    align-items: flex-start;
  }

  .cc-footer-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .cc-brand-logo {
    height: 36px;
  }

  .cc-brand-text {
    font-size: 18px;
  }

  .cc-btn-sm {
    padding: 9px 14px;
    font-size: 12px;
  }

  .cc-hero-title {
    font-size: 34px;
    letter-spacing: -0.75px;
  }

  .cc-hero-lead {
    font-size: 16px;
  }

  .cc-hero-actions .cc-btn,
  .cc-contact-actions .cc-btn {
    width: 100%;
  }

  .cc-product-body {
    grid-template-columns: 1fr;
  }

  .cc-product-sidebar {
    display: none;
  }

  .cc-product-kpis,
  .cc-product-grid {
    grid-template-columns: 1fr;
  }

  .cc-section,
  .cc-intro-section,
  .cc-contact-section {
    padding: 64px 0;
  }

  .cc-section-heading h2,
  .cc-left-title,
  .cc-intro-card h2,
  .cc-erp-box h2,
  .cc-contact-box h2 {
    font-size: 29px;
  }

  .cc-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }




  
}


/* V4.1 quick polish */
.cc-hero {
  padding: 70px 0 58px;
}

.cc-hero-title {
  font-size: 48px;
  line-height: 1.08;
  max-width: 620px;
}

.cc-product-card {
  max-width: 530px;
}

.cc-intro-section {
  padding-bottom: 48px;
}

.cc-section {
  padding: 72px 0;
}


/* V4.2 spacing polish */
.cc-intro-section {
  padding-top: 18px;
  padding-bottom: 28px;
}

#solutions.cc-section {
  padding-top: 48px;
}

.cc-section-heading {
  margin-bottom: 42px;
}


/* HERO STATS */

.cc-hero-stats {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.cc-stat {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 14px 18px;
  min-width: 140px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.cc-stat strong {
  display: block;
  color: #0f172a;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.1;
}

.cc-stat span {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 767.98px) {
  .cc-stat {
    width: calc(50% - 7px);
    min-width: auto;
  }
}


/* ======================================================
   COSTCHIEF HERO MACHINE
====================================================== */

.cc-hero-visual{
    position:relative;
    min-height:620px;
}

.cc-hero-machine{
    position:absolute;
    top:-35px;
    right:-220px;
    width:1100px;
    max-width:none;
    opacity:.28;
    z-index:1;
    pointer-events:none;
    filter:
        drop-shadow(0 40px 90px rgba(15,23,42,.10))
        saturate(.95);
}

.cc-product-card{
    position:relative;
    z-index:5;
}

.cc-note-left,
.cc-note-right{
    z-index:6;
}



/* =======================================================
   STORY / ILLUSTRATION SECTIONS
======================================================= */

.cc-story-section{
    padding:110px 0;
}

.cc-story-section-soft{
    background:#f8fafc;
}

.cc-story-card{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:28px;
    padding:60px;
    box-shadow:0 20px 50px rgba(15,23,42,.05);
}

.cc-section-label{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    font-size:.85rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#ff9900;
    margin-bottom:1rem;
}

.cc-story-title{
    font-size:2.5rem;
    line-height:1.15;
    font-weight:800;
    color:#0f172a;
    margin-bottom:1.5rem;
}

.cc-story-text{
    color:#64748b;
    font-size:1.05rem;
    line-height:1.9;
    margin-bottom:1rem;
}

.cc-story-points{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:2rem;
}

.cc-story-points span{
    display:flex;
    align-items:center;
    gap:8px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:999px;
    padding:10px 16px;
    font-size:.92rem;
    font-weight:600;
}

.cc-story-points i{
    color:#10b981;
}

/* =======================================================
   ILLUSTRATION PLACEHOLDER
======================================================= */

.cc-illustration-placeholder{
    min-height:420px;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fafc 100%
        );

    border:2px dashed #cbd5e1;
    border-radius:30px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    text-align:center;

    padding:40px;

    position:relative;

    overflow:hidden;
}

.cc-illustration-placeholder i{
    font-size:5rem;
    color:#ff9900;
    margin-bottom:1.5rem;
}

.cc-illustration-placeholder strong{
    display:block;
    font-size:1.4rem;
    color:#0f172a;
    margin-bottom:.75rem;
}

.cc-illustration-placeholder span{
    color:#64748b;
    max-width:340px;
    line-height:1.7;
}

.cc-illustration-badge{
    position:absolute;
    top:20px;
    right:20px;

    background:#ff9900;
    color:#fff;

    font-size:.8rem;
    font-weight:700;

    border-radius:999px;

    padding:8px 14px;
}

/* =======================================================
   SOLUTIONS
======================================================= */

.cc-solution-card{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:30px;
    height:100%;
    transition:.25s ease;
}

.cc-solution-card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 40px rgba(15,23,42,.08);
}

.cc-solution-icon{
    width:64px;
    height:64px;

    border-radius:18px;

    background:#fff4e5;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:20px;
}

.cc-solution-icon i{
    color:#ff9900;
    font-size:1.5rem;
}

.cc-solution-card h3{
    font-size:1.25rem;
    font-weight:700;
    margin-bottom:.75rem;
    color:#0f172a;
}

.cc-solution-card strong{
    display:block;
    margin-bottom:1rem;
    color:#1e293b;
}

.cc-solution-card p{
    color:#64748b;
    line-height:1.8;
}

/* =======================================================
   INDUSTRIES
======================================================= */

.cc-industry-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

.cc-industry-card{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:30px;
    text-align:center;
}

.cc-industry-card i{
    font-size:2rem;
    color:#ff9900;
    margin-bottom:1rem;
}

.cc-industry-card h3{
    font-size:1.1rem;
    font-weight:700;
    margin-bottom:.75rem;
}

.cc-industry-card p{
    color:#64748b;
    line-height:1.7;
}

/* =======================================================
   WHY COSTCHIEF
======================================================= */

.cc-left-title{
    font-size:2.4rem;
    font-weight:800;
    line-height:1.15;
    color:#0f172a;
    margin-bottom:1rem;
}

.cc-left-text{
    color:#64748b;
    line-height:1.9;
}

.cc-why-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.cc-why-grid > div{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:25px;
}

.cc-why-grid i{
    color:#10b981;
    font-size:1.4rem;
    margin-bottom:1rem;
}

.cc-why-grid strong{
    display:block;
    margin-bottom:.75rem;
    color:#0f172a;
}

.cc-why-grid span{
    color:#64748b;
    line-height:1.7;
}

/* =======================================================
   ERP COMPARISON
======================================================= */

.cc-erp-box{
    background:#0f172a;
    color:#fff;
    border-radius:32px;
    padding:60px;
}

.cc-compare-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.cc-compare-card{
    border-radius:24px;
    padding:25px;

    display:flex;
    flex-direction:column;
    gap:12px;
}

.cc-compare-card.muted{
    background:rgba(255,255,255,.08);
}

.cc-compare-card.active{
    background:#ff9900;
    color:#fff;
}

/* =======================================================
   JOURNEY
======================================================= */

.cc-journey{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:20px;
}

.cc-journey div{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:24px;
    padding:25px;
    text-align:center;
}

.cc-journey strong{
    display:block;
    margin-bottom:.5rem;
    color:#0f172a;
}

.cc-journey span{
    color:#64748b;
}

/* =======================================================
   FAQ
======================================================= */

.cc-faq{
    max-width:900px;
    margin:0 auto;
}

.cc-faq-item{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:20px;
    padding:25px;
    margin-bottom:16px;
}

.cc-faq-item strong{
    display:block;
    margin-bottom:10px;
    color:#0f172a;
}

.cc-faq-item p{
    color:#64748b;
    margin:0;
}

/* =======================================================
   CONTACT CTA
======================================================= */

.cc-contact-section{
    padding:120px 0;
}

.cc-contact-box{
    background:#0f172a;
    color:#fff;

    border-radius:32px;

    padding:70px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
}

.cc-contact-actions{
    display:flex;
    gap:16px;
}

/* =======================================================
   RESPONSIVE
======================================================= */

@media (max-width:991px){

    .cc-story-card{
        padding:35px;
    }

    .cc-story-title,
    .cc-left-title{
        font-size:2rem;
    }

    .cc-industry-grid,
    .cc-journey,
    .cc-why-grid,
    .cc-compare-grid{
        grid-template-columns:1fr;
    }

    .cc-contact-box{
        flex-direction:column;
        text-align:center;
    }
}



.cc-illustration-image{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:28px;
    overflow:hidden;
    box-shadow:0 18px 45px rgba(15,23,42,.06);
}

.cc-illustration-image img{
    display:block;
    width:100%;
    height:auto;
}

.cc-solution-image{
    margin:-10px -10px 22px;
    border-radius:20px;
    overflow:hidden;
    background:#f8fafc;
    border:1px solid #eef2f7;
}

.cc-solution-image img{
    display:block;
    width:100%;
    height:auto;
}

.cc-solution-image{
    height:170px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.cc-solution-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.cc-story-section{
    padding:90px 0;
}

.cc-story-card{
    max-width:1120px;
    margin:0 auto;
}

.cc-illustration-image img{
    object-fit:cover;
}


/* =======================================================
   HERO V4 - MACHINE + DASHBOARD
======================================================= */

.cc-hero-v4{
    min-height:680px;
    padding:72px 0 82px;
    overflow:hidden;
    background:
        radial-gradient(circle at 4% 12%, rgba(255,153,0,.12), transparent 26%),
        linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}

.cc-hero-v4-container{
    position:relative;
    min-height:560px;
    display:grid;
    grid-template-columns:34% 34% 32%;
    align-items:center;
    gap:0;
}

.cc-hero-copy{
    position:relative;
    z-index:5;
}

.cc-hero-v4 .cc-hero-title{
    font-size:46px;
    line-height:1.08;
    max-width:560px;
    margin:22px 0 18px;
}

.cc-hero-v4 .cc-hero-lead{
    max-width:470px;
    font-size:16px;
    line-height:1.8;
    margin-bottom:28px;
}

.cc-hero-v4 .cc-hero-points{
    max-width:500px;
}

.cc-hero-machine-wrap{
    position:relative;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:520px;
}

.cc-hero-machine-v4{
    width:760px;
    max-width:none;
    transform:translateX(-30px);
    filter:drop-shadow(0 28px 55px rgba(15,23,42,.13));
}

.cc-hero-dashboard-wrap{
    position:relative;
    z-index:4;
    display:flex;
    justify-content:flex-end;
}

.cc-product-card-v4{
    width:560px;
    max-width:none;
    border-radius:26px;
    box-shadow:0 32px 90px rgba(15,23,42,.16);
    transform:translateX(8px);
}

.cc-product-card-v4 .cc-product-body{
    min-height:382px;
}

.cc-product-card-v4 .cc-product-sidebar{
    background:#0f172a;
}

.cc-product-card-v4 .cc-product-sidebar div{
    color:#cbd5e1;
}

.cc-product-card-v4 .cc-product-sidebar div.active{
    background:rgba(255,255,255,.10);
    color:#ffffff;
    box-shadow:none;
}

.cc-product-card-v4 .cc-product-sidebar i{
    color:#94a3b8;
}

.cc-product-card-v4 .cc-product-sidebar div.active i{
    color:#ff9900;
}

.cc-hero-v4 .cc-hero-stats,
.cc-hero-v4 .cc-floating-note,
.cc-hero-v4 .cc-hero-machine{
    display:none !important;
}

@media (max-width:1199.98px){
    .cc-hero-v4-container{
        grid-template-columns:38% 28% 34%;
    }

    .cc-hero-machine-v4{
        width:660px;
        transform:translateX(-20px);
    }

    .cc-product-card-v4{
        width:500px;
    }

    .cc-hero-v4 .cc-hero-title{
        font-size:40px;
    }
}

@media (max-width:991.98px){
    .cc-hero-v4{
        padding:58px 0 64px;
    }

    .cc-hero-v4-container{
        display:block;
        min-height:auto;
    }

    .cc-hero-machine-wrap{
        min-height:auto;
        margin:42px 0 24px;
    }

    .cc-hero-machine-v4{
        width:100%;
        max-width:720px;
        transform:none;
    }

    .cc-hero-dashboard-wrap{
        justify-content:center;
    }

    .cc-product-card-v4{
        width:100%;
        max-width:620px;
        transform:none;
    }
}

@media (max-width:767.98px){
    .cc-hero-v4 .cc-hero-title{
        font-size:34px;
    }

    .cc-product-card-v4{
        border-radius:22px;
    }
}

/* =======================================================
   HERO DASHBOARD FINAL
======================================================= */

.cc-hero-dashboard{
    padding:78px 0 86px;
    overflow:hidden;
    background:
        radial-gradient(circle at 4% 12%, rgba(255,153,0,.12), transparent 26%),
        linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}

.cc-hero-dashboard-grid{
    display:grid;
    grid-template-columns:38% 62%;
    align-items:center;
    gap:34px;
}

.cc-hero-copy{
    position:relative;
    z-index:5;
}

.cc-hero-dashboard .cc-hero-title{
    font-size:48px;
    line-height:1.08;
    max-width:620px;
    margin:22px 0 18px;
}

.cc-hero-dashboard .cc-hero-lead{
    max-width:540px;
    font-size:17px;
    line-height:1.8;
    margin-bottom:30px;
}

.cc-hero-dashboard-visual{
    position:relative;
    min-height:560px;
}

.cc-hero-machine-bg{
    position:absolute;
    left:-80px;
    bottom:8px;
    width:660px;
    max-width:none;
    opacity:.18;
    filter:saturate(.9) drop-shadow(0 30px 70px rgba(15,23,42,.08));
    pointer-events:none;
    z-index:1;
}

.cc-dashboard-panel{
    position:relative;
    z-index:4;
    width:820px;
    max-width:none;
    margin-left:auto;
    background:#ffffff;
    border:1px solid #e2e8f0;
    border-radius:28px;
    overflow:hidden;
    box-shadow:0 34px 95px rgba(15,23,42,.16);
}

.cc-dashboard-topbar{
    height:58px;
    padding:0 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #edf2f7;
    background:#ffffff;
}

.cc-dashboard-topbar strong{
    font-size:13px;
    color:#0f172a;
    font-weight:900;
}

.cc-dashboard-body{
    display:grid;
    grid-template-columns:170px 1fr;
    min-height:470px;
}

.cc-dashboard-sidebar{
    background:#0f172a;
    padding:20px 14px;
}

.cc-dashboard-sidebar div{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 13px;
    margin-bottom:8px;
    border-radius:14px;
    color:#cbd5e1;
    font-size:12px;
    font-weight:850;
}

.cc-dashboard-sidebar div.active{
    background:rgba(255,255,255,.1);
    color:#ffffff;
}

.cc-dashboard-sidebar i{
    color:#94a3b8;
}

.cc-dashboard-sidebar div.active i{
    color:#ff9900;
}

.cc-dashboard-main{
    padding:22px;
    background:#f8fafc;
}

.cc-dashboard-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    margin-bottom:18px;
}

.cc-dashboard-head small{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:800;
}

.cc-dashboard-head h3{
    margin:4px 0 0;
    color:#0f172a;
    font-size:22px;
    font-weight:900;
}

.cc-dashboard-head span{
    background:#fff7ed;
    color:#c46b00;
    border:1px solid rgba(255,153,0,.24);
    border-radius:999px;
    padding:7px 12px;
    font-size:11px;
    font-weight:900;
}

.cc-dashboard-kpi-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-bottom:14px;
}

.cc-dashboard-kpi-grid div{
    background:#ffffff;
    border:1px solid #e8eef6;
    border-radius:16px;
    padding:14px;
}

.cc-dashboard-kpi-grid small{
    display:block;
    color:#64748b;
    font-size:10px;
    font-weight:850;
    margin-bottom:7px;
}

.cc-dashboard-kpi-grid strong{
    display:block;
    color:#0f172a;
    font-size:20px;
    font-weight:900;
    line-height:1.1;
}

.cc-dashboard-kpi-grid span{
    display:inline-flex;
    margin-top:9px;
    background:#ecfdf5;
    color:#059669;
    border-radius:999px;
    padding:4px 8px;
    font-size:10px;
    font-weight:900;
}

.cc-dashboard-content-grid{
    display:grid;
    grid-template-columns:1.5fr .9fr;
    gap:14px;
    margin-bottom:14px;
}

.cc-dashboard-chart-card,
.cc-dashboard-status-card,
.cc-dashboard-table{
    background:#ffffff;
    border:1px solid #e8eef6;
    border-radius:18px;
    padding:16px;
}

.cc-card-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:14px;
}

.cc-card-head strong{
    color:#0f172a;
    font-size:13px;
    font-weight:900;
}

.cc-card-head small{
    color:#64748b;
    font-size:11px;
    font-weight:800;
}

.cc-dashboard-line{
    position:relative;
    height:150px;
    background:
        linear-gradient(#eef2f7 1px, transparent 1px),
        linear-gradient(90deg,#eef2f7 1px, transparent 1px);
    background-size:100% 38px, 70px 100%;
    border-radius:14px;
    overflow:hidden;
}

.cc-dashboard-line::before{
    content:"";
    position:absolute;
    left:16px;
    right:16px;
    top:80px;
    height:4px;
    background:linear-gradient(90deg,#ff9900,#2563eb,#ff9900);
    border-radius:999px;
    transform:skewY(-8deg);
}

.cc-dashboard-line span{
    position:absolute;
    width:9px;
    height:9px;
    border-radius:999px;
    background:#ff9900;
    box-shadow:0 0 0 5px rgba(255,153,0,.14);
}

.cc-dashboard-line .p1{left:10%;top:66%;}
.cc-dashboard-line .p2{left:26%;top:54%;}
.cc-dashboard-line .p3{left:42%;top:60%;}
.cc-dashboard-line .p4{left:58%;top:38%;}
.cc-dashboard-line .p5{left:74%;top:44%;}
.cc-dashboard-line .p6{left:88%;top:28%;}

.cc-status-ring{
    width:112px;
    height:112px;
    border-radius:999px;
    margin:8px auto 16px;
    background:
        radial-gradient(circle,#fff 0 48%,transparent 49%),
        conic-gradient(#ff9900 0 72%,#e2e8f0 72% 100%);
    display:flex;
    align-items:center;
    justify-content:center;
}

.cc-status-ring span{
    color:#0f172a;
    font-size:22px;
    font-weight:900;
}

.cc-status-list{
    display:grid;
    gap:8px;
}

.cc-status-list span{
    display:flex;
    align-items:center;
    gap:8px;
    color:#64748b;
    font-size:11px;
    font-weight:800;
}

.cc-status-list i{
    width:9px;
    height:9px;
    border-radius:999px;
    display:block;
}

.cc-status-list .ok{background:#10b981;}
.cc-status-list .wait{background:#2563eb;}
.cc-status-list .warn{background:#ff9900;}

.cc-delivery-row{
    display:grid;
    grid-template-columns:1fr auto auto;
    gap:12px;
    align-items:center;
    padding:10px 0;
    border-top:1px solid #eef2f7;
}

.cc-delivery-row span{
    color:#334155;
    font-size:12px;
    font-weight:850;
}

.cc-delivery-row strong{
    color:#64748b;
    font-size:11px;
    font-weight:800;
}

.cc-delivery-row em{
    font-style:normal;
    background:#ecfdf5;
    color:#059669;
    border-radius:999px;
    padding:5px 9px;
    font-size:10px;
    font-weight:900;
}

@media (max-width:1199.98px){
    .cc-hero-dashboard-grid{
        grid-template-columns:40% 60%;
    }

    .cc-dashboard-panel{
        width:720px;
    }

    .cc-dashboard-kpi-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .cc-hero-machine-bg{
        width:560px;
    }
}

@media (max-width:991.98px){
    .cc-hero-dashboard-grid{
        display:block;
    }

    .cc-hero-dashboard-visual{
        min-height:auto;
        margin-top:42px;
    }

    .cc-dashboard-panel{
        width:100%;
    }

    .cc-hero-machine-bg{
        display:none;
    }
}

@media (max-width:767.98px){
    .cc-hero-dashboard .cc-hero-title{
        font-size:34px;
    }

    .cc-dashboard-body{
        grid-template-columns:1fr;
    }

    .cc-dashboard-sidebar{
        display:none;
    }

    .cc-dashboard-kpi-grid,
    .cc-dashboard-content-grid{
        grid-template-columns:1fr;
    }
}


/* =======================================================
   HERO V5 - DASHBOARD ONLY
======================================================= */

.cc-hero-v5{
    padding:78px 0 88px;
    overflow:hidden;
    background:
        radial-gradient(circle at 4% 12%, rgba(255,153,0,.12), transparent 26%),
        linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}

.cc-hero-v5-grid{
    display:grid;
    grid-template-columns:42% 58%;
    align-items:center;
    gap:34px;
}

.cc-hero-v5 .cc-hero-title{
    font-size:48px;
    line-height:1.08;
    max-width:720px;
    margin:22px 0 18px;
}

.cc-hero-v5 .cc-hero-lead{
    max-width:620px;
    font-size:17px;
    line-height:1.8;
    margin-bottom:30px;
}

.cc-fox-note{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:26px;
    padding:12px 16px;
    background:#fff7ed;
    border:1px solid rgba(255,153,0,.24);
    border-radius:999px;
    color:#9a5b00;
    font-size:13px;
    font-weight:850;
}

.cc-fox-note span{
    font-size:18px;
}

.cc-dashboard-panel-v5{
    width:840px;
    max-width:none;
    margin-left:auto;
}

.cc-dashboard-brand,
.cc-dashboard-company{
    display:flex;
    align-items:center;
    gap:10px;
}

.cc-dashboard-fox{
    width:30px;
    height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#fff7ed;
    border:1px solid rgba(255,153,0,.28);
    border-radius:10px;
    font-size:17px;
}

.cc-dashboard-company{
    flex-direction:column;
    align-items:flex-end;
    gap:2px;
}

.cc-dashboard-company span{
    color:#64748b;
    font-size:10px;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.cc-dashboard-company strong{
    color:#0f172a;
    font-size:12px;
    font-weight:900;
}

.cc-sidebar-logo{
    margin-bottom:18px;
    padding:14px 12px;
    background:rgba(255,255,255,.08);
    border:1px dashed rgba(255,255,255,.18);
    border-radius:16px;
}

.cc-sidebar-logo span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:34px;
    background:#ffffff;
    color:#0f172a;
    border-radius:10px;
    font-size:10px;
    font-weight:900;
    margin-bottom:8px;
}

.cc-sidebar-logo strong{
    display:block;
    color:#ffffff;
    font-size:12px;
    font-weight:900;
}

.cc-dashboard-content-grid-v5{
    grid-template-columns:1.45fr .85fr;
}

.cc-live-bars{
    height:180px;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    align-items:end;
    gap:14px;
    padding:16px 6px 0;
}

.cc-live-bars div{
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:center;
    gap:10px;
}

.cc-live-bars span{
    width:100%;
    max-width:36px;
    height:var(--h);
    display:block;
    border-radius:12px 12px 5px 5px;
    background:linear-gradient(180deg,#ff9900 0%,#e88900 100%);
    animation:ccLiveBars 2.4s ease-in-out infinite;
    animation-delay:var(--d);
    box-shadow:0 10px 22px rgba(255,153,0,.22);
}

.cc-live-bars small{
    color:#64748b;
    font-size:10px;
    font-weight:850;
    text-align:center;
}

@keyframes ccLiveBars{
    0%,100%{
        transform:scaleY(.82);
        opacity:.82;
    }
    50%{
        transform:scaleY(1);
        opacity:1;
    }
}

.cc-dashboard-bottom-grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:14px;
}

.cc-efatura-card{
    background:#ffffff;
    border:1px solid #e8eef6;
    border-radius:18px;
    padding:16px;
}

.cc-efatura-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}

.cc-efatura-stats div{
    background:#f8fafc;
    border:1px solid #eef2f7;
    border-radius:14px;
    padding:12px 8px;
    text-align:center;
}

.cc-efatura-stats strong{
    display:block;
    color:#0f172a;
    font-size:18px;
    font-weight:900;
}

.cc-efatura-stats span{
    display:block;
    color:#64748b;
    font-size:10px;
    font-weight:850;
    margin-top:4px;
}

.cc-hero-v5 .cc-hero-machine-bg,
.cc-hero-v5 .cc-hero-machine,
.cc-hero-v5 .cc-hero-machine-v4{
    display:none !important;
}

@media (max-width:1199.98px){
    .cc-hero-v5-grid{
        grid-template-columns:40% 60%;
    }

    .cc-dashboard-panel-v5{
        width:760px;
    }

    .cc-hero-v5 .cc-hero-title{
        font-size:42px;
    }
}

@media (max-width:991.98px){
    .cc-hero-v5-grid{
        display:block;
    }

    .cc-hero-dashboard-visual{
        margin-top:42px;
    }

    .cc-dashboard-panel-v5{
        width:100%;
    }
}

@media (max-width:767.98px){
    .cc-hero-v5 .cc-hero-title{
        font-size:34px;
    }

    .cc-dashboard-company{
        display:none;
    }

    .cc-dashboard-bottom-grid,
    .cc-dashboard-content-grid-v5,
    .cc-efatura-stats{
        grid-template-columns:1fr;
    }
}


/* ============================================================
   CostChief PUBLIC LANDING - Brand tuning only
   ============================================================ */

.cc-header .cc-brand-logo{
  height: 64px;
  width: auto;
  max-width: none;
}

.cc-header .cc-public-brand-text{
  font-weight: 800;
  font-size: 1.45rem;
  letter-spacing: .4px;
}

.cc-dashboard-logo{
  height: 26px;
  width: auto;
  max-width: none;
  display: inline-block;
}