/* YiHub 官网 · 2026-09-24 改版：白底、品牌绿、系统字体（苹方 / SF），截图直接放在白底上。 */

:root{
  --paper:#fff;
  --ink:#15332a;
  --muted:#5a6a62;
  --faint:#8a9790;
  --rule:#e4eae6;
  --green:#237652;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Segoe UI","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC",sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--paper);color-scheme:light;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
h1,h2,p,figure,dl,dd{margin:0}
h1,h2{font-weight:600}
img{display:block;max-width:100%;height:auto}
em{font-style:normal}
::selection{background:#d6e9dd}
:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.col{width:min(1080px,100% - 80px);margin-inline:auto}
.nowrap{white-space:nowrap}
.skip-link{position:absolute;left:16px;top:-64px;z-index:10;padding:10px 14px;background:var(--paper)}
.skip-link:focus{top:12px}

/* 页头 */
.site-head .col{height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px}
.brand-icon{width:28px;height:28px;border-radius:7px}
.brand-word{width:auto;height:18px}
.head-nav{display:flex;gap:32px;font-size:14px;color:var(--muted)}
.head-nav a,.foot-nav a{transition:color .2s}
.head-nav a:hover,.head-nav a[aria-current="page"],.foot-nav a:hover{color:var(--ink)}

/* 首屏 */
.hero{padding-top:112px;text-align:center}
.hero h1{font-size:clamp(36px,5.2vw,66px);line-height:1.2;letter-spacing:-.01em}
.hero h1 em,.closing em{color:var(--green)}
.hero-sub{margin-top:20px;font-size:17px;color:var(--muted);letter-spacing:.02em}
.hero-shot{width:320px;margin:72px auto 0}
/* 截图按 iPhone 屏幕圆角裁角（6.9 英寸屏幕约 62pt，等于截图宽的 14.24%），不加描边、阴影或背景板 */
.shot img{border-radius:14.24% / 6.555%}

/* 五段功能 */
.features{max-width:880px;padding:136px 0 24px}
.feature{display:grid;grid-template-columns:1fr 1fr;column-gap:64px;align-items:center;padding:64px 0}
.feature:nth-of-type(even) .feature-text{order:2}
.feature-text{max-width:400px}
.num{margin-bottom:18px;font-size:13px;color:var(--green);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.feature h2{font-size:clamp(26px,2.9vw,34px);line-height:1.45}
.feature h2 span{display:block}
.desc{margin-top:16px;font-size:17px;color:var(--muted)}
.feature .shot{justify-self:center;width:280px}
.shots-note{margin-top:48px;text-align:center;font-size:13px;color:var(--faint)}

/* 我们怎么想 */
.beliefs{max-width:880px;padding-top:128px;text-align:center}
.beliefs h2{font-size:14px;color:var(--green);letter-spacing:.14em}
.beliefs dl{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:40px}
.beliefs dt{font-size:18px;font-weight:600}
.beliefs dd{margin-top:8px;font-size:14px;line-height:1.7;color:var(--muted)}
.beliefs dd span{display:block}

/* 收尾 */
.closing{padding:152px 0 160px;text-align:center}
.closing-mark{width:44px;margin:0 auto 32px}
.closing p{font-size:clamp(26px,3.4vw,40px);font-weight:600;line-height:1.35}

/* 页脚 */
.site-foot{border-top:1px solid var(--rule);padding:40px 0 48px;font-size:13px;color:var(--muted)}
.foot-main{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;flex-wrap:wrap}
.foot-brand img{width:auto;height:16px}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 28px}
.foot-legal{margin-top:28px;font-size:12px;line-height:1.8;color:var(--faint);overflow-wrap:anywhere}

/* 说明类页面（关于、隐私、条款、支持） */
.doc{max-width:720px;min-height:60vh;padding:96px 0 128px}
.doc .eyebrow{margin-bottom:18px;font-size:12px;color:var(--green);letter-spacing:.14em}
.doc h1{font-size:clamp(32px,4.2vw,44px);line-height:1.3;letter-spacing:-.005em}
.doc .meta{margin:14px 0 48px;font-size:14px;color:var(--faint)}
.doc h2{margin:44px 0 10px;font-size:19px}
.doc p,.doc li{color:var(--muted);line-height:1.9;overflow-wrap:anywhere}
.doc p+p{margin-top:1em}
.doc ul{padding-left:1.3em}
.company-details{display:grid;grid-template-columns:140px 1fr;margin:24px 0 28px;border-top:1px solid var(--rule)}
.company-details dt,.company-details dd{padding:14px 0;border-bottom:1px solid var(--rule);font-size:15px}
.company-details dt{color:var(--faint)}
.company-details dd{overflow-wrap:anywhere}
.ul-link{color:var(--green);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.contact-email{font-size:clamp(20px,3vw,26px);font-weight:500;color:var(--green);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;overflow-wrap:anywhere}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* 手机 */
@media (max-width:720px){
  .col{width:calc(100% - 32px)}
  .site-head .col{height:60px}
  .brand-icon{width:26px;height:26px;border-radius:6px}
  .brand-word{height:16px}
  .head-nav{gap:22px}

  .hero{padding-top:64px}
  .hero h1{font-size:clamp(30px,9.4vw,40px);line-height:1.3}
  .hero-sub{margin-top:14px;font-size:15px}
  .hero-shot{width:min(260px,70vw);margin-top:44px}

  .features{padding:80px 0 8px}
  .feature{grid-template-columns:1fr;row-gap:32px;padding:44px 0;text-align:center}
  .feature:nth-of-type(even) .feature-text{order:0}
  .feature-text{max-width:none}
  .num{margin-bottom:12px}
  .feature h2{font-size:24px}
  .desc{margin-top:10px;font-size:15px}
  .feature .shot{width:min(250px,66vw)}
  .shots-note{margin-top:36px;font-size:12px}

  .beliefs{padding-top:88px}
  .beliefs dl{grid-template-columns:repeat(2,1fr);gap:28px 16px;margin-top:28px}
  .beliefs dt{font-size:16px}
  .beliefs dd{font-size:13px}

  .closing{padding:104px 0 112px}
  .closing-mark{width:38px;margin-bottom:24px}

  .site-foot{padding:32px 0 40px}
  .foot-main{flex-direction:column;align-items:flex-start}
  .foot-nav{gap:6px 20px}
  .foot-legal{margin-top:24px}

  .doc{padding:56px 0 88px}
  .doc .meta{margin-bottom:36px}
  .doc h2{margin-top:36px;font-size:18px}
  .doc p,.doc li{font-size:15px}
  .company-details{grid-template-columns:1fr}
  .company-details dt{padding-bottom:0;border:0}
  .company-details dd{padding-top:4px}
}
