:root {
    --wjc-ink: #121610;
    --wjc-ink-soft: #34392f;
    --wjc-muted: #687064;
    --wjc-line: #dfe3da;
    --wjc-surface: #ffffff;
    --wjc-soft: #f4f5f0;
    --wjc-accent: #868a09;
    --wjc-accent-dark: #666a05;
    --wjc-dark: #171a14;
    --wjc-max: 1180px;
}

.wjc-page,
.wjc-page * { box-sizing: border-box; }
.wjc-page { overflow: hidden; color: var(--wjc-ink); background: #fff; }
.wjc-page svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wjc-container { width: min(calc(100% - 40px), var(--wjc-max)); margin-inline: auto; }
.wjc-section { padding: 104px 0; }
.wjc-kicker { margin: 0 0 14px; color: var(--wjc-accent-dark); font-size: 12px; line-height: 1.3; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.wjc-kicker--light { color: #d9de5d; }
.wjc-page h1,
.wjc-page h2,
.wjc-page h3 { color: var(--wjc-ink); text-wrap: balance; }
.wjc-page h1 { margin: 0; max-width: 720px; font-size: clamp(45px, 5.15vw, 72px); line-height: 1.01; letter-spacing: -.055em; font-weight: 780; }
.wjc-page h1 span { color: var(--wjc-accent-dark); }
.wjc-page h2 { margin: 0; font-size: clamp(34px, 4vw, 50px); line-height: 1.08; letter-spacing: -.042em; font-weight: 760; }
.wjc-page h3 { margin: 0; font-size: 21px; line-height: 1.25; letter-spacing: -.02em; }
.wjc-page p { text-wrap: pretty; }

.wjc-hero { position: relative; overflow: hidden; padding: 88px 0 82px; background: radial-gradient(circle at 78% 20%, rgba(134,138,9,.14), transparent 31%), linear-gradient(135deg, #f6f7f3 0%, #fff 52%, #eef0e8 100%); }
.wjc-hero::before { content: ""; position: absolute; top: -260px; right: -240px; width: 620px; height: 620px; border: 1px solid rgba(134,138,9,.15); border-radius: 50%; }
.wjc-hero::after { content: ""; position: absolute; left: 7%; bottom: -120px; width: 240px; height: 240px; background: repeating-linear-gradient(135deg, rgba(134,138,9,.07) 0 1px, transparent 1px 13px); transform: rotate(8deg); }
.wjc-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr); gap: 66px; align-items: center; }
.wjc-hero__lead { max-width: 690px; margin: 26px 0 0; color: var(--wjc-muted); font-size: 19px; line-height: 1.72; }
.wjc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 26px; margin-top: 34px; }
.wjc-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 0 25px; border: 1px solid var(--wjc-accent); border-radius: 7px; background: var(--wjc-accent); color: #fff !important; text-decoration: none !important; font-size: 15px; font-weight: 750; box-shadow: 0 12px 26px rgba(102,106,5,.20); transition: transform .2s ease, background .2s ease; }
.wjc-button:hover { background: var(--wjc-accent-dark); transform: translateY(-2px); }
.wjc-button span { font-size: 20px; line-height: 1; }
.wjc-link { color: var(--wjc-ink) !important; text-decoration: none !important; font-weight: 750; }
.wjc-link span { margin-left: 7px; color: var(--wjc-accent-dark); }
.wjc-checks { display: flex; flex-wrap: wrap; gap: 13px 24px; margin: 36px 0 0; padding: 0; list-style: none; }
.wjc-checks li { color: var(--wjc-ink-soft); font-size: 13px; font-weight: 650; }
.wjc-checks li::before { content: "✓"; display: inline-grid; place-items: center; width: 19px; height: 19px; margin-right: 8px; border-radius: 50%; background: rgba(134,138,9,.14); color: var(--wjc-accent-dark); font-size: 11px; font-weight: 900; }

.wjc-bridge { position: relative; min-height: 510px; padding: 46px 33px 38px; border: 1px solid rgba(255,255,255,.82); border-radius: 28px; background: rgba(255,255,255,.81); box-shadow: 0 30px 80px rgba(35,41,31,.14); backdrop-filter: blur(12px); }
.wjc-bridge__glow { position: absolute; inset: 23% 20%; background: rgba(134,138,9,.14); filter: blur(45px); border-radius: 50%; }
.wjc-node { position: relative; z-index: 2; display: grid; grid-template-columns: 48px 1fr; column-gap: 14px; align-items: center; width: 82%; min-height: 92px; padding: 18px 20px; border: 1px solid var(--wjc-line); border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(24,29,21,.08); }
.wjc-node small { grid-column: 2; color: var(--wjc-muted); font-size: 11px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.wjc-node strong { grid-column: 2; font-size: 15px; line-height: 1.3; }
.wjc-node__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--wjc-soft); color: var(--wjc-accent-dark); font-size: 27px; }
.wjc-node--customer { margin-left: 0; }
.wjc-node--office { width: 92%; margin: 42px 0 42px auto; border-color: rgba(134,138,9,.45); background: var(--wjc-dark); color: #fff; box-shadow: 0 18px 38px rgba(20,24,17,.22); }
.wjc-node--office small { color: #c9cebd; }
.wjc-node--office strong { color: #fff; }
.wjc-node--office .wjc-node__icon { background: var(--wjc-accent); color: #fff; }
.wjc-node--factory { margin-left: 0; }
.wjc-node__badge { position: absolute; top: -12px; right: 14px; padding: 6px 10px; border-radius: 20px; background: var(--wjc-accent); color: #fff; font-size: 9px; line-height: 1; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.wjc-connector { position: absolute; z-index: 1; width: 86px; height: 72px; border-right: 1px dashed rgba(102,106,5,.55); }
.wjc-connector::after { content: ""; position: absolute; right: -4px; bottom: -1px; width: 7px; height: 7px; border-right: 1px solid var(--wjc-accent-dark); border-bottom: 1px solid var(--wjc-accent-dark); transform: rotate(45deg); }
.wjc-connector--one { top: 120px; left: 37%; transform: rotate(-13deg); }
.wjc-connector--two { bottom: 116px; right: 38%; transform: rotate(14deg); }
.wjc-bridge__caption { position: absolute; right: 34px; bottom: 20px; color: var(--wjc-muted); font-size: 11px; font-weight: 700; letter-spacing: .03em; }

.wjc-intro { background: #fff; }
.wjc-intro__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; align-items: start; }
.wjc-intro__copy { padding-left: 34px; border-left: 3px solid var(--wjc-accent); }
.wjc-intro__copy p { margin: 0 0 18px; color: var(--wjc-muted); font-size: 17px; line-height: 1.78; }
.wjc-intro__copy .wjc-lead { color: var(--wjc-ink); font-size: 23px; line-height: 1.48; font-weight: 650; }

.wjc-role-section { background: var(--wjc-soft); }
.wjc-section-head { display: grid; grid-template-columns: 1fr 360px; gap: 70px; align-items: end; margin-bottom: 48px; }
.wjc-section-head > p { margin: 0 0 4px; color: var(--wjc-muted); font-size: 16px; line-height: 1.7; }
.wjc-role-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.wjc-role-card { position: relative; min-height: 310px; padding: 29px 27px 27px; border: 1px solid var(--wjc-line); border-radius: 12px; background: #fff; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.wjc-role-card:hover { transform: translateY(-4px); border-color: rgba(134,138,9,.45); box-shadow: 0 20px 44px rgba(27,31,24,.09); }
.wjc-role-card__number { position: absolute; top: 24px; right: 25px; color: #bdc1b6; font-size: 12px; font-weight: 850; letter-spacing: .12em; }
.wjc-role-card__icon { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 35px; border-radius: 11px; background: rgba(134,138,9,.12); color: var(--wjc-accent-dark); font-size: 27px; }
.wjc-role-card h3 { margin-bottom: 14px; }
.wjc-role-card p { margin: 0; color: var(--wjc-muted); font-size: 14px; line-height: 1.72; }

.wjc-process { position: relative; padding: 104px 0; overflow: hidden; background: var(--wjc-dark); color: #fff; }
.wjc-process::after { content: ""; position: absolute; top: -180px; right: -140px; width: 460px; height: 460px; border: 1px solid rgba(217,222,93,.18); border-radius: 50%; }
.wjc-process__head { position: relative; z-index: 1; max-width: 820px; }
.wjc-process h2 { color: #fff; }
.wjc-process__head > p:last-child { max-width: 700px; margin: 22px 0 0; color: #b9c0b2; font-size: 17px; line-height: 1.72; }
.wjc-process__steps { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; margin: 65px 0 0; padding: 0; list-style: none; }
.wjc-process__steps::before { content: ""; position: absolute; top: 21px; left: 4%; right: 4%; height: 1px; background: linear-gradient(90deg, transparent, rgba(217,222,93,.55) 8%, rgba(217,222,93,.55) 92%, transparent); }
.wjc-process__steps li { position: relative; padding: 58px 14px 0 0; }
.wjc-process__steps li > span { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid rgba(217,222,93,.55); border-radius: 50%; background: var(--wjc-dark); color: #d9de5d; font-size: 11px; font-weight: 850; }
.wjc-process__steps strong { display: block; margin-bottom: 9px; color: #fff; font-size: 15px; }
.wjc-process__steps small { display: block; max-width: 140px; color: #9fa79a; font-size: 11px; line-height: 1.55; }

.wjc-capabilities { background: #fff; }
.wjc-stats { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 24px; border: 1px solid var(--wjc-line); border-radius: 12px; overflow: hidden; }
.wjc-stats > div { min-height: 155px; padding: 29px 26px; border-right: 1px solid var(--wjc-line); background: #fff; }
.wjc-stats > div:last-child { border-right: 0; }
.wjc-stats strong { display: block; color: var(--wjc-accent-dark); font-size: 33px; line-height: 1.1; letter-spacing: -.035em; }
.wjc-stats span { display: block; margin-top: 12px; color: var(--wjc-muted); font-size: 13px; line-height: 1.5; }
.wjc-links-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.wjc-links-grid a { position: relative; display: grid; min-height: 190px; padding: 25px 52px 25px 25px; border-radius: 12px; background: var(--wjc-soft); color: var(--wjc-ink) !important; text-decoration: none !important; transition: background .2s ease, transform .2s ease; }
.wjc-links-grid a:hover { background: #eceee5; transform: translateY(-3px); }
.wjc-links-grid span { color: var(--wjc-accent-dark); font-size: 11px; font-weight: 850; letter-spacing: .1em; }
.wjc-links-grid strong { align-self: end; font-size: 22px; line-height: 1.2; }
.wjc-links-grid small { margin-top: 8px; color: var(--wjc-muted); font-size: 12px; line-height: 1.5; }
.wjc-links-grid b { position: absolute; top: 50%; right: 24px; color: var(--wjc-accent-dark); font-size: 24px; font-weight: 400; transform: translateY(-50%); }

.wjc-small-team { background: var(--wjc-soft); }
.wjc-small-team__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 95px; align-items: center; }
.wjc-small-team__visual { position: relative; min-height: 430px; border-radius: 20px; overflow: hidden; background: linear-gradient(145deg, #262a21, #11140f); box-shadow: 0 30px 70px rgba(25,29,21,.18); }
.wjc-small-team__visual::before { content: "WUJING"; position: absolute; left: 26px; bottom: 16px; color: rgba(255,255,255,.08); font-size: 78px; font-weight: 900; letter-spacing: -.06em; }
.wjc-rings span { position: absolute; border: 1px solid rgba(217,222,93,.36); border-radius: 50%; }
.wjc-rings span:nth-child(1) { width: 360px; height: 360px; top: 35px; left: -90px; }
.wjc-rings span:nth-child(2) { width: 270px; height: 270px; top: 80px; left: -45px; }
.wjc-rings span:nth-child(3) { width: 175px; height: 175px; top: 128px; left: 3px; background: rgba(134,138,9,.13); }
.wjc-small-team__mark { position: absolute; top: 50%; left: 47%; display: grid; place-items: center; width: 112px; height: 112px; border-radius: 15px; background: var(--wjc-accent); color: #fff; font-size: 41px; font-weight: 850; letter-spacing: -.04em; transform: translate(-50%, -50%) rotate(-5deg); box-shadow: 0 20px 35px rgba(0,0,0,.25); }
.wjc-small-team .wjc-lead { margin: 27px 0 16px; color: var(--wjc-ink); font-size: 21px; line-height: 1.55; font-weight: 620; }
.wjc-small-team p:not(.wjc-kicker):not(.wjc-lead) { color: var(--wjc-muted); font-size: 16px; line-height: 1.75; }
.wjc-quote { margin-top: 28px; padding: 20px 23px; border-left: 3px solid var(--wjc-accent); background: #fff; color: var(--wjc-ink-soft); font-size: 15px; line-height: 1.6; font-weight: 650; }

.wjc-cta { padding: 74px 0; background: var(--wjc-accent-dark); color: #fff; }
.wjc-cta__inner { display: grid; grid-template-columns: 1fr auto; gap: 65px; align-items: center; }
.wjc-cta h2 { color: #fff; font-size: clamp(32px, 4vw, 49px); }
.wjc-cta p:last-child { max-width: 720px; margin: 18px 0 0; color: #e2e5c9; font-size: 16px; line-height: 1.7; }
.wjc-button--light { border-color: #fff; background: #fff; color: var(--wjc-accent-dark) !important; box-shadow: none; white-space: nowrap; }
.wjc-button--light:hover { background: #f3f4e7; }

@media (max-width: 1050px) {
    .wjc-hero__grid { grid-template-columns: 1fr; }
    .wjc-bridge { max-width: 680px; width: 100%; }
    .wjc-intro__grid, .wjc-small-team__grid { gap: 55px; }
    .wjc-role-grid { grid-template-columns: repeat(2, 1fr); }
    .wjc-process__steps { grid-template-columns: repeat(3, 1fr); row-gap: 36px; }
    .wjc-process__steps::before { display: none; }
    .wjc-stats { grid-template-columns: repeat(2, 1fr); }
    .wjc-stats > div:nth-child(2) { border-right: 0; }
    .wjc-stats > div:nth-child(-n+2) { border-bottom: 1px solid var(--wjc-line); }
}

@media (max-width: 780px) {
    .wjc-container { width: min(calc(100% - 28px), var(--wjc-max)); }
    .wjc-section, .wjc-process { padding: 74px 0; }
    .wjc-hero { padding: 64px 0; }
    .wjc-hero__grid { gap: 44px; }
    .wjc-page h1 { font-size: clamp(39px, 12vw, 56px); }
    .wjc-bridge { min-height: 500px; padding: 35px 20px; }
    .wjc-node { width: 94%; }
    .wjc-node--office { width: 96%; }
    .wjc-intro__grid, .wjc-small-team__grid, .wjc-section-head, .wjc-cta__inner { grid-template-columns: 1fr; gap: 35px; }
    .wjc-intro__copy { padding-left: 22px; }
    .wjc-role-grid, .wjc-links-grid { grid-template-columns: 1fr; }
    .wjc-role-card { min-height: auto; }
    .wjc-process__steps { grid-template-columns: repeat(2, 1fr); }
    .wjc-stats { grid-template-columns: 1fr 1fr; }
    .wjc-small-team__visual { min-height: 330px; order: 2; }
    .wjc-cta__inner { align-items: start; }
}

@media (max-width: 480px) {
    .wjc-checks { display: grid; }
    .wjc-bridge { min-height: 540px; }
    .wjc-node { grid-template-columns: 42px 1fr; padding: 15px; }
    .wjc-node__icon { width: 42px; height: 42px; }
    .wjc-node__badge { display: none; }
    .wjc-process__steps, .wjc-stats { grid-template-columns: 1fr; }
    .wjc-stats > div { border-right: 0; border-bottom: 1px solid var(--wjc-line); }
    .wjc-stats > div:last-child { border-bottom: 0; }
    .wjc-button { width: 100%; }
}