:root{
      --bg: #e8e8f1;
      --muted: #6b7280;
      --card: #f8fafb;
      --accent: #bb2649;
      --glass: rgba(15,23,42,0.03);
      --radius: 14px;
      --maxw: 860px;
      --shadow: 0 8px 30px rgba(12,18,30,0.06);
      --radius-sm: 10px;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    }

    /*{box-sizing: border-box}*/

    .body{
      margin:0;
      background:var(--bg);
      color:#0f172a;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
      /*line-height:1.45;*/
      display:flex;
      justify-content:center;
    }

    .mcontainer{
      width:100%;
      max-width:var(--maxw);
    }

    /* Header */
    .mhero{
      text-align:center;
      max-width:780px;
      margin:0 auto 32px;
      padding:28px 12px;
    }
    .meyebrow{
      display:inline-block;
      background:var(--glass);
      color:var(--muted);
      padding:6px 10px;
      border-radius:999px;
      font-size:13px;
      margin-bottom:12px;
    }
    h1{
      font-size:28px;
      margin:6px 0 8px;
      letter-spacing:-0.02em;
    }
    p.lead{
      color:var(--muted);
      margin:0 auto;
      max-width:640px;
      font-size:15px;
    }

    /* Toggle */
    .toggles-wrap{display:flex;justify-content:center;margin:22px 0 36px}
    .toggles{background:#d6dee6;;border-radius:999px;padding:6px;display:inline-flex;gap:6px;align-items:center}
    .toggles button{background:transparent;border:0;padding:8px 14px;border-radius:999px;cursor:pointer;font-weight:600}
    .toggles button.active{background:white;box-shadow:var(--shadow)}

    /* Pricing grid */
    .mgrid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:20px;
      align-items:start;
      margin-bottom:28px;
    }

    @media (max-width:880px){
      .grid{grid-template-columns:1fr;max-width:520px;margin:0 auto}
      .pro {order:-1} /* pro first on mobile */
    }

    .mcard{
      background:linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,255,255,0.95));
      border-radius:var(--radius);
      padding:26px;
      box-shadow:none;
      border:1px solid rgba(15,23,42,0.04);
      min-height:440px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      transition:transform .18s ease, box-shadow .18s ease;
    }
    /*.card:hover{transform:translateY(-6px); box-shadow:var(--shadow)}*/

    /* Pro highlight */
    .mpro{
      /*transform:translateY(-6px);*/
      border:2px solid rgba(255,106,0,0.12);
      box-shadow:0 18px 40px rgba(255,106,0,0.06);
    }
    .mbadge{
      display:inline-block;
      /*background:linear-gradient(90deg, rgba(255,106,0,0.15), rgba(255,106,0,0.06));*/
      color:var(--accent);
      font-weight:700;
      font-size:12px;
      padding:6px 10px;
      border-radius:999px;
      position:relative;
      top:-6px;
      margin-bottom:10px;
      width:max-content;
    }

    .mplan-title{font-weight:800;letter-spacing:-0.02em;font-size:18px;margin:6px 0}
    .mplan-sub{color:var(--muted);font-size:14px;margin-bottom:16px}
    .mprice{font-weight:800;font-size:28px;margin:8px 0;color:#0f172a}
    .mprice small{font-weight:600;color:var(--muted);font-size:14px;margin-left:6px}
    .mfeatures{margin:18px 0 22px;padding:0;list-style:none;color:var(--muted);gap:10px;display:flex;flex-direction:column}
    .mfeatures li{display:flex;gap:12px;align-items:flex-start;font-size:13px}
    .mfeatures svg{flex:0 0 18px;margin-top:3px; color:var(--accent)}

    .mcta{
      display:inline-block;
      width:100%;
      text-align:center;
      padding:12px 14px;
      border-radius:12px;
      cursor:pointer;
      border:0;
      font-weight:700;
      font-size:15px;
    }
    .mcta.primary{background:var(--accent);color:white;box-shadow:0 8px 24px rgba(255,106,0,0.12)}
    .mcta.ghost{background:#ebecf0;border:1px solid rgba(15,23,42,0.06);color:#0f172a}

    .mmuted-note{font-size:13px;color:var(--muted);margin-top:10px;text-align:center}

    /* Enterprise specifics */
    .menterprise .price{font-size:20px}
    .enterprise .cta{background:#111827;color:white;border-radius:10px}

    /* Logos / trust */
    .mtrust{margin-top:28px;padding:20px;border-radius:12px;background:linear-gradient(180deg,rgba(247,248,250,1), rgba(247,248,250,1));display:flex;flex-direction:column;align-items:center;gap:10px;border:1px solid rgba(15,23,42,0.03)}
    .mtrust .txt{color:var(--muted);font-weight:600;font-size:14px}
    .mlogos{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap;padding-top:6px}
    .mlogos svg{opacity:0.72;filter:grayscale(100%);width:92px;height:30px}

    /* small foot */
    .fmoot{margin-top:12px;color:var(--muted);font-size:13px;text-align:center}

    /* subtle divider */
    .mdivider{height:1px;background:linear-gradient(90deg, rgba(15,23,42,0.03), rgba(15,23,42,0.01));margin:26px 0;border-radius:4px}