/* YTC 官网内页共用样式（11/4）。色值、字体照 H2 首页：米色底 #F5F1EA、字 #1E1B16、金 #8A6A3B、深底 #15120E */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}html,body{overflow-x:clip}
body{font-family:Archivo,system-ui,sans-serif;-webkit-font-smoothing:antialiased;background:#F5F1EA;color:#1E1B16}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
.serif{font-family:Newsreader,Georgia,serif;font-weight:400;letter-spacing:-.01em}
.eb{font:600 13px/1.35 Archivo;letter-spacing:.16em;text-transform:uppercase;color:#755729}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:#1E1B16;color:#fff;padding:12px 16px;font:600 14px/1 Archivo}.skip:focus{top:12px}

/* 顶栏：内页没有大照片，字用深色 */
.nav{position:relative;z-index:10;display:flex;align-items:center;gap:28px;padding:22px 56px;font:500 15px/1 Archivo;border-bottom:1px solid #DDD5C8;background:#F5F1EA}
.nav .lg img{height:44px;width:auto}.nav .sp{flex:1}
.nav>a:not(.lg):not(.call){color:#2A2620}.nav>a:not(.lg):not(.call):hover{color:#8A6A3B}
.nav>a[aria-current]{color:#8A6A3B;box-shadow:inset 0 -2px 0 #8A6A3B;padding-bottom:6px}
.nav .call{background:#8A6A3B;color:#fff;padding:13px 20px;font-weight:600;white-space:nowrap}
.menu{display:none;background:#fff;border:1.5px solid #8A6A3B;color:#8A6A3B;font:600 14px/1 Archivo;padding:9px 12px;cursor:pointer}
.mnav{display:none}
.mnav.open{display:flex;flex-direction:column;position:absolute;left:12px;right:12px;top:72px;z-index:50;padding:8px 0;border-radius:6px;background:#fff;border:1px solid #D8D0C3;box-shadow:0 20px 40px -20px rgba(0,0,0,.3)}
.mnav.open a{padding:14px 18px;font:600 16px/1 Archivo}

.crumb{padding:22px 56px 0;font:500 13px/1.5 Archivo;color:#6A6357}.crumb a{color:#755729}.crumb span{margin:0 9px;color:#B5AB9C}.crumb b{font-weight:500;color:#4A443B}

/* 页首：左字右图 */
.head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;padding:36px 56px 90px}
.head.solo{grid-template-columns:minmax(0,760px);padding-bottom:70px}
.head h1{font-size:62px;line-height:1.04;margin:18px 0 22px;text-wrap:balance}
.lede>p:not(.eb){font:400 18px/1.6 Archivo;color:#4A443B;max-width:560px}.lede>p:not(.eb)+p{margin-top:14px}
.head .ph{aspect-ratio:4/3;overflow:hidden;background:#D8D0C3}.head .ph img{width:100%;height:100%;object-fit:cover}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;font:600 15px/1 Archivo;border:1.5px solid #8A6A3B;color:#8A6A3B;background:transparent;cursor:pointer}
.btn.f{background:#8A6A3B;color:#fff}.btn:hover{border-color:#5E4522}.btn.f:hover{background:#755729}

/* 段落 */
.sec{padding:90px 56px}
.sec.alt{background:#EDE7DD}
.sec.dark{background:#15120E;color:#F5F1EA}.sec.dark .eb{color:#C9A56B}.sec.dark .intro{color:#CFC6B8}
.sec h2{font-size:46px;line-height:1.06;margin:14px 0 18px;text-wrap:balance}
.sec .intro{font:400 18px/1.6 Archivo;color:#4A443B;max-width:620px}.sec .intro+.intro{margin-top:14px}
.ul{text-decoration:underline;text-underline-offset:3px}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start}

/* 品项卡 */
.items .hd{margin-bottom:10px}
.grp{margin-top:34px}.grp h3.eb{padding-top:12px;border-top:1px solid #CFC6B8;margin-bottom:16px}
.cards{display:grid;grid-template-columns:repeat(var(--c,3),minmax(0,1fr));gap:22px}
.card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:#D8D0C3}
.card figcaption{padding-top:12px;font:600 17px/1.3 Archivo}

/* 四格事实、九步 */
.facts{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 32px;margin-top:30px}
.facts li{border-top:1px solid #CFC6B8;padding:20px 0 6px}
.facts b{display:block;font-size:30px;line-height:1.1}
.facts span{display:block;margin-top:8px;font:400 15px/1.5 Archivo;color:#4A443B}
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:40px;margin-top:40px}
.steps li{border-top:1px solid #3A352D;padding:22px 0 26px}
.sec:not(.dark) .steps li{border-top-color:#CFC6B8}
.steps .n{display:block;font:500 13px/1 'IBM Plex Mono',monospace;color:#C9A56B}.sec:not(.dark) .steps .n{color:#755729}
.steps h3{font-size:28px;line-height:1.1;margin:12px 0 6px}
.steps p{font:400 15px/1.5 Archivo;color:#BFB6A8}.sec:not(.dark) .steps p{color:#4A443B}
.steps.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px}

.rels{display:flex;flex-wrap:wrap;gap:10px;margin-top:40px}
.rel{display:inline-flex;align-items:center;gap:10px;padding:13px 18px;border:1.5px solid #CFC6B8;font:600 15px/1.2 Archivo;color:#2A2620}.rel:hover{border-color:#8A6A3B;color:#8A6A3B}

/* 照片记录 */
.fields{margin:24px 0 0;padding:13px 0;border-top:1px solid #CFC6B8;border-bottom:1px solid #CFC6B8;font:500 13px/1.6 'IBM Plex Mono',monospace;color:#755729;text-transform:uppercase;letter-spacing:.06em}
.fields i{font-style:normal;color:#6A6357;text-transform:none;letter-spacing:0;margin-right:8px}
.stat{padding-top:10px}.stat b{display:block;font-size:110px;line-height:.9;color:#8A6A3B}
.stat span{display:block;margin-top:14px;font:400 17px/1.5 Archivo;color:#4A443B;max-width:340px}
.stat p{margin-top:22px;font:400 18px/1.6 Archivo;color:#1E1B16;max-width:420px}

/* 项目 */
.pjlist{list-style:none;margin:28px 0 0;border-top:1px solid #CFC6B8;max-width:600px}
.pjlist li{padding:13px 0 14px;border-bottom:1px solid #CFC6B8}
.pjlist b{display:block;font-size:24px;line-height:1.2}
.pjlist span{display:block;margin-top:6px;font:600 12px/1.3 Archivo;letter-spacing:.12em;text-transform:uppercase;color:#755729}
.pjlist li.more{border-bottom:0}.pjlist li.more b{color:#8A6A3B;font-size:30px}.pjlist li.more span{text-transform:none;letter-spacing:0;font:400 15px/1.5 Archivo;color:#4A443B}
.head .ph.slides{position:relative;aspect-ratio:4/5;align-self:start}
.slides .im{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;opacity:0;transition:opacity .8s ease}.slides .im.on{opacity:1}

/* 资料表 */
.dl{margin-top:24px;border-top:1px solid #CFC6B8}
.dl>div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;padding:13px 0;border-bottom:1px solid #CFC6B8}
.dl dt{font:600 12px/1.6 Archivo;letter-spacing:.1em;text-transform:uppercase;color:#755729}
.dl dd{font:400 17px/1.5 Archivo;color:#1E1B16;overflow-wrap:anywhere}

/* 询价段（深底） */
.cta{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:72px;align-items:end}
.clist{list-style:none;border-top:1px solid #3A352D}
.clist li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid #3A352D;font:400 16px/1.5 Archivo;color:#EDE6DA;overflow-wrap:anywhere}
.clist li span{font:600 12px/1.9 Archivo;letter-spacing:.1em;text-transform:uppercase;color:#C9A56B}
.clist a{text-decoration:underline;text-underline-offset:3px}
.clist li p{margin:0}
.clist.dark-on-light{border-top-color:#CFC6B8;margin-top:18px}.clist.dark-on-light li{border-bottom-color:#CFC6B8;color:#1E1B16}.clist.dark-on-light li span{color:#755729}
.sec.dark .btn:not(.f){color:#E0BE84;border-color:#C9A56B}

/* 表单 */
.form{display:grid;gap:18px;max-width:620px}
.form label{display:grid;gap:8px;font:600 14px/1.3 Archivo;color:#2A2620}
.form input:not([type=radio]),.form textarea{width:100%;font:400 16px/1.4 Archivo;color:#1E1B16;background:#fff;border:1.5px solid #CFC6B8;padding:13px 14px;border-radius:0}
.form input:focus,.form textarea:focus{outline:2px solid #8A6A3B;outline-offset:1px;border-color:#8A6A3B}
.form fieldset{border:0}.form legend{font:600 14px/1.3 Archivo;color:#2A2620;margin-bottom:10px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{display:block}.opt input{position:absolute;opacity:0;pointer-events:none}
.opt span{display:inline-block;padding:11px 14px;border:1.5px solid #CFC6B8;background:#fff;font:500 14.5px/1.2 Archivo;color:#2A2620;cursor:pointer}
.opt input:checked+span{background:#8A6A3B;border-color:#8A6A3B;color:#fff}
.opt input:focus-visible+span{outline:2px solid #1E1B16;outline-offset:2px}
.form .btn{justify-self:start;margin-top:4px}
.err{font:600 14px/1.4 Archivo;color:#A33A1E}
.note{font:400 14px/1.5 Archivo;color:#6A6357}

/* 页脚 */
.foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:40px;padding:40px 56px 48px;background:#1E1B16;color:#BFB6A8}
.foot img{height:40px;width:auto}.foot .nap{margin-top:16px;font:400 15px/1.7 Archivo}.foot .nap b{color:#fff;font-weight:600}
.foot nav{display:flex;flex-wrap:wrap;gap:12px 24px;align-content:start;font:500 14px/1.4 Archivo}.foot nav a:hover{color:#fff}

/* 淡入：没有脚本就直接看得到 */
.js .fade{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.js .fade.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .fade{opacity:1;transform:none;transition:none}.slides .im{transition:none}}

@media (max-width:1180px){.nav{gap:20px;padding:20px 32px}.nav>a:not(.lg):not(.call){display:none}.menu{display:inline-flex}}
@media (max-width:1100px){
 .head{gap:40px;padding:30px 32px 70px}.head h1{font-size:50px}.crumb{padding:20px 32px 0}
 .sec{padding:76px 32px}.sec h2{font-size:40px}.two,.cta{gap:44px}
 .cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.facts{grid-template-columns:1fr 1fr}
 .foot{padding:36px 32px 44px}}
@media (max-width:760px){
 .nav{padding:14px 18px;gap:0}.nav .lg img{height:34px}.nav .call{padding:10px 12px;font-size:14px}.menu{margin-left:10px}.mnav.open{top:62px}
 .crumb{padding:16px 18px 0;font-size:12.5px}
 .head,.head.solo{grid-template-columns:1fr;gap:28px;padding:22px 18px 56px}.head h1{font-size:38px;margin:14px 0 16px}
 .head .ph{order:2}.lede>p:not(.eb){font-size:16px}.btn{height:50px;width:100%;justify-content:center}
 .sec{padding:60px 18px}.sec h2{font-size:32px}.sec .intro{font-size:16px}.two,.cta{grid-template-columns:1fr;gap:34px}
 .cards{grid-template-columns:1fr 1fr;gap:16px 12px}.card figcaption{font-size:14.5px;padding-top:8px}
 .cards .card:last-child:nth-child(odd){grid-column:1/-1}.cards .card:last-child:nth-child(odd) img{aspect-ratio:16/9}
 .facts{grid-template-columns:1fr 1fr;gap:0 18px}.facts b{font-size:24px}.facts span{font-size:14px}
 .steps,.steps.two{grid-template-columns:1fr 1fr;column-gap:18px;margin-top:28px}.steps li{padding:16px 0 18px}.steps h3{font-size:22px}.steps p{font-size:14px}
 .stat b{font-size:76px}
 .pjlist b{font-size:21px}.pjlist li.more b{font-size:24px}
 .head .ph.slides{aspect-ratio:4/3}
 .dl>div{grid-template-columns:1fr;gap:4px}.clist li{grid-template-columns:1fr;gap:2px}
 .foot{grid-template-columns:1fr;padding:30px 18px 40px}}

/* 11/4 设计审稿后 */
.steps.two.big{max-width:none;column-gap:56px}.steps.two.big .n{font-size:15px}.steps.two.big h3{font-size:40px}.steps.two.big p{font-size:17px}
.relsec{padding-top:56px;padding-bottom:56px}
.head .ph.slides{align-self:stretch;aspect-ratio:auto;min-height:520px}
.clist li{grid-template-columns:190px minmax(0,1fr)}
.docs{list-style:none;margin:22px 0 4px;border-top:1px solid #CFC6B8}
.docs li{padding:13px 0;border-bottom:1px solid #CFC6B8}.docs b{display:block;font:600 16px/1.35 Archivo;color:#1E1B16}.docs span{display:block;margin-top:3px;font:400 15px/1.5 Archivo;color:#4A443B}
.small{margin-top:18px;font:400 13px/1.55 Archivo;color:#6A6357}
@media (max-width:760px){.steps.two.big h3{font-size:28px}.steps.two.big p{font-size:15px}.head .ph.slides{aspect-ratio:4/3;min-height:0}.clist li{grid-template-columns:1fr}}
