/* 回音谷 Echo Valley AI · echoaitech.net
   Apple 风格浅色改版：白底 #fff / #f5f5f7，墨字 #1d1d1f，点缀蓝 #1769cf */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --ink:#1d1d1f; --muted:#6e6e73; --muted2:#515157; --line:#d8dbe0;
  --blue:#1769cf; --blue-dark:#0f4fa8;
  --bg:#ffffff; --bg-soft:#f5f5f7; --bg-soft2:#f8f9fb;
  --shadow:0 12px 32px rgba(36,43,52,.08);
}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{font-family:-apple-system,"SF Pro Display","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,a{-webkit-tap-highlight-color:transparent}
img{display:block;max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.kicker{font-size:12px;letter-spacing:.28em;color:var(--muted);font-weight:600;margin-bottom:16px}
.sec-title{font-size:clamp(32px,4.4vw,52px);font-weight:700;letter-spacing:-.04em;margin-bottom:14px;color:var(--ink)}
.sec-note{color:var(--muted);font-size:16px;margin-bottom:52px;line-height:1.8}

/* header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:12px 32px;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid #e4e6e9;transition:box-shadow .3s}
.brand img{height:30px;width:auto;filter:brightness(0)}
.site-nav{display:flex;gap:28px;align-items:center}
.site-nav a{color:var(--ink);text-decoration:none;font-size:14px;font-weight:500;min-height:44px;display:inline-flex;align-items:center}
.site-nav a:hover{color:var(--blue)}
.nav-cta{background:var(--blue);color:#fff!important;padding:10px 22px;border-radius:999px;font-weight:600}
.nav-cta:hover{background:var(--blue-dark)}

/* hero：浅色编辑风 */
.hero{background:var(--bg);padding:150px 0 90px;text-align:center;overflow:hidden}
.hero-inner{max-width:900px}
.hero-eyebrow{letter-spacing:.5em;font-size:13px;color:var(--muted);font-weight:600;margin-bottom:24px;text-indent:.5em}
.hero-title{font-size:clamp(64px,11vw,132px);font-weight:700;letter-spacing:-.055em;line-height:1.05;color:var(--ink)}
.hero-slogan{margin-top:22px;font-size:clamp(19px,2.6vw,28px);font-weight:500;letter-spacing:-.01em;color:var(--muted2)}
.hero-actions{margin-top:44px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 34px;
  background:var(--blue);color:#fff;text-decoration:none;font-size:16px;font-weight:600;border-radius:999px}
.btn-primary:hover{background:var(--blue-dark)}
.hero-figure{margin-top:72px;max-width:1280px}
.hero-figure picture{display:block;overflow:hidden;border-radius:6px;box-shadow:var(--shadow)}
.hero-figure img{width:100%;height:auto;object-fit:cover;will-change:transform}

/* about */
.about{padding:120px 0 110px;background:var(--bg)}
.about-copy{max-width:820px;margin-bottom:72px}
.about-copy p{font-size:17px;line-height:1.95;color:var(--muted2);margin-bottom:18px;letter-spacing:-.01em}
.about-copy strong{color:var(--ink);font-weight:650}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.pillar{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;transition:box-shadow .3s}
.pillar:hover{box-shadow:var(--shadow)}
.pillar-img{aspect-ratio:4/3;overflow:hidden;background:#eef0f3}
.pillar-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.pillar:hover .pillar-img img{transform:scale(1.04)}
.pillar-index{display:block;font-size:12px;letter-spacing:.18em;color:var(--muted);font-weight:600;padding:22px 22px 0}
.pillar h3{font-size:20px;font-weight:650;letter-spacing:-.02em;padding:10px 22px 0}
.pillar-sub{font-size:14px;color:var(--ink);font-weight:600;padding:8px 22px 0}
.pillar p:last-child{font-size:14px;color:var(--muted);padding:6px 22px 24px;line-height:1.7}

/* partners */
.partners{padding:110px 0;background:var(--bg-soft)}
.logo-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px;margin-top:8px}
.logo-cell{background:#fff;border:1px solid var(--line);border-radius:8px;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;
  padding:14px;transition:box-shadow .25s,transform .25s}
.logo-cell:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.logo-cell img{max-width:100%;max-height:100%;object-fit:contain}
.logo-fallback{font-size:13px;color:var(--muted);font-weight:600;text-align:center;line-height:1.6;padding:0 6px}

/* cases：浅色横向画廊 */
.cases{background:var(--bg-soft2);overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cases-pin{padding:110px 0}
.case-track{display:flex;gap:24px;padding:10px 32px 30px;will-change:transform;width:max-content}
.case-card{flex:0 0 32vw;max-width:440px;min-width:300px;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.case-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#eef0f3}
.case-img img{width:100%;height:100%;object-fit:cover;will-change:transform;transition:transform .5s ease}
.case-card[data-has-video] .case-img{cursor:pointer}
.case-card[data-has-video] .case-img:hover img{transform:scale(1.04)}
.play-badge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.play-badge span{width:72px;height:72px;border-radius:50%;background:rgba(23,105,207,.94);display:flex;align-items:center;justify-content:center;
  font-size:24px;color:#fff;box-shadow:0 8px 28px rgba(0,0,0,.28)}
.placeholder-art{display:flex;align-items:center;justify-content:center;background:#eef0f3}
.placeholder-art span{color:var(--muted);letter-spacing:.4em;font-size:13px;font-weight:600;text-indent:.4em}
.case-card h3{font-size:19px;font-weight:650;letter-spacing:-.02em;margin:0;padding:20px 22px 6px}
.case-card p{color:var(--muted);font-size:14px;margin:0;padding:0 22px 22px;line-height:1.7}

/* ip */
.ip{padding:120px 0;background:var(--bg)}
.ip-chain{max-width:720px;margin:0 auto}
.ip-step{border-top:1px solid var(--line);padding:40px 8px;text-align:left}
.ip-step:last-of-type{border-bottom:1px solid var(--line)}
.ip-num{font-size:13px;letter-spacing:.28em;color:var(--blue);font-weight:700}
.ip-step h3{font-size:25px;font-weight:650;letter-spacing:-.03em;margin:12px 0 14px}
.ip-step p{color:var(--muted2);line-height:1.9;font-size:16px}
.ip-step p strong{color:var(--ink)}
.ip-arrow{display:none}
.ip-gu{width:140px;height:140px;border-radius:50%;overflow:hidden;margin:4px 0 18px;box-shadow:var(--shadow)}
.ip-gu img{width:100%;height:100%;object-fit:cover}

/* awards */
.awards{padding:110px 0;background:var(--bg-soft);text-align:center}
.award-stats{display:flex;justify-content:center;gap:6vw;flex-wrap:wrap;margin:24px 0 56px}
.stat-n{font-size:clamp(34px,4.2vw,54px);font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.stat p{color:var(--muted);margin-top:10px;font-size:15px;line-height:1.8}
.trophies{display:flex;justify-content:center;gap:36px;align-items:flex-end}
.trophies picture{width:110px;height:220px;display:flex;align-items:flex-end;justify-content:center}
.trophies img{max-width:100%;max-height:100%;object-fit:contain}

/* training */
.training{padding:120px 0;background:var(--bg)}
.training-hero{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:88px}
.training-hero picture{border-radius:8px;overflow:hidden;display:block;box-shadow:var(--shadow)}
.training-hero img{width:100%;height:100%;object-fit:cover}
.training-copy h3{font-size:27px;font-weight:650;letter-spacing:-.03em;margin-bottom:16px}
.training-copy p{color:var(--muted2);line-height:1.9;margin-bottom:28px;font-size:16px}
.training-stats{display:flex;gap:48px}
.training-stats strong{display:block;font-size:34px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.training-stats span{font-size:14px;color:var(--muted)}
.sub-h{font-size:23px;font-weight:650;letter-spacing:-.02em;margin-bottom:30px}
.learners{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:88px}
.learners figure{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.learners img{width:100%;aspect-ratio:4/3;object-fit:cover}
.learners figcaption{padding:16px 20px;font-size:15px;font-weight:600;border-top:1px solid var(--line)}
.waicy-band{display:grid;grid-template-columns:1fr 1.4fr;gap:44px;align-items:center;background:var(--bg-soft);
  border:1px solid var(--line);border-radius:10px;padding:44px;overflow:hidden}
.waicy-band picture{border-radius:6px;overflow:hidden;display:block}
.waicy-band img{width:100%;height:100%;object-fit:cover}
.waicy-band h3{font-size:25px;font-weight:650;letter-spacing:-.03em;margin-bottom:14px}
.waicy-band p{color:var(--muted2);line-height:1.9;font-size:16px}

/* footer：浅色 */
.footer{background:var(--bg-soft);border-top:1px solid var(--line);padding:110px 0 56px;text-align:center}
.footer-title{font-size:clamp(34px,5vw,64px);font-weight:700;letter-spacing:-.04em;margin-bottom:60px;color:var(--ink)}
.contact{display:flex;justify-content:center;gap:8vw;flex-wrap:wrap;margin-bottom:64px}
.contact span{font-size:12px;letter-spacing:.28em;color:var(--muted);font-weight:600}
.contact p{font-size:21px;margin-top:12px;color:var(--ink);font-weight:600}
.copyright{color:var(--muted);font-size:13px;margin-top:20px}
.footer-logo{width:150px;height:auto;filter:brightness(0);margin:0 auto}

/* reveal helper (JS animates, no-JS safe default visible) */
.reveal-up{will-change:transform}

/* lightbox（视频播放保持深色罩层） */
.lightbox{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center}
.lightbox.open{display:flex}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(10,10,12,.88)}
.lightbox-box{position:relative;width:min(960px,92vw);z-index:1}
.lightbox-player{aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.5)}
.lightbox-player iframe,.lightbox-player video{width:100%;height:100%;border:0;display:block}
.lightbox-close{position:absolute;top:-56px;right:0;background:none;border:0;color:#fff;font-size:40px;cursor:pointer;line-height:1;
  min-width:48px;min-height:48px}

/* responsive */
@media (max-width:960px){
  .logo-grid{grid-template-columns:repeat(4,1fr)}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .case-card{flex-basis:44vw}
}
@media (max-width:820px){
  .wrap{padding:0 20px}
  .site-header{padding:10px 20px}
  .brand img{height:28px}
  .site-nav{gap:0}
  .site-nav a:not(.nav-cta){display:none}
  .nav-cta{padding:10px 20px;font-size:14px}
  .hero{padding:118px 0 64px}
  .hero-eyebrow{letter-spacing:.32em}
  .hero-actions{margin-top:36px}
  .hero-figure{margin-top:52px}
  .about{padding:88px 0 80px}
  .about-copy{margin-bottom:52px}
  .about-copy p{font-size:16px}
  .pillars{grid-template-columns:1fr;gap:18px}
  .pillar-img{aspect-ratio:16/10}
  .partners{padding:80px 0}
  .sec-note{margin-bottom:36px}
  .cases-pin{padding:80px 0}
  .case-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:thin}
  .case-track{padding:6px 20px 24px;gap:18px}
  .case-card{flex:0 0 78vw;min-width:0;scroll-snap-align:center}
  .ip{padding:88px 0}
  .ip-step{padding:32px 4px}
  .awards{padding:80px 0}
  .award-stats{gap:32px;margin:16px 0 44px}
  .trophies{gap:22px}
  .trophies picture{width:84px;height:170px}
  .training{padding:88px 0}
  .training-hero{grid-template-columns:1fr;gap:32px;margin-bottom:64px}
  .learners{grid-template-columns:1fr;gap:18px;margin-bottom:64px}
  .waicy-band{grid-template-columns:1fr;gap:28px;padding:30px}
  .training-stats{gap:32px}
  .footer{padding:88px 0 48px}
  .contact{flex-direction:column;gap:30px;margin-bottom:52px}
}
@media (max-width:580px){
  .kicker{letter-spacing:.22em}
  .logo-grid{grid-template-columns:repeat(3,1fr);gap:10px}
  .logo-cell{padding:10px}
  .award-stats{gap:24px 40px}
  .trophies picture{width:68px;height:140px}
  .training-stats strong{font-size:28px}
  .hero-figure{margin-top:44px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
