/* V4 设计校准：仅修改本区块视觉，数据及既有动画控制器保持不变。 */
/* 首页 About Us 的内容轨道、文字及媒体共用前台与 Gutenberg 样式。 */
.yumin-home-about { padding:104px 0 96px; background:#f3f8f7; color:#0c2c2f; font-family:YuminHomeHero,Inter,Arial,sans-serif; }
.yumin-home-about__inner { width:min(1184px,calc(100% - 56px)); margin-inline:auto; }
.yumin-home-about__head { display:flex; align-items:center; justify-content:space-between; gap:40px; padding-bottom:44px; border-bottom:1px solid #dce9e8; }
.yumin-home-about__copy { min-width:0; }
.yumin-home-about .yumin-home-about__copy h2 { margin:0; color:inherit; font-size:clamp(30.4px,2.9vw,43.2px); font-weight:700; line-height:1.12; letter-spacing:-.02em; }
.yumin-home-about .yumin-home-about__copy p { max-width:62ch; margin:16px 0 0; color:#5b7377; font-size:15.52px; line-height:1.7; overflow-wrap:anywhere; }
.yumin-home-about__head .yumin-button { display:inline-flex; flex-shrink:0; align-items:center; justify-content:center; gap:14px; box-sizing:border-box; min-height:52px; padding:12px 28px; border-radius:999px; font-size:14px; font-weight:700; line-height:1.4; text-decoration:none; transition:background .3s,box-shadow .35s,transform .35s; }
.yumin-home-about__head .yumin-button svg { flex:none; width:22px; height:11px; transition:transform .35s cubic-bezier(.22,.61,.36,1); }
.yumin-home-about__head .yumin-button--teal { color:#fff; background:#00928e; }
.yumin-home-about__head .yumin-button:focus-visible,.yumin-home-about__play:focus-visible,.yumin-home-about__watch:focus-visible { outline:3px solid #00928e; outline-offset:5px; }
.yumin-home-about__highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px; padding-top:46px; }
.yumin-home-about__highlight { min-width:0; }
.yumin-home-about .yumin-home-about__highlight h3 { position:relative; margin:0; padding-bottom:11px; color:inherit; font-size:15.5px; font-weight:700; line-height:1.3; overflow-wrap:anywhere; }
.yumin-home-about__highlight h3::after { position:absolute; bottom:0; left:0; width:26px; height:2px; border-radius:3px; background:#00928e; content:""; }
.yumin-home-about .yumin-home-about__highlight p { margin:12px 0 0; color:#5b7377; font-size:13.5px; line-height:1.68; overflow-wrap:anywhere; }
/* 未点击时只展示封面；遮罩不会拦截媒体原位编辑和播放按钮。 */
.yumin-home-about__media { position:relative; display:block; overflow:hidden; width:100%; min-height:280px; margin-top:64px; border-radius:18px; aspect-ratio:1440 / 600; background:#edf6f5; cursor:pointer; }
.yumin-home-about__media > img { position:absolute; inset:0; display:block; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; object-fit:cover; object-position:center; }
.yumin-home-about__media > img { transition:transform 1.1s cubic-bezier(.22,.61,.36,1),opacity .3s; }
/* 原内置图片四边有28px透明留边；补偿裁切只作用该素材，悬浮增幅仍为4%。 */
.yumin-home-about__media > .yumin-home-about__cover--framed { transform:scale(1.12); }
.yumin-home-about__veil { position:absolute; inset:0; pointer-events:none; background:linear-gradient(to top,rgba(4,44,48,.72) 0%,rgba(4,44,48,.18) 45%,rgba(0,146,142,.12) 100%); transition:opacity .3s; }
.yumin-home-about__play { position:absolute; z-index:1; bottom:34px; left:36px; display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; color:#00928e; background:#fff; box-shadow:0 14px 34px rgba(0,40,40,.35); cursor:pointer; transition:background .3s,color .3s,transform .4s cubic-bezier(.22,.61,.36,1); }
.yumin-home-about__play svg { width:16px; height:16px; margin-left:2px; }
.yumin-home-about__watch { position:absolute; z-index:1; bottom:46px; left:94px; max-width:calc(100% - 154px); margin:0; padding:0; border:0; color:#fff; background:transparent; font:inherit; font-size:14.5px; font-weight:700; line-height:1.4; text-align:left; text-decoration:none; text-shadow:0 1px 8px rgba(0,0,0,.22); cursor:pointer; }
/* 弹窗外壳复用设计稿的 960px、24px 圆角、14px 内边距与深青色模糊遮罩。 */
.yumin-home-tour-dialog { position:fixed; inset:0; z-index:100010; display:none; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:20px; border:0; overflow:hidden; background:transparent; color:#fff; font-family:YuminHomeHero,Inter,Arial,sans-serif; }
.yumin-home-tour-dialog[open] { display:grid; place-items:center; perspective:1400px; }
.yumin-home-tour-dialog::backdrop { background:transparent; }
.yumin-home-tour-dialog__veil { position:absolute; inset:0; background:rgba(4,32,36,.62); backdrop-filter:blur(4px); }
.yumin-home-tour-dialog__panel { position:relative; z-index:2; width:min(960px,calc(100vw - 40px)); max-width:calc((100dvh - 80px) * 16 / 9 + 28px); padding:14px; border-radius:24px; background:#08222a; box-shadow:0 30px 70px rgba(8,55,58,.14); transform-origin:center; will-change:transform,opacity; }
.yumin-home-tour-dialog__frame { position:relative; overflow:hidden; width:100%; aspect-ratio:16 / 9; border-radius:12px; background:#04191c; }
.yumin-home-tour-dialog__poster,.yumin-home-tour-dialog .yumin-home-about__player { position:absolute; inset:0; width:100%; height:100%; max-width:none; max-height:none; margin:0; padding:0; border:0; }
.yumin-home-tour-dialog__poster { object-fit:cover; }
.yumin-home-tour-dialog__poster--framed { transform:scale(1.12); }
.yumin-home-tour-dialog[data-phase="open"] .yumin-home-tour-dialog__panel { will-change:auto; }
.yumin-home-tour-dialog .yumin-home-about__player { z-index:1; opacity:0; object-fit:contain; background:#000; transition:opacity .3s; }
.yumin-home-tour-dialog__frame.is-ready .yumin-home-about__player { opacity:1; }
.yumin-home-tour-dialog__close { position:absolute; z-index:6; top:14px; right:14px; display:grid; place-items:center; width:38px; height:38px; margin:0; padding:0; border:0; border-radius:50%; color:rgba(255,255,255,.85); background:rgba(8,34,42,.42); font:400 25.6px/1 Arial,sans-serif; cursor:pointer; transition:color .25s,background .25s; }
.yumin-home-tour-dialog__close:hover { color:#fff; background:#00928e; }
.yumin-home-tour-dialog button:focus-visible,.yumin-home-tour-dialog video:focus-visible { outline:2px solid #31d1c7; outline-offset:3px; }
.yumin-home-tour-dialog__status { position:absolute; z-index:2; left:50%; top:50%; width:max-content; max-width:calc(100% - 40px); padding:12px 18px; border-radius:12px; background:rgba(4,32,36,.8); color:#fff; font-size:14px; line-height:1.6; text-align:center; transform:translate(-50%,-50%); pointer-events:none; }
.yumin-home-tour-dialog__retry { position:absolute; z-index:3; left:50%; top:calc(50% + 50px); padding:8px 18px; border:1px solid rgba(255,255,255,.5); border-radius:999px; background:#00928e; color:#fff; font:inherit; cursor:pointer; transform:translateX(-50%); }
.yumin-home-tour-dialog [hidden] { display:none !important; }
.yumin-home-tour-dialog__fx { position:absolute; z-index:3; left:50%; top:50%; transform:translate(-50%,-50%); pointer-events:none; }
/* SVG 仅保存 Three 生成的折射向量场；不能 display:none，否则部分浏览器不解析引用滤镜。 */
.yumin-home-tour-dialog__heat-defs { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
/* CSS 柔光作为基础动效，WebGL 不可用时仍有完整开合体验，不阻塞真实视频。 */
.yumin-home-tour-dialog__panel::after { position:absolute; inset:-2px; border:1px solid rgba(92,240,220,.65); border-radius:26px; box-shadow:0 0 36px rgba(36,213,191,.26); opacity:0; pointer-events:none; content:""; }
.yumin-home-tour-dialog[data-phase="opening"] .yumin-home-tour-dialog__panel::after { animation:yumin-tour-gather .64s ease both; }
.yumin-home-tour-dialog[data-phase="closing"] .yumin-home-tour-dialog__panel::after { animation:yumin-tour-scatter .46s ease both; }
.yumin-home-tour-dialog[data-motion="three"] .yumin-home-tour-dialog__panel::after { animation:none; }
@keyframes yumin-tour-gather { 0% { opacity:0; transform:scale(1.06); } 45% { opacity:.75; } 100% { opacity:0; transform:scale(1); } }
@keyframes yumin-tour-scatter { 0% { opacity:0; transform:scale(1); } 35% { opacity:.6; } 100% { opacity:0; transform:scale(1.1); } }
@media(hover:hover) {
 .yumin-home-about__head .yumin-button:hover { box-shadow:0 14px 26px rgba(0,146,142,.22); }
 .yumin-home-about__head .yumin-button--teal:hover { background:#007f7b; }
 /* 与设计稿一致：整个封面区域触发按钮反馈，不要求精确悬浮小按钮。 */
 .yumin-home-about__media:hover .yumin-home-about__play { color:#fff; background:#00928e; }
}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
 .yumin-home-about__head .yumin-button:hover { transform:translateY(-2px); }
 .yumin-home-about__head .yumin-button:hover svg { transform:translateX(5px); }
 .yumin-home-about__media:hover img { transform:scale(1.04); }
 .yumin-home-about__media:hover > .yumin-home-about__cover--framed { transform:scale(1.1648); }
 .yumin-home-about__media:hover .yumin-home-about__play { transform:scale(1.08); }
}
@media(max-width:1024px) { .yumin-home-about__head { flex-direction:column; align-items:flex-start; gap:26px; } .yumin-home-about__highlights { grid-template-columns:1fr; gap:34px; } }
@media(max-width:760px) {
 .yumin-home-tour-dialog__frame.has-error .yumin-home-tour-dialog__status { top:38%; padding:8px 12px; font-size:12px; }
 .yumin-home-tour-dialog__retry { top:auto; bottom:10px; padding:6px 14px; font-size:12px; }
 .yumin-home-about { padding:72px 0; }
 .yumin-home-about__inner { width:calc(100% - 40px); }
 .yumin-home-about__head .yumin-button { width:100%; }
 .yumin-home-about__media { min-height:0; margin-top:48px; border-radius:16px; aspect-ratio:4 / 3; }
 .yumin-home-about__play { bottom:20px; left:20px; width:44px; height:44px; }
 .yumin-home-about__watch { bottom:32px; left:78px; max-width:calc(100% - 106px); font-size:13.76px; }
}
@media(prefers-reduced-motion:reduce) { .yumin-home-about__head .yumin-button,.yumin-home-about__head .yumin-button svg,.yumin-home-about__media img,.yumin-home-about__play { transition:none; transform:none; } .yumin-home-about__media > .yumin-home-about__cover--framed { transform:scale(1.12); } .yumin-home-about__player,.yumin-home-about__veil,.yumin-home-tour-dialog__close { transition:none !important; } .yumin-home-tour-dialog__panel::after { animation:none !important; } }