.commercial-home-route {
  background: #060b13;
}

.commercial-home-route .app-shell {
  display: block;
  min-height: 100vh;
}

.commercial-home-route .app-shell > .topbar,
.commercial-home-route .app-shell > .sidebar {
  display: none;
}

.commercial-home-route .main-view {
  min-height: 100vh;
  max-width: none;
  padding: 0;
  overflow: visible;
}

.commercial-home {
  --home-bg: #060b13;
  --home-bg-soft: #0a111c;
  --home-panel: #0d1521;
  --home-line: rgba(150, 169, 198, .16);
  --home-text: #f5f7fb;
  --home-muted: #9ca9bb;
  --home-primary: #6f5cff;
  --home-cyan: #2ed1c3;
  --home-orange: #ff9a52;
  min-height: 100vh;
  color: var(--home-text);
  background: var(--home-bg);
  letter-spacing: 0;
}

.commercial-home * {
  box-sizing: border-box;
}

.home-container {
  width: min(1240px, calc(100% - 56px));
  margin: 0 auto;
}

.home-header {
  position: sticky;
  top: 0;
  z-index: 35;
  height: 74px;
  border-bottom: 1px solid var(--home-line);
  background: rgba(5, 9, 15, .88);
  backdrop-filter: blur(18px);
}

.home-header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 28px;
}

.home-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 0;
  color: var(--home-text);
  background: transparent;
  text-align: left;
}

.home-brand-mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, #6b5cff, #8c59ff);
  box-shadow: 0 0 28px rgba(111, 92, 255, .42);
  font-weight: 900;
}

.home-brand-copy strong,
.home-brand-copy span {
  display: block;
}

.home-brand-copy strong {
  font-size: 17px;
}

.home-brand-copy span {
  margin-top: 3px;
  color: #7f8b9c;
  font-size: 11px;
}

.home-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.home-nav button {
  height: 38px;
  padding: 0 13px;
  border-radius: 6px;
  color: #aab5c4;
  background: transparent;
}

.home-nav button:hover {
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

.home-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.home-btn {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 17px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 6px;
  color: #fff;
  background: rgba(255, 255, 255, .055);
  text-decoration: none;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.home-btn:hover {
  border-color: rgba(255, 255, 255, .32);
  background: rgba(255, 255, 255, .1);
  transform: translateY(-1px);
}

.home-btn.primary {
  border-color: var(--home-primary);
  background: var(--home-primary);
  box-shadow: 0 12px 30px rgba(86, 71, 255, .28);
}

.home-btn.orange {
  border-color: #ff984f;
  background: #ff984f;
  color: #11151b;
  font-weight: 800;
}

.home-hero {
  position: relative;
  min-height: 650px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--home-line);
}

.home-hero-media,
.home-hero-media::after {
  position: absolute;
  inset: 0;
}

.home-hero-media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% center;
}

.home-hero-media::after {
  content: '';
  background:
    linear-gradient(90deg, #060b13 0%, rgba(6, 11, 19, .96) 30%, rgba(6, 11, 19, .56) 58%, rgba(6, 11, 19, .2) 100%),
    linear-gradient(0deg, rgba(6, 11, 19, .45), transparent 40%);
}

.home-hero-inner {
  position: relative;
  z-index: 2;
  padding: 88px 0 104px;
}

.home-eyebrow,
.home-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #d8deea;
  font-size: 13px;
  font-weight: 700;
}

.home-eyebrow::before {
  content: '';
  width: 30px;
  height: 2px;
  background: var(--home-primary);
}

.home-hero h1 {
  max-width: 760px;
  margin: 24px 0 20px;
  font-size: clamp(48px, 5.4vw, 76px);
  line-height: 1.04;
  letter-spacing: 0;
}

.home-hero-lead {
  max-width: 720px;
  margin: 0;
  color: #c2cad6;
  font-size: 20px;
  line-height: 1.75;
}

.home-hero-lead strong {
  color: #fff;
}

.home-hero-actions {
  display: flex;
  gap: 12px;
  margin-top: 30px;
}

.home-hero-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  margin-top: 27px;
  color: #a7b2c2;
  font-size: 13px;
}

.home-hero-trust span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.home-hero-trust i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--home-cyan);
  box-shadow: 0 0 12px rgba(46, 209, 195, .6);
}

.home-hero-caption {
  position: absolute;
  z-index: 2;
  right: max(28px, calc((100vw - 1240px) / 2));
  bottom: 66px;
  width: min(330px, 30vw);
  padding-left: 16px;
  border-left: 2px solid var(--home-orange);
  color: #ecf0f6;
  font-size: 13px;
  line-height: 1.7;
}

.home-outcomes {
  border-bottom: 1px solid var(--home-line);
  background: #07101a;
}

.home-outcome-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-outcome {
  min-height: 205px;
  padding: 42px 34px;
  border-right: 1px solid var(--home-line);
}

.home-outcome:first-child {
  border-left: 1px solid var(--home-line);
}

.home-outcome-no {
  color: #897bff;
  font-size: 12px;
  font-weight: 800;
}

.home-outcome:nth-child(2) .home-outcome-no { color: var(--home-cyan); }
.home-outcome:nth-child(3) .home-outcome-no { color: var(--home-orange); }

.home-outcome h2 {
  margin: 18px 0 10px;
  font-size: 25px;
}

.home-outcome p,
.home-section-head > p,
.home-campaign-copy > p,
.home-matrix-copy > p,
.home-cta p {
  margin: 0;
  color: var(--home-muted);
  line-height: 1.75;
}

.home-section {
  padding: 96px 0;
}

.home-section.alt {
  background: #090f18;
}

.home-section-head {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr);
  gap: 54px;
  align-items: end;
  margin-bottom: 36px;
}

.home-section-kicker {
  color: var(--home-cyan);
}

.home-section h2 {
  margin: 12px 0 0;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.15;
}

.home-campaign-layout,
.home-matrix-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(520px, 1.1fr);
  gap: 70px;
  align-items: center;
}

.home-campaign-copy h3,
.home-matrix-copy h3 {
  margin: 16px 0 18px;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.16;
}

.home-feature-list {
  display: grid;
  gap: 12px;
  margin-top: 30px;
}

.home-feature-item {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  padding: 15px 0;
  border-top: 1px solid var(--home-line);
}

.home-feature-index {
  color: #8f82ff;
  font-size: 13px;
  font-weight: 900;
}

.home-feature-item strong,
.home-feature-item span {
  display: block;
}

.home-feature-item span {
  margin-top: 5px;
  color: var(--home-muted);
  font-size: 13px;
  line-height: 1.65;
}

.home-plan-panel,
.home-matrix-board {
  overflow: hidden;
  border: 1px solid var(--home-line);
  border-radius: 8px;
  background: var(--home-panel);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .28);
}

.home-plan-head,
.home-matrix-head {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 22px;
  border-bottom: 1px solid var(--home-line);
}

.home-status,
.home-ready {
  padding: 6px 10px;
  border-radius: 999px;
  color: #8fe4ba;
  background: rgba(72, 199, 142, .12);
  font-size: 11px;
}

.home-plan-days {
  padding: 7px 22px 18px;
}

.home-plan-day {
  min-height: 72px;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 76px;
  gap: 14px;
  align-items: center;
  border-bottom: 1px solid rgba(150, 169, 198, .1);
}

.home-plan-day:last-child { border-bottom: 0; }
.home-day-label { color: #8190a4; font-size: 12px; }
.home-day-copy strong,
.home-day-copy span { display: block; }
.home-day-copy strong { font-size: 14px; }
.home-day-copy span { margin-top: 4px; color: var(--home-muted); font-size: 12px; }
.home-day-type { color: #99a7b9; font-size: 11px; text-align: right; }

.home-case-grid {
  display: grid;
  grid-template-columns: 1.35fr .9fr .9fr;
  grid-auto-rows: 236px;
  gap: 14px;
}

.home-case-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--home-line);
  border-radius: 8px;
  background: #0b111a;
}

.home-case-card.large { grid-row: span 2; }

.home-case-card > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 260ms ease;
}

.home-case-card:hover > img { transform: scale(1.025); }

.home-case-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(3, 7, 12, .94) 0%, rgba(3, 7, 12, .12) 72%);
}

.home-case-tag {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 16px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 999px;
  color: #fff;
  background: rgba(3, 7, 12, .48);
  font-size: 11px;
}

.home-case-copy {
  position: absolute;
  z-index: 2;
  left: 17px;
  right: 17px;
  bottom: 17px;
}

.home-case-copy h3 {
  margin: 0;
  font-size: 22px;
}

.home-case-card.large .home-case-copy h3 { font-size: 31px; }

.home-case-copy p {
  margin: 7px 0 12px;
  color: #b9c3d1;
  font-size: 12px;
  line-height: 1.55;
}

.home-case-button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 5px;
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

.home-case-button:hover {
  border-color: var(--home-primary);
  background: var(--home-primary);
}

.home-matrix-layout {
  grid-template-columns: minmax(520px, 1.1fr) minmax(0, .9fr);
}

.home-account-row {
  min-height: 72px;
  display: grid;
  grid-template-columns: 44px 120px minmax(0, 1fr) 68px;
  gap: 14px;
  align-items: center;
  padding: 0 20px;
  border-bottom: 1px solid rgba(150, 169, 198, .1);
}

.home-account-row:last-child { border-bottom: 0; }

.home-avatar {
  width: 38px;
  height: 38px;
  overflow: hidden;
  border-radius: 50%;
  background: #151d28;
}

.home-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-account-name strong,
.home-account-name span { display: block; }
.home-account-name strong { font-size: 13px; }
.home-account-name span { margin-top: 3px; color: var(--home-muted); font-size: 10px; }
.home-account-topic { color: #d4dbe6; font-size: 12px; }

.home-metric-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 28px;
}

.home-metric {
  padding: 16px;
  border: 1px solid var(--home-line);
  border-radius: 6px;
  background: rgba(255, 255, 255, .02);
}

.home-metric strong,
.home-metric span { display: block; }
.home-metric strong { font-size: 22px; }
.home-metric span { margin-top: 5px; color: var(--home-muted); font-size: 11px; }

.home-workflow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--home-line);
  border-radius: 8px;
  overflow: hidden;
}

.home-workflow-step {
  min-height: 215px;
  padding: 27px;
  border-right: 1px solid var(--home-line);
  background: #0c141f;
}

.home-workflow-step:last-child { border-right: 0; }

.home-workflow-step b {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  margin-bottom: 28px;
  border-radius: 6px;
  color: #9e92ff;
  background: rgba(111, 92, 255, .15);
}

.home-workflow-step:nth-child(2) b { color: #75e4da; background: rgba(46, 209, 195, .14); }
.home-workflow-step:nth-child(3) b { color: #ffc094; background: rgba(255, 154, 82, .14); }
.home-workflow-step:nth-child(4) b { color: #8ee4b9; background: rgba(72, 199, 142, .14); }
.home-workflow-step h3 { margin: 0 0 10px; font-size: 18px; }
.home-workflow-step p { margin: 0; color: var(--home-muted); font-size: 13px; line-height: 1.72; }

.home-cta {
  position: relative;
  min-height: 390px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.home-cta > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-cta::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 10, 17, .97) 0%, rgba(5, 10, 17, .72) 55%, rgba(5, 10, 17, .28) 100%);
}

.home-cta-inner {
  position: relative;
  z-index: 2;
  padding: 72px 0;
}

.home-cta h2 {
  max-width: 760px;
  margin: 14px 0 16px;
  font-size: clamp(38px, 4.6vw, 58px);
  line-height: 1.12;
}

.home-cta p {
  max-width: 680px;
  margin-bottom: 26px;
}

.home-footer {
  border-top: 1px solid var(--home-line);
  background: #050910;
}

.home-footer-inner {
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  color: #738095;
  font-size: 12px;
}

@media (max-width: 1080px) {
  .home-nav { display: none; }
  .home-campaign-layout,
  .home-matrix-layout { grid-template-columns: 1fr; gap: 42px; }
  .home-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-case-card.large { grid-row: span 1; }
  .home-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-workflow-step:nth-child(2) { border-right: 0; }
  .home-workflow-step:nth-child(-n+2) { border-bottom: 1px solid var(--home-line); }
}

@media (max-width: 720px) {
  .home-container { width: min(100% - 28px, 1240px); }
  .home-header { height: 64px; }
  .home-brand-copy span,
  .home-header-actions .home-btn:not(.primary) { display: none; }
  .home-header-actions { margin-left: auto; }
  .home-header-actions .home-btn { min-height: 38px; padding: 0 12px; font-size: 13px; }
  .home-hero { min-height: 680px; align-items: end; }
  .home-hero-media video { object-position: 62% center; }
  .home-hero-media::after {
    background: linear-gradient(0deg, rgba(5, 9, 15, .99) 0%, rgba(5, 9, 15, .8) 62%, rgba(5, 9, 15, .2) 100%);
  }
  .home-hero-inner { padding: 210px 0 52px; }
  .home-hero h1 { margin-top: 18px; font-size: 42px; }
  .home-hero-lead { font-size: 16px; }
  .home-hero-actions { display: grid; }
  .home-hero-caption { display: none; }
  .home-outcome-grid,
  .home-case-grid,
  .home-workflow,
  .home-metric-row { grid-template-columns: 1fr; }
  .home-outcome { min-height: auto; padding: 28px 18px; border-left: 1px solid var(--home-line); }
  .home-section { padding: 66px 0; }
  .home-section-head { grid-template-columns: 1fr; gap: 18px; }
  .home-section h2,
  .home-campaign-copy h3,
  .home-matrix-copy h3 { font-size: 34px; }
  .home-case-grid { grid-auto-rows: 270px; }
  .home-account-row { grid-template-columns: 40px 108px minmax(0, 1fr); padding: 0 12px; }
  .home-ready { display: none; }
  .home-workflow-step { border-right: 0; border-bottom: 1px solid var(--home-line); }
  .home-workflow-step:last-child { border-bottom: 0; }
  .home-footer-inner { min-height: 92px; flex-direction: column; justify-content: center; text-align: center; }
}