:root { --orange:#ea641b; --ink:#252c36; --body:#59636e; --line:#e6e5e0; --cream:#faf8f3; --dark:#172831; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; background:#fff; color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; line-height:1.75; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #f08c45; outline-offset:5px; }
.wrap { width:min(1160px,calc(100% - 64px)); margin:auto; }
.skip { position:fixed; top:-80px; left:20px; background:white; z-index:100; padding:10px; }
.skip:focus { top:10px; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.header-inner { height:76px; display:flex; align-items:center; gap:32px; }
.brand { display:flex; align-items:center; gap:11px; line-height:1.4; }
.brand-mark { display:grid; place-items:center; background:#f97316; color:white; border-radius:11px; width:40px; height:40px; font-weight:800; font-size:21px; }
.brand small { display:block; color:var(--orange); font-size:10px; letter-spacing:1px; font-weight:700; }
.brand strong { font-size:19px; }
.header-inner nav { display:flex; gap:28px; margin-left:auto; font-size:14px; }
.header-inner nav a[aria-current] { color:var(--orange); font-weight:700; }
.header-inner nav a:hover,.text-link:hover { color:var(--orange); }
.button { display:inline-flex; align-items:center; justify-content:center; background:var(--orange); color:white; border-radius:9px; padding:13px 24px; font-size:15px; font-weight:650; transition:background .2s; }
.button:hover { background:#c64e0c; }
.button.compact { padding:9px 18px; font-size:13px; }
.hero { padding:64px 0 0; background:linear-gradient(180deg,#faf8f3,#fff 90%); }
.eyebrow { font-size:12px; letter-spacing:2px; font-weight:700; color:var(--orange); margin-bottom:20px; }
h1 { font-size:clamp(34px,4.5vw,58px); line-height:1.3; letter-spacing:-1.5px; font-weight:800; }
.orange { color:var(--orange); }
.lead { font-size:17px; color:var(--body); line-height:1.9; margin-top:23px; }
.actions { display:flex; align-items:center; gap:30px; margin-top:28px; }
.text-link { font-size:14px; font-weight:650; }
.hero-picture { margin-top:44px; border-radius:14px; overflow:hidden; background:var(--dark); padding:8px; box-shadow:0 20px 45px -25px #17283180; }
.picture-label { display:flex; justify-content:space-between; color:#c8d3d7; font-size:11px; padding:7px 12px 13px; letter-spacing:1px; }
.hero-picture img { border-radius:7px; }
.zoom { display:block; position:relative; cursor:zoom-in; overflow:hidden; }
.zoom-hint { position:absolute; right:13px; bottom:13px; background:rgba(18,29,37,.86); color:white; border:1px solid #ffffff26; padding:5px 11px; border-radius:6px; font-size:11px; opacity:0; transition:opacity .2s; }
.zoom:hover .zoom-hint,.zoom:focus-visible .zoom-hint { opacity:1; }
.image-note { font-size:11px; color:#7b838b; text-align:center; margin:15px 0 32px; }
.module-nav { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.module-nav a { display:flex; align-items:center; gap:17px; padding:24px 22px; font-size:15px; font-weight:650; }
.module-nav a+a { border-left:1px solid var(--line); }
.module-nav span { font-size:12px; color:var(--orange); }
.module-nav b { margin-left:auto; font-weight:400; color:#858b90; }
.module-nav a:hover { background:var(--cream); }
.section { padding-top:100px; padding-bottom:100px; }
.section-heading { margin-bottom:42px; }
.section-heading .eyebrow { margin-bottom:14px; }
h2 { font-size:clamp(27px,3vw,38px); line-height:1.45; letter-spacing:-.8px; }
h3 { font-size:18px; line-height:1.55; }
.section-heading>p:last-child:not(.eyebrow) { color:var(--body); font-size:15px; margin-top:17px; max-width:750px; }
.feature-layout { margin-bottom:42px; }
.feature-copy { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.feature-copy article { display:flex; gap:12px; }
.feature-copy article:first-child { padding-top:0; }
.feature-copy article:last-child { border-bottom:0; padding-bottom:0; }
.feature-copy article>span { color:#b8aaa0; font-size:12px; padding-top:4px; }
.feature-copy p { color:var(--body); font-size:14px; margin-top:7px; }
.light-frame { background:#f1f2f5; border:1px solid #e3e5e8; border-radius:13px; overflow:hidden; }
.frame-bar { padding:12px 15px; font-size:8px; color:#c7cbd0; }
.frame-bar span { font-size:10px; color:#7c838e; margin-left:9px; }
.stats-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.stats-heading h3 { font-size:23px; }
.stats-heading p { font-size:13px; color:var(--body); margin-top:5px; }
.stats-count { color:var(--orange); font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.stats-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.stats-controls[hidden],.stats-slide[hidden] { display:none; }
.stats-options,.stats-arrows { display:flex; gap:8px; }
.stats-controls button { border:1px solid var(--line); border-radius:8px; padding:10px 18px; color:var(--body); background:white; cursor:pointer; font-size:13px; }
.stats-controls button:hover { border-color:var(--orange); }
.stats-options button[aria-pressed="true"] { color:white; background:var(--orange); border-color:var(--orange); font-weight:650; }
.stats-arrows button { width:44px; height:44px; padding:0; font-size:20px; }
.stats-slide+.stats-slide { margin-top:22px; }
.stats-gallery[data-ready] .stats-slide { margin-top:0; }
.stats-slide .zoom { background:#f4f5fb; }
.stats-slide img { width:100%; aspect-ratio:1280/1000; object-fit:contain; }
.stats-slide figcaption { padding:20px 26px; background:white; text-align:left; min-height:100px; }
.stats-slide figcaption strong { display:block; font-size:16px; color:var(--ink); }
.stats-slide figcaption span { display:block; margin-top:6px; font-size:13px; color:var(--body); }
figcaption { font-size:12px; color:#78818a; padding:12px 18px; text-align:center; }
.tinted { background:var(--cream); }
.two-up { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.visual-card { background:white; border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.card-copy { padding:27px 30px 31px; }
.tag { font-size:11px; color:var(--orange); background:#fff2e7; border-radius:5px; padding:5px 8px; display:inline-block; margin-bottom:12px; }
.card-copy p { font-size:14px; color:var(--body); margin-top:10px; }
.independent { display:flex; gap:21px; padding:26px 30px; margin-top:28px; background:#efece4; border-radius:11px; align-items:center; }
.independent>span { flex-shrink:0; display:grid; place-items:center; width:40px; height:40px; border:1px solid #c7c0b1; border-radius:50%; font-size:24px; }
.independent h3 { font-size:16px; }
.independent p { font-size:14px; color:var(--body); margin-top:4px; }
.board-section { background:var(--dark); color:#f6f3e9; }
.board-section .eyebrow { color:#f5b276; }
.board-section .section-heading>p:last-child { color:#acbdc6; }
.board-wide { border:1px solid #ffffff26; border-radius:12px; overflow:hidden; }
.board-wide figcaption { color:#a3b3bb; background:#ffffff04; padding:17px; }
.board-details { margin-top:36px; }
.board-details .zoom { border:1px solid #ffffff26; border-radius:9px; }
.board-details h3 { margin:23px 0 10px; }
.board-details p { font-size:14px; color:#acbdc6; }
.board-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; border-top:1px solid #ffffff26; margin-top:46px; padding-top:29px; }
.board-benefits h3 { font-size:15px; font-weight:650; color:#f5bd87; }
.board-benefits p { font-size:13px; color:#acbdc6; margin-top:8px; }
.together .section-heading { text-align:center; }
.roles { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.roles article { padding:30px; background:var(--cream); border-radius:10px; }
.roles span { font-size:12px; color:var(--orange); }
.roles h3 { font-size:24px; margin:12px 0; }
.roles p { font-size:14px; color:var(--body); }
.payment-note { display:flex; justify-content:center; gap:20px; flex-wrap:wrap; margin-top:32px; font-size:14px; }
.payment-note span { color:var(--body); }
.faq-section { background:#f6f7f7; }
.faq-layout { display:grid; grid-template-columns:1fr 2fr; gap:60px; }
.faq-list details { border-bottom:1px solid #dde1e3; padding:20px 0; }
.faq-list details:first-child { padding-top:0; }
.faq-list summary { cursor:pointer; font-size:16px; font-weight:650; list-style:none; display:flex; justify-content:space-between; gap:24px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:after { content:'+'; color:var(--orange); font-size:20px; font-weight:400; line-height:1.4; }
.faq-list details[open] summary:after { content:'−'; }
.faq-list details p { margin-top:14px; font-size:14px; color:var(--body); }
.contact-section { background:#fff4e9; }
.contact-inner { display:flex; align-items:center; justify-content:space-between; gap:48px; }
.contact-inner h2 { font-size:34px; }
.contact-inner p:not(.eyebrow) { font-size:15px; color:var(--body); margin-top:16px; }
.contact-tags { display:flex; flex-wrap:wrap; gap:8px 22px; font-size:12px; color:#9b6c48; margin-top:30px; }
.qr { flex-shrink:0; background:white; padding:20px 25px 10px; border-radius:13px; border:1px solid #ead9c8; }
.qr img { margin:auto; }
.qr figcaption { color:var(--ink); font-size:13px; padding:12px 0 5px; }
.qr small { font-size:11px; color:#78818a; }
.footer { display:flex; justify-content:space-between; gap:25px; padding-top:32px; padding-bottom:32px; font-size:12px; }
.footer-brand { font-weight:700; }
.footer-brand span { font-weight:400; color:#7b838b; }
.footer>div { display:flex; gap:25px; color:#7b838b; }
.image-dialog { background:#14232c; color:white; border:1px solid #ffffff33; border-radius:12px; padding:0; width:min(1500px,96vw); max-width:96vw; max-height:94vh; }
.image-dialog::backdrop { background:#081219e8; }
.dialog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 18px; font-size:14px; }
.dialog-toolbar button { border:1px solid #ffffff40; background:#ffffff12; color:white; border-radius:6px; padding:5px 13px; cursor:pointer; }
.dialog-image { max-height:calc(94vh - 66px); overflow:auto; }
.dialog-image img { width:100%; height:auto; }
body:has(.image-dialog[open]) { overflow:hidden; }
@media(max-width:900px) {
  .header-inner { gap:20px; } .header-inner nav { gap:20px; }
  .feature-layout { grid-template-columns:1fr; gap:30px; }
  .feature-copy { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .feature-copy article,.feature-copy article:first-child { padding:0; border:0; }
  .section { padding-top:72px; padding-bottom:72px; }
  .roles article { padding:22px; } .faq-layout { grid-template-columns:1fr; gap:0; }
  .faq-layout .section-heading { margin-bottom:28px; }
  .contact-inner h2 { font-size:28px; } .card-copy { padding:22px; }
  .module-nav a { padding:20px 14px; gap:10px; }
}
@media(max-width:600px) {
  html { scroll-padding-top:82px; } .wrap { width:calc(100% - 36px); }
  .header-inner { height:66px; gap:14px; }
  .brand-mark { width:32px; height:32px; border-radius:9px; font-size:17px; }
  .brand { gap:7px; } .brand strong { font-size:15px; } .brand small { font-size:8px; letter-spacing:.4px; }
  .header-inner nav { gap:12px; font-size:12px; }
  .header-inner nav .optional,.header-inner nav a:first-child { display:none; }
  .button.compact { padding:8px 10px; font-size:12px; }
  .hero { padding-top:40px; } .eyebrow { font-size:10px; margin-bottom:17px; }
  h1 { font-size:35px; letter-spacing:-1.1px; } .lead { font-size:14px; margin-top:18px; }
  .desktop-break { display:none; } .actions { gap:20px; margin-top:24px; }
  .button { font-size:13px; padding:12px 17px; } .text-link { font-size:12px; }
  .hero-picture { margin-top:30px; padding:4px; border-radius:8px; }
  .picture-label { font-size:9px; padding:5px 7px 8px; letter-spacing:0; } .picture-label span:first-child { display:none; }
  .image-note { font-size:10px; margin:12px 0 24px; } .module-nav { grid-template-columns:1fr; }
  .module-nav a { padding:14px 7px; font-size:13px; } .module-nav a+a { border-left:0; border-top:1px solid var(--line); }
  .section { padding-top:54px; padding-bottom:54px; } .section-heading { margin-bottom:28px; }
  h2 { font-size:27px; } .section-heading>p:last-child:not(.eyebrow) { font-size:14px; margin-top:13px; }
  .feature-copy { grid-template-columns:1fr; gap:23px; } h3 { font-size:17px; } .feature-copy p { font-size:13px; }
  .stats-heading h3 { font-size:20px; } .stats-heading { align-items:flex-start; gap:14px; }
  .stats-controls { flex-wrap:wrap; } .stats-options { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .stats-options button { padding:10px 8px; font-size:12px; } .stats-arrows { margin-left:auto; }
  .stats-slide figcaption { padding:18px; min-height:145px; } .stats-slide figcaption strong { font-size:14px; }
  .stats-slide figcaption span { font-size:12px; } .feature-layout { margin-bottom:34px; }
  .two-up { grid-template-columns:1fr; gap:25px; } .card-copy { padding:22px; } .card-copy p { font-size:13px; }
  .independent { padding:21px 19px; gap:14px; align-items:flex-start; }
  .independent>span { width:30px; height:30px; font-size:20px; } .independent h3 { font-size:14px; } .independent p { font-size:12px; }
  .board-wide figcaption { font-size:11px; padding:12px; } .board-details { margin-top:28px; }
  .board-details h3 { margin-top:17px; } .board-details p { font-size:13px; }
  .board-benefits { grid-template-columns:1fr; gap:23px; margin-top:30px; }
  .roles { grid-template-columns:1fr; gap:15px; } .roles article { padding:25px; } .roles h3 { font-size:22px; margin:8px 0; }
  .together .section-heading { text-align:left; } .payment-note { justify-content:flex-start; font-size:13px; gap:6px; margin-top:24px; }
  .faq-list summary { font-size:14px; } .faq-list details p { font-size:13px; }
  .contact-inner { flex-direction:column; align-items:flex-start; gap:28px; }
  .contact-inner h2 { font-size:27px; } .contact-inner p:not(.eyebrow) { font-size:14px; }
  .contact-tags { gap:16px; font-size:11px; margin-top:20px; } .qr { align-self:center; }
  .footer { flex-direction:column; gap:13px; padding-top:25px; padding-bottom:25px; } .footer>div { gap:22px; }
  .zoom-hint { opacity:1; font-size:9px; right:7px; bottom:7px; padding:3px 7px; }
  .dialog-toolbar { font-size:12px; padding:10px; } .dialog-toolbar button { white-space:nowrap; }
  .dialog-image img { min-width:850px; max-width:none; width:100%; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }