:root{
      --bg:#f6f8fb;
      --card:#ffffff;
      --accent:#3b82f6;
      --muted:#6b7280;
      --radius:14px;
      --shadow: 0 8px 30px rgba(29,41,63,0.08);
      --glass: rgba(255,255,255,0.6);
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
      background: linear-gradient(180deg,var(--bg),#eef3fb 60%);
      color:#111827;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
      padding:40px 20px;
    }

    .mh-container{
      max-width:980px;
      margin:0 auto;
    }

    header.mh-header{
      display:flex;
      gap:16px;
      align-items:center;
      margin-bottom:20px;
      position: relative;
    }

    .mh-brand{
      background:linear-gradient(90deg,var(--accent),#06b6d4);
      color:white;
      padding:10px 14px;
      border-radius:12px;
      font-weight:700;
      font-family:'Montserrat', 'Inter', sans-serif;
      letter-spacing:0.3px;
      box-shadow: 0 6px 20px rgba(59,130,246,0.12);
    }

    h1.title{
      font-size:20px;
      margin:0;
      font-weight:700;
    }

    p.lead{color:var(--muted);margin:8px 0 28px}

    .card{
      background:var(--card);
      border-radius:var(--radius);
      padding:18px;
      box-shadow:var(--shadow);
      backdrop-filter: blur(6px) saturate(120%);
    }

    /* Accordion / dropdown styles */
    .mh-accordion{margin-top:12px}
    .mh-acc-item{border-radius:12px;overflow:hidden;margin-bottom:12px;border:1px solid rgba(15,23,42,0.04)}

    .mh-acc-btn{
      all:unset;
      display:flex;
      align-items:center;
      justify-content:space-between;
      width:100%;
      padding:18px;
      cursor:pointer;
      gap:12px;
      background:linear-gradient(180deg, rgba(255,255,255,0.6), rgba(245,247,250,0.6));
      transition:background .25s ease;
    }
    .mh-acc-btn:hover{background:linear-gradient(180deg, rgba(250,250,255,0.9), rgba(245,247,250,0.9));}

    .mh-acc-left{display:flex;gap:12px;align-items:center}
    .mh-acc-ico{
      width:44px;height:44px;border-radius:10px;display:grid;place-items:center;font-weight:700;color:white;background:linear-gradient(180deg,var(--accent),#06b6d4);
      box-shadow:0 6px 18px rgba(59,130,246,0.15);
      font-family:'Montserrat';
    }

    .mh-acc-meta{display:flex;flex-direction:column;align-items:flex-start}
    .mh-acc-title{font-weight:600;font-size:15px}
    .mh-acc-sub{font-size:13px;color:var(--muted)}

    .mh-chevron{
      width:36px;height:36px;border-radius:9px;display:grid;place-items:center;background:rgba(15,23,42,0.03);transition:transform .35s cubic-bezier(.2,.9,.2,1), background .2s
    }
    .mh-chevron svg{width:18px;height:18px;display:block}

    .mh-acc-panel{
      max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.2,.9,.2,1), padding .25s;
      padding:0 18px;
      background:linear-gradient(180deg,#fff,#fbfdff);
    }

    .mh-acc-panel.open{padding:18px;}
    .mh-acc-panel .content{color:#374151;line-height:1.7;font-size:14px}

    /* rotate chevron when open (using attribute) */
    .mh-acc-item[data-open="true"] .mh-chevron{transform:rotate(180deg);background:rgba(59,130,246,0.06)}

    /* subtle collapse animation for panel content */
    .mh-acc-panel .content p{margin:0 0 12px}

    /* small screens */
    @media (max-width:640px){
      body{padding:24px 12px}
      .mh-acc-ico{width:40px;height:40px}
      .mh-acc-btn{padding:14px}
    }

    /* Nice typography for legal text */
    .legal-heading{font-family:'Montserrat', 'Inter';font-weight:700;margin-top:8px}
    .muted-small{color:var(--muted);font-size:13px}

    /* Menu button styles */
    .menu-btn {
      all: unset;
      cursor: pointer;
      width: 36px;
      height: 36px;
      border-radius: 9px;
      display: grid;
      place-items: center;
      background: rgba(15, 23, 42, 0.03);
      transition: background .2s;
    }
    .menu-btn:hover {
      background: rgba(59, 130, 246, 0.06);
    }
    .menu-btn svg {
      width: 18px;
      height: 18px;
      color: var(--muted);
    }

    /* Menu dropdown styles */
    .menu-dropdown {
      position: absolute;
      /* top: 100%; */
      right: 0;
      background: var(--card);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 8px 0;
      min-width: 200px;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-10px);
      transition: opacity .2s, visibility .2s, transform .2s;
      z-index: 1000;
    }
    .menu-dropdown.show {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }
    .menu-item {
      display: block;
      padding: 12px 16px;
      text-decoration: none;
      color: #111827;
      font-weight: 500;
      transition: background .2s;
    }
    .menu-item:hover {
      background: rgba(59, 130, 246, 0.06);
    }
    .menu-item.active {
      background: rgba(59, 130, 246, 0.1);
      color: var(--accent);
    }