/* 案例沿用官网内页字体和宽度，以真实网站截图为主视觉。 */
#main [data-inner-v3] .case-shell{width:min(1320px,calc(100% - 96px));margin-inline:auto}
#main [data-inner-v3] .case-index-intro{padding:132px 0 58px}
#main [data-inner-v3] .case-index-intro h1{margin:0;font-size:clamp(38px,3.5vw,50px);font-weight:500;line-height:1.4}
#main [data-inner-v3] .case-grid-v2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:88px 36px;padding:0 0 120px}
#main [data-inner-v3] .case-card-v2{min-width:0;transition:transform .4s ease}
#main [data-inner-v3] .case-card-v2 a{display:block;color:inherit;text-decoration:none}
#main [data-inner-v3] .case-card-v2 figure{margin:0;aspect-ratio:16/10;overflow:hidden;background:#f7f7f7;border:1px solid #e6e8e7;border-radius:4px}
#main [data-inner-v3] .case-card-v2 img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:0;transition:transform .4s ease}
#main [data-inner-v3] .case-card-copy{padding:18px 0 0}
#main [data-inner-v3] .case-card-meta{margin:0 0 7px;color:#737b76;font-size:14px;line-height:1.5}
#main [data-inner-v3] .case-card-copy h2{margin:0;font-size:clamp(24px,2.1vw,30px);font-weight:550;line-height:1.35}
#main [data-inner-v3] .case-card-v2:is(:hover,:focus-within){transform:translateY(-4px)}
#main [data-inner-v3] .case-card-v2:is(:hover,:focus-within) img{transform:scale(1.03)}
#main [data-inner-v3] .case-card-v2 a:focus-visible{outline:2px solid var(--brand-green);outline-offset:7px}
#main [data-inner-v3] .case-detail-intro{padding:112px 0 56px}
#main [data-inner-v3] .case-back{display:inline-flex;align-items:center;min-height:40px;color:#59615d;font-size:14px;text-decoration:none}
#main [data-inner-v3] .case-back:hover{color:var(--brand-green)}
#main [data-inner-v3] .case-kicker{margin:42px 0 10px;color:#818985;font-size:13px;line-height:1.5;letter-spacing:.1em}
#main [data-inner-v3] .case-detail-intro h1{margin:0;font-size:clamp(42px,4.1vw,62px);font-weight:500;line-height:1.25}
#main [data-inner-v3] .case-detail-lede{margin:16px 0 52px;font-size:clamp(20px,1.8vw,26px);line-height:1.55;color:#454c48}
#main [data-inner-v3] .case-hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:36px;padding-top:25px;border-top:1px solid #e5e8e6}
#main [data-inner-v3] .case-hero-facts{display:grid;grid-template-columns:.7fr 1fr .8fr 2fr;gap:24px;flex:1;margin:0}
#main [data-inner-v3] .case-hero-facts div{min-width:0}
#main [data-inner-v3] .case-hero-facts dt{margin:0 0 8px;color:#7c8580;font-size:13px;line-height:1.5}
#main [data-inner-v3] .case-hero-facts dd{margin:0;color:#242a26;font-size:15px;line-height:1.7}
#main [data-inner-v3] .case-hero-visit{display:inline-flex;gap:9px;align-items:center;min-height:42px;white-space:nowrap;color:#212723;font-size:15px;text-underline-offset:5px}
#main [data-inner-v3] .case-hero-visit:hover{color:var(--brand-green)}
#main [data-inner-v3] .case-cover{margin:0}
#main [data-inner-v3] .case-cover img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid #e6e8e7;border-radius:4px}
#main [data-inner-v3] .case-section{display:grid;grid-template-columns:280px minmax(0,1fr);gap:48px;padding:104px 0;border-bottom:1px solid #e5e8e6}
#main [data-inner-v3] .case-section-heading span{display:block;margin-bottom:14px;color:#848c87;font-size:13px;letter-spacing:.08em}
#main [data-inner-v3] .case-section-heading h2{margin:0;font-size:32px;font-weight:500;line-height:1.4}
#main [data-inner-v3] .case-overview p{max-width:810px;margin:0;color:#353d38;font-size:22px;line-height:1.9}
#main [data-inner-v3] .case-overview p+p{margin-top:1.25em}
#main [data-inner-v3] .case-services ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin:0;padding:0;list-style:none}
#main [data-inner-v3] .case-services li{margin:0;padding:18px 0;border-top:1px solid #e5e8e6;color:#303833;font-size:18px;line-height:1.5}
#main [data-inner-v3] .case-gallery-section{display:block;padding-bottom:110px}
#main [data-inner-v3] .case-gallery-section .case-section-heading{margin-bottom:52px}
#main [data-inner-v3] .case-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:68px 28px}
#main [data-inner-v3] .case-gallery-image{grid-column:1/-1;min-width:0;margin:0}
#main [data-inner-v3] .case-gallery-image img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid #e6e8e7;border-radius:4px}
#main [data-inner-v3] .case-gallery-image figcaption{padding-top:13px;color:#707974;font-size:14px}
#main [data-inner-v3] [data-case="shengkeda"] .case-gallery-image-2,#main [data-inner-v3] [data-case="yunkai"] .case-gallery-image-2{grid-column:3/12}
#main [data-inner-v3] [data-case="taiwan-perfume"] .case-gallery-image-2{grid-column:7/-1}
#main [data-inner-v3] [data-case="maison-aurevon"] .case-gallery-image{grid-column:span 6}
#main [data-inner-v3] [data-case="langshanshi"] .case-gallery-image-2{grid-column:2/12}
#main [data-inner-v3] .case-website{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:42px 0 76px}
#main [data-inner-v3] .case-website h2{margin:0;font-size:24px;font-weight:500}
#main [data-inner-v3] .case-website a{display:inline-flex;align-items:center;min-height:44px;gap:9px;color:#202622;font-size:18px;text-underline-offset:5px}
#main [data-inner-v3] .case-website a:hover{color:var(--brand-green)}
#main [data-inner-v3] .case-next{padding:66px 0 120px;border-top:1px solid #e5e8e6}
#main [data-inner-v3] .case-next a{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center;color:inherit;text-decoration:none}
#main [data-inner-v3] .case-next-copy{display:flex;flex-direction:column;align-items:start;gap:19px}
#main [data-inner-v3] .case-next-copy > span:first-child{color:#858d88;font-size:13px;letter-spacing:.1em}
#main [data-inner-v3] .case-next-copy strong{font-size:clamp(31px,3.2vw,48px);font-weight:500;line-height:1.35}
#main [data-inner-v3] .case-next-copy > span:last-child{font-size:16px;text-decoration:underline;text-underline-offset:5px}
#main [data-inner-v3] .case-next img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border:1px solid #e6e8e7;border-radius:4px;transition:transform .4s ease}
#main [data-inner-v3] .case-next a:hover img{transform:scale(1.02)}
#main [data-inner-v3] .case-next a:hover .case-next-copy > span:last-child{color:var(--brand-green)}
#main [data-inner-v3] :where(.case-hero-visit,.case-website a,.case-next a):focus-visible{outline:2px solid var(--brand-green);outline-offset:6px}
#main [data-inner-v3] .case-feature-intro{padding:100px 0 48px}
#main [data-inner-v3] .case-feature-intro .case-kicker{margin:38px 0 14px}
#main [data-inner-v3] .case-feature-intro h1{max-width:1100px;margin:0;font-size:clamp(38px,5vw,68px);font-weight:500;line-height:1.12;letter-spacing:-.035em}
#main [data-inner-v3] .case-feature-type{margin:17px 0 0;color:#515a54;font-size:clamp(19px,1.8vw,24px);line-height:1.45}
#main [data-inner-v3] .case-feature-utility{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:48px;padding-top:22px;border-top:1px solid #e5e8e6}
#main [data-inner-v3] .case-feature-utility p{margin:0;color:#323a35;font-size:15px;line-height:1.7}
#main [data-inner-v3] .case-feature-utility p span{margin-right:18px;color:#7d8580}
#main [data-inner-v3] .case-feature-utility a{white-space:nowrap;color:#202622;font-size:16px;text-underline-offset:5px}
#main [data-inner-v3] .case-stage{margin:0;padding:clamp(24px,4.5vw,70px);background:#f5f5f2}
#main [data-inner-v3] .case-stage .v3-image-button{line-height:0}
#main [data-inner-v3] .case-stage img{display:block;width:100%;height:auto;border:1px solid #e1e4e3;border-radius:5px;box-shadow:0 8px 28px rgba(13,30,42,.08)}
#main [data-inner-v3] .case-stage figcaption{padding:16px 0 0;color:#66706a;font-size:13px;line-height:1.5;letter-spacing:.04em}
#main [data-inner-v3] .case-feature-showcase h2{margin:0;color:#7b847e;font-size:13px;font-weight:500;line-height:1.5;letter-spacing:.13em}
#main [data-inner-v3] .case-feature-showcase h2{margin:0 0 24px}
#main [data-inner-v3] .case-stage-services{background:#f2f4f5}
#main [data-inner-v3] .case-feature-pair{display:grid;grid-template-columns:1fr 4fr;gap:32px;align-items:center;margin:78px 0}
#main [data-inner-v3] .case-feature-pair-label{align-self:center}
#main [data-inner-v3] .case-feature-pair-label span{color:#7b847e;font-size:13px;letter-spacing:.13em}
#main [data-inner-v3] .case-feature-pair-label p{margin:12px 0 0;font-size:20px;line-height:1.5}
#main [data-inner-v3] .case-stage-about{padding:clamp(20px,3vw,45px)}
#main [data-inner-v3] .case-stage-detail{background:#102038}
#main [data-inner-v3] .case-stage-detail img{height:auto;aspect-ratio:2.3;object-fit:cover;object-position:center 42%;border-color:#546170}
#main [data-inner-v3] .case-stage-detail figcaption{color:#d9dfe5}
#main [data-inner-v3] .case-feature-website{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:94px 0;border-bottom:1px solid #e5e8e6}
#main [data-inner-v3] .case-feature-website > span{color:#7b847e;font-size:13px;letter-spacing:.13em}
#main [data-inner-v3] .case-feature-website a{color:#202622;font-size:clamp(25px,3vw,40px);font-weight:500;text-underline-offset:8px}
#main [data-inner-v3] .case-feature-next{border:0}
#main [data-inner-v3] :where(.case-feature-utility a,.case-feature-website a):focus-visible{outline:2px solid var(--brand-green);outline-offset:6px}
@media (max-width:1000px){
  #main [data-inner-v3] .case-hero-bottom{align-items:start;flex-direction:column}
  #main [data-inner-v3] .case-hero-facts{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
  #main [data-inner-v3] .case-section{grid-template-columns:210px minmax(0,1fr);gap:35px}
}
@media (max-width:700px){
  #main [data-inner-v3] .case-shell{width:calc(100% - 40px)}
  #main [data-inner-v3] .case-index-intro{padding:100px 0 36px}
  #main [data-inner-v3] .case-grid-v2{grid-template-columns:1fr;gap:58px;padding-bottom:76px}
  #main [data-inner-v3] .case-card-copy{padding-top:15px}
  #main [data-inner-v3] .case-detail-intro{padding:82px 0 35px}
  #main [data-inner-v3] .case-kicker{margin-top:29px}
  #main [data-inner-v3] .case-detail-intro h1{font-size:36px}
  #main [data-inner-v3] .case-detail-lede{margin:12px 0 34px;font-size:19px}
  #main [data-inner-v3] .case-hero-facts{gap:22px 16px}
  #main [data-inner-v3] .case-hero-facts dd{font-size:14px}
  #main [data-inner-v3] .case-cover img{aspect-ratio:3/2}
  #main [data-inner-v3] .case-section{display:block;padding:72px 0}
  #main [data-inner-v3] .case-section-heading{margin-bottom:26px}
  #main [data-inner-v3] .case-section-heading h2{font-size:26px}
  #main [data-inner-v3] .case-overview p{font-size:17px;line-height:1.85}
  #main [data-inner-v3] .case-services li{font-size:15px}
  #main [data-inner-v3] .case-gallery-section{padding-bottom:76px}
  #main [data-inner-v3] .case-gallery-section .case-section-heading{margin-bottom:32px}
  #main [data-inner-v3] .case-gallery{grid-template-columns:1fr;gap:42px}
  #main [data-inner-v3] .case-gallery-image,#main [data-inner-v3] [data-case] .case-gallery-image{grid-column:1}
  #main [data-inner-v3] .case-website{padding:34px 0 54px}
  #main [data-inner-v3] .case-website h2{font-size:19px}
  #main [data-inner-v3] .case-website a{font-size:15px}
  #main [data-inner-v3] .case-next{padding:52px 0 82px}
  #main [data-inner-v3] .case-next a{display:flex;flex-direction:column;align-items:stretch;gap:28px}
  #main [data-inner-v3] .case-next-copy{gap:10px}
  #main [data-inner-v3] .case-next-copy strong{font-size:32px}
  #main [data-inner-v3] .case-feature-intro{padding:80px 0 30px}
  #main [data-inner-v3] .case-feature-intro .case-kicker{margin-top:25px}
  #main [data-inner-v3] .case-feature-intro h1{font-size:clamp(34px,9vw,46px)}
  #main [data-inner-v3] .case-feature-utility{align-items:start;flex-direction:column;gap:15px;margin-top:32px}
  #main [data-inner-v3] .case-feature-utility p span{display:block;margin:0 0 4px}
  #main [data-inner-v3] .case-stage{padding:16px}
  #main [data-inner-v3] .case-stage figcaption{padding-top:11px}
  #main [data-inner-v3] .case-feature-pair{display:block;margin:46px 0}
  #main [data-inner-v3] .case-feature-pair-label{margin-bottom:18px}
  #main [data-inner-v3] .case-feature-pair-label p{margin-top:4px;font-size:17px}
  #main [data-inner-v3] .case-stage-detail img{aspect-ratio:1.4}
  #main [data-inner-v3] .case-feature-website{display:block;padding:70px 0}
  #main [data-inner-v3] .case-feature-website > span{display:block;margin-bottom:15px}
  #main [data-inner-v3] .case-feature-website a{font-size:25px}
}
@media (prefers-reduced-motion:reduce){
  #main [data-inner-v3] :where(.case-card-v2,.case-card-v2 img,.case-next img){transition:none}
  #main [data-inner-v3] .case-card-v2:is(:hover,:focus-within),#main [data-inner-v3] .case-card-v2:is(:hover,:focus-within) img,#main [data-inner-v3] .case-next a:hover img{transform:none}
}
:is(.cases-page,.case-detail-page) .desktop-nav > a,:is(.cases-page,.case-detail-page) .desktop-nav > button{white-space:nowrap}
@media (min-width:1101px) and (max-width:1280px){
  :is(.cases-page,.case-detail-page) .site-header{grid-template-columns:180px 1fr 160px;padding-inline:28px}
  :is(.cases-page,.case-detail-page) .desktop-nav > a,:is(.cases-page,.case-detail-page) .desktop-nav > button{padding-inline:10px;font-size:15px}
}
