@ -1,157 +1,295 @@
import { getLocalizedPath , type Locale } from '../i18n/utils' ;
import { getTranslation } from '../i18n/utils' ;
import { Icon , trackIcons } from '../icons' ;
import { useState , useEffect } from 'react' ;
export default function Footer ( { locale } : { locale : Locale } ) {
const t = getTranslation ( locale ) ;
const f = t . footer ;
const brandName = t . brand || 'BaskBuddy' ;
// ICP 备案正式编号(2026-07-28 工信部审核通过)
const icpNumber = '沪ICP备2026035550号' ;
const icpNumber = '沪ICP备2026035550号-2 ' ;
// 公安备案数据码(阿里云已下发,有效期至 2026-08-27,审核完成后替换为正式沪公网安备号)
const psbFilingCode = 'c7c31b218d433ab92abbf85ec20af2bd' ;
// 邮箱复制状态
const [ copied , setCopied ] = useState ( false ) ;
useEffect ( ( ) = > {
if ( ! copied ) return ;
const timer = setTimeout ( ( ) = > setCopied ( false ) , 2000 ) ;
return ( ) = > clearTimeout ( timer ) ;
} , [ copied ] ) ;
const handleCopyEmail = async ( ) = > {
try {
await navigator . clipboard . writeText ( f . contact . email ) ;
setCopied ( true ) ;
} catch ( err ) {
// Fallback: create hidden textarea
const ta = document . createElement ( 'textarea' ) ;
ta . value = f . contact . email ;
ta . style . position = 'fixed' ;
ta . style . opacity = '0' ;
document . body . appendChild ( ta ) ;
ta . select ( ) ;
try {
document . execCommand ( 'copy' ) ;
setCopied ( true ) ;
} catch ( e ) {
// ignore
}
document . body . removeChild ( ta ) ;
}
} ;
// 三语辅助:英文用 en 文本,繁体用 hk 文本,简体用 zh 文本。
const zhText = ( zh : string , hk : string , en : string ) = >
locale === 'en' ? en : locale === 'hk' ? hk : zh ;
return (
< footer className = "bg-[var(--brand-black)] border-t border-[color-mix(in_oklch,var(--brand-white)_10%,transparent)]" >
< div className = "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12 md:py-16" >
{ /* Main Footer Grid */ }
< div className = "grid grid-cols-1 md:grid-cols-4 gap-8 md:gap-12 mb-10 md:mb-14" >
{ /* Column 1: Brand */ }
< div className = "md:col-span-1" >
< div className = "flex items-center gap-3 mb-4" >
< div className = "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-14 md:py-20" >
{ /* ========== Main Footer: 4-Column Grid ========== */ }
< div className = "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-10 lg:gap-8 mb-12 lg:mb-16" >
{ /* ===== Column 1: Brand (4 cols on desktop) ===== */ }
< div className = "lg:col-span-4" >
{ /* Logo + Brand */ }
< div className = "flex items-center gap-3 mb-6" >
< img
src = "/baskbuddy-logo.png"
src = "https://oss.baskbuddy.com/baskbuddy /baskbuddy-logo.png"
alt = "BaskBuddy"
className = "w-12 h-12 object-contain rounded-xl bg-white"
/ >
< span className = "font-semibold text-body text-[var(--brand)]" style = { { fontFamily : 'var(--font-body)' } } >
{ brandName }
< / span >
< div className = "flex flex-col" >
< span className = "font-semibold text-body text-[var(--brand)] leading-tight" style = { { fontFamily : 'var(--font-body)' } } >
{ brandName }
< / span >
< span className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] mt-0.5" style = { { fontFamily : 'var(--font-body)' } } >
{ t . brandSub || '巴适伙伴' }
< / span >
< / div >
< / div >
< p className = "text-body leading-relaxed mb-4 text-[color-mix(in_oklch,var(--brand-white)_60%,transparent)]" >
{ zhText (
'以温暖科技,连接美好生活。五大赛道全面覆盖数字生活服务生态。' ,
'以溫暖科技,連接美好生活。五大賽道全面覆蓋數位生活服務生態。' ,
'Connecting beautiful life with warm tech. Five tracks covering the digital life service ecosystem.' ,
) }
{ /* Slogan */ }
< h3 className = "text-[28px] md:text-[32px] font-bold leading-tight mb-3 text-[var(--brand-white)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . slogan }
< / h3 >
< p className = "text-body leading-relaxed mb-6 text-[color-mix(in_oklch,var(--brand-white)_65%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . subtitle }
< / p >
< div className = "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-micro font-semibold tracking-[0.06em] uppercase bg-[color-mix(in_oklch,var(--brand)_12%,transparent)] text-[color-mix(in_oklch,var(--brand)_92%,transparent)] border border-[color-mix(in_oklch,var(--brand)_22%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
I · C · I · D · P
{ /* ICIDP Culture Badge */ }
< div className = "inline-flex items-center gap-2 px-4 py-2 rounded-xl bg-[color-mix(in_oklch,var(--brand)_10%,transparent)] border border-[color-mix(in_oklch,var(--brand)_20%,transparent)]" >
< span className = "text-micro font-bold tracking-[0.12em] text-[var(--brand)]" style = { { fontFamily : 'var(--font-body)' } } >
I · C · I · D · P
< / span >
< span className = "w-px h-4 bg-[color-mix(in_oklch,var(--brand)_30%,transparent)]" / >
< span className = "text-micro tracking-wide text-[color-mix(in_oklch,var(--brand-white)_55%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ zhText ( '诚信·勇敢·创新·奉献·激情' , '誠信·勇敢·創新·奉獻·激情' , 'Integrity · Courage · Innovation · Devotion · Passion' ) }
< / span >
< / div >
< / div >
{ /* Column 2: Quick Links */ }
< div >
< h4 className = "text-micro font-semibold tracking-[0.08em] uppercase mb-4 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ zhText ( '快速导航' , '快速導航' , 'QUICK LINKS' ) }
{ /* ===== Column 2: Business Tracks (3 cols) ===== */ }
< div className = "lg:col-span-3" >
< h4 className = "text-micro font-bold tracking-[0.1em] uppercase mb-5 text-[color-mix(in_oklch,var(--brand-white)_45 %,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . columns . tracks }
< / h4 >
< div className = "flex flex-col gap-3.5 leading-relaxed " >
{ Object . entries ( t . nav ) . map ( ( [ key , label ] ) = > (
< div className = "grid grid-cols-2 gap-x-3 gap-y-3 " >
{ Object . entries ( t . home . tracks ) . map ( ( [ key , track ] ) = > (
< a
key = { key }
href = { getLocalizedPath ( ` / ${ key === 'home' ? '' : key } ` , locale ) }
className = "inline-flex items-center text-body transition-colors duration-200 text-[color-mix(in_oklch,var(--brand-white)_65%,transparent)] hover:text-[var(--brand)]"
href = { getLocalizedPath ( '/business' , locale ) }
className = "group flex items-center gap-2.5 px-3 py-2.5 rounded-xl transition-all duration-200 hover:bg-[color-mix(in_oklch,var(--brand)_10%,transparent)] border border-transparent hover:border-[color-mix(in_oklch,var(--brand)_20%,transparent)]"
title = { track . desc }
>
{ label }
< span className = "flex items-center justify-center w-8 h-8 rounded-lg bg-[color-mix(in_oklch,var(--brand)_12%,transparent)] text-[var(--brand)] group-hover:bg-[var(--brand-accent)] group-hover:text-white transition-colors duration-200 shrink-0" >
< Icon name = { trackIcons [ key ] } className = "w-4 h-4" / >
< / span >
< span className = "text-body font-medium text-[color-mix(in_oklch,var(--brand-white)_75%,transparent)] group-hover:text-[var(--brand-white)] transition-colors duration-200" style = { { fontFamily : 'var(--font-body)' } } >
{ track . name }
< / span >
< / a >
) ) }
< / div >
< / div >
{ /* Column 3: Tracks */ }
< div >
< h4 className = "text-micro font-semibold tracking-[0.08em] uppercase mb-4 text-[color-mix(in_oklch,var(--brand-white)_50 %,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ zhText ( '业务赛道' , '業務賽道' , 'BUSINESS TRACKS' ) }
{ /* ===== Column 3: Quick Navigate (2 cols) ===== */ }
< div className = "lg:col-span-2" >
< h4 className = "text-micro font-bold tracking-[0.1em] uppercase mb-5 text-[color-mix(in_oklch,var(--brand-white)_45 %,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . columns . navigate }
< / h4 >
< div className = "flex flex-col gap-3.5 leading-relaxed" >
{ Object . entries ( t . home . tracks ) . map ( ( [ key , track ] ) = > (
< a key = { key } href = "/business" className = "inline-flex items-center gap-2 text-body transition-colors duration-200 text-[color-mix(in_oklch,var(--brand-white)_65%,transparent)] hover:text-[var(--brand)]" >
< Icon name = { trackIcons [ key ] } className = "w-4 h-4" / >
{ track . name }
< / a >
< ul className = "flex flex-col gap-3" >
{ Object . entries ( t . nav ) . map ( ( [ key , label ] ) = > (
< li key = { key } >
< a
href = { getLocalizedPath ( ` / ${ key === 'home' ? '' : key } ` , locale ) }
className = "inline-flex items-center text-body transition-colors duration-200 text-[color-mix(in_oklch,var(--brand-white)_70%,transparent)] hover:text-[var(--brand)] hover:pl-1"
style = { { fontFamily : 'var(--font-body)' } }
>
{ label }
< / a >
< / li >
) ) }
< / div >
< / ul >
< / div >
{ /* Column 4: Contact */ }
< div >
< h4 className = "text-micro font-semibold tracking-[0.08em] uppercase mb-4 text-[color-mix(in_oklch,var(--brand-white)_50 %,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ zhText ( '联系我们' , '聯繫我們' , 'CONTACT' ) }
{ /* ===== Column 4: Contact (3 cols) ===== */ }
< div className = "lg:col-span-3" >
< h4 className = "text-micro font-bold tracking-[0.1em] uppercase mb-5 text-[color-mix(in_oklch,var(--brand-white)_45 %,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . columns . contact }
< / h4 >
< div className = "flex flex-col gap-3.5 leading-relaxed" >
< a href = "/contact" className = "text-body transition-colors duration-200 text-[color-mix(in_oklch,var(--brand-white)_65%,transparent)] hover:text-[var(--brand)]" >
{ zhText ( '求职咨询' , '求職諮詢' , 'Job Inquiry' ) }
< div className = "flex flex-col gap-4" >
{ /* Careers */ }
< a href = { getLocalizedPath ( '/contact' , locale ) } className = "group block p-4 rounded-xl bg-[color-mix(in_oklch,var(--brand-white)_4%,transparent)] border border-[color-mix(in_oklch,var(--brand-white)_8%,transparent)] hover:border-[color-mix(in_oklch,var(--brand)_30%,transparent)] transition-all duration-200" >
< div className = "flex items-center justify-between mb-1" >
< span className = "text-body font-semibold text-[var(--brand-white)] group-hover:text-[var(--brand)] transition-colors duration-200" style = { { fontFamily : 'var(--font-body)' } } >
{ f . contact . jobs . label }
< / span >
< Icon name = "arrowUpRight" className = "w-4 h-4 text-[color-mix(in_oklch,var(--brand-white)_40%,transparent)] group-hover:text-[var(--brand)] transition-colors duration-200" / >
< / div >
< p className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . contact . jobs . hint }
< / p >
< / a >
< a href = "/contact" className = "text-body transition-colors duration-200 text-[color-mix(in_oklch,var(--brand-white)_65%,transparent)] hover:text-[var(--brand)]" >
{ zhText ( '商务合作' , '商務合作' , 'Business Cooperation' ) }
{ /* Business */ }
< a href = { getLocalizedPath ( '/contact' , locale ) } className = "group block p-4 rounded-xl bg-[color-mix(in_oklch,var(--brand-white)_4%,transparent)] border border-[color-mix(in_oklch,var(--brand-white)_8%,transparent)] hover:border-[color-mix(in_oklch,var(--brand)_30%,transparent)] transition-all duration-200" >
< div className = "flex items-center justify-between mb-1" >
< span className = "text-body font-semibold text-[var(--brand-white)] group-hover:text-[var(--brand)] transition-colors duration-200" style = { { fontFamily : 'var(--font-body)' } } >
{ f . contact . biz . label }
< / span >
< Icon name = "arrowUpRight" className = "w-4 h-4 text-[color-mix(in_oklch,var(--brand-white)_40%,transparent)] group-hover:text-[var(--brand)] transition-colors duration-200" / >
< / div >
< p className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . contact . biz . hint }
< / p >
< / a >
{ /* Email: Click to mail, text selectable, 1-click copy with feedback */ }
< div className = "pt-1" >
< p className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_45%,transparent)] mb-2" style = { { fontFamily : 'var(--font-body)' } } >
{ zhText ( '统一联系邮箱(求职 / 商务)' , '統一聯繫郵箱(求職 / 商務)' , 'Unified Contact Email' ) }
< / p >
< div className = "group inline-flex items-center gap-1 px-3 py-2 rounded-xl bg-[color-mix(in_oklch,var(--brand-white)_4%,transparent)] border border-[color-mix(in_oklch,var(--brand-white)_8%,transparent)] hover:border-[color-mix(in_oklch,var(--brand)_30%,transparent)] transition-all duration-200 w-full" >
< Icon name = "mail" className = "w-4 h-4 shrink-0 text-[var(--brand)]" / >
< a
href = { ` mailto: ${ f . contact . email } ` }
className = "text-body font-medium text-[var(--brand-white)] hover:text-[var(--brand)] transition-colors duration-200 select-all outline-none"
style = { { fontFamily : 'var(--font-body)' , userSelect : 'all' } }
onClick = { ( e ) = > e . stopPropagation ( ) }
title = { zhText ( '点击发邮件 · 文本可直接选中复制' , '點擊發郵件 · 文本可直接選中複製' , 'Click to email · Text is selectable' ) }
>
{ f . contact . email }
< / a >
< div className = "ml-auto relative" >
< button
type = "button"
onClick = { handleCopyEmail }
className = "flex items-center justify-center w-8 h-8 rounded-lg transition-all duration-200 text-[color-mix(in_oklch,var(--brand-white)_55%,transparent)] hover:bg-[var(--brand-accent)] hover:text-white focus:outline-none focus:ring-2 focus:ring-[var(--brand-accent)]/50"
title = { copied
? zhText ( '已复制!' , '已複製!' , 'Copied!' )
: zhText ( '一键复制邮箱' , '一鍵複製郵箱' , 'Copy email' ) }
aria - label = { zhText ( '复制邮箱地址' , '複製郵箱地址' , 'Copy email address' ) }
>
< Icon
name = { copied ? 'check' : 'copy' }
className = { ` w-[18px] h-[18px] transition-all duration-200 ${ copied ? 'text-[var(--sus-green)] scale-110' : '' } ` }
/ >
< / button >
{ /* Tooltip */ }
< span
className = { ` absolute -top-10 left-1/2 -translate-x-1/2 px-2.5 py-1 rounded-lg text-micro whitespace-nowrap transition-all duration-200 pointer-events-none ${
copied
? 'opacity-100 -translate-y-1 bg-[var(--sus-green)] text-white shadow-lg'
: 'opacity-0 translate-y-1 bg-[color-mix(in_oklch,var(--brand-white)_92%,var(--brand-black))] text-[var(--brand-black)] group-hover:opacity-100 group-hover:-translate-y-1'
} ` }
style = { { fontFamily : 'var(--font-body)' } }
>
{ copied
? zhText ( '✓ 已复制' , '✓ 已複製' , '✓ Copied' )
: zhText ( '点击复制' , '點擊複製' , 'Click to copy' ) }
< / span >
< / div >
< / div >
< / div >
{ /* Address */ }
< p className = "flex items-start gap-2 text-body pt-1 text-[color-mix(in_oklch,var(--brand-white)_55%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
< Icon name = "mapPin" className = "w-4 h-4 shrink-0 mt-0.5" / >
< span className = "leading-relaxed" > { f . contact . address } < / span >
< / p >
< / div >
< / div >
< / div >
{ /* ========== Bottom Bar ========== */ }
< div className = "border-t border-[color-mix(in_oklch,var(--brand-white)_10%,transparent)] pt-6 md:pt-7" >
< div className = "flex flex-col md:flex-row md:items-center md:justify-between gap-6" >
{ /* Left: Copyright */ }
< div className = "flex flex-col md:flex-row md:items-center gap-3 md:gap-4" >
< p className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_55%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } >
{ f . copyright }
< / p >
< span className = "hidden md:inline w-px h-4 bg-[color-mix(in_oklch,var(--brand-white)_15%,transparent)]" aria - hidden = "true" / >
< p className = "text-micro font-semibold tracking-[0.08em] uppercase text-[color-mix(in_oklch,var(--brand-white)_35%,transparent)] md:hidden" style = { { fontFamily : 'var(--font-body)' } } aria - hidden = "true" >
{ f . icidpFull }
< / p >
< / div >
{ /* Center: Legal Links */ }
< div className = "flex flex-wrap items-center justify-start md:justify-center gap-x-3 gap-y-2" >
{ /* ICP */ }
< a
href = "mailto:baskbuddy@163.com"
className = "text-body font-medium transition-all duration-200 hover:underline underline-offset-2 text-[var(--brand)] hover:text-[var(--brand-white)]"
href = "https://beian.miit.gov.cn/"
target = "_blank"
rel = "noopener noreferrer"
className = "group inline-flex items-center text-micro transition-all duration-200 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)]"
title = { zhText ( '工信部ICP/IP地址/域名信息备案管理系统' , '工信部ICP/IP地址/域名信息備案管理系統' , 'MIIT ICP Filing Query (China)' ) }
style = { { fontFamily : 'var(--font-body)' } }
title = { zhText ( '点击发送邮件 (求职)' , '點擊發送郵件 (求職)' , 'Click to send email (Jobs)' ) }
>
baskbuddy @163 . com
< Icon name = "shieldCheck" className = "w-3.5 h-3.5 mr-1.5 opacity-70 group-hover:opacity-100" / >
{ icpNumber }
< / a >
< span className = "text-[color-mix(in_oklch,var(--brand-white)_18%,transparent)]" aria - hidden = "true" > · < / span >
{ /* PSB */ }
< a
href = "mailto:baskbuddy@163.com"
className = "text-micro transition-all duration-200 hover:underline underline-offset-2 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[color-mix(in_oklch,var(--brand-white)_85%,transparent)]"
href = "https://beian.mps.gov.cn/"
target = "_blank"
rel = "noopener noreferrer"
className = "group inline-flex items-center text-micro transition-all duration-200 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)]"
title = { zhText ( '全国互联网安全管理服务平台 — 公安备案' , '全國互聯網安全管理服務平台 — 公安備案' , 'MPS Public Security Internet Filing (China)' ) }
style = { { fontFamily : 'var(--font-body)' } }
title = { zhText ( '点击发送邮件 (商务)' , '點擊發送郵件 (商務)' , 'Click to send email (Business)' ) }
>
baskbuddy @163 . com
< Icon name = "shieldCheck" className = "w-3.5 h-3.5 mr-1.5 opacity-70 group-hover:opacity-100" / >
{ zhText (
` 公安备案数据码 ${ psbFilingCode } ` ,
` 公安備案數據碼 ${ psbFilingCode } ` ,
` PSB Filing Code ${ psbFilingCode } ` ,
) }
< / a >
< span className = "text-[color-mix(in_oklch,var(--brand-white)_18%,transparent)]" aria - hidden = "true" > · < / span >
{ /* Privacy */ }
< a
href = { getLocalizedPath ( '/privacy' , locale ) }
className = "text-micro transition-all duration-200 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)]"
style = { { fontFamily : 'var(--font-body)' } }
>
{ f . legal . privacy }
< / a >
< p className = "flex items-start gap-1 text-micro text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)]" title = { zhText ( '巴适伙伴(上海)科技有限公司 办公地址' , '巴適夥伴(上海)科技有限公司 辦公地址' , 'BaskBuddy (Shanghai) Office' ) } >
< Icon name = "mapPin" className = "w-3.5 h-3.5 shrink-0 mt-0.5" / >
< span > { zhText ( '中国 · 上海市静安区康宁路288弄2号410室' , '中國 · 上海市靜安區康寧路288弄2號410室' , "Room 410, No.2, Lane 288, Kangning Rd, Jing'an District, Shanghai, China" ) } < / span >
< / p >
< / div >
< / div >
< / div >
{ /* Bottom Bar */ }
< div className = "border-t border-[color-mix(in_oklch,var(--brand-white)_10%,transparent)] pt-6 flex flex-col md:flex-row items-center justify-between gap-5" >
< div className = "flex flex-col md:flex-row items-center gap-3 md:gap-4 text-center md:text-left" >
< p className = "text-micro text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)]" >
{ zhText (
` © 2026 巴适伙伴(上海)科技有限公司. 保留所有权利 ` ,
` © 2026 巴適夥伴(上海)科技有限公司. 保留所有權利 ` ,
` © 2026 BaskBuddy (Shanghai) Technology Co., Ltd. All rights reserved. ` ,
) }
{ /* Desktop-only ICIDP tagline */ }
< div className = "hidden md:flex mt-5 pt-5 border-t border-[color-mix(in_oklch,var(--brand-white)_6%,transparent)] justify-center" >
< p className = "text-micro font-semibold tracking-[0.2em] uppercase text-[color-mix(in_oklch,var(--brand-white)_30%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } aria - hidden = "true" >
{ f . icidpFull }
< / p >
< a
href = "https://beian.miit.gov.cn/"
target = "_blank"
rel = "noopener noreferrer"
className = "text-micro transition-all duration-200 hover:underline underline-offset-2 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)]"
title = { zhText ( '工信部ICP/IP地址/域名信息备案管理系统' , '工信部ICP/IP地址/域名信息備案管理系統' , 'MIIT ICP Filing Query (China)' ) }
>
{ icpNumber }
< / a >
< a
href = "https://beian.mps.gov.cn/"
target = "_blank"
rel = "noopener noreferrer"
className = "text-micro transition-all duration-200 hover:underline underline-offset-2 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)] inline-flex items-center gap-1"
title = { zhText ( '全国互联网安全管理服务平台 — 公安备案' , '全國互聯網安全管理服務平台 — 公安備案' , 'MPS Public Security Internet Filing (China)' ) }
>
< Icon name = "shieldCheck" className = "w-3.5 h-3.5" / >
{ zhText (
` 公安备案数据码 ${ psbFilingCode } ` ,
` 公安備案數據碼 ${ psbFilingCode } ` ,
` PSB Filing Code ${ psbFilingCode } ` ,
) }
< / a >
< a href = "/privacy" className = "text-micro transition-all duration-200 hover:underline underline-offset-2 text-[color-mix(in_oklch,var(--brand-white)_50%,transparent)] hover:text-[var(--brand)]" >
{ zhText ( '隐私政策' , '隱私政策' , 'Privacy' ) }
< / a >
< / div >
< p className = "text-micro font-semibold tracking-wide text-[color-mix(in_oklch,var(--brand-white)_45%,transparent)]" style = { { fontFamily : 'var(--font-body)' } } aria - hidden = "true" >
Integrity · Courage · Innovation · Devotion · Passion
< / p >
< / div >
< / div >
< / footer >