/* ===== MEETINGS – GREEN COLLABORATIVE THEME ===== */

    .mt-hero {
      background: #020c04;
      min-height: 100vh;
      padding: 120px 0 80px;
      position: relative;
      overflow: hidden;
    }
    .mt-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 50% 60% at 25% 35%, rgba(34,197,94,.1) 0%, transparent 70%),
        radial-gradient(ellipse 40% 45% at 80% 55%, rgba(74,222,128,.07) 0%, transparent 60%);
    }
    .mt-hero-inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 4rem;
      align-items: center;
      position: relative;
      z-index: 1;
    }
    .mt-badge {
      display: inline-flex; align-items: center; gap: .5rem;
      background: rgba(34,197,94,.12);
      border: 1px solid rgba(34,197,94,.25);
      color: #4ade80;
      border-radius: 99px;
      padding: .4rem 1rem;
      font-size: .8rem; font-weight: 700; letter-spacing: .04em;
      margin-bottom: 1.5rem;
    }
    .mt-title { font-size: clamp(2rem, 3.8vw, 3rem); font-weight: 800; color: #fff; line-height: 1.1; margin-bottom: 1.25rem; }
    .mt-grad { background: linear-gradient(135deg, #4ade80, #22c55e, #86efac); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .mt-sub { font-size: 1.05rem; color: rgba(255,255,255,.6); line-height: 1.7; margin-bottom: 2rem; }
    .mt-cta-row { display: flex; gap: 1rem; flex-wrap: wrap; }
    .mt-btn-p {
      background: linear-gradient(135deg, #22c55e, #16a34a);
      color: #fff; border: none; border-radius: 10px;
      padding: .85rem 2rem; font-size: .95rem; font-weight: 700;
      text-decoration: none; display: inline-block;
      box-shadow: 0 0 30px rgba(34,197,94,.3);
    }
    .mt-btn-g {
      background: rgba(255,255,255,.07);
      color: rgba(255,255,255,.85);
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 10px; padding: .85rem 2rem;
      font-size: .95rem; font-weight: 600;
      text-decoration: none; display: inline-block;
      transition: background .2s, border-color .2s;
    }
    .mt-btn-g:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.4); }

    /* Meeting mockup card */
    .mt-mockup {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(34,197,94,.15);
      border-radius: 20px;
      overflow: hidden;
    }
    .mt-mockup-bar {
      background: linear-gradient(135deg, #16a34a, #22c55e);
      padding: .7rem 1.25rem;
      display: flex; align-items: center; gap: .75rem;
    }
    .mt-mockup-dots { display: flex; gap: .35rem; }
    .mt-mockup-dot { width: 10px; height: 10px; border-radius: 50%; }
    .mt-mockup-title { flex: 1; text-align: center; font-size: .75rem; font-weight: 600; color: rgba(255,255,255,.85); }
    .mt-mockup-body { padding: 1.25rem; display: flex; flex-direction: column; gap: .85rem; }
    .mt-meeting-item {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.07);
      border-radius: 12px;
      padding: 1rem;
      display: flex; align-items: center; gap: .85rem;
      transition: border-color .2s;
    }
    .mt-meeting-item:hover { border-color: rgba(34,197,94,.3); }
    .mt-mi-time {
      background: rgba(34,197,94,.15);
      border: 1px solid rgba(34,197,94,.25);
      border-radius: 10px;
      padding: .5rem .6rem;
      text-align: center;
      min-width: 52px;
      flex-shrink: 0;
    }
    .mt-mi-time-h { font-size: .9rem; font-weight: 800; color: #4ade80; display: block; }
    .mt-mi-time-m { font-size: .55rem; color: rgba(74,222,128,.6); }
    .mt-mi-info { flex: 1; min-width: 0; }
    .mt-mi-name { font-size: .82rem; font-weight: 700; color: #fff; margin-bottom: .2rem; }
    .mt-mi-meta { font-size: .68rem; color: rgba(255,255,255,.4); display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
    .mt-mi-avatars { display: flex; margin-left: auto; }
    .mt-mi-avatar {
      width: 26px; height: 26px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: .55rem; font-weight: 700; color: #fff;
      border: 2px solid #0f1a10;
      margin-left: -6px;
    }
    .mt-mi-avatar:first-child { margin-left: 0; }
    .mt-rsvp-row { display: flex; gap: .4rem; margin-top: .5rem; }
    .mt-rsvp-tag {
      font-size: .6rem; font-weight: 700; border-radius: 6px;
      padding: .15rem .45rem;
    }
    .mt-rsvp-yes { background: rgba(34,197,94,.15); color: #4ade80; }
    .mt-rsvp-no { background: rgba(239,68,68,.15); color: #f87171; }
    .mt-rsvp-maybe { background: rgba(245,158,11,.15); color: #fbbf24; }
    .mt-rsvp-pending { background: rgba(148,163,184,.15); color: #94a3b8; }
    .mt-mi-recurring {
      font-size: .55rem; font-weight: 700; color: #86efac;
      background: rgba(134,239,172,.1);
      border-radius: 4px;
      padding: .1rem .35rem;
    }

    /* Stats strip */
    .mt-stats { background: #081a0c; border-top: 1px solid rgba(34,197,94,.1); border-bottom: 1px solid rgba(34,197,94,.1); padding: 2.5rem 0; }
    .mt-stats-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; text-align: center; }
    .mt-stat-num { font-size: 2.4rem; font-weight: 800; background: linear-gradient(135deg,#4ade80,#22c55e); -webkit-background-clip:text; -webkit-text-fill-color:transparent; display: block; margin-bottom: .25rem; }
    .mt-stat-lbl { font-size: .83rem; color: rgba(255,255,255,.5); }

    /* Features section */
    .mt-features { padding: 6rem 0; background: #f8faf9; }
    .mt-sec-label { display: block; text-align: center; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #22c55e; margin-bottom: .75rem; }
    .mt-sec-title { text-align: center; font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: #0f172a; margin-bottom: .5rem; }
    .mt-sec-sub { text-align: center; color: #64748b; max-width: 560px; margin: 0 auto 3.5rem; font-size: .95rem; line-height: 1.7; }
    .mt-feat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .mt-feat-card {
      background: #fff;
      border-radius: 20px;
      padding: 1.75rem;
      border: 1px solid #e2e8f0;
      transition: all .25s;
    }
    .mt-feat-card:hover { transform: translateY(-3px); box-shadow: 0 10px 40px rgba(34,197,94,.1); border-color: rgba(34,197,94,.25); }
    .mt-feat-icon {
      width: 52px; height: 52px; border-radius: 14px;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: .85rem;
    }
    .mt-feat-card h3 { font-size: 1rem; font-weight: 800; color: #0f172a; margin-bottom: .35rem; }
    .mt-feat-card p { font-size: .83rem; color: #64748b; line-height: 1.6; }
    .mt-fi-green { background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.15); }
    .mt-fi-teal { background: rgba(20,184,166,.1); border: 1px solid rgba(20,184,166,.15); }
    .mt-fi-blue { background: rgba(59,130,246,.1); border: 1px solid rgba(59,130,246,.15); }
    .mt-fi-violet { background: rgba(139,92,246,.1); border: 1px solid rgba(139,92,246,.15); }
    .mt-fi-amber { background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.15); }
    .mt-fi-pink { background: rgba(236,72,153,.1); border: 1px solid rgba(236,72,153,.15); }

    /* How-it-works (dark) */
    .mt-steps { padding: 6rem 0; background: #020c04; }
    .mt-steps-title { text-align: center; color: #fff; font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; margin-bottom: .5rem; }
    .mt-steps-sub { text-align: center; color: rgba(255,255,255,.5); max-width: 560px; margin: 0 auto 3.5rem; font-size: .95rem; }
    .mt-steps-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
    .mt-step {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(34,197,94,.15);
      border-radius: 20px;
      padding: 2rem;
      position: relative;
      overflow: hidden;
    }
    .mt-step-num { position: absolute; top: -8px; right: 1rem; font-size: 5rem; font-weight: 900; color: rgba(34,197,94,.07); line-height: 1; }
    .mt-step-icon {
      width: 52px; height: 52px; border-radius: 14px;
      background: rgba(34,197,94,.15); border: 1px solid rgba(34,197,94,.3);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 1.25rem;
      position: relative; z-index: 1;
    }
    .mt-step h3 { font-size: 1rem; font-weight: 700; color: #fff; margin-bottom: .4rem; position: relative; z-index: 1; }
    .mt-step p { font-size: .83rem; color: rgba(255,255,255,.5); line-height: 1.6; position: relative; z-index: 1; }

    /* Notification types */
    .mt-notifs { padding: 6rem 0; background: #f8faf9; }
    .mt-notif-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
    .mt-notif-left h2 { font-size: clamp(1.7rem, 2.5vw, 2.2rem); font-weight: 800; color: #0f172a; margin-bottom: 1rem; }
    .mt-notif-left p { font-size: .95rem; color: #64748b; line-height: 1.7; margin-bottom: 2rem; }
    .mt-notif-list { display: flex; flex-direction: column; gap: .65rem; }
    .mt-notif-item {
      display: flex; align-items: center; gap: .85rem;
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 12px;
      padding: .85rem 1rem;
      transition: all .2s;
    }
    .mt-notif-item:hover { border-color: rgba(34,197,94,.3); box-shadow: 0 4px 16px rgba(34,197,94,.08); }
    .mt-notif-icon {
      width: 38px; height: 38px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .mt-notif-text h4 { font-size: .82rem; font-weight: 700; color: #0f172a; margin-bottom: .1rem; }
    .mt-notif-text p { font-size: .73rem; color: #64748b; line-height: 1.4; margin: 0; }
    .mt-notif-right {
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 20px;
      padding: 2rem;
    }
    .mt-phone-frame {
      background: #0f172a;
      border-radius: 24px;
      padding: 1.5rem 1rem;
      max-width: 280px;
      margin: 0 auto;
    }
    .mt-phone-notch { width: 80px; height: 6px; background: rgba(255,255,255,.1); border-radius: 99px; margin: 0 auto 1.25rem; }
    .mt-phone-notif {
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 14px;
      padding: .85rem;
      margin-bottom: .65rem;
      display: flex; align-items: flex-start; gap: .65rem;
    }
    .mt-pn-icon { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .mt-pn-text { flex: 1; }
    .mt-pn-title { font-size: .7rem; font-weight: 700; color: #fff; margin-bottom: .15rem; }
    .mt-pn-desc { font-size: .6rem; color: rgba(255,255,255,.45); line-height: 1.4; }
    .mt-pn-time { font-size: .55rem; color: rgba(255,255,255,.25); margin-top: .2rem; }

    /* CTA */
    .mt-cta { padding: 6rem 0; background: linear-gradient(135deg, #020c04, #0a1f0e); }
    .mt-cta-inner { text-align: center; }
    .mt-cta-inner h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: #fff; margin-bottom: .75rem; }
    .mt-cta-inner p { color: rgba(255,255,255,.55); margin-bottom: 2rem; font-size: 1.05rem; }
    .mt-cta-btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
    .mt-cta-w { background: linear-gradient(135deg, #22c55e, #16a34a); color: #fff; border-radius: 10px; padding: .85rem 2rem; font-weight: 700; text-decoration: none; box-shadow: 0 4px 24px rgba(34,197,94,.3); }
    .mt-cta-o { background: rgba(255,255,255,.07); color: rgba(255,255,255,.8); border: 1px solid rgba(255,255,255,.2); border-radius: 10px; padding: .85rem 2rem; font-weight: 600; text-decoration: none; transition: all .2s; }
    .mt-cta-o:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.35); }

    @media (max-width:900px) {
      .mt-hero-inner { grid-template-columns: 1fr; gap: 3rem; }
      .mt-stats-row { grid-template-columns: 1fr 1fr; }
      .mt-feat-grid { grid-template-columns: 1fr 1fr; }
      .mt-steps-row { grid-template-columns: 1fr; }
      .mt-notif-grid { grid-template-columns: 1fr; }
    }
    @media (max-width:600px) {
      .mt-feat-grid { grid-template-columns: 1fr; }
      .mt-stats-row { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 768px) { footer .container > div:first-child { grid-template-columns: 1fr !important; } }