:root {
  --nav-h: 96px;
}

.nav { min-height: var(--nav-h); }
.nav-inner { min-height: var(--nav-h); max-width: 1360px; }
.brand { gap: 15px; }
.brand-mark-badge { width: 64px; height: 64px; border-radius: 15px; }
.brand-name { font-size: 1.32rem; letter-spacing: -0.025em; }
.brand-tagline { font-size: 0.68rem; margin-top: 5px; letter-spacing: 0.02em; }
.nav-links { gap: 5px; }
.nav-links a { padding: 11px 13px; font-size: 1rem; font-weight: 600; }
.nav-cta .btn { padding: 11px 20px; font-size: .96rem; }

.hero-product-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-full);
  color: var(--text-muted);
  background: rgba(255,255,255,.75);
  font-size: .82rem;
  font-weight: 600;
}

.hero-marketing {
  padding-top: calc(var(--nav-h) + 38px);
  padding-bottom: clamp(46px, 6vw, 76px);
}
.hero-marketing .hero-inner { grid-template-columns: .92fr 1.18fr; gap: 48px; }
.hero-marketing h1 { font-size: clamp(2.75rem, 4.8vw, 4.65rem); line-height: 1.03; max-width: 690px; }
.hero-marketing .lead { max-width: 670px; font-size: clamp(1.02rem, 1.4vw, 1.18rem); }
.hero-marketing .hero-cta { margin-top: 26px; }

.company-map {
  display: grid;
  grid-template-columns: 1fr 58px 150px 58px 1.02fr;
  align-items: center;
  min-height: 430px;
  padding: 26px;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(246,249,252,.92));
  box-shadow: var(--sh-xl);
  overflow: hidden;
}
.map-column { display: grid; gap: 11px; }
.map-kicker { font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; color: var(--text-muted); margin: 0 0 2px 4px; }
.system-node, .outcome-node {
  padding: 12px 13px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: #fff;
  box-shadow: var(--sh-sm);
}
.system-node b, .outcome-node b { display: block; font-size: .85rem; color: var(--text-strong); }
.system-node small, .outcome-node small { display: block; margin-top: 2px; color: var(--text-muted); font-size: .69rem; line-height: 1.35; }
.system-node:nth-child(2) { border-left: 3px solid #58d8d7; }
.system-node:nth-child(3) { border-left: 3px solid #3572e8; }
.system-node:nth-child(4) { border-left: 3px solid #f59e0b; }
.system-node:nth-child(5) { border-left: 3px solid #8b5cf6; }
.system-node:nth-child(6) { border-left: 3px solid #16a34a; }
.map-flow { display: grid; gap: 40px; align-content: center; }
.map-flow span { display: block; height: 1px; background: linear-gradient(90deg, rgba(53,114,232,.18), rgba(53,114,232,.9)); position: relative; }
.map-flow span::after { content: ''; position: absolute; right: -1px; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: #3572e8; box-shadow: 0 0 0 4px rgba(53,114,232,.1); }
.map-flow-out { gap: 68px; }
.map-flow-out span { background: linear-gradient(90deg, rgba(88,216,215,.9), rgba(88,216,215,.18)); }
.map-flow-out span::after { right: auto; left: -1px; background: #58d8d7; box-shadow: 0 0 0 4px rgba(88,216,215,.11); }
.assemble-core {
  width: 150px;
  min-height: 150px;
  border-radius: 34px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 18px;
  color: #eaf5f7;
  background: linear-gradient(160deg, #14283a, #0f1f31 72%);
  box-shadow: 0 24px 50px rgba(15,31,49,.25);
  border: 1px solid rgba(88,216,215,.24);
}
.assemble-core img { width: 54px; height: 54px; margin-bottom: 8px; }
.assemble-core strong { font-family: var(--font-display); font-size: 1.05rem; color: #fff; }
.assemble-core small { font-size: .66rem; line-height: 1.35; color: #a9bbc7; margin-top: 4px; }
.outcome-node { border-left: 3px solid #58d8d7; }
.future-outcome { border-style: dashed; background: #fffdf7; position: relative; }
.future-outcome em { display: inline-flex; margin-top: 7px; font-style: normal; font-size: .59rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; color: #94300c; }

.role-journey { background: linear-gradient(180deg, #fff, #f8fafc); }
.role-stack { display: grid; gap: 12px; max-width: 1100px; margin-inline: auto; }
.role-band {
  display: grid;
  grid-template-columns: 70px minmax(0,1fr) 270px;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--sh-sm);
  position: relative;
  overflow: hidden;
}
.role-band::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--role-color, #3572e8); }
.role-level { font-family: var(--font-display); font-size: 1.3rem; font-weight: 800; color: var(--role-color, #3572e8); }
.role-label { display: inline-block; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--role-color, #3572e8); font-weight: 800; margin-bottom: 4px; }
.role-band h3 { font-size: 1.25rem; margin-bottom: 5px; }
.role-band p { color: var(--text-muted); font-size: .91rem; line-height: 1.55; }
.role-question { border-left: 1px solid var(--border); padding-left: 22px; color: var(--text-strong); font-weight: 700; font-size: .9rem; line-height: 1.4; }
.role-band.employee { --role-color: #0ea5a4; }
.role-band.manager { --role-color: #3572e8; margin-inline: 22px; }
.role-band.department { --role-color: #8b5cf6; margin-inline: 44px; }
.role-band.cfo { --role-color: #f59e0b; margin-inline: 66px; }
.role-band.ceo { --role-color: #14283a; margin-inline: 88px; background: linear-gradient(135deg, #f9fbfc, #edf5f7); }

.department-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.department-grid article { min-height: 190px; padding: 24px; border: 1px solid var(--border); border-radius: 18px; background: #fff; box-shadow: var(--sh-sm); }
.department-grid article > span { display: inline-flex; font-size: .67rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; color: var(--c-primary-600); margin-bottom: 14px; }
.department-grid h3 { font-size: 1.18rem; margin-bottom: 8px; }
.department-grid p { color: var(--text-muted); font-size: .89rem; }

.decision-card { border: 1px solid var(--border); border-radius: 22px; background: #fff; padding: 26px; box-shadow: var(--sh-lg); }
.decision-card h3 { margin: 5px 0 18px; }
.decision-row { display: grid; grid-template-columns: 100px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: .86rem; }
.decision-row b { color: var(--text-strong); }
.decision-row span { color: var(--text-muted); }
.decision-card p { color: var(--text-muted); font-size: .82rem; margin-top: 16px; }

.product-shell {
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--sh-xl);
}
.product-shell-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-soft);
}
.product-shell-body { display: grid; grid-template-columns: 170px 1fr; min-height: 330px; }
.product-nav { padding: 18px 12px; background: #14283a; color: #dce9f2; }
.product-nav h5 { color: #fff; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; padding: 8px 10px; opacity: .72; }
.product-nav span { display: block; padding: 9px 10px; border-radius: 8px; font-size: .8rem; }
.product-nav .selected { background: rgba(88,216,215,.14); color: #8ff3f0; }
.product-work { padding: 24px; background: #f5f7f9; }
.product-work h3 { margin-bottom: 6px; }
.product-work p { color: var(--text-muted); }
.product-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 20px; }
.product-metric { padding: 16px; border-radius: var(--r-md); background: #fff; border: 1px solid var(--border); }
.product-metric strong { display:block; font-family:var(--font-display); font-size:1.35rem; color:var(--text-strong); }
.product-metric span { font-size:.76rem; color:var(--text-muted); }
.product-list { margin-top: 16px; background:#fff; border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; }
.product-list div { display:flex; justify-content:space-between; gap:16px; padding:12px 14px; border-bottom:1px solid var(--border); font-size:.82rem; }
.product-list div:last-child { border-bottom:0; }
.product-list small { color:var(--text-muted); }

.pillar-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:42px; }
.pillar { padding:22px; border:1px solid var(--border); border-radius:var(--r-lg); background:#fff; }
.pillar .num { font-size:.72rem; font-weight:800; color:var(--c-primary-600); letter-spacing:.08em; text-transform:uppercase; }
.pillar h3 { font-size:1.15rem; margin-top:8px; }
.pillar p { font-size:.88rem; color:var(--text-muted); margin-top:7px; }

.connection-chain { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px; margin-top:36px; }
.connection-chain span { padding:10px 14px; border-radius:var(--r-full); background:var(--bg-soft); border:1px solid var(--border); font-size:.86rem; font-weight:600; }
.connection-chain i { font-style:normal; color:var(--text-muted); }

.status-note { border:1px solid var(--c-primary-100); background:var(--c-primary-50); color:var(--c-primary-800); border-radius:var(--r-lg); padding:20px 22px; }
.status-note strong { color:var(--c-primary-900); }

.price-card { max-width:700px; margin:40px auto 0; border:1px solid var(--border); border-radius:var(--r-xl); background:#fff; box-shadow:var(--sh-lg); padding:34px; }
.price-main { display:flex; align-items:flex-end; justify-content:center; gap:8px; margin:18px 0 8px; }
.price-main strong { font-family:var(--font-display); font-size:3.4rem; line-height:1; color:var(--text-strong); }
.price-main span { color:var(--text-muted); padding-bottom:6px; }
.price-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:24px; }
.price-fact { padding:14px; background:var(--bg-soft); border-radius:var(--r-md); text-align:center; }
.price-fact strong { display:block; color:var(--text-strong); }
.price-fact span { font-size:.8rem; color:var(--text-muted); }

.module-columns { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px; }
.module-group { border:1px solid var(--border); border-radius:var(--r-lg); padding:24px; background:#fff; }
.module-group h3 { font-size:1.2rem; margin-bottom:12px; }
.module-group ul { display:grid; gap:8px; }
.module-group li { color:var(--text-muted); font-size:.9rem; padding-left:18px; position:relative; }
.module-group li::before { content:'•'; position:absolute; left:0; color:var(--c-secondary-500); font-weight:800; }

.future-card { border:1px dashed var(--border-strong); background:var(--bg-soft); }
.future-badge { display:inline-flex; padding:5px 9px; border-radius:var(--r-full); background:#fff8eb; color:#94300c; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:10px; }

.contact-simple { max-width:760px; margin:0 auto; text-align:center; }
.contact-email { display:inline-flex; margin-top:24px; font-family:var(--font-display); font-size:clamp(1.3rem,3vw,2rem); color:var(--c-primary-700); }

[data-theme="dark"] .company-map,
[data-theme="dark"] .system-node,
[data-theme="dark"] .outcome-node,
[data-theme="dark"] .role-band,
[data-theme="dark"] .department-grid article,
[data-theme="dark"] .decision-card,
[data-theme="dark"] .product-shell,
[data-theme="dark"] .product-metric,
[data-theme="dark"] .product-list,
[data-theme="dark"] .pillar,
[data-theme="dark"] .price-card,
[data-theme="dark"] .module-group { background:var(--bg-soft); }
[data-theme="dark"] .company-map { background: linear-gradient(145deg, rgba(15,23,42,.94), rgba(20,40,58,.82)); }
[data-theme="dark"] .future-outcome { background: rgba(122,40,13,.12); }
[data-theme="dark"] .role-band.ceo { background: linear-gradient(135deg, rgba(20,40,58,.95), rgba(15,31,49,.9)); }
[data-theme="dark"] .product-work { background:var(--bg); }
[data-theme="dark"] .hero-product-label { background:rgba(15,23,42,.55); }

@media (max-width: 1180px) {
  :root { --nav-h: 88px; }
  .brand-mark-badge { width: 56px; height: 56px; }
  .brand-name { font-size: 1.18rem; }
  .brand-tagline { font-size: .61rem; }
  .nav-links a { padding-inline: 9px; font-size: .9rem; }
  .company-map { grid-template-columns: 1fr 32px 126px 32px 1fr; padding: 18px; }
  .assemble-core { width: 126px; min-height: 134px; }
}

@media (max-width: 1040px) {
  .hero-marketing .hero-inner { grid-template-columns: 1fr; }
  .hero-marketing .hero-text { max-width: 800px; }
  .company-map { max-width: 860px; }
  .pillar-grid { grid-template-columns:repeat(2,1fr); }
  .module-columns { grid-template-columns:repeat(2,1fr); }
  .department-grid { grid-template-columns: repeat(2,1fr); }
  .role-band, .role-band.manager, .role-band.department, .role-band.cfo, .role-band.ceo { margin-inline: 0; }
}

@media (max-width: 768px) {
  :root { --nav-h: 80px; }
  .brand-mark-badge { width:50px; height:50px; }
  .brand-name { font-size: 1.05rem; }
  .brand-tagline { font-size: .54rem; }
  .hero-marketing { padding-top: calc(var(--nav-h) + 28px); }
  .hero-marketing h1 { font-size: clamp(2.35rem, 12vw, 3.35rem); }
  .company-map { grid-template-columns: 1fr; gap: 16px; min-height: 0; }
  .map-flow { display: none; }
  .assemble-core { width: 100%; min-height: 120px; border-radius: 22px; }
  .map-column { grid-template-columns: 1fr; }
  .role-band { grid-template-columns: 48px 1fr; gap: 14px; padding: 20px; }
  .role-question { grid-column: 2; border-left: 0; padding-left: 0; padding-top: 10px; border-top: 1px solid var(--border); }
  .department-grid, .product-metrics, .price-facts, .pillar-grid, .module-columns { grid-template-columns:1fr; }
  .product-shell-body { grid-template-columns:1fr; }
  .product-nav { display:none; }
}