:root { --paper:#f7f7f5; --soft:#ececeb; --ink:#17212d; --muted:#70757a; --line:rgba(23,33,45,.18); --red:#c73b32; --red-dark:#9f2d29; --blue:#a7bec8; --sand:#d6cbb7; --display:"Barlow Condensed", Impact, sans-serif; --body:"Manrope", "Noto Sans SC", sans-serif; --serif:"Noto Serif SC", Georgia, serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--paper); color:var(--ink); font-family:var(--body); margin:0; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
.site-shell { overflow:hidden; }
.section-pad { padding-left:clamp(22px,7vw,112px); padding-right:clamp(22px,7vw,112px); }
.site-header { align-items:center; background:rgba(247,247,245,.94); border-bottom:1px solid rgba(23,33,45,.12); display:flex; height:82px; justify-content:space-between; left:0; padding:0 clamp(22px,4vw,64px); position:absolute; top:0; width:100%; z-index:10; }
.brand { align-items:center; display:flex; font-size:1.25rem; font-weight:800; gap:9px; letter-spacing:-.07em; }
.brand-symbol { color:var(--red); font-size:1.75rem; line-height:0; transform:rotate(-25deg); }
.brand small { color:var(--muted); font-family:var(--display); font-size:8px; font-weight:600; letter-spacing:.13em; margin:4px 0 0 2px; }
.site-nav { display:flex; gap:clamp(24px,4vw,68px); margin-left:auto; margin-right:clamp(24px,4vw,68px); }
.site-nav a,.language,.menu-toggle { font-family:var(--display); font-size:13px; letter-spacing:.05em; text-transform:uppercase; }
.site-nav a { position:relative; }
.site-nav a::after { background:var(--red); bottom:-7px; content:""; height:2px; left:0; position:absolute; transform:scaleX(0); transform-origin:right; transition:transform .3s ease; width:100%; }
.site-nav a:hover::after { transform:scaleX(1); transform-origin:left; }
.header-actions { align-items:center; display:flex; gap:24px; }
.language { color:var(--muted); font-size:11px; }
.menu-toggle { align-items:center; background:none; border:0; cursor:pointer; display:flex; gap:8px; padding:7px 0; }
.menu-toggle span { font-size:11px; }
.menu-toggle i { background:var(--ink); display:block; height:1px; transition:transform .25s ease; width:22px; }
.menu-toggle i:last-child { margin-left:-30px; transform:translateY(5px); }
.menu-toggle.is-open i:first-of-type { transform:rotate(45deg); }.menu-toggle.is-open i:last-child { transform:rotate(-45deg); }
.hero { background:#d1d6d5; color:var(--paper); min-height:clamp(640px,92vh,900px); overflow:hidden; position:relative; }
.hero-slide { inset:0; opacity:0; position:absolute; transition:opacity .8s ease; }.hero-slide.is-active { opacity:1; }
.hero-image { background-position:center; background-size:cover; inset:0; position:absolute; transform:scale(1.02); }
.hero-image-glass { background-image:url('assets/hero/glass-courtyard.jpg'); background-position:center 44%; }
.hero-image-factory { background-image:url('assets/hero/factory-line.jpg'); background-position:center 52%; }
.hero-image-furnace { background-image:url('assets/hero/tempering-furnace.jpg'); background-position:center 55%; }
.hero-tint { background:linear-gradient(90deg,rgba(10,20,28,.76),rgba(10,20,28,.12) 68%,rgba(10,20,28,.18)); inset:0; position:absolute; }
.hero-machine { background:linear-gradient(165deg,#aeb7b4 0%,#e7e9e4 44%,#728078 100%); inset:0; position:absolute; }
.machine-frame { border:18px solid rgba(25,38,43,.72); height:55%; left:7%; position:absolute; top:23%; transform:skewY(-7deg); width:75%; }
.machine-frame::before,.machine-frame::after { background:#eff0ec; content:""; height:13%; left:1%; position:absolute; top:43%; width:98%; }
.machine-frame::after { background:var(--red); height:4%; top:27%; }
.machine-bed { background:repeating-linear-gradient(90deg,rgba(255,255,255,.82) 0 2px,transparent 2px 72px); bottom:17%; height:12%; left:1%; position:absolute; transform:skewY(-7deg); width:90%; }
.machine-head { background:linear-gradient(90deg,#303b3d,#c5cdca 72%); height:37%; position:absolute; right:5%; top:27%; transform:skewY(-7deg); width:18%; }
.machine-glow { background:rgba(222,60,43,.72); filter:blur(34px); height:48%; left:32%; position:absolute; top:25%; width:19%; }
.machine-rail { background:#fafbf7; height:12px; position:absolute; transform:rotate(-7deg); width:82%; }.rail-a{left:3%;top:38%;}.rail-b{bottom:31%;left:9%;}
.hero-slide-alt { background:linear-gradient(135deg,#c8d0d3,#f0f1ef 48%,#85929b); }.glass-tower { background:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 18px,rgba(20,35,44,.14) 18px 20px),repeating-linear-gradient(0deg,rgba(255,255,255,.22) 0 14px,transparent 14px 17px); height:94%; left:45%; position:absolute; top:6%; transform:perspective(500px) rotateY(-18deg); width:25%; }.hero-slide-dark { background:linear-gradient(145deg,#111c31,#556a79 58%,#d9d1a2); }.solar-array { background:repeating-linear-gradient(90deg,#113b66 0 24px,#b1d0e0 24px 26px),repeating-linear-gradient(0deg,transparent 0 24px,rgba(255,255,255,.4) 24px 26px); height:58%; left:20%; position:absolute; top:20%; transform:skewY(-15deg) rotate(-6deg); width:56%; }
.hero-content,.hero-footer { position:relative; z-index:2; }.hero-content { margin:0 clamp(22px,7vw,112px); padding-top:clamp(190px,25vh,260px); max-width:730px; }.hero-kicker,.eyebrow,.section-number { font-family:var(--display); font-size:12px; letter-spacing:.1em; text-transform:uppercase; }.hero-kicker { color:#f3beb8; margin:0 0 24px; }.hero h1 { font-size:clamp(4rem,8vw,9rem); letter-spacing:-.055em; line-height:.88; margin:0 0 30px; }.hero h1 em { color:#f3d9d2; font-family:var(--serif); font-style:normal; font-weight:600; letter-spacing:-.15em; }.hero-description { color:rgba(247,247,245,.84); font-size:14px; line-height:1.85; margin:0 0 28px; max-width:430px; }.hero-link,.under-link { border-bottom:1px solid currentColor; display:inline-flex; font-family:var(--display); font-size:13px; gap:42px; padding-bottom:8px; text-transform:uppercase; }.hero-link span,.under-link span { font-family:var(--body); font-size:17px; line-height:11px; }.hero-footer { align-items:end; bottom:33px; display:grid; grid-template-columns:1fr 1fr 1fr; left:clamp(22px,7vw,112px); position:absolute; right:clamp(22px,7vw,112px); }.hero-progress { align-items:center; display:flex; font-family:var(--display); font-size:12px; gap:12px; }.progress-line { background:rgba(247,247,245,.42); height:1px; position:relative; width:110px; }.progress-line i { background:var(--red); display:block; height:2px; width:33%; }.hero-footer p { font-family:var(--display); font-size:12px; letter-spacing:.08em; line-height:1.2; margin:0; text-transform:uppercase; }.hero-scroll { font-family:var(--display); font-size:12px; justify-self:end; letter-spacing:.08em; text-transform:uppercase; }.hero-scroll span { color:#f1bcb3; font-family:var(--body); font-size:18px; margin-left:9px; }
.trust { align-items:center; background:#fff; display:grid; gap:50px; grid-template-columns:1fr 2fr; padding-bottom:68px; padding-top:68px; }.trust-heading .eyebrow,.about .eyebrow,.solutions .eyebrow,.projects .eyebrow,.contact .eyebrow { color:var(--red); }.trust-heading p { font-family:var(--display); font-size:clamp(2rem,3.4vw,4.4rem); letter-spacing:-.04em; line-height:.95; margin:17px 0 0; }.partner-row { align-items:center; border-left:1px solid var(--line); display:flex; justify-content:space-around; min-height:80px; padding-left:4%; }.partner-row span { color:#7c8386; font-family:var(--display); font-size:clamp(1.4rem,2.6vw,3.2rem); font-weight:700; letter-spacing:-.04em; }.partner-outline { color:transparent!important; -webkit-text-stroke:1px #7c8386; }.partner-serif { font-family:var(--serif)!important; font-size:clamp(1.7rem,2.8vw,3.5rem)!important; font-weight:500!important; }.partner-small { font-family:var(--display)!important; font-size:12px!important; line-height:.9; }
.about { background:var(--soft); padding-bottom:clamp(100px,12vw,185px); padding-top:clamp(88px,10vw,150px); }.section-number { color:var(--muted); }.about-grid { display:grid; gap:10vw; grid-template-columns:1.15fr .85fr; margin-top:75px; }.about-heading h2,.solutions-title h2,.project-intro h2,.contact h2 { font-family:var(--display); font-size:clamp(4rem,7.7vw,9.3rem); font-weight:700; letter-spacing:-.07em; line-height:.83; margin:22px 0 0; }.about-heading h2 em,.solutions-title h2 em,.project-intro h2 em,.contact h2 em { color:var(--red); font-family:var(--serif); font-style:normal; font-weight:800; letter-spacing:-.17em; }.about-copy { align-self:end; max-width:390px; }.about-copy p { color:#62696d; font-size:14px; line-height:1.9; margin:0 0 18px; }.about-copy .lead { color:var(--ink); font-family:var(--display); font-size:23px; line-height:1.18; }.under-link { color:var(--red); margin-top:22px; }.facts { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,1fr); margin-top:120px; }.facts div { border-right:1px solid var(--line); padding:23px 17px 0 0; }.facts div+div { padding-left:22px; }.facts div:last-child { border:0; }.facts strong { display:block; font-family:var(--display); font-size:clamp(3rem,5.2vw,6rem); font-weight:700; letter-spacing:-.04em; line-height:.9; }.facts strong span { color:var(--red); font-size:.65em; }.facts small { color:var(--muted); display:block; font-family:var(--display); font-size:12px; letter-spacing:.05em; margin-top:12px; text-transform:uppercase; }
.solutions { background:#fff; padding-bottom:clamp(100px,12vw,180px); padding-top:clamp(88px,10vw,150px); }.section-topline { align-items:center; display:flex; justify-content:space-between; }.solutions-title { align-items:end; display:grid; grid-template-columns:1.25fr .75fr; margin:75px 0 70px; }.solutions-title p { color:var(--muted); font-family:var(--display); font-size:18px; line-height:1.1; margin:0 0 7px; }.solution-grid { display:grid; gap:15px; grid-template-columns:repeat(4,1fr); }.solution-card { aspect-ratio:.78; color:var(--paper); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:21px; position:relative; transition:transform .45s cubic-bezier(.16,1,.3,1); }.solution-card:hover { transform:translateY(-8px); }.solution-card > * { position:relative; z-index:1; }.card-red { background:linear-gradient(140deg,#c64035,#701d1c); }.card-blue { background:linear-gradient(140deg,#a9c4cc,#314b60); }.card-navy { background:linear-gradient(140deg,#152539,#080c14); }.card-sand { background:linear-gradient(140deg,#d9cfbe,#8a745e); }.card-index { font-family:var(--display); font-size:12px; }.solution-card h3 { font-family:var(--display); font-size:clamp(1.8rem,3vw,3rem); letter-spacing:-.04em; line-height:.92; margin:0; }.solution-card p { font-family:var(--display); font-size:12px; letter-spacing:.06em; margin:10px 0 0; opacity:.76; text-transform:uppercase; }.card-arrow { align-self:flex-end; font-size:22px; }.card-orbit { border:1px solid rgba(255,255,255,.68); border-radius:50%; height:80%; left:28%; position:absolute; top:12%; transform:rotate(-30deg); width:85%; }.card-orbit::after { background:#f2a091; border-radius:50%; content:""; height:22px; left:22%; position:absolute; top:14%; width:22px; }.card-grid-lines { background:repeating-linear-gradient(90deg,rgba(255,255,255,.14) 0 1px,transparent 1px 23px),repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0 1px,transparent 1px 23px); inset:0; position:absolute; transform:skewY(-20deg) scale(1.3); }.card-glass-shape { border:20px solid rgba(170,213,226,.45); height:68%; left:20%; position:absolute; top:17%; transform:skewY(-10deg); width:60%; }.card-fan { border:30px dotted rgba(247,247,245,.45); border-radius:50%; height:66%; left:21%; position:absolute; top:14%; width:66%; }
.card-red { background-image:linear-gradient(140deg,rgba(108,20,19,.42),rgba(16,17,20,.78)),url('assets/solutions/tempering-furnace.jpg'); background-position:center; background-size:cover; }
.card-blue { background-image:linear-gradient(140deg,rgba(35,66,78,.35),rgba(8,21,30,.78)),url('assets/solutions/automation-line.jpg'); background-position:center; background-size:cover; }
.card-navy { background-image:linear-gradient(140deg,rgba(11,31,45,.2),rgba(5,14,22,.82)),url('assets/solutions/patterned-glass.jpg'); background-position:center; background-size:cover; }
.card-sand { background-image:linear-gradient(140deg,rgba(47,40,29,.18),rgba(25,23,21,.76)),url('assets/solutions/factory-floor.jpg'); background-position:center; background-size:cover; }
.solution-card .card-orbit,.solution-card .card-grid-lines,.solution-card .card-glass-shape,.solution-card .card-fan { opacity:.42; }
.projects { background:#101a27; color:var(--paper); padding-top:clamp(100px,12vw,185px); }.project-intro { display:grid; grid-template-columns:1fr 1.3fr 1fr; margin-bottom:90px; }.project-intro h2 { margin-top:0; }.project-intro p { align-self:end; color:#a8b1b7; font-size:14px; line-height:1.8; justify-self:end; max-width:260px; }.project-visual { min-height:52vw; overflow:hidden; position:relative; }.project-visual::before { content:""; inset:0; position:absolute; transition:transform 1s cubic-bezier(.16,1,.3,1); }.project-visual:hover::before { transform:scale(1.04); }.project-one::before { background:linear-gradient(135deg,rgba(28,49,61,.2),rgba(12,30,36,.1)),linear-gradient(110deg,#b9c9c9 0 28%,#4a7d87 28% 31%,#d2d9d8 31% 58%,#234454 58% 62%,#91acaf 62%); }.project-two::before { background:linear-gradient(135deg,#d7d2c8,#c0c6c6 40%,#8c9ba0 41% 46%,#e6e3dc 46% 78%,#9c624e 78%); }.project-three::before { background:linear-gradient(150deg,#c8d6de 0 35%,#4c7d8f 36% 62%,#102743 63% 100%); }.project-overlay { bottom:40px; left:clamp(22px,7vw,112px); position:absolute; right:clamp(22px,7vw,112px); z-index:1; }.project-overlay span,.project-overlay p { font-family:var(--display); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }.project-overlay h3 { font-family:var(--display); font-size:clamp(2.5rem,6vw,7rem); letter-spacing:-.05em; line-height:.85; margin:16px 0 9px; }.project-overlay p { margin:0; opacity:.75; }
.project-one::before { background-image:linear-gradient(110deg,rgba(7,18,28,.62),rgba(7,18,28,.08) 70%),var(--cms-project-image,url('assets/projects/byd-wuhan.jpg')); background-position:center 42%; background-size:cover; }
.project-two::before { background-image:linear-gradient(110deg,rgba(7,18,28,.62),rgba(7,18,28,.08) 70%),var(--cms-project-image,url('assets/projects/puyang-data-center.jpg')); background-position:center; background-size:cover; }
.project-three::before { background-image:linear-gradient(110deg,rgba(7,18,28,.65),rgba(7,18,28,.08) 70%),var(--cms-project-image,url('assets/projects/wuhan-eye.jpg')); background-position:center 48%; background-size:cover; }
.contact { background:var(--red); color:var(--paper); padding-bottom:32px; padding-top:clamp(88px,10vw,145px); }.contact .section-topline .section-number,.contact .eyebrow { color:#f8c0b7; }.contact-grid { align-items:end; display:grid; gap:10vw; grid-template-columns:1.25fr .75fr; margin:clamp(100px,13vw,190px) 0 clamp(110px,15vw,230px); }.contact h2 { font-size:clamp(4.5rem,9.2vw,11rem); margin:0; }.contact h2 em { color:var(--ink); }.contact-cta { max-width:360px; }.contact-cta p { font-size:14px; line-height:1.8; margin:0 0 28px; }.contact-mail { border-bottom:2px solid var(--paper); display:flex; font-family:var(--display); font-size:15px; justify-content:space-between; padding-bottom:10px; }.contact-mail span { font-size:20px; }.phone { display:block; font-family:var(--display); font-size:13px; margin-top:16px; }.contact-footer { align-items:center; border-top:1px solid rgba(247,247,245,.55); display:flex; font-family:var(--display); font-size:11px; justify-content:space-between; padding-top:16px; text-transform:uppercase; }.contact-footer div { display:flex; gap:30px; }.contact-footer a:hover { text-decoration:underline; }.inquiry { align-items:center; background:var(--red); border:0; bottom:22px; box-shadow:0 5px 18px rgba(0,0,0,.2); color:var(--paper); cursor:pointer; display:flex; font-family:var(--display); font-size:12px; gap:11px; padding:12px 17px; position:fixed; right:22px; z-index:12; }.inquiry span { font-size:15px; }.toast { background:var(--ink); bottom:24px; color:var(--paper); font-family:var(--display); font-size:13px; left:50%; opacity:0; padding:13px 18px; pointer-events:none; position:fixed; transform:translate(-50%,18px); transition:opacity .25s ease,transform .25s ease; z-index:20; }.toast.is-visible { opacity:1; transform:translate(-50%,0); }
@media (max-width:820px) { .site-header{height:72px}.site-nav{background:var(--paper); border-bottom:1px solid var(--line); flex-direction:column; gap:28px; left:0; margin:0; opacity:0; padding:105px 22px 32px; pointer-events:none; position:absolute; top:0; transform:translateY(-12px); transition:opacity .25s ease,transform .25s ease; width:100%; z-index:-1}.site-nav.is-open{opacity:1;pointer-events:auto;transform:translateY(0)}.site-nav a{font-size:15px}.language{display:none}.hero-content{padding-top:200px}.hero h1{font-size:clamp(4rem,16vw,7rem)}.hero-footer{grid-template-columns:1fr 1fr}.hero-footer p{display:none}.hero-scroll{grid-column:2}.trust{display:block}.partner-row{border-left:0;border-top:1px solid var(--line);margin-top:42px;padding:24px 0 0}.partner-row span:nth-child(4),.partner-row span:nth-child(5){display:none}.about-grid,.solutions-title,.project-intro,.contact-grid{display:block}.about-copy{margin-top:70px}.facts{margin-top:85px}.solution-grid{grid-template-columns:repeat(2,1fr)}.solution-card{aspect-ratio:.85;padding:16px}.project-intro{margin-bottom:70px}.project-intro p{margin-top:30px}.project-visual{min-height:105vw}.contact-grid{margin-top:100px}.contact-cta{margin-top:70px}.contact-footer{align-items:flex-start;flex-direction:column;gap:18px}.contact-footer div{flex-wrap:wrap;gap:12px 20px} }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Readability and language control refinements */
.language { background:none; border:0; cursor:pointer; padding:0; }
.hero-content { max-width:920px; }
.hero h1 { letter-spacing:-.045em; line-height:.98; }
.hero h1 em { letter-spacing:-.1em; }
.about-heading h2,
.solutions-title h2,
.project-intro h2,
.contact h2 { letter-spacing:-.055em; line-height:.92; }
.about-heading h2 em,
.solutions-title h2 em,
.project-intro h2 em,
.contact h2 em { letter-spacing:-.12em; }
.project-intro h2 { font-size:clamp(4rem,6.6vw,8rem); white-space:nowrap; }
@media (max-width:820px) {
  .language { display:block; }
  .hero-tint { background:linear-gradient(90deg,rgba(10,20,28,.84),rgba(10,20,28,.38) 78%,rgba(10,20,28,.24)); }
  .hero h1 { font-size:clamp(3rem,10vw,5.2rem); letter-spacing:-.07em; line-height:.95; }
  .hero h1 em { letter-spacing:-.06em; }
  .about-heading h2,
  .solutions-title h2,
  .project-intro h2,
  .contact h2 { line-height:.94; }
  .project-intro h2 { white-space:normal; }
}

/* Reference-led interaction layer: image-backed sections, restrained motion, project pages */
.hero-slide { transform:scale(1.04); transition:opacity .9s ease,transform 1.4s cubic-bezier(.16,1,.3,1); }
.hero-slide.is-active { transform:scale(1); }
.hero-controls { align-items:center; bottom:30px; display:flex; gap:8px; position:absolute; right:clamp(22px,7vw,112px); z-index:3; }
.hero-controls button { background:rgba(9,18,26,.26); border:1px solid rgba(247,247,245,.62); color:var(--paper); cursor:pointer; font-family:var(--body); font-size:18px; height:38px; transition:background .25s ease,color .25s ease,transform .25s ease; width:38px; }
.hero-controls button:hover { background:var(--paper); color:var(--ink); transform:translateY(-3px); }
.hero-slide.is-active .hero-content { animation:hero-copy-in .9s .15s both cubic-bezier(.16,1,.3,1); }
@keyframes hero-copy-in { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }

.trust, .about, .solutions, .projects, .contact { isolation:isolate; overflow:hidden; position:relative; }
.trust > *, .about > *, .solutions > *, .projects > *, .contact > * { position:relative; z-index:1; }
.trust::before, .about::before, .solutions::before, .contact::before { background-position:center; background-size:cover; content:""; inset:0; opacity:.1; pointer-events:none; position:absolute; z-index:0; }
.trust::before { background-image:url('assets/hero/glass-courtyard.jpg'); background-position:center 53%; opacity:.055; }
.about::before { background-image:linear-gradient(90deg,rgba(244,245,242,.98) 0%,rgba(244,245,242,.78) 42%,rgba(244,245,242,.28)),url('assets/solutions/factory-floor.jpg'); background-position:center right; opacity:.75; }
.solutions::before { background-image:linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.3)),url('assets/solutions/automation-line.jpg'); background-position:center; opacity:.26; }
.contact { background-image:linear-gradient(120deg,rgba(194,57,47,.96),rgba(194,57,47,.78)),url('assets/projects/wuhan-eye-night.jpg'); background-position:center 38%; background-size:cover; }
.about-copy, .facts, .solutions-title, .solution-grid, .contact-grid, .contact-footer { position:relative; }

.project-intro { overflow:hidden; position:relative; }
.project-intro::before { background:linear-gradient(90deg,rgba(16,26,39,.98) 18%,rgba(16,26,39,.68) 64%,rgba(16,26,39,.42)),url('assets/projects/wuhan-eye-day.jpg'); background-position:center 47%; background-size:cover; content:""; inset:0; opacity:.75; position:absolute; z-index:-1; }
.project-visual { background:#152432; border:0; color:inherit; cursor:pointer; display:block; font:inherit; padding:0; text-align:left; width:100%; }
.project-visual:focus-visible, .hero-controls button:focus-visible, .detail-close:focus-visible, .detail-nav button:focus-visible { outline:2px solid #f3beb8; outline-offset:4px; }
.project-visual::after { background:linear-gradient(180deg,transparent 45%,rgba(7,16,24,.42)); content:""; inset:0; opacity:0; pointer-events:none; position:absolute; transition:opacity .4s ease; }
.project-visual:hover::after, .project-visual:focus-visible::after { opacity:1; }
.project-open { border-bottom:1px solid rgba(247,247,245,.62); font-family:var(--display); font-size:12px; letter-spacing:.08em; opacity:0; position:absolute; right:clamp(22px,7vw,112px); text-transform:uppercase; top:36px; transform:translateY(-10px); transition:opacity .35s ease,transform .35s ease; z-index:2; }
.project-visual:hover .project-open, .project-visual:focus-visible .project-open { opacity:1; transform:translateY(0); }
.project-one::before { background-image:linear-gradient(110deg,rgba(7,18,28,.68),rgba(7,18,28,.08) 70%),var(--cms-project-image,url('assets/projects/byd-wuhan-main.png')); background-position:center 42%; background-size:cover; }
.project-two::before { background-image:linear-gradient(110deg,rgba(7,18,28,.72),rgba(7,18,28,.12) 70%),var(--cms-project-image,url('assets/projects/puyang-data-center-concept.png')); background-position:center; background-size:cover; }
.project-three::before { background-image:linear-gradient(110deg,rgba(7,18,28,.68),rgba(7,18,28,.08) 70%),var(--cms-project-image,url('assets/projects/wuhan-eye-night.jpg')); background-position:center 48%; background-size:cover; }

[data-reveal], .solution-card, .project-visual { opacity:0; transform:translateY(32px); transition:opacity .75s ease,transform .85s cubic-bezier(.16,1,.3,1); }
[data-reveal].is-visible, .solution-card.is-visible, .project-visual.is-visible { opacity:1; transform:translateY(0); }
.solution-card:nth-child(2), .project-visual:nth-of-type(3) { transition-delay:.08s; }
.solution-card:nth-child(3), .project-visual:nth-of-type(4) { transition-delay:.16s; }
.solution-card:nth-child(4), .project-visual:nth-of-type(5) { transition-delay:.24s; }

.project-detail { background:#0d1724; color:var(--paper); inset:0; opacity:0; overflow:auto; position:fixed; visibility:hidden; z-index:30; }
.project-detail.is-open { opacity:1; visibility:visible; }
.project-detail-backdrop { background:rgba(5,11,18,.82); inset:0; position:fixed; }
.project-detail-sheet { background:#0d1724; margin:0 auto; min-height:100%; max-width:1480px; position:relative; transform:translateY(4vh); transition:transform .8s cubic-bezier(.16,1,.3,1); }
.project-detail.is-open .project-detail-sheet { transform:translateY(0); }
.detail-topline { align-items:center; display:flex; font-family:var(--display); font-size:12px; justify-content:space-between; left:clamp(22px,4vw,70px); letter-spacing:.08em; position:absolute; right:clamp(22px,4vw,70px); text-transform:uppercase; top:27px; z-index:3; }
.detail-close { background:rgba(8,16,25,.35); border:1px solid rgba(247,247,245,.65); color:var(--paper); cursor:pointer; font-family:var(--display); font-size:12px; letter-spacing:.08em; padding:11px 14px; text-transform:uppercase; }
.detail-close span { font-family:var(--body); font-size:20px; line-height:0; margin-left:8px; vertical-align:-2px; }
.detail-hero { min-height:min(76vh,760px); overflow:hidden; position:relative; }
.detail-hero::after { background:linear-gradient(180deg,rgba(5,12,18,.08),rgba(5,12,18,.84)); content:""; inset:0; position:absolute; }
.detail-hero img { height:100%; inset:0; object-fit:cover; object-position:center; position:absolute; width:100%; }
.detail-hero-caption { bottom:clamp(28px,6vw,82px); left:clamp(22px,7vw,112px); position:absolute; right:clamp(22px,7vw,112px); z-index:1; }
.detail-hero-caption span, .detail-hero-caption p { font-family:var(--display); font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.detail-hero-caption h2 { font-family:var(--display); font-size:clamp(3.2rem,8vw,9rem); letter-spacing:-.06em; line-height:.86; margin:17px 0 12px; }
.detail-hero-caption p { margin:0; opacity:.76; }
.detail-body { background:var(--paper); color:var(--ink); padding:clamp(54px,8vw,110px) clamp(22px,7vw,112px) 80px; }
.detail-intro { align-items:start; display:grid; gap:10vw; grid-template-columns:.6fr 1.4fr; }
.detail-intro .eyebrow { color:var(--red); }
.detail-intro p { font-family:var(--display); font-size:clamp(1.5rem,2.4vw,2.7rem); letter-spacing:-.035em; line-height:1.05; margin:0; max-width:770px; }
.detail-stats { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(4,1fr); margin-top:75px; }
.detail-stat { border-right:1px solid var(--line); min-height:105px; padding:18px 20px 0 0; }
.detail-stat + .detail-stat { padding-left:20px; }
.detail-stat:last-child { border-right:0; }
.detail-stat span { color:var(--muted); display:block; font-family:var(--display); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.detail-stat strong { display:block; font-family:var(--display); font-size:clamp(1.2rem,2vw,2rem); letter-spacing:-.03em; line-height:1.05; margin-top:15px; }
.detail-gallery { display:grid; gap:14px; grid-template-columns:1.35fr .65fr; margin-top:70px; }
.detail-gallery figure { margin:0; overflow:hidden; }
.detail-gallery figure:first-child { grid-row:span 2; }
.detail-gallery img { display:block; height:100%; min-height:240px; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1); width:100%; }
.detail-gallery figure:first-child img { min-height:560px; }
.detail-gallery figure:hover img { transform:scale(1.035); }
.detail-gallery figcaption { color:var(--muted); font-family:var(--display); font-size:11px; letter-spacing:.08em; padding-top:10px; text-transform:uppercase; }
.detail-nav { align-items:center; background:#0d1724; display:flex; justify-content:space-between; padding:20px clamp(22px,7vw,112px) 28px; }
.detail-nav button { background:none; border:0; color:var(--paper); cursor:pointer; font-family:var(--display); font-size:13px; letter-spacing:.05em; padding:10px 0; text-transform:uppercase; }
.detail-nav button:hover { color:#f3beb8; }
body.detail-open { overflow:hidden; }

@media (max-width:820px) {
  .hero-controls { bottom:27px; right:22px; }
  .hero-footer { bottom:32px; right:120px; }
  .project-open { opacity:1; right:22px; top:22px; transform:none; }
  .detail-intro { display:block; }
  .detail-intro p { margin-top:28px; }
  .detail-stats { grid-template-columns:repeat(2,1fr); }
  .detail-stat:nth-child(2) { border-right:0; }
  .detail-stat:nth-child(3) { border-top:1px solid var(--line); padding-left:0; }
  .detail-stat:nth-child(4) { border-top:1px solid var(--line); }
  .detail-gallery { display:block; margin-top:48px; }
  .detail-gallery figure, .detail-gallery figure:first-child { margin-bottom:28px; }
  .detail-gallery img, .detail-gallery figure:first-child img { min-height:0; max-height:68vh; }
  .detail-nav { gap:14px; }
  .detail-nav button { font-size:11px; }
}

@media (prefers-reduced-motion:reduce) {
  .hero-slide.is-active .hero-content { animation:none; }
  [data-reveal], .solution-card, .project-visual { opacity:1; transform:none; }
}

/* Solution detail pages */
.solution-grid { grid-template-columns:repeat(3,1fr); }
.solution-card { border:0; cursor:pointer; font:inherit; text-align:left; }
.solution-card:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
.solution-detail { background:#0d1724; color:var(--paper); inset:0; opacity:0; overflow:auto; position:fixed; visibility:hidden; z-index:31; }
.solution-detail.is-open { opacity:1; visibility:visible; }
.solution-detail-backdrop { background:rgba(5,11,18,.82); inset:0; position:fixed; }
.solution-detail-sheet { background:#0d1724; margin:0 auto; min-height:100%; max-width:1480px; position:relative; transform:translateY(4vh); transition:transform .8s cubic-bezier(.16,1,.3,1); }
.solution-detail.is-open .solution-detail-sheet { transform:translateY(0); }
.solution-detail-hero { min-height:min(76vh,760px); overflow:hidden; position:relative; }
.solution-detail-hero::after { background:linear-gradient(180deg,rgba(5,12,18,.08),rgba(5,12,18,.84)); content:""; inset:0; position:absolute; }
.solution-detail-hero img { height:100%; inset:0; object-fit:cover; object-position:center; position:absolute; width:100%; }
.solution-detail-body { padding-bottom:100px; }
.solution-note { border-top:1px solid var(--line); margin-top:70px; max-width:850px; padding-top:18px; }
.solution-note .eyebrow { color:var(--red); }
.solution-note p { color:#5f676c; font-size:15px; line-height:1.8; margin:18px 0 0; }

@media (max-width:820px) {
  .solution-grid { grid-template-columns:repeat(2,1fr); }
  .solution-detail-hero { min-height:68vh; }
  .solution-detail-body { padding-bottom:65px; }
  .solution-note { margin-top:48px; }
}

/* About detail + source-backed credential archive */
.about-detail { z-index:32; }
.about-detail-hero { min-height:min(68vh,680px); }
.about-detail-hero img { object-position:center 42%; }
.about-detail-columns { border-top:1px solid var(--line); display:grid; gap:10vw; grid-template-columns:.6fr 1.4fr; margin-top:86px; padding-top:24px; }
.about-detail-columns h3 { font-family:var(--display); font-size:clamp(2rem,3.8vw,4rem); letter-spacing:-.045em; line-height:.95; margin:18px 0 0; max-width:480px; }
.about-detail-text { max-width:720px; }
.about-detail-text p { color:#5f676c; font-size:16px; line-height:1.8; margin:0 0 18px; }
.credentials-block { border-top:1px solid var(--line); margin-top:88px; padding-top:24px; }
.credentials-heading { align-items:end; display:flex; gap:24px; justify-content:space-between; }
.credentials-heading .eyebrow { color:var(--red); }
.credentials-heading p { color:var(--muted); font-size:13px; margin:0; }
.credential-grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); margin-top:28px; }
.credential-grid figure { background:#ebe7de; margin:0; overflow:hidden; }
.credential-grid img { aspect-ratio:4 / 5; background:#f5f2eb; display:block; object-fit:contain; padding:12px; transition:transform .7s cubic-bezier(.16,1,.3,1); width:100%; }
.credential-grid figure:hover img { transform:scale(1.025); }
.credential-grid figcaption { color:var(--ink); font-family:var(--display); font-size:12px; letter-spacing:.04em; min-height:38px; padding:12px 14px 14px; }
.detail-nav-contact { color:var(--paper); font-family:var(--display); font-size:13px; letter-spacing:.05em; text-decoration:none; text-transform:uppercase; }
.detail-nav-contact:hover { color:#f3beb8; }

@media (max-width:820px) {
  .about-detail-columns { display:block; margin-top:58px; }
  .about-detail-text { margin-top:28px; }
  .credentials-block { margin-top:62px; }
  .credentials-heading { align-items:start; display:block; }
  .credentials-heading p { line-height:1.6; margin-top:14px; }
  .credential-grid { gap:10px; grid-template-columns:repeat(2,1fr); }
  .credential-grid img { padding:7px; }
  .credential-grid figcaption { font-size:10px; min-height:44px; padding:9px 9px 11px; }
}

/* Factory strength / equipment detail */
.factory { background:#0d1724; color:var(--paper); overflow:hidden; }
.factory .section-number, .factory .eyebrow { color:#efaaa2; }
.factory-title { align-items:end; display:grid; gap:8vw; grid-template-columns:1fr .72fr; margin-top:40px; }
.factory-title h2 { font-family:var(--display); font-size:clamp(3.6rem,8vw,9.2rem); letter-spacing:-.075em; line-height:.82; margin:0; max-width:760px; }
.factory-title h2 em { color:#efaaa2; font-family:var(--serif); font-style:normal; }
.factory-title p { color:rgba(247,247,245,.7); font-size:15px; line-height:1.7; margin:0 0 6px; max-width:360px; }
.factory-grid { display:grid; gap:14px; grid-template-columns:repeat(3,1fr); margin-top:92px; }
.factory-card { background:#172535; border:0; color:var(--paper); cursor:pointer; min-height:510px; overflow:hidden; padding:0; position:relative; text-align:left; transition:transform .6s cubic-bezier(.16,1,.3,1), box-shadow .6s ease; }
.factory-card:hover { box-shadow:0 26px 50px rgba(0,0,0,.25); transform:translateY(-8px); }
.factory-card:focus-visible { outline:2px solid #efaaa2; outline-offset:5px; }
.factory-card img { height:100%; inset:0; object-fit:cover; position:absolute; transition:transform 1s cubic-bezier(.16,1,.3,1); width:100%; }
.factory-card:hover img { transform:scale(1.045); }
.factory-card-shade { background:linear-gradient(180deg,rgba(9,17,27,.1) 20%,rgba(9,17,27,.86) 100%); inset:0; position:absolute; }
.factory-card-index { font-family:var(--display); font-size:12px; left:24px; letter-spacing:.1em; position:absolute; top:24px; }
.factory-card-copy { bottom:28px; display:flex; flex-direction:column; left:24px; position:absolute; right:44px; }
.factory-card-copy strong { font-family:var(--display); font-size:clamp(1.5rem,2.3vw,2.45rem); letter-spacing:-.045em; line-height:.98; }
.factory-card-copy small { color:rgba(247,247,245,.68); font-family:var(--display); font-size:10px; letter-spacing:.08em; margin-top:10px; }
.factory-card-arrow { bottom:27px; font-size:24px; position:absolute; right:22px; }
.factory-process { border-top:1px solid rgba(247,247,245,.24); display:grid; gap:8vw; grid-template-columns:.7fr 1.3fr; margin-top:92px; padding-top:22px; }
.factory-process p { color:rgba(247,247,245,.68); font-size:14px; line-height:1.7; margin:18px 0 0; max-width:420px; }
.process-rail { align-items:center; display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.process-rail span { border-bottom:1px solid rgba(247,247,245,.42); color:rgba(247,247,245,.8); font-family:var(--display); font-size:12px; letter-spacing:.04em; padding:0 0 12px; }
.process-rail i { color:#efaaa2; font-family:var(--display); font-size:18px; font-style:normal; }
.factory-detail { z-index:33; }
.factory-detail-hero { min-height:min(72vh,720px); }
.factory-detail-process { border-top:1px solid var(--line); display:grid; gap:8vw; grid-template-columns:.7fr 1.3fr; margin-top:82px; padding-top:22px; }
.factory-detail-process h3 { font-family:var(--display); font-size:clamp(2rem,3.2vw,3.8rem); letter-spacing:-.05em; line-height:.95; margin:18px 0 0; max-width:420px; }
.factory-detail-process .process-rail { justify-content:flex-start; }
.factory-detail-process .process-rail span { border-color:var(--line); color:var(--muted); }
.factory-detail-process .process-rail span.is-active { border-color:var(--red); color:var(--ink); }
.factory-detail-process .process-rail i { color:var(--red); }
.factory-detail-gallery { grid-template-columns:1fr; margin-top:72px; }
.factory-detail-gallery figure:first-child { grid-row:auto; }
.factory-detail-gallery figure:first-child img { min-height:400px; }

/* Inquiry form: static-site friendly, copyable brief */
.contact-mail { background:none; border-left:0; border-right:0; border-top:0; color:inherit; cursor:pointer; text-align:left; width:100%; }
.contact-details { display:grid; gap:14px; margin-top:24px; }
.contact-detail {
  color:inherit;
  display:block;
  font-family:var(--display);
  font-size:clamp(1rem, 1.35vw, 1.25rem);
  font-weight:600;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.contact-details .phone {
  font-size:clamp(1.35rem, 2.3vw, 2rem);
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.1;
  margin-top:0;
}

@media (max-width:820px) {
  .contact-details { gap:12px; margin-top:22px; }
  .contact-details .phone { font-size:1.45rem; }
  .contact-detail { font-size:1rem; }
}
.contact-mail:hover { color:#f8c0b7; }
.inquiry-panel { background:#0d1724; color:var(--paper); inset:0; opacity:0; overflow:auto; position:fixed; visibility:hidden; z-index:40; }
.inquiry-panel.is-open { opacity:1; visibility:visible; }
.inquiry-panel-backdrop { background:rgba(5,11,18,.82); inset:0; position:fixed; }
.inquiry-panel-sheet { background:var(--paper); color:var(--ink); margin:0 auto; min-height:100%; max-width:920px; position:relative; transform:translateY(4vh); transition:transform .7s cubic-bezier(.16,1,.3,1); }
.inquiry-panel.is-open .inquiry-panel-sheet { transform:translateY(0); }
.inquiry-panel .detail-topline { color:var(--paper); }
.inquiry-panel-content { padding:clamp(78px,10vw,140px) clamp(22px,8vw,120px) 80px; }
.inquiry-panel-content > .eyebrow { color:var(--red); }
.inquiry-panel-content h2 { font-family:var(--display); font-size:clamp(4rem,8vw,8rem); letter-spacing:-.07em; line-height:.84; margin:22px 0 18px; }
.inquiry-panel-content h2 em { color:var(--red); font-family:var(--serif); font-style:normal; }
.inquiry-note { color:var(--muted); font-size:14px; line-height:1.7; margin:0 0 42px; }
.inquiry-form { display:grid; gap:22px; grid-template-columns:repeat(2,1fr); }
.inquiry-form label { display:block; }
.inquiry-form label:nth-child(3), .inquiry-form label:nth-child(4), .inquiry-form > button, .form-footnote, .inquiry-result { grid-column:1 / -1; }
.inquiry-form label span, .inquiry-result > span { color:var(--red); display:block; font-family:var(--display); font-size:11px; letter-spacing:.08em; margin-bottom:9px; text-transform:uppercase; }
.inquiry-form input, .inquiry-form select, .inquiry-form textarea { background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0; color:var(--ink); font:inherit; outline:0; padding:11px 0; width:100%; }
.inquiry-form textarea { min-height:110px; resize:vertical; }
.inquiry-form input:focus, .inquiry-form select:focus, .inquiry-form textarea:focus { border-bottom-color:var(--red); }
.inquiry-form button, .inquiry-result button { background:var(--red); border:0; color:var(--paper); cursor:pointer; font-family:var(--display); font-size:13px; letter-spacing:.05em; padding:15px 18px; text-transform:uppercase; }
.inquiry-form button:hover, .inquiry-result button:hover { background:var(--ink); }
.form-footnote { color:var(--muted); font-family:var(--display); font-size:12px; margin:0; }
.form-footnote a { color:var(--ink); }
.inquiry-result { border-top:1px solid var(--line); margin-top:8px; padding-top:22px; }
.inquiry-result textarea { background:#ebe7de; border:0; color:var(--ink); font:13px/1.7 var(--body); min-height:145px; padding:14px; resize:vertical; width:100%; }
.inquiry-result button { margin-top:12px; }
body.inquiry-open { overflow:hidden; }
.credential-grid figure { cursor:zoom-in; }
.credential-grid figure:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
.credential-lightbox { background:rgba(5,11,18,.92); inset:0; opacity:0; position:fixed; visibility:hidden; z-index:45; }
.credential-lightbox.is-open { opacity:1; visibility:visible; }
.credential-lightbox-backdrop { inset:0; position:absolute; }
.credential-lightbox-frame { align-items:center; display:flex; flex-direction:column; inset:clamp(58px,8vh,90px) clamp(22px,8vw,120px); justify-content:center; position:absolute; }
.credential-lightbox-frame .detail-close { align-self:flex-end; margin-bottom:14px; }
.credential-lightbox-frame img { background:#f5f2eb; max-height:calc(100vh - 180px); max-width:100%; object-fit:contain; padding:12px; }
.credential-lightbox-frame p { color:var(--paper); font-family:var(--display); font-size:12px; letter-spacing:.06em; margin:14px 0 0; text-align:center; text-transform:uppercase; }
body.credential-open { overflow:hidden; }
.project-type { color:#f3beb8; display:block; font-family:var(--display); font-size:11px; letter-spacing:.08em; margin-top:14px; text-transform:uppercase; }

@media (max-width:820px) {
  .factory-title { display:block; margin-top:30px; }
  .factory-title p { margin-top:28px; }
  .factory-grid { gap:10px; grid-template-columns:1fr; margin-top:54px; }
  .factory-card { min-height:390px; }
  .factory-process { display:block; margin-top:58px; }
  .factory-process .process-rail { justify-content:flex-start; margin-top:30px; }
  .factory-detail-hero { min-height:66vh; }
  .factory-detail-process { display:block; margin-top:58px; }
  .factory-detail-process .process-rail { justify-content:flex-start; margin-top:30px; }
  .factory-detail-gallery { margin-top:48px; }
  .factory-detail-gallery figure:first-child img { min-height:0; }
  .inquiry-panel-content { padding-top:94px; }
  .inquiry-panel-content h2 { font-size:clamp(3.4rem,15vw,5.4rem); }
  .inquiry-form { display:block; }
  .inquiry-form label { margin-bottom:22px; }
  .inquiry-form > button { margin-top:5px; width:100%; }
  .form-footnote { margin-top:18px; }
  .credential-lightbox-frame { inset:72px 16px 30px; }
  .credential-lightbox-frame img { max-height:calc(100vh - 160px); padding:7px; }
}