:root {
  --final-bg: #020306;
  --final-panel: #0b0d12;
  --final-line: rgba(255,255,255,.10);
  --final-muted: #8d94a0;
  --final-ease: cubic-bezier(.23,1,.32,1);
}

html { scroll-behavior: smooth; }

body.m2-final-active {
  min-height: 100vh;
  margin: 0;
  padding: 0 24px 96px;
  color: #fff;
  background:
    radial-gradient(ellipse 46% 18% at 50% 54%, rgba(105,112,213,.14), transparent 74%),
    radial-gradient(ellipse 70% 16% at 50% 62%, rgba(49,72,124,.14), transparent 78%),
    #000 !important;
}

.m2-final-navigation {
  position: fixed;
  inset: 0 0 auto;
  z-index: 10050;
  height: 68px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.82);
  backdrop-filter: blur(18px);
}

.m2-final-navigation nav {
  position: relative;
  width: min(1240px, calc(100% - 48px));
  height: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.m2-final-logo {
  color: #fff;
  font: 900 19px/1 Montserrat, Inter, sans-serif;
  letter-spacing: -1px;
  text-decoration: none;
}

.m2-final-links {
  position: absolute;
  left: 50%;
  display: flex;
  gap: 34px;
  transform: translateX(-50%);
}

.m2-final-links a {
  color: rgba(255,255,255,.5);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: color 180ms ease;
}

.m2-final-open,
.m2-final-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 8px;
  color: #050608;
  background: linear-gradient(180deg,#fff,#f7f7f8 58%,#cfd2da);
  box-shadow: 0 12px 28px -16px rgba(255,255,255,.7);
  font-weight: 800;
  text-decoration: none;
  transition: transform 140ms var(--final-ease), box-shadow 180ms ease;
}

.m2-final-open { min-height: 38px; padding: 0 16px; font-size: 12px; }

.m2-final-hero {
  width: min(940px, 100%);
  margin: auto;
  padding: 132px 24px 58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  animation: final-enter 600ms var(--final-ease) both;
}

.m2-final-badge {
  min-height: 34px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: #9299a6;
  background: rgba(255,255,255,.04);
  font-size: 11px;
}

.m2-final-hero h1 {
  margin: 28px 0 18px;
  color: #fff;
  background: linear-gradient(180deg,#fff 0%,#fff 45%,rgba(255,255,255,.52) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font: 600 clamp(42px,5.2vw,70px)/1.02 Montserrat,Inter,sans-serif;
  letter-spacing: -.055em;
}

.m2-final-hero p {
  margin: 0 0 30px;
  color: var(--final-muted);
  font-size: clamp(13px,1.2vw,16px);
  line-height: 1.65;
}

.m2-final-cta { min-height: 48px; padding: 0 28px; font-size: 13px; }
.m2-final-open:active,.m2-final-cta:active { transform: scale(.97); }

#root.m2-final-dashboard {
  position: relative;
  z-index: 3;
  width: min(1480px,100%);
  min-height: 760px;
  margin: 0 auto;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 14px;
  background: #07090d;
  box-shadow: 0 38px 120px rgba(0,0,0,.72),0 -32px 110px rgba(105,112,213,.12);
  overflow: hidden;
  animation: final-dashboard-enter 700ms var(--final-ease) 90ms both;
}

#root.m2-final-dashboard .app-shell { position: relative; min-height: 760px; background: #07090d !important; }
#root.m2-final-dashboard .sidebar { position: absolute !important; min-height: 760px; border-radius: 13px 0 0 13px; }
#root.m2-final-dashboard .content { min-height: 760px !important; background: #07090d !important; }

body.m2-final-active > .m2-delivery-sidebar-toggle {
  position: absolute !important;
  top: 525px !important;
  left: max(calc((100vw - 1480px)/2 + 258px),258px) !important;
}

@media (hover:hover) and (pointer:fine) {
  .m2-final-links a:hover { color: #fff; }
  .m2-final-open:hover,.m2-final-cta:hover { transform: translateY(-1px); box-shadow: 0 14px 34px -14px rgba(255,255,255,.82); }
}

@keyframes final-enter { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@keyframes final-dashboard-enter { from { opacity:0; transform:translateY(16px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }

@media (max-width:980px) {
  body.m2-final-active { padding-inline:12px; }
  .m2-final-links { display:none; }
  .m2-final-hero { padding-top:116px; }
  #root.m2-final-dashboard { min-height:0; }
  #root.m2-final-dashboard .app-shell { min-height:0; }
  #root.m2-final-dashboard .sidebar { position:relative !important; min-height:0; border-radius:13px 13px 0 0; }
  body.m2-final-active > .m2-delivery-sidebar-toggle { display:none !important; }
}

@media (max-width:620px) {
  .m2-final-navigation nav { width:calc(100% - 28px); }
  .m2-final-hero { padding:108px 0 42px; }
  .m2-final-hero h1 { font-size:40px; }
  .m2-final-hero p br { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .m2-final-hero,#root.m2-final-dashboard { animation:final-fade 200ms ease both; }
}

@keyframes final-fade { from { opacity:0; } to { opacity:1; } }
