@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --mst-ink:#121826;
  --mst-violet:#5b21b6;
  --mst-fuchsia:#d946ef;
  --mst-sky:#0ea5e9;
  --mst-mint:#2dd4bf;
  --mst-paper:#f1f5f9;
  --mst-muted:#64748b;
  --mst-glass:rgba(241,245,249,.78);
  --mst-glow:0 12px 40px rgba(91,33,182,.18);
  --mst-r:20px;
  --mst-nav:62px;
  --mst-dl:0px;
}

html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:'Outfit','Noto Sans SC',system-ui,sans-serif;
  background:var(--mst-paper);
  color:var(--mst-ink);
  line-height:1.78;
  overflow-x:hidden;
}
body.mst-dl-on{padding-top:calc(var(--mst-nav) + var(--mst-dl))}
a{color:var(--mst-violet);text-decoration:none;transition:color .22s}
a:hover{color:var(--mst-fuchsia)}

.mst-head{
  position:fixed;top:0;left:0;right:0;z-index:1100;
  height:var(--mst-nav);
  background:var(--mst-glass);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(18,24,38,.07);
}
.mst-head.mst-shadow{box-shadow:var(--mst-glow)}
.mst-head-row{
  max-width:1180px;margin:0 auto;padding:0 18px;
  height:100%;display:flex;align-items:center;justify-content:space-between;
}
.mst-logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.02rem;color:var(--mst-ink)}
.mst-logo img{width:36px;height:36px;border-radius:11px;object-fit:cover}
.mst-nav-desk{display:flex;gap:26px;list-style:none}
.mst-nav-desk a{color:var(--mst-muted);font-weight:500;font-size:.93rem}
.mst-nav-desk a:hover,.mst-nav-desk a.mst-on{color:var(--mst-violet)}
.mst-ham{
  display:none;background:none;border:none;cursor:pointer;
  width:42px;height:42px;flex-direction:column;justify-content:center;align-items:center;gap:5px;
}
.mst-ham i{display:block;width:22px;height:2px;background:var(--mst-ink);border-radius:2px;transition:.28s}
.mst-ham.mst-open i:nth-child(1){transform:rotate(42deg) translate(5px,5px)}
.mst-ham.mst-open i:nth-child(2){opacity:0}
.mst-ham.mst-open i:nth-child(3){transform:rotate(-42deg) translate(5px,-5px)}
.mst-nav-mob{
  display:none;position:fixed;top:var(--mst-nav);left:0;right:0;
  background:var(--mst-glass);backdrop-filter:blur(20px);
  padding:18px 20px 22px;border-bottom:1px solid rgba(18,24,38,.08);
  z-index:1090;transform:translateY(-130%);transition:transform .32s ease;
}
.mst-nav-mob.mst-show{display:block;transform:translateY(0)}
.mst-nav-mob ul{list-style:none;display:flex;flex-direction:column;gap:14px}
.mst-nav-mob a{font-size:1.02rem;color:var(--mst-ink);font-weight:500;padding:6px 0;display:block}

.mst-dlbar{
  position:fixed;top:var(--mst-nav);left:0;right:0;z-index:1080;
  background:linear-gradient(120deg,rgba(18,24,38,.94),rgba(91,33,182,.88));
  backdrop-filter:blur(14px);padding:9px 14px;
  transform:translateY(-110%);opacity:0;transition:transform .34s,opacity .34s;pointer-events:none;
}
.mst-dlbar.mst-show{transform:translateY(0);opacity:1;pointer-events:auto}
.mst-dlbar-grid{
  max-width:1180px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
}
.mst-dlbar-grid a{
  display:flex;flex-direction:column;align-items:center;
  width:calc(20% - 7px);color:#fff;text-decoration:none;font-size:.68rem;
}
.mst-dlbar-grid img{width:48px;height:48px;border-radius:13px;object-fit:cover;border:2px solid rgba(255,255,255,.22)}
.mst-dlbar-grid span{margin-top:3px;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.mst-promo{padding:calc(var(--mst-nav) + 12px) 16px 0;background:linear-gradient(180deg,#ede9fe 0%,var(--mst-paper) 100%)}
.mst-ads{display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
.mst-ads>div{display:flex;flex-direction:column;align-items:center;width:70px}
.mst-ads img{width:62px;height:62px;border-radius:16px;object-fit:cover;box-shadow:0 5px 16px rgba(18,24,38,.1)}
.mst-ads .mst-cap{font-size:10px;color:var(--mst-muted);margin-top:3px;max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.mst-banner{
  position:relative;padding:48px 20px 56px;overflow:hidden;
  background:radial-gradient(ellipse 80% 60% at 70% 20%,rgba(217,70,239,.22),transparent),
              radial-gradient(ellipse 60% 50% at 10% 80%,rgba(14,165,233,.18),transparent),
              linear-gradient(165deg,#ede9fe 0%,var(--mst-paper) 55%);
}
.mst-banner-inner{max-width:880px;margin:0 auto;text-align:center;position:relative;z-index:2}
.mst-banner h1{
  font-size:clamp(1.55rem,4.5vw,2.35rem);font-weight:700;line-height:1.32;
  background:linear-gradient(135deg,var(--mst-ink),var(--mst-violet));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.mst-lead{margin-top:16px;font-size:1.02rem;color:var(--mst-muted);max-width:720px;margin-left:auto;margin-right:auto}
.mst-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.45;pointer-events:none}
.mst-orb-a{width:220px;height:220px;background:var(--mst-fuchsia);top:-40px;right:8%}
.mst-orb-b{width:180px;height:180px;background:var(--mst-sky);bottom:10px;left:5%}

.mst-wrap{max-width:960px;margin:0 auto;padding:0 18px 60px}
.mst-block{margin-top:44px;animation:mstUp .6s ease both}
.mst-block h2{
  font-size:1.38rem;font-weight:700;margin-bottom:16px;color:var(--mst-ink);
  padding-left:14px;border-left:4px solid var(--mst-fuchsia);
}
.mst-block h3{font-size:1.08rem;font-weight:600;margin:18px 0 10px;color:var(--mst-violet)}
.mst-block p{margin-bottom:14px;color:#334155;text-align:justify}

.mst-split{display:grid;grid-template-columns:1fr;gap:24px;align-items:center;margin-top:20px}
.mst-split.mst-flip .mst-shot{order:2}
.mst-shot img{width:100%;max-width:340px;border-radius:var(--mst-r);box-shadow:var(--mst-glow);display:block;margin:0 auto}
.mst-shot figcaption{font-size:.82rem;color:var(--mst-muted);text-align:center;margin-top:8px}

.mst-tiles{display:grid;grid-template-columns:1fr;gap:16px;margin-top:20px}
.mst-tile{
  background:#fff;border-radius:var(--mst-r);padding:22px 20px;
  border:1px solid rgba(91,33,182,.08);box-shadow:0 4px 20px rgba(18,24,38,.05);
  transition:transform .25s,box-shadow .25s;
}
.mst-tile:hover{transform:translateY(-3px);box-shadow:var(--mst-glow)}
.mst-tile-icon{
  width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--mst-violet),var(--mst-fuchsia));color:#fff;font-size:1.1rem;margin-bottom:12px;
}
.mst-tile h3{margin:0 0 8px;font-size:1rem}

.mst-strip{
  display:flex;flex-wrap:wrap;gap:10px;margin:20px 0;
}
.mst-pill{
  flex:1 1 calc(50% - 10px);min-width:140px;background:linear-gradient(135deg,rgba(91,33,182,.08),rgba(14,165,233,.06));
  border-radius:14px;padding:14px 16px;border:1px solid rgba(91,33,182,.1);
}
.mst-pill strong{display:block;font-size:.88rem;color:var(--mst-violet);margin-bottom:4px}

.mst-cta-wrap{text-align:center;margin:32px 0 12px}
.mst-cta{
  display:inline-block;padding:13px 32px;border-radius:999px;font-weight:600;color:#fff;
  background:linear-gradient(135deg,var(--mst-violet),var(--mst-fuchsia));
  box-shadow:0 8px 24px rgba(91,33,182,.35);transition:transform .2s,box-shadow .2s;
}
.mst-cta:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(217,70,239,.4);color:#fff}

.mst-crumb{
  max-width:960px;margin:calc(var(--mst-nav) + 16px) auto 0;padding:0 18px;
  font-size:.86rem;color:var(--mst-muted);
}
.mst-crumb a{color:var(--mst-violet)}
.mst-crumb span{margin:0 6px}

.mst-subhero{padding:28px 20px 20px;text-align:center;background:linear-gradient(180deg,#ede9fe,var(--mst-paper))}
.mst-subhero h1{font-size:clamp(1.35rem,3.5vw,1.85rem);color:var(--mst-ink)}
.mst-legal .mst-block h2{font-size:1.15rem;border-left-width:3px}
.mst-legal ul,.mst-legal ol{margin:10px 0 14px 22px;color:#334155}
.mst-legal li{margin-bottom:6px}

.mst-foot{
  background:var(--mst-ink);color:rgba(255,255,255,.72);padding:36px 20px 28px;margin-top:40px;
}
.mst-foot-inner{max-width:960px;margin:0 auto;text-align:center}
.mst-foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-bottom:16px}
.mst-foot-nav a{color:rgba(255,255,255,.85);font-size:.9rem}
.mst-foot-nav a:hover{color:var(--mst-mint)}
.mst-copy{font-size:.8rem;opacity:.55}

.mst-err{
  min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:40px 20px;
}
.mst-err h1{font-size:4rem;font-weight:700;background:linear-gradient(135deg,var(--mst-violet),var(--mst-sky));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.mst-err p{margin:12px 0 24px;color:var(--mst-muted);max-width:420px}

@keyframes mstUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

@media(min-width:640px){
  .mst-split{grid-template-columns:1fr 1fr}
  .mst-split.mst-flip .mst-shot{order:2}
  .mst-tiles{grid-template-columns:repeat(2,1fr)}
  .mst-pill{flex:1 1 calc(33.33% - 10px)}
}
@media(min-width:900px){
  .mst-tiles{grid-template-columns:repeat(3,1fr)}
  .mst-dlbar-grid a{width:calc(12.5% - 7px)}
  .mst-dlbar-grid img{width:44px;height:44px}
}
@media(max-width:768px){
  .mst-nav-desk{display:none}
  .mst-ham{display:flex}
}
