:root { color: #101828; background: #fff; font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; }
button, input { font: inherit; }
button { border: 0; }
a { color: inherit; }
.cooperation-shell { width: min(1352px, calc(100% - 48px)); margin: 0 auto; }
.cooperation-header { display: flex; align-items: center; justify-content: space-between; min-height: 76px; padding: 0 max(24px, calc((100vw - 1352px) / 2)); background: #fff; border-bottom: 1px solid #edf1f3; }
.cooperation-brand { display: inline-flex; align-items: center; }
.cooperation-brand img { width: 132px; height: auto; }
.cooperation-header nav { display: flex; gap: 30px; }
.cooperation-header nav a { color: #526174; font-size: 14px; text-decoration: none; }
.cooperation-header nav a:hover { color: #155eef; }
.cooperation-login { min-width: 72px; padding: 9px 18px; border: 1px solid #d4deea; border-radius: 6px; color: #17202c; font-size: 14px; text-align: center; text-decoration: none; }
.cooperation-hero { display: grid; min-height: 600px; place-items: center; padding: 64px 24px; background: #f8fbff url("/assets/cooperation/header_bg.png") center / cover no-repeat; }
.cooperation-hero-inner { max-width: 880px; text-align: center; }
.cooperation-title { display: flex; justify-content: center; gap: 18px; margin: 0; color: #101828; font-size: 56px; font-weight: 700; line-height: 1.4; }
.cooperation-title strong { font: inherit; color: #155eef; }
.cooperation-hero-desc { margin: 24px 0 32px; color: #667085; font-size: 18px; line-height: 1.75; }
.cooperation-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 26px; border: 1px solid transparent; border-radius: 6px; font-size: 16px; font-weight: 600; line-height: 1; cursor: pointer; transition: background 160ms ease, border-color 160ms ease, color 160ms ease; }
.cooperation-button-primary { color: #fff; background: #155eef; box-shadow: 0 4px 10px rgba(21, 94, 239, .18); }
.cooperation-button-primary:hover { background: #004eeb; }
.cooperation-button-secondary { border-color: #b8ccff; color: #155eef; background: rgba(255, 255, 255, .74); }
.cooperation-button-secondary:hover { border-color: #155eef; background: #eff4ff; }
.cooperation-button:disabled { cursor: wait; opacity: .7; }
.cooperation-section { padding: 88px 0; }
.cooperation-section-heading { margin: 0 auto 40px; text-align: center; }
.cooperation-section-heading h2 { margin: 0; color: #101828; font-size: 36px; font-weight: 600; line-height: 1.4; }
.cooperation-section-heading p { margin: 14px 0 0; color: #667085; font-size: 16px; line-height: 1.75; }
.cooperation-objectives { background: linear-gradient(180deg, #fff 0%, #fcfcfd 100%); }
.cooperation-objective-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding: 16px; }
.cooperation-objective-card { min-height: 314px; padding: 40px; border-radius: 16px; background: #fff; box-shadow: 0 4px 8px rgba(0, 0, 0, .04); }
.cooperation-objective-card img { width: 64px; height: 64px; object-fit: contain; }
.cooperation-objective-card h3, .cooperation-advantage-card h3, .cooperation-mode-card h3, .cooperation-step-list h3 { margin: 16px 0 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 1.4; }
.cooperation-objective-card p, .cooperation-advantage-card p { margin: 12px 0 0; color: #64676e; font-size: 14px; line-height: 2; }
.cooperation-advantages { background: #f9fbff url("/assets/cooperation/panel_bg.png") right bottom / cover no-repeat; }
.cooperation-advantage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "one two three" "four five three"; gap: 24px; padding: 0 16px 16px; }
.cooperation-advantage-card { display: flex; flex-direction: column; min-height: 214px; padding: 32px 40px; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 8px 16px rgba(0, 0, 0, .04); backdrop-filter: blur(4px); }
.cooperation-advantage-card img { width: 64px; height: 64px; object-fit: contain; }
.cooperation-advantage-card h3 { margin-top: 8px; }
.advantage-one { grid-area: one; }.advantage-two { grid-area: two; }.advantage-three { grid-area: three; }.advantage-four { grid-area: four; }.advantage-five { grid-area: five; }
.cooperation-modes { background: linear-gradient(180deg, #fff 0%, #fbfcff 100%); }
.cooperation-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding: 80px 16px 16px; }
.cooperation-mode-card { position: relative; min-height: 485px; padding: 64px 32px 32px; border-radius: 16px; background: linear-gradient(180deg, #fff 0%, #f0faff 100%); box-shadow: 0 8px 16px rgba(0, 15, 10, .04); }
.cooperation-mode-card > img { position: absolute; top: -64px; right: 0; max-width: min(100%, 220px); height: 128px; object-fit: contain; }
.cooperation-mode-card h3 { margin: 0; }
.cooperation-mode-card ul { display: grid; gap: 18px; margin: 24px 0 0; padding: 0; list-style: none; }
.cooperation-mode-card li { min-height: 54px; padding: 15px 16px 15px 32px; border: 1px solid #edf1f3; border-radius: 12px; color: #636e80; background: #fff; font-size: 16px; line-height: 1.45; }
.cooperation-steps { background: rgba(255, 255, 255, .64); }
.cooperation-step-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.cooperation-step-list li { min-width: 0; }
.cooperation-step-copy { display: flex; align-items: flex-start; gap: 12px; min-height: 76px; }
.cooperation-step-copy h3 { margin: 4px 0 0; }
.cooperation-step-index { width: 36px; height: 36px; flex: 0 0 auto; }
.cooperation-step-visual { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; }
.cooperation-step-visual > img:first-child { width: 80px; height: 80px; margin-left: 48px; object-fit: contain; }
.cooperation-step-arrow { width: 52px; height: 36px; margin-left: 12px; object-fit: contain; }
.cooperation-cta { display: grid; min-height: 410px; place-items: center; padding: 40px 24px; background: #f5f9ff url("/assets/cooperation/footer_banner.png") center / cover no-repeat; text-align: center; }
.cooperation-cta-inner { max-width: 780px; }
.cooperation-cta-tag { display: inline-flex; margin: 0; padding: 8px 16px; border-radius: 18px; color: #155eef; background: rgba(49, 122, 247, .12); font-size: 14px; line-height: 20px; }
.cooperation-cta h2 { margin: 24px 0 0; color: #0f0f11; font-size: 36px; font-weight: 600; line-height: 1.4; }
.cooperation-cta > .cooperation-cta-inner > p:not(.cooperation-cta-tag) { margin: 24px 0 0; color: #636e80; font-size: 20px; line-height: 1.5; }
.cooperation-cta-actions { display: flex; justify-content: center; gap: 16px; margin-top: 40px; }
.cooperation-contact { padding: 64px 0; color: #d6e1ed; background: #111b27; }
.cooperation-contact h2 { margin: 0; color: #fff; font-size: 28px; line-height: 1.4; }
.cooperation-contact p { margin: 12px 0 0; color: #bdcad8; font-size: 15px; line-height: 1.7; }
.cooperation-contact a { color: #9fc9ff; }
.cooperation-modal[hidden], .cooperation-result-modal[hidden] { display: none; }
.cooperation-modal { position: fixed; z-index: 10000; inset: 0; display: grid; place-items: center; padding: 24px; }
.cooperation-modal-backdrop { position: absolute; inset: 0; background: rgba(16, 24, 40, .56); }
.cooperation-modal-panel { position: relative; width: min(500px, 100%); padding: 32px; border-radius: 8px; background: #fff; box-shadow: 0 24px 64px rgba(16, 24, 40, .24); }
.cooperation-modal-panel h2 { margin: 0 0 28px; color: #101828; font-size: 22px; line-height: 1.35; }
.cooperation-modal-close { position: absolute; top: 14px; right: 18px; width: 32px; height: 32px; color: #667085; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; }
.cooperation-modal form { display: grid; gap: 20px; }
.cooperation-modal form > label { display: grid; gap: 8px; color: #344054; font-size: 14px; font-weight: 600; }
.cooperation-modal em { color: #f04438; font-style: normal; }
.cooperation-modal input:not([type="radio"]) { width: 100%; height: 42px; padding: 0 12px; border: 1px solid #d0d5dd; border-radius: 4px; color: #101828; background: #fff; font-size: 14px; outline: none; }
.cooperation-modal input:focus { border-color: #155eef; box-shadow: 0 0 0 3px rgba(21, 94, 239, .12); }
.cooperation-name-input { position: relative; display: block; }
.cooperation-name-input > input { padding-right: 124px !important; }
.cooperation-name-input > span { position: absolute; top: 5px; right: 5px; display: flex; overflow: hidden; border: 1px solid #d0d5dd; border-radius: 3px; background: #fff; }
.cooperation-name-input label { display: inline-flex; align-items: center; padding: 5px 8px; color: #475467; font-size: 12px; font-weight: 400; cursor: pointer; }
.cooperation-name-input input[type="radio"] { margin: 0 4px 0 0; accent-color: #155eef; }
.cooperation-modal form .cooperation-button { width: 100%; margin-top: 4px; }
.cooperation-result-modal { position: fixed; z-index: 10001; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(16, 24, 40, .56); }
.cooperation-result-panel { width: min(380px, 100%); padding: 32px; border-radius: 8px; background: #fff; text-align: center; box-shadow: 0 24px 64px rgba(16, 24, 40, .24); }
.cooperation-result-panel h2 { margin: 0; font-size: 21px; }.cooperation-result-panel p { margin: 18px 0 28px; color: #667085; font-size: 15px; line-height: 1.7; }
.cooperation-toast { position: fixed; z-index: 10002; right: 24px; bottom: 24px; max-width: min(360px, calc(100% - 48px)); padding: 12px 16px; border-radius: 5px; color: #fff; background: #152333; box-shadow: 0 12px 32px rgba(0, 0, 0, .2); opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity 160ms ease, transform 160ms ease; }
.cooperation-toast.is-visible { opacity: 1; transform: translateY(0); }
body.cooperation-modal-open { overflow: hidden; }
@media (max-width: 1100px) { .cooperation-objective-grid { grid-template-columns: repeat(2, 1fr); }.cooperation-advantage-grid { grid-template-columns: repeat(2, 1fr); grid-template-areas: "one two" "three three" "four five"; }.cooperation-mode-grid { grid-template-columns: 1fr; max-width: 620px; margin: 0 auto; }.cooperation-mode-card { min-height: auto; }.cooperation-step-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }.cooperation-step-visual { justify-content: flex-start; gap: 32px; }.cooperation-step-visual > img:first-child { margin-left: 48px; } }
@media (max-width: 700px) { .cooperation-shell { width: min(100% - 32px, 560px); }.cooperation-header { min-height: 64px; padding: 0 16px; }.cooperation-header nav { display: none; }.cooperation-hero { min-height: 512px; padding: 52px 24px; background-position: 57% center; }.cooperation-title { flex-direction: column; gap: 0; font-size: 42px; line-height: 1.3; }.cooperation-hero-desc { margin: 18px 0 28px; font-size: 14px; }.cooperation-section { padding: 58px 0; }.cooperation-section-heading { margin-bottom: 28px; }.cooperation-section-heading h2 { font-size: 28px; }.cooperation-section-heading p { font-size: 14px; }.cooperation-objective-grid { grid-template-columns: 1fr; gap: 16px; padding: 0; }.cooperation-objective-card { display: flex; min-height: auto; align-items: center; gap: 16px; padding: 24px; }.cooperation-objective-card img { flex: 0 0 auto; width: 56px; height: 56px; }.cooperation-objective-card h3 { margin: 0; font-size: 16px; }.cooperation-objective-card p { margin-top: 9px; font-size: 12px; line-height: 1.7; }.cooperation-advantage-grid { grid-template-columns: 1fr; grid-template-areas: "one" "two" "three" "four" "five"; gap: 16px; padding: 0; }.cooperation-advantage-card { flex-direction: row; min-height: auto; gap: 16px; padding: 24px; }.cooperation-advantage-card img { flex: 0 0 auto; width: 56px; height: 56px; }.cooperation-advantage-card h3 { margin: 0; font-size: 16px; }.cooperation-advantage-card p { margin-top: 9px; font-size: 12px; line-height: 1.7; }.cooperation-mode-grid { padding: 72px 0 0; }.cooperation-mode-card { padding: 48px 24px 24px; }.cooperation-mode-card h3 { font-size: 18px; }.cooperation-mode-card ul { gap: 12px; margin-top: 16px; }.cooperation-mode-card li { min-height: 0; padding: 12px 16px; font-size: 13px; }.cooperation-step-list { grid-template-columns: 1fr; gap: 12px; justify-items: center; }.cooperation-step-list li { width: 220px; }.cooperation-step-copy { min-height: auto; }.cooperation-step-copy h3 { font-size: 16px; }.cooperation-step-visual { flex-direction: column; margin: 10px 0; gap: 12px; }.cooperation-step-visual > img:first-child { display: none; }.cooperation-step-arrow { margin: 0; transform: rotate(90deg); }.cooperation-step-list li:last-child .cooperation-step-visual { display: none; }.cooperation-cta { min-height: 350px; }.cooperation-cta h2 { font-size: 28px; }.cooperation-cta > .cooperation-cta-inner > p:not(.cooperation-cta-tag) { font-size: 14px; }.cooperation-cta-actions { margin-top: 28px; }.cooperation-button { min-height: 42px; padding: 0 20px; font-size: 15px; }.cooperation-modal { padding: 16px; }.cooperation-modal-panel { padding: 28px 20px 24px; }.cooperation-name-input > input { padding-right: 116px !important; }.cooperation-name-input label { padding: 5px 6px; }.cooperation-contact h2 { font-size: 24px; } }