/* =========================================================================
   business-cloud.css — page-scoped styles for the 4 business-cloud pages:
   /tally-on-cloud, /erp-on-cloud, /cloud-application-hosting, /managed-cloud-servers
   Loaded ONLY by the matching services/*.blade.php file. No global side-effects.
   Each page uses its own unique prefix so it cannot bleed into the others:
     .tally-*  → Tally on Cloud (emerald/amber financial theme)
     .erpc-*   → ERP on Cloud (indigo/violet enterprise theme)
     .cah-*    → Cloud Application Hosting (cyan/violet dev theme)
     .mcs-*    → Managed Cloud Servers (teal/orange ops theme)
   ========================================================================= */

/* ----------------------------------------------------------------
   COMMON — shared primitives (counter, CTA, layout helpers)
   ---------------------------------------------------------------- */
.bc-page { position: relative; }

.bc-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
}
.bc-eyebrow i { font-size: 14px; }

.bc-h2 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.15; font-weight: 800;
    color: #0b1020; margin: 14px 0 10px; letter-spacing: -0.01em;
}
.bc-h3 {
    font-size: 20px; font-weight: 700; color: #0b1020;
    margin: 0 0 6px; letter-spacing: -0.005em;
}
.bc-lead {
    font-size: 16px; line-height: 1.65; color: #4b5568; margin: 0;
}
.bc-section { padding: 70px 0; }
.bc-container { max-width: 1200px; margin: 0 auto; padding: 0 22px; }

.bc-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 13px 24px; border-radius: 10px;
    font-weight: 700; font-size: 15px; text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    border: 0; cursor: pointer;
}
.bc-btn-primary { color: #fff; }
.bc-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -10px rgba(0,0,0,0.25); }
.bc-btn-ghost {
    background: #fff; border: 1.5px solid #e5e7eb; color: #0b1020;
}
.bc-btn-ghost:hover { border-color: #0b1020; }

/* Counter grid (reusable) */
.bc-counter-grid {
    display: grid; gap: 18px;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 32px;
}
.bc-counter {
    border-radius: 18px; padding: 26px 22px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(11,16,32,0.05);
    border: 1px solid rgba(11,16,32,0.04);
    text-align: left;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.bc-counter:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -10px rgba(11,16,32,0.12); }
.bc-counter__num {
    font-size: 40px; font-weight: 800; line-height: 1;
    background-clip: text; -webkit-background-clip: text;
    color: transparent; -webkit-text-fill-color: transparent;
}
.bc-counter__label {
    font-size: 14px; font-weight: 600; color: #4b5568; margin-top: 8px;
}

/* Bottom CTA (reusable) */
.bc-bottom-cta {
    border-radius: 20px; padding: 24px 32px;
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    margin: 30px 0 60px;
    box-shadow: 0 18px 40px -16px rgba(11,16,32,0.18);
    flex-wrap: wrap;
}
.bc-bottom-cta__text { display: flex; align-items: center; gap: 16px; flex: 1; min-width: 280px; }
.bc-bottom-cta__icon {
    width: 52px; height: 52px; border-radius: 14px;
    display: grid; place-items: center; color: #fff; font-size: 22px;
    flex: 0 0 auto;
}
.bc-bottom-cta__title { font-size: 20px; font-weight: 800; color: #0b1020; margin: 0; }
.bc-bottom-cta__sub { font-size: 14px; color: #4b5568; margin: 4px 0 0; }
.bc-bottom-cta__actions { display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 900px) {
    .bc-counter-grid { grid-template-columns: repeat(2, 1fr); }
    .bc-bottom-cta { flex-direction: column; align-items: flex-start; }
    .bc-bottom-cta__actions { width: 100%; }
    .bc-bottom-cta__actions .bc-btn { flex: 1; justify-content: center; }
}
@media (max-width: 480px) {
    .bc-counter-grid { grid-template-columns: 1fr; }
    .bc-section { padding: 50px 0; }
}

/* ========================================================================
   TALLY ON CLOUD — .tally-*
   Theme: Emerald (#047857) → Amber (#F59E0B). Financial / accounting feel.
   ======================================================================== */
.tally-section { padding: 70px 0; background: #f7faf9; }
.tally-section--alt { background: #fff; }
.tally-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    background: linear-gradient(90deg, rgba(4,120,87,0.12), rgba(245,158,11,0.15));
    color: #047857;
}
.tally-h2 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.15; font-weight: 800; color: #0b1020;
    margin: 14px 0 12px; letter-spacing: -0.01em;
}
.tally-h3 { font-size: 20px; font-weight: 700; color: #0b1020; margin: 0 0 6px; }
.tally-lead { font-size: 16px; line-height: 1.7; color: #4b5568; margin: 0; max-width: 720px; }
.tally-container { max-width: 1200px; margin: 0 auto; padding: 0 22px; }

/* Tally feature row (alternating image/text) */
.tally-row { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.tally-row + .tally-row { margin-top: 60px; }
.tally-row--reverse > :first-child { order: 2; }
.tally-row__visual {
    border-radius: 22px; overflow: hidden;
    box-shadow: 0 22px 50px -18px rgba(4,120,87,0.28);
    border: 1px solid rgba(4,120,87,0.10);
}
.tally-row__visual img { width: 100%; display: block; }
.tally-row__chips { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.tally-row__chip {
    padding: 7px 14px; border-radius: 999px;
    background: rgba(4,120,87,0.08); color: #047857;
    font-size: 13px; font-weight: 600;
}
.tally-row__chip--amber { background: rgba(245,158,11,0.12); color: #b45309; }
.tally-checklist { list-style: none; padding: 0; margin: 18px 0 0; }
.tally-checklist li {
    position: relative; padding: 6px 0 6px 32px; color: #374151; font-size: 15px;
}
.tally-checklist li::before {
    content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    position: absolute; left: 0; top: 8px;
    color: #047857; font-size: 14px;
}

/* Tally mock dashboard panel */
.tally-dash {
    background: #fff; border-radius: 18px; padding: 22px;
    box-shadow: 0 18px 40px -16px rgba(11,16,32,0.18);
    border: 1px solid rgba(4,120,87,0.10);
}
.tally-dash__head {
    display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 14px; border-bottom: 1px solid #eef2f0;
    margin-bottom: 16px;
}
.tally-dash__title { font-size: 16px; font-weight: 700; color: #0b1020; margin: 0; }
.tally-dash__pill {
    background: rgba(4,120,87,0.10); color: #047857;
    font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}
.tally-dash__row {
    display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 12px;
    padding: 10px 0; border-bottom: 1px dashed #eef2f0; align-items: center;
    font-size: 13px; color: #4b5568;
}
.tally-dash__row:last-child { border-bottom: 0; }
.tally-dash__row strong { color: #0b1020; font-weight: 700; }
.tally-dash__row .ok { color: #047857; font-weight: 700; }
.tally-dash__row .pending { color: #b45309; font-weight: 700; }

.tally-counter .bc-counter__num { background-image: linear-gradient(90deg, #047857, #F59E0B); }
.tally-counter:hover { border-color: rgba(4,120,87,0.30); }

/* Tally pricing (3 tiers) */
.tally-pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 36px; }
.tally-tier {
    background: #fff; border-radius: 18px; padding: 28px 26px;
    border: 1px solid #e7eaf0; position: relative; overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.tally-tier:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -10px rgba(4,120,87,0.20); }
.tally-tier--featured {
    background: linear-gradient(180deg, #047857, #065F46);
    color: #fff; border-color: transparent;
    box-shadow: 0 18px 40px -14px rgba(4,120,87,0.45);
}
.tally-tier--featured .tally-tier__name,
.tally-tier--featured .tally-tier__price,
.tally-tier--featured .tally-tier__feat { color: #fff; }
.tally-tier--featured .tally-tier__feat { border-color: rgba(255,255,255,0.18); }
.tally-tier__ribbon {
    position: absolute; top: 14px; right: -32px;
    background: #F59E0B; color: #0b1020; font-size: 11px; font-weight: 800;
    padding: 4px 36px; transform: rotate(35deg);
}
.tally-tier__name { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #047857; }
.tally-tier__price { font-size: 36px; font-weight: 800; color: #0b1020; margin: 8px 0; }
.tally-tier__price small { font-size: 14px; color: #6b7280; font-weight: 600; }
.tally-tier--featured .tally-tier__price small { color: rgba(255,255,255,0.7); }
.tally-tier__feat { list-style: none; padding: 0; margin: 14px 0 22px; border-top: 1px solid #eef2f0; padding-top: 14px; color: #4b5568; font-size: 14px; }
.tally-tier__feat li { padding: 5px 0 5px 22px; position: relative; }
.tally-tier__feat li::before { content: "✓"; color: #047857; position: absolute; left: 0; font-weight: 800; }
.tally-tier--featured .tally-tier__feat li::before { color: #F59E0B; }
.tally-tier__cta {
    display: block; text-align: center; padding: 12px 20px; border-radius: 10px;
    background: #047857; color: #fff; font-weight: 700; text-decoration: none;
    transition: background 0.2s ease;
}
.tally-tier__cta:hover { background: #065F46; }
.tally-tier--featured .tally-tier__cta { background: #F59E0B; color: #0b1020; }
.tally-tier--featured .tally-tier__cta:hover { background: #d97706; }

.tally-cta {
    background: linear-gradient(90deg, #047857, #065F46);
    color: #fff; border-radius: 20px; padding: 28px 32px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; box-shadow: 0 18px 40px -16px rgba(4,120,87,0.40);
}
.tally-cta__text h3 { color: #fff; margin: 0 0 4px; font-size: 22px; }
.tally-cta__text p { color: rgba(255,255,255,0.85); margin: 0; font-size: 15px; }
.tally-cta__btn {
    background: linear-gradient(135deg, #F59E0B, #D97706);
    color: #fff;
    box-shadow: 0 8px 18px -6px rgba(245,158,11,0.55);
}
.tally-cta__btn:hover {
    background: linear-gradient(135deg, #D97706, #B45309);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px rgba(245,158,11,0.65);
}
.tally-cta__btn--ghost {
    background: transparent;
    border: 1.5px solid rgba(255,255,255,0.55);
    color: #fff;
}
.tally-cta__btn--ghost:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

@media (max-width: 900px) {
    .tally-row { grid-template-columns: 1fr; gap: 28px; }
    .tally-row--reverse > :first-child { order: 0; }
    .tally-pricing { grid-template-columns: 1fr; }
}

/* ========================================================================
   ERP ON CLOUD — .erpc-*
   Theme: Indigo (#1E3A8A) → Violet (#6366F1). Enterprise architecture feel.
   ======================================================================== */
.erpc-section { padding: 70px 0; background: #fff; }
.erpc-section--slate { background: linear-gradient(180deg, #f5f6fb, #fff); }
.erpc-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    background: rgba(99,102,241,0.10); color: #4338ca;
}
.erpc-h2 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.15; font-weight: 800; color: #0b1020;
    margin: 14px 0 12px; letter-spacing: -0.01em;
}
.erpc-h3 { font-size: 20px; font-weight: 700; color: #0b1020; margin: 0 0 6px; }
.erpc-lead { font-size: 16px; line-height: 1.7; color: #4b5568; margin: 0; max-width: 720px; }
.erpc-container { max-width: 1200px; margin: 0 auto; padding: 0 22px; }

/* ERP architecture stack diagram */
.erpc-stack {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
    margin-top: 32px;
}
.erpc-stack__col {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 16px;
    padding: 22px; position: relative;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.erpc-stack__col:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -12px rgba(99,102,241,0.20); }
.erpc-stack__num {
    position: absolute; top: -14px; left: 22px;
    width: 36px; height: 36px; border-radius: 10px;
    background: linear-gradient(135deg, #1E3A8A, #6366F1);
    color: #fff; font-weight: 800; display: grid; place-items: center;
    font-size: 15px;
}
.erpc-stack__name { font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #4338ca; margin: 8px 0 4px; }
.erpc-stack__title { font-size: 18px; font-weight: 700; color: #0b1020; margin: 0 0 8px; }
.erpc-stack__desc { font-size: 14px; color: #4b5568; line-height: 1.6; margin: 0; }
.erpc-stack__items { list-style: none; padding: 0; margin: 12px 0 0; }
.erpc-stack__items li {
    padding: 6px 0 6px 20px; position: relative; font-size: 14px; color: #374151;
    border-top: 1px solid #f1f1f8;
}
.erpc-stack__items li:first-child { border-top: 0; }
.erpc-stack__items li::before {
    content: "▸"; position: absolute; left: 0; top: 6px; color: #6366F1; font-weight: 800;
}

/* ERP industry grid */
.erpc-industries { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 32px; }
.erpc-industry {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 14px;
    padding: 20px; text-align: center; transition: all 0.25s ease;
    cursor: default;
}
.erpc-industry:hover {
    background: linear-gradient(135deg, #1E3A8A, #6366F1);
    color: #fff; transform: translateY(-3px);
    box-shadow: 0 16px 30px -10px rgba(99,102,241,0.40);
}
.erpc-industry__icon {
    width: 56px; height: 56px; border-radius: 14px;
    background: rgba(99,102,241,0.10); color: #4338ca;
    display: grid; place-items: center; font-size: 22px;
    margin: 0 auto 10px;
}
.erpc-industry:hover .erpc-industry__icon { background: rgba(255,255,255,0.18); color: #fff; }
.erpc-industry__name { font-size: 15px; font-weight: 700; color: #0b1020; }
.erpc-industry:hover .erpc-industry__name { color: #fff; }

/* ERP process timeline */
.erpc-process { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 36px; position: relative; }
.erpc-process::before {
    content: ""; position: absolute; top: 26px; left: 8%; right: 8%; height: 3px;
    background: linear-gradient(90deg, #1E3A8A, #6366F1); opacity: 0.25; border-radius: 999px;
}
.erpc-step { text-align: center; position: relative; }
.erpc-step__num {
    width: 56px; height: 56px; border-radius: 50%;
    background: linear-gradient(135deg, #1E3A8A, #6366F1);
    color: #fff; font-weight: 800; font-size: 20px;
    display: grid; place-items: center; margin: 0 auto 14px;
    box-shadow: 0 8px 20px -6px rgba(99,102,241,0.40);
    position: relative; z-index: 1;
}
.erpc-step__title { font-size: 16px; font-weight: 700; color: #0b1020; margin: 0 0 6px; }
.erpc-step__desc { font-size: 14px; color: #4b5568; line-height: 1.55; margin: 0; }

.erpc-counter .bc-counter__num { background-image: linear-gradient(90deg, #1E3A8A, #6366F1); }
.erpc-counter:hover { border-color: rgba(99,102,241,0.30); }

.erpc-cta {
    background: linear-gradient(135deg, #1E3A8A, #6366F1);
    color: #fff; border-radius: 20px; padding: 28px 32px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; box-shadow: 0 18px 40px -16px rgba(99,102,241,0.40);
}
.erpc-cta__text h3 { color: #fff; margin: 0 0 4px; font-size: 22px; }
.erpc-cta__text p { color: rgba(255,255,255,0.85); margin: 0; font-size: 15px; }
.erpc-cta__btn {
    background: linear-gradient(135deg, #6366F1, #4F46E5);
    color: #fff;
    box-shadow: 0 8px 18px -6px rgba(79,70,229,0.55);
}
.erpc-cta__btn:hover {
    background: linear-gradient(135deg, #4F46E5, #4338CA);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px rgba(79,70,229,0.65);
}
.erpc-cta__btn--ghost {
    background: transparent;
    border: 1.5px solid rgba(255,255,255,0.55);
    color: #fff;
}
.erpc-cta__btn--ghost:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

@media (max-width: 900px) {
    .erpc-stack { grid-template-columns: 1fr; }
    .erpc-industries { grid-template-columns: repeat(2, 1fr); }
    .erpc-process { grid-template-columns: 1fr; gap: 30px; }
    .erpc-process::before { display: none; }
}

/* ========================================================================
   CLOUD APPLICATION HOSTING — .cah-*
   Theme: Cyan (#0891B2) → Violet (#A855F7). Dev / PaaS feel.
   ======================================================================== */
.cah-section { padding: 70px 0; background: #fff; }
.cah-section--alt { background: linear-gradient(180deg, #f4f7fb, #fff); }
.cah-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    background: linear-gradient(90deg, rgba(8,145,178,0.12), rgba(168,85,247,0.15));
    color: #0e7490;
}
.cah-h2 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.15; font-weight: 800; color: #0b1020;
    margin: 14px 0 12px; letter-spacing: -0.01em;
}
.cah-h3 { font-size: 20px; font-weight: 700; color: #0b1020; margin: 0 0 6px; }
.cah-lead { font-size: 16px; line-height: 1.7; color: #4b5568; margin: 0; max-width: 720px; }
.cah-container { max-width: 1200px; margin: 0 auto; padding: 0 22px; }

/* CAH terminal/code mockup */
.cah-terminal {
    background: #0b1020; border-radius: 14px; padding: 18px 20px;
    box-shadow: 0 22px 50px -18px rgba(8,145,178,0.35);
    font-family: 'Consolas', 'Monaco', monospace;
    border: 1px solid #1f2937;
    color: #d1d5db;
    font-size: 14px; line-height: 1.6;
    overflow-x: auto;
}
.cah-terminal__bar { display: flex; align-items: center; gap: 8px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #1f2937; }
.cah-terminal__dot { width: 12px; height: 12px; border-radius: 50%; }
.cah-terminal__dot--r { background: #ef4444; }
.cah-terminal__dot--y { background: #f59e0b; }
.cah-terminal__dot--g { background: #10b981; }
.cah-terminal__title { color: #6b7280; font-size: 12px; margin-left: 8px; }
.cah-terminal__line { white-space: pre; }
.cah-terminal__line--prompt { color: #22d3ee; }
.cah-terminal__line--ok { color: #10b981; }
.cah-terminal__line--warn { color: #f59e0b; }
.cah-terminal__line--muted { color: #6b7280; }

/* CAH stack tags */
.cah-stack { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 32px; }
.cah-stack__card {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 16px;
    padding: 24px; transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cah-stack__card:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -10px rgba(8,145,178,0.20); }
.cah-stack__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.cah-stack__icon {
    width: 44px; height: 44px; border-radius: 11px;
    background: linear-gradient(135deg, #0891B2, #A855F7);
    color: #fff; display: grid; place-items: center; font-size: 18px;
}
.cah-stack__name { font-size: 17px; font-weight: 700; color: #0b1020; margin: 0; }
.cah-stack__desc { font-size: 14px; color: #4b5568; line-height: 1.6; margin: 0 0 14px; }
.cah-stack__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cah-stack__tag {
    background: rgba(8,145,178,0.08); color: #0e7490;
    padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
}

/* CAH pipeline */
.cah-pipeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 32px; position: relative; }
.cah-pipeline__step {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 12px;
    padding: 18px 14px; text-align: center; position: relative;
}
.cah-pipeline__step::after {
    content: "\f061"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    position: absolute; right: -10px; top: 50%; transform: translateY(-50%);
    color: #A855F7; font-size: 14px; z-index: 1;
}
.cah-pipeline__step:last-child::after { display: none; }
.cah-pipeline__num {
    width: 32px; height: 32px; border-radius: 50%;
    background: linear-gradient(135deg, #0891B2, #A855F7);
    color: #fff; font-weight: 800; font-size: 14px;
    display: grid; place-items: center; margin: 0 auto 8px;
}
.cah-pipeline__label { font-size: 13px; font-weight: 700; color: #0b1020; margin: 0; }
.cah-pipeline__hint { font-size: 11px; color: #6b7280; margin: 2px 0 0; }

.cah-counter .bc-counter__num { background-image: linear-gradient(90deg, #0891B2, #A855F7); }
.cah-counter:hover { border-color: rgba(8,145,178,0.30); }

.cah-cta {
    background: linear-gradient(135deg, #0891B2, #A855F7);
    color: #fff; border-radius: 20px; padding: 28px 32px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; box-shadow: 0 18px 40px -16px rgba(8,145,178,0.40);
}
.cah-cta__text h3 { color: #fff; margin: 0 0 4px; font-size: 22px; }
.cah-cta__text p { color: rgba(255,255,255,0.85); margin: 0; font-size: 15px; }
.cah-cta__btn {
    background: linear-gradient(135deg, #A855F7, #9333EA);
    color: #fff;
    box-shadow: 0 8px 18px -6px rgba(147,51,234,0.55);
}
.cah-cta__btn:hover {
    background: linear-gradient(135deg, #9333EA, #7E22CE);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px rgba(147,51,234,0.65);
}
.cah-cta__btn--ghost {
    background: transparent;
    border: 1.5px solid rgba(255,255,255,0.55);
    color: #fff;
}
.cah-cta__btn--ghost:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

@media (max-width: 900px) {
    .cah-stack { grid-template-columns: 1fr; }
    .cah-pipeline { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .cah-pipeline__step::after { display: none; }
}

/* ========================================================================
   MANAGED CLOUD SERVERS — .mcs-*
   Theme: Teal (#0D9488) → Orange (#F97316). Ops / monitoring feel.
   ======================================================================== */
.mcs-section { padding: 70px 0; background: #fff; }
.mcs-section--alt { background: linear-gradient(180deg, #f4faf9, #fff); }
.mcs-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 14px; border-radius: 999px;
    font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    background: linear-gradient(90deg, rgba(13,148,136,0.12), rgba(249,115,22,0.15));
    color: #0f766e;
}
.mcs-h2 {
    font-size: clamp(28px, 3.2vw, 42px);
    line-height: 1.15; font-weight: 800; color: #0b1020;
    margin: 14px 0 12px; letter-spacing: -0.01em;
}
.mcs-h3 { font-size: 20px; font-weight: 700; color: #0b1020; margin: 0 0 6px; }
.mcs-lead { font-size: 16px; line-height: 1.7; color: #4b5568; margin: 0; max-width: 720px; }
.mcs-container { max-width: 1200px; margin: 0 auto; padding: 0 22px; }

/* MCS monitoring chart mockup */
.mcs-monitor {
    background: #0b1020; border-radius: 16px; padding: 20px;
    box-shadow: 0 22px 50px -18px rgba(13,148,136,0.35);
    color: #d1d5db; font-family: 'Consolas', 'Monaco', monospace;
    font-size: 12px;
}
.mcs-monitor__head {
    display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 12px; border-bottom: 1px solid #1f2937; margin-bottom: 12px;
}
.mcs-monitor__title { color: #fff; font-size: 14px; font-weight: 700; margin: 0; }
.mcs-monitor__status {
    display: flex; align-items: center; gap: 6px; color: #5EEAD4; font-size: 12px; font-weight: 700;
}
.mcs-monitor__status::before {
    content: ""; width: 8px; height: 8px; border-radius: 50%; background: #5EEAD4;
    box-shadow: 0 0 8px #5EEAD4;
}
.mcs-monitor__grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px;
}
.mcs-monitor__metric { background: #111827; border-radius: 10px; padding: 12px; }
.mcs-monitor__metric-label { color: #6b7280; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.mcs-monitor__metric-value { color: #fff; font-size: 20px; font-weight: 800; margin-top: 4px; }
.mcs-monitor__metric-delta { color: #5EEAD4; font-size: 11px; font-weight: 600; }
.mcs-monitor__chart {
    background: linear-gradient(180deg, rgba(13,148,136,0.10), transparent);
    border-radius: 10px; height: 100px; position: relative; padding: 8px;
}
.mcs-monitor__bars { display: flex; align-items: flex-end; gap: 4px; height: 100%; }
.mcs-monitor__bar {
    flex: 1; background: linear-gradient(180deg, #5EEAD4, #0D9488);
    border-radius: 3px 3px 0 0; min-height: 8px;
}

/* MCS server tiers */
.mcs-tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 32px; }
.mcs-tier {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 18px;
    padding: 26px; position: relative; overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mcs-tier:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -10px rgba(13,148,136,0.22); }
.mcs-tier--featured {
    background: linear-gradient(180deg, #0D9488, #115E59);
    color: #fff; border-color: transparent;
    box-shadow: 0 18px 40px -14px rgba(13,148,136,0.45);
}
.mcs-tier__icon {
    width: 48px; height: 48px; border-radius: 12px;
    background: rgba(13,148,136,0.12); color: #0f766e;
    display: grid; place-items: center; font-size: 20px; margin-bottom: 12px;
}
.mcs-tier--featured .mcs-tier__icon { background: rgba(255,255,255,0.15); color: #fff; }
.mcs-tier__name { font-size: 19px; font-weight: 800; color: #0b1020; margin: 0 0 6px; }
.mcs-tier--featured .mcs-tier__name { color: #fff; }
.mcs-tier__price { font-size: 28px; font-weight: 800; color: #0f766e; margin: 0 0 12px; }
.mcs-tier--featured .mcs-tier__price { color: #FB923C; }
.mcs-tier__price small { font-size: 14px; color: #6b7280; font-weight: 600; }
.mcs-tier__specs { list-style: none; padding: 0; margin: 0 0 18px; border-top: 1px solid #eef2f0; padding-top: 14px; }
.mcs-tier--featured .mcs-tier__specs { border-color: rgba(255,255,255,0.15); }
.mcs-tier__specs li {
    padding: 6px 0 6px 24px; position: relative;
    font-size: 14px; color: #4b5568;
}
.mcs-tier--featured .mcs-tier__specs li { color: rgba(255,255,255,0.9); }
.mcs-tier__specs li::before {
    content: "●"; color: #0D9488; position: absolute; left: 6px; top: 6px; font-size: 12px;
}
.mcs-tier--featured .mcs-tier__specs li::before { color: #FB923C; }
.mcs-tier__cta {
    display: block; text-align: center; padding: 12px 20px; border-radius: 10px;
    background: #0D9488; color: #fff; font-weight: 700; text-decoration: none;
    transition: background 0.2s ease;
}
.mcs-tier__cta:hover { background: #115E59; }
.mcs-tier--featured .mcs-tier__cta { background: #F97316; }
.mcs-tier--featured .mcs-tier__cta:hover { background: #ea580c; }

/* MCS compliance badges */
.mcs-badges { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-top: 32px; }
.mcs-badge {
    background: #fff; border: 1px solid #e7eaf0; border-radius: 14px;
    padding: 18px 12px; text-align: center; transition: all 0.25s ease;
}
.mcs-badge:hover {
    background: linear-gradient(135deg, #0D9488, #115E59);
    transform: translateY(-3px); border-color: transparent;
    box-shadow: 0 12px 24px -10px rgba(13,148,136,0.35);
}
.mcs-badge__icon { font-size: 26px; color: #0D9488; margin-bottom: 6px; }
.mcs-badge:hover .mcs-badge__icon { color: #fff; }
.mcs-badge__name { font-size: 13px; font-weight: 700; color: #0b1020; }
.mcs-badge:hover .mcs-badge__name { color: #fff; }

.mcs-counter .bc-counter__num { background-image: linear-gradient(90deg, #0D9488, #F97316); }
.mcs-counter:hover { border-color: rgba(13,148,136,0.30); }

.mcs-cta {
    background: linear-gradient(90deg, #0D9488, #115E59);
    color: #fff; border-radius: 20px; padding: 28px 32px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap; box-shadow: 0 18px 40px -16px rgba(13,148,136,0.40);
}
.mcs-cta__text h3 { color: #fff; margin: 0 0 4px; font-size: 22px; }
.mcs-cta__text p { color: rgba(255,255,255,0.85); margin: 0; font-size: 15px; }
.mcs-cta__btn {
    background: linear-gradient(135deg, #F97316, #EA580C);
    color: #fff;
    box-shadow: 0 8px 18px -6px rgba(249,115,22,0.55);
}
.mcs-cta__btn:hover {
    background: linear-gradient(135deg, #EA580C, #C2410C);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px rgba(249,115,22,0.65);
}
.mcs-cta__btn--ghost {
    background: transparent;
    border: 1.5px solid rgba(255,255,255,0.55);
    color: #fff;
}
.mcs-cta__btn--ghost:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

@media (max-width: 900px) {
    .mcs-tiers { grid-template-columns: 1fr; }
    .mcs-badges { grid-template-columns: repeat(3, 1fr); }
    .mcs-monitor__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .mcs-badges { grid-template-columns: repeat(2, 1fr); }
}