.wp-page, .wp-page * { box-sizing: border-box; }
.wp-page { overflow: hidden; padding-top: 92px; color: var(--ns-text); background: var(--ns-bg); }
.wp-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.wp-hero { min-height: 720px; display: grid; align-items: center; padding: 70px 0; background: radial-gradient(650px 480px at 85% 35%, color-mix(in srgb, var(--ns-brand-secondary) 12%, transparent), transparent 70%), radial-gradient(600px 430px at 5% 0%, color-mix(in srgb, var(--ns-brand-primary) 8%, transparent), transparent 70%); }
.wp-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(440px, .9fr); align-items: center; gap: 70px; }
.wp-kicker { color: var(--ns-brand-secondary); font-size: 9px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.wp-hero h1 { max-width: 700px; margin: 18px 0 0; color: var(--ns-text); font-size: clamp(50px, 6vw, 82px); line-height: .96; letter-spacing: -.065em; }
.wp-hero h1 em { color: var(--ns-brand-secondary); font-style: normal; }
.wp-hero p { max-width: 610px; margin: 24px 0 0; color: var(--ns-text-muted); font-size: 13px; line-height: 1.75; }
.wp-actions { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 9px; }
.wp-system-map { position: relative; min-height: 480px; overflow: hidden; border: 1px solid var(--ns-border); border-radius: 26px; background: color-mix(in srgb, var(--ns-surface-raised) 92%, transparent); box-shadow: var(--ns-shadow-lg); }
.wp-system-map::before { content: ""; position: absolute; inset: 12%; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--ns-brand-secondary) 12%, transparent), transparent 66%); }
.wp-system-map__core { position: absolute; z-index: 3; top: 50%; left: 50%; width: 124px; height: 124px; display: grid; place-items: center; border-radius: 34px; color: var(--ns-brand-on-secondary); background: var(--ns-brand-secondary); box-shadow: var(--ns-brand-glow); transform: translate(-50%, -50%) rotate(8deg); }
.wp-system-map__core i, .wp-system-map__core small { transform: rotate(-8deg); }
.wp-system-map__core i { margin-bottom: -25px; font-size: 42px; }
.wp-system-map__core small { font-size: 7px; font-weight: 900; letter-spacing: .1em; }
.wp-orbit { position: absolute; top: 50%; left: 50%; border: 1px solid color-mix(in srgb, var(--ns-brand-secondary) 30%, var(--ns-border)); border-radius: 50%; transform: translate(-50%, -50%); }
.wp-orbit--one { width: 280px; height: 280px; border-style: dashed; animation: wp-spin 20s linear infinite; }
.wp-orbit--two { width: 410px; height: 410px; animation: wp-spin 30s linear infinite reverse; }
.wp-map-node { position: absolute; z-index: 4; width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid var(--ns-border); border-radius: 15px; color: var(--ns-brand-secondary); background: var(--ns-surface-muted); box-shadow: var(--ns-shadow-sm); }
.wp-map-node i { font-size: 23px; }.wp-map-node--a { top: 15%; left: 18%; }.wp-map-node--b { top: 19%; right: 15%; }.wp-map-node--c { bottom: 17%; left: 15%; }.wp-map-node--d { right: 18%; bottom: 14%; }
.wp-section { padding: 105px 0; border-top: 1px solid var(--ns-border); background: var(--ns-surface-muted); }
.wp-section-head { margin-bottom: 40px; display: flex; align-items: flex-end; justify-content: space-between; gap: 34px; }
.wp-section-head h2 { max-width: 680px; margin: 12px 0 0; font-size: clamp(34px, 4vw, 56px); line-height: 1.03; letter-spacing: -.055em; }
.wp-section-head > p { max-width: 430px; margin: 0; color: var(--ns-text-muted); font-size: 11px; line-height: 1.7; }
.wp-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.wp-card-grid--integrations { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wp-card { position: relative; min-height: 330px; padding: 23px; overflow: hidden; border: 1px solid var(--ns-border); border-radius: 17px; background: var(--ns-surface-raised); transition: transform var(--ns-motion), border-color var(--ns-motion), box-shadow var(--ns-motion); }
.wp-card:hover { transform: translateY(-4px); border-color: var(--ns-brand-secondary); box-shadow: var(--ns-shadow-md); }
.wp-card > i { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; color: var(--ns-brand-secondary); background: color-mix(in srgb, var(--ns-brand-secondary) 10%, var(--ns-surface-muted)); font-size: 21px; }
.wp-card > span { position: absolute; top: 26px; right: 22px; color: color-mix(in srgb, var(--ns-brand-secondary) 54%, transparent); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.wp-card h3 { margin: 25px 0 10px; font-size: 14px; }.wp-card p { margin: 0; min-height: 67px; color: var(--ns-text-muted); font-size: 9px; line-height: 1.65; }
.wp-card ul { margin: 20px 0 0; padding: 16px 0 0; display: grid; gap: 8px; border-top: 1px solid var(--ns-border); list-style: none; }.wp-card li { display: flex; align-items: center; gap: 7px; color: var(--ns-text-muted); font-size: 8px; }.wp-card li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--ns-brand-secondary); }
.wp-flow { padding: 100px 0; background: var(--ns-bg); }
.wp-flow__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--ns-border); border-radius: 22px; overflow: hidden; background: var(--ns-surface-raised); }
.wp-flow__steps > div { position: relative; min-height: 230px; padding: 26px; border-right: 1px solid var(--ns-border); }.wp-flow__steps > div:last-child { border: 0; }.wp-flow__steps b { position: absolute; top: 20px; right: 20px; color: color-mix(in srgb, var(--ns-brand-secondary) 45%, transparent); font-size: 24px; }.wp-flow__steps i { margin-top: 25px; color: var(--ns-brand-secondary); font-size: 28px; }.wp-flow__steps h3 { margin: 30px 0 8px; font-size: 14px; }.wp-flow__steps p { margin: 0; color: var(--ns-text-muted); font-size: 9px; line-height: 1.6; }
.wp-cta { padding: 0 0 90px; background: var(--ns-bg); }.wp-cta__inner { padding: 55px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 35px; border: 1px solid var(--ns-border); border-radius: 24px; background: linear-gradient(135deg, color-mix(in srgb, var(--ns-brand-secondary) 9%, var(--ns-surface-raised)), var(--ns-surface-raised)); box-shadow: var(--ns-shadow-lg); }.wp-cta h2 { max-width: 710px; margin: 10px 0 0; font-size: clamp(30px, 4vw, 50px); line-height: 1.04; letter-spacing: -.05em; }.wp-cta p { max-width: 650px; margin: 12px 0 0; color: var(--ns-text-muted); font-size: 10px; line-height: 1.7; }
.wp-info-page { background: radial-gradient(720px 520px at 85% 10%, color-mix(in srgb, var(--ns-brand-primary) 8%, transparent), transparent 70%), var(--ns-bg); }
.wp-info-hero { min-height: 690px; }
.wp-system-map--story .wp-system-map__core,
.wp-system-map--career .wp-system-map__core,
.wp-system-map--docs .wp-system-map__core { border-radius: 32px; }
.wp-system-map--story::after,
.wp-system-map--career::after,
.wp-system-map--docs::after { content: ""; position: absolute; inset: auto 8% 7% auto; width: 42%; aspect-ratio: 1; border: 34px solid color-mix(in srgb, var(--ns-brand-primary) 9%, transparent); border-radius: 50%; opacity: .7; }
.wp-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; align-items: stretch; }
.wp-principle-card { position: relative; display: flex !important; min-height: 255px; flex-direction: column; justify-content: flex-start; padding: 27px !important; overflow: hidden; border: 1px solid var(--ns-border) !important; border-radius: 18px !important; color: var(--ns-text); background: linear-gradient(145deg, color-mix(in srgb, var(--ns-surface-raised) 95%, transparent), color-mix(in srgb, var(--ns-brand-secondary) 5%, var(--ns-surface-raised))) !important; box-shadow: var(--ns-shadow-sm); isolation: isolate; transition: transform var(--ns-motion), border-color var(--ns-motion), box-shadow var(--ns-motion); }
.wp-principle-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(240px 140px at 82% 12%, color-mix(in srgb, var(--ns-brand-secondary) 13%, transparent), transparent 68%); opacity: .85; }
.wp-principle-card:hover { transform: translateY(-4px); border-color: var(--ns-brand-secondary) !important; box-shadow: var(--ns-shadow-md); }
.wp-principle-card i { width: 46px !important; height: 46px !important; display: grid !important; place-items: center; flex: 0 0 auto; border-radius: 13px; color: var(--ns-brand-secondary); background: color-mix(in srgb, var(--ns-brand-secondary) 10%, var(--ns-surface-muted)); font-size: 23px !important; line-height: 1; }
.wp-principle-card h3 { margin: auto 0 10px !important; color: var(--ns-text); font-size: 18px; line-height: 1.2; }
.wp-principle-card p { margin: 0 !important; max-width: 95%; color: var(--ns-text-muted); font-size: 10px; line-height: 1.7; }
.wp-role-list { display: grid; gap: 12px; }
.wp-role-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 24px; border: 1px solid var(--ns-border); border-radius: 18px; background: var(--ns-surface-raised); transition: transform var(--ns-motion), border-color var(--ns-motion), box-shadow var(--ns-motion); }
.wp-role-list article:hover { transform: translateY(-3px); border-color: var(--ns-brand-secondary); box-shadow: var(--ns-shadow-md); }
.wp-role-list span { color: var(--ns-brand-secondary); font-size: 8px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.wp-role-list h3 { margin: 7px 0 8px; color: var(--ns-text); font-size: 20px; line-height: 1.2; }
.wp-role-list p { max-width: 700px; margin: 0; color: var(--ns-text-muted); font-size: 10px; line-height: 1.7; }
@keyframes wp-spin { from { transform: translate(-50%, -50%) rotate(0deg); } to { transform: translate(-50%, -50%) rotate(360deg); } }
@media (max-width: 1000px) { .wp-hero__grid { grid-template-columns: 1fr; }.wp-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.wp-section-head { align-items: flex-start; flex-direction: column; } }
@media (max-width: 1000px) { .wp-principles { grid-template-columns: 1fr; }.wp-role-list article { grid-template-columns: 1fr; } }
@media (max-width: 680px) { .wp-page { padding-top: 74px; }.wp-container { width: min(100% - 24px, 1180px); }.wp-hero { min-height: auto; padding: 65px 0; }.wp-hero h1 { font-size: 48px; }.wp-system-map { min-height: 420px; }.wp-card-grid, .wp-card-grid--integrations, .wp-flow__steps { grid-template-columns: 1fr; }.wp-flow__steps > div { border-right: 0; border-bottom: 1px solid var(--ns-border); }.wp-cta__inner { padding: 30px; grid-template-columns: 1fr; }.wp-principle-card { min-height: 220px; }.wp-role-list article { padding: 20px; }}
@media (prefers-reduced-motion: reduce) { .wp-orbit { animation: none !important; } }