/* ===== Core Services · Reference Layout ===== */
.home-services-section{position:relative;padding:94px 0 104px;background:linear-gradient(180deg,#fff 0%,#f7f9fc 100%);overflow:hidden}
.home-services-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 46% 38% at 16% 70%,rgba(202,219,237,.32),transparent 74%),radial-gradient(ellipse 38% 35% at 85% 36%,rgba(231,238,246,.72),transparent 76%)}
.services-reference-container{position:relative;width:min(100% - 48px,1440px);margin:0 auto}
.services-reference-heading{margin:0 0 40px;text-align:center}
.services-reference-title-row{display:flex;align-items:center;justify-content:center;gap:26px}
.services-reference-title-row>span{width:22px;height:2px;background:var(--color-orange)}
.services-reference-title-row h2{margin:0;color:var(--color-navy);font-size:clamp(2rem,3.1vw,2.75rem);font-weight:780;line-height:1.18;letter-spacing:-.03em}
.services-reference-heading>p{margin:7px 0 0;color:#94a3b8;font-family:var(--font-en);font-size:.8rem;font-weight:750;letter-spacing:.17em}

.services-reference-tabs{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin:0 0 38px;padding:0 22px}
.service-reference-tab{position:relative;display:flex;min-width:0;min-height:94px;align-items:center;justify-content:center;gap:9px;padding:13px 8px 17px;color:var(--color-navy);background:transparent;border:0;cursor:pointer;font:inherit;font-size:.94rem;font-weight:720;line-height:1.35;outline-offset:-4px;transition:color 220ms ease,background-color 220ms ease}
.service-reference-tab::after{position:absolute;top:18px;right:0;width:1px;height:54px;background:#dce3ec;content:""}
.service-reference-tab:last-child::after{display:none}
.service-reference-tab::before{position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--color-orange);content:"";transform:translateX(-50%);transition:width 260ms cubic-bezier(.22,1,.36,1)}
.service-reference-tab:hover,.service-reference-tab:focus-visible,.service-reference-tab.active{color:var(--color-orange)}
.service-reference-tab.active::before{width:76px}
.service-reference-tab:focus-visible{background:rgba(245,130,32,.06)}
.service-reference-tab-icon{display:flex;width:34px;height:34px;align-items:center;justify-content:center;color:currentColor;transition:transform 260ms cubic-bezier(.22,1,.36,1)}
.service-reference-tab-icon svg{width:29px;height:29px;stroke:currentColor}
.service-reference-tab:hover .service-reference-tab-icon,.service-reference-tab.active .service-reference-tab-icon{transform:translateY(-2px)}
:root[lang^="zh"] #service-tab-ddu{gap:5px;padding-right:2px;padding-left:2px}
:root[lang^="zh"] #service-tab-ddu>span:last-child{font-size:.9em;letter-spacing:-.05em;white-space:nowrap}

.services-reference-detail{position:relative;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);min-height:438px;overflow:hidden;background:#fff;border:1px solid #e2e8f0;border-radius:16px;box-shadow:0 18px 42px rgba(7,27,56,.09)}
.services-reference-media{position:relative;min-height:438px;margin:0;overflow:hidden;background:#dce7f0}
.services-reference-media::after{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,27,56,.03) 0%,rgba(7,27,56,.02) 70%,rgba(255,255,255,.3) 100%);content:"";pointer-events:none}
.services-reference-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.015);transition:opacity 320ms ease,transform 620ms cubic-bezier(.22,1,.36,1)}
.services-reference-media.is-switching img{opacity:0;transform:scale(1.045)}
.services-reference-copy{position:relative;z-index:0;display:flex;min-width:0;padding:clamp(40px,5.1vw,74px) clamp(34px,5vw,68px) 42px;flex-direction:column;justify-content:center;background:#fff;transition:opacity 180ms ease,transform 180ms ease}
.services-reference-copy::after{position:absolute;z-index:-1;right:24px;bottom:26px;width:210px;height:180px;background-image:radial-gradient(circle,rgba(126,149,177,.18) 1.15px,transparent 1.25px);background-position:0 0;background-size:10px 10px;content:"";mask-image:linear-gradient(135deg,transparent 7%,#000 50%,transparent 96%);opacity:.55;pointer-events:none}
.services-reference-copy.is-switching{opacity:0;transform:translateY(8px)}
.services-reference-service-title{display:flex;align-items:center;gap:16px;margin-bottom:25px}
.services-reference-badge{display:flex;width:62px;height:62px;align-items:center;justify-content:center;flex:0 0 62px;color:var(--color-orange);background:#fff2e7;border-radius:50%}
.services-reference-badge svg{width:30px;height:30px;stroke:currentColor}
.services-reference-service-title h3{margin:0;color:var(--color-navy);font-size:clamp(1.75rem,2.4vw,2.35rem);font-weight:790;line-height:1.15;letter-spacing:-.025em}
.services-reference-service-title p{margin:5px 0 0;color:var(--color-orange);font-family:var(--font-en);font-size:.83rem;font-weight:760;letter-spacing:.04em}
.services-reference-desc{max-width:565px;margin:0 0 32px;color:#53657d;font-size:.98rem;line-height:1.9}
.services-reference-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 35px;padding:0;list-style:none}
.services-reference-benefits li{display:flex;min-width:0;min-height:66px;align-items:center;justify-content:center;gap:8px;padding:10px 8px;color:#31425a;background:rgba(255,255,255,.92);border:1px solid #e4e9f0;border-radius:9px;font-size:.8rem;font-weight:680;line-height:1.45;text-align:center;box-shadow:0 4px 14px rgba(7,27,56,.025)}
.services-reference-benefits svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:var(--color-orange);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7}
.services-reference-link{display:inline-flex;width:max-content;align-items:center;gap:10px;padding-bottom:8px;color:var(--color-orange);border-bottom:2px solid var(--color-orange);font-size:.95rem;font-weight:750;text-decoration:none;transition:gap 220ms ease,color 220ms ease}
.services-reference-link:hover,.services-reference-link:focus-visible{gap:15px;color:#db6810}
.services-reference-link svg{width:18px;height:18px;stroke:currentColor}

@media(max-width:1180px){
  .services-reference-container{width:min(100% - 40px,1040px)}
  .services-reference-tabs{padding:0}
  .service-reference-tab{gap:6px;font-size:.82rem}
  .service-reference-tab-icon{width:30px;height:30px}
  .service-reference-tab-icon svg{width:25px;height:25px}
  .services-reference-copy{padding:42px 38px}
  .services-reference-benefits{grid-template-columns:1fr;gap:8px;margin-bottom:25px}
  .services-reference-benefits li{justify-content:flex-start;padding:10px 13px;text-align:left}
}

@media(max-width:860px){
  .home-services-section{padding:76px 0 82px}
  .services-reference-container{width:min(100% - 32px,720px)}
  .services-reference-tabs{display:flex;gap:0;margin-right:-16px;margin-bottom:28px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:thin}
  .service-reference-tab{min-width:122px;flex:0 0 122px;flex-direction:column;gap:4px;scroll-snap-align:start;font-size:.84rem}
  .service-reference-tab::after{top:20px;height:48px}
  .services-reference-detail{grid-template-columns:1fr;min-height:0}
  .services-reference-media{min-height:0;aspect-ratio:16 / 9}
  .services-reference-copy{padding:38px 32px 40px}
  .services-reference-benefits{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:28px}
  .services-reference-benefits li{min-height:70px;justify-content:center;padding:9px 7px;text-align:center}
}

@media(max-width:560px){
  .home-services-section{padding:60px 0 66px}
  .services-reference-container{width:min(100% - 28px,430px)}
  .services-reference-heading{margin-bottom:26px}
  .services-reference-title-row{gap:16px}
  .services-reference-title-row>span{width:19px}
  .services-reference-title-row h2{font-size:1.85rem}
  .services-reference-heading>p{font-size:.68rem}
  .services-reference-tabs{margin-right:-14px;margin-bottom:23px}
  .service-reference-tab{min-width:108px;min-height:82px;padding:8px 5px 14px;font-size:.76rem}
  .service-reference-tab::after{top:14px;height:43px}
  .service-reference-tab.active::before{width:55px}
  .service-reference-tab-icon svg{width:23px;height:23px}
  .services-reference-detail{border-radius:13px}
  .services-reference-copy{padding:30px 21px 32px}
  .services-reference-service-title{gap:12px;margin-bottom:20px}
  .services-reference-badge{width:52px;height:52px;flex-basis:52px}
  .services-reference-badge svg{width:25px;height:25px}
  .services-reference-service-title h3{font-size:1.58rem}
  .services-reference-service-title p{font-size:.68rem}
  .services-reference-desc{margin-bottom:22px;font-size:.89rem;line-height:1.8}
  .services-reference-benefits{grid-template-columns:1fr;margin-bottom:25px}
  .services-reference-benefits li{min-height:46px;justify-content:flex-start;padding:8px 10px;text-align:left}
  .services-reference-copy::after{right:-28px;bottom:-35px;width:170px;height:145px}
}

@media(prefers-reduced-motion:reduce){
  .service-reference-tab,.service-reference-tab::before,.service-reference-tab-icon,.services-reference-media img,.services-reference-copy,.services-reference-link{transition:none}
}
