:root { --ink:#0b0c0d; --paper:#f5f4f0; --paper-deep:#e9e7e1; --muted:#70716f; --line:rgba(10,12,13,.13); --orange:#ee6500; --orange-deep:#c84e00; --radius:26px; --sans:"Microsoft YaHei UI","Microsoft YaHei","PingFang SC","Noto Sans SC",Inter,Arial,sans-serif; --display:"Arial Narrow","Microsoft YaHei UI","PingFang SC","Noto Sans SC",Arial,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; } button,input,textarea,select { font:inherit; } button,a { -webkit-tap-highlight-color:transparent; } button { cursor:pointer; } a { color:inherit; text-decoration:none; } img { display:block; max-width:100%; } .wrap { width:min(1180px,calc(100% - 48px)); margin-inline:auto; } .section-space { padding-block:132px; } .section-dark { background:var(--ink); color:#fff; }
.scroll-progress { position:fixed; z-index:60; inset:0 0 auto; height:3px; pointer-events:none; }.scroll-progress span { display:block; width:0; height:100%; background:var(--orange); }
.site-header { position:fixed; z-index:50; top:18px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:28px; width:min(1240px,calc(100% - 48px)); height:62px; padding:0 16px 0 21px; color:#fff; border:1px solid rgba(255,255,255,.22); border-radius:16px; transition:background .3s,color .3s,box-shadow .3s,top .3s; }.site-header.scrolled { top:10px; color:var(--ink); background:rgba(250,249,246,.93); border-color:rgba(10,12,13,.08); box-shadow:0 9px 30px rgba(0,0,0,.1); backdrop-filter:blur(12px); }.brand { position:relative; font-family:Arial,sans-serif; font-size:17px; font-weight:900; letter-spacing:-1px; white-space:nowrap; }.brand span { color:var(--orange); font-style:italic; }.brand i { display:block; width:18px; height:2px; margin-top:3px; background:var(--orange); } nav { display:flex; gap:24px; margin:auto; } nav a { color:inherit; font-size:12px; font-weight:600; opacity:.8; transition:opacity .2s,color .2s; } nav a:hover,nav a.active { color:var(--orange); opacity:1; }.header-actions { display:flex; align-items:center; gap:14px; }.language-toggle { padding:0; color:inherit; border:0; background:none; font-size:11px; font-weight:700; }.language-toggle span { margin-inline:3px; opacity:.4; }.header-cta { padding:8px 10px 8px 15px; color:inherit; border:1px solid rgba(255,255,255,.35); border-radius:100px; background:rgba(255,255,255,.1); font-size:11px; font-weight:700; }.scrolled .header-cta { border-color:var(--line); background:#fff; }.header-cta b { display:inline-grid; width:18px; height:18px; margin-left:4px; place-items:center; color:var(--ink); border-radius:50%; background:#fff; }.menu-toggle { display:none; }
.hero { position:relative; display:flex; min-height:100svh; overflow:hidden; align-items:center; }.hero-image { position:absolute; inset:0; overflow:hidden; }.hero-image::after { position:absolute; inset:0; content:""; background:linear-gradient(90deg,rgba(2,5,7,.92) 0%,rgba(4,8,11,.8) 34%,rgba(5,9,12,.32) 67%,rgba(2,4,6,.5) 100%); }.hero-image img { width:100%; height:100%; object-fit:cover; object-position:center; filter:contrast(1.06) saturate(.84); transform:scale(1.02); }.grain { position:absolute; inset:0; opacity:.17; background-image:radial-gradient(rgba(255,255,255,.34) .55px,transparent .8px); background-size:5px 5px; mix-blend-mode:soft-light; }.hero-copy { position:relative; width:min(730px,calc(100% - 48px)); margin:122px 0 100px max(24px,calc((100vw - 1180px)/2)); }.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 20px; font-family:var(--sans); font-size:11px; font-weight:800; letter-spacing:1.35px; }.eyebrow>span:first-child { width:22px; height:2px; background:currentColor; }.eyebrow.orange { color:var(--orange); } h1,h2 { margin:0; font-family:var(--display); font-weight:900; letter-spacing:-.08em; line-height:.92; } .hero h1 { max-width:720px; font-size:clamp(58px,8vw,120px); } h1 em,h2 em { font-family:var(--sans); font-weight:350; font-style:normal; letter-spacing:-.09em; }.hero h1 em { color:#f2f0ea; }.hero-summary { max-width:420px; margin:32px 0; color:#deded9; font-size:16px; font-weight:500; line-height:1.7; }.hero-actions { display:flex; align-items:center; gap:24px; }.button { display:inline-flex; align-items:center; gap:9px; padding:14px 19px; border:0; border-radius:100px; font-size:12px; font-weight:800; transition:transform .2s,box-shadow .2s,background .2s; }.button:hover { box-shadow:0 10px 21px rgba(0,0,0,.2); transform:translateY(-2px); }.button-orange { color:#fff; background:var(--orange); }.button-dark { color:#fff; background:var(--ink); }.button b { display:grid; width:20px; height:20px; place-items:center; color:var(--ink); border-radius:50%; background:#fff; }.text-button { padding:0; color:#fff; border:0; background:none; font-size:12px; font-weight:700; }.text-button b { margin-left:5px; color:var(--orange); font-size:18px; }.hero-fact { position:absolute; right:max(24px,calc((100vw - 1180px)/2)); bottom:49px; width:210px; padding-top:14px; border-top:1px solid rgba(255,255,255,.4); }.fact-mark { color:var(--orange); font-family:Arial,sans-serif; font-size:34px; font-style:italic; font-weight:900; letter-spacing:-.11em; }.hero-fact p { margin:6px 0 0; color:#ddd; font-size:11px; line-height:1.6; }.hero-scroll { position:absolute; bottom:22px; left:50%; display:flex; gap:10px; align-items:center; color:#bbb; font-size:8px; letter-spacing:1.7px; transform:translateX(-50%); }.hero-scroll span { width:28px; height:1px; background:var(--orange); }
.intro { display:grid; grid-template-columns:1.05fr .95fr; gap:70px 8%; align-items:end; }.intro h2,.products h2,.quality h2,.services h2,.site-footer h2 { font-size:clamp(45px,5.2vw,76px); }.intro-body { padding-bottom:7px; }.intro-body>p { max-width:470px; margin:0 0 27px; font-size:17px; line-height:1.75; }.inline-link { padding-bottom:7px; border-bottom:1px solid var(--ink); font-size:13px; font-weight:800; }.inline-link b { margin-left:8px; color:var(--orange); }.photo-window { position:relative; grid-column:span 2; height:490px; overflow:hidden; border-radius:var(--radius); background:#ddd; }.photo-window::after { position:absolute; inset:auto 0 0; height:43%; content:""; background:linear-gradient(transparent,rgba(0,0,0,.58)); }.photo-window img { width:100%; height:100%; object-fit:cover; object-position:center 48%; filter:contrast(1.04); }.photo-badge { position:absolute; z-index:1; bottom:21px; left:24px; display:flex; gap:13px; align-items:end; color:#fff; }.photo-badge span { color:var(--orange); font-family:Arial,sans-serif; font-size:37px; font-weight:900; letter-spacing:-.07em; line-height:.8; }.photo-badge p { margin:0; font-size:10px; font-weight:700; letter-spacing:1px; line-height:1.5; }.stats { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.stat-card { padding:32px 22px; border-right:1px solid var(--line); }.stat-card:last-child { border-right:0; }.stat-number { font-family:var(--display); font-size:57px; font-weight:900; letter-spacing:-.1em; }.stat-card sup { color:var(--orange); font-size:24px; font-weight:900; }.stat-card p { max-width:130px; margin:6px 0 0; color:#5f605e; font-size:11px; line-height:1.45; }
.services { padding:128px 0; overflow:hidden; }.service-layout { display:grid; grid-template-columns:.79fr 1.21fr; gap:10%; }.services-intro { position:sticky; top:115px; align-self:start; }.services-intro>p:not(.eyebrow) { max-width:355px; margin:30px 0 0; color:#babbb8; font-size:15px; line-height:1.7; }.service-caption { display:flex; gap:13px; align-items:end; margin-top:50px; }.service-caption span { color:var(--orange); font-family:Arial,sans-serif; font-size:32px; font-weight:900; letter-spacing:-.1em; }.service-caption p { max-width:150px; margin:0; color:#858585; font-size:10px; line-height:1.5; }.accordion { align-self:start; border-top:1px solid rgba(255,255,255,.27); }.accordion-item { overflow:hidden; border-bottom:1px solid rgba(255,255,255,.27); }.accordion-item button { display:grid; grid-template-columns:70px 1fr auto; width:100%; padding:25px 0; color:#fff; border:0; background:none; text-align:left; align-items:center; }.accordion-item button>span { color:var(--orange); font-family:Arial,sans-serif; font-size:16px; font-style:italic; font-weight:700; }.accordion-item button strong { font-size:24px; font-weight:800; letter-spacing:-.05em; }.accordion-item button b { font-family:Arial,sans-serif; font-size:28px; font-weight:400; transition:transform .3s; }.accordion-item.active button b { color:var(--orange); transform:rotate(45deg); }.accordion-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .48s cubic-bezier(.2,.7,.2,1); }.accordion-panel>* { min-height:0; overflow:hidden; }.accordion-item.active .accordion-panel { grid-template-rows:1fr; }.accordion-panel>span { display:block; padding:0 0 28px 70px; color:var(--orange); font-size:10px; letter-spacing:1.5px; }.service-detail { display:grid; grid-template-columns:210px 1fr; gap:28px; padding:0 0 22px 70px; }.service-image { min-height:168px; overflow:hidden; border-radius:12px; background-color:#1d1d1d; background-position:center; background-size:cover; }.service-image-design { background-image:linear-gradient(135deg,rgba(0,0,0,.08),rgba(0,0,0,.45)),url("assets/overhead-crane-original.png"); background-position:center 24%; }.service-image-fabrication { background-image:linear-gradient(135deg,rgba(0,0,0,.06),rgba(0,0,0,.48)),url("assets/hero-industrial-original.png"); background-position:78% bottom; }.service-image-logistics { background-image:linear-gradient(135deg,rgba(0,0,0,.1),rgba(0,0,0,.45)),url("assets/gantry-yard-original.png"); }.service-image-installation { background-image:linear-gradient(135deg,rgba(0,0,0,.1),rgba(0,0,0,.42)),url("assets/overhead-crane-original.png"); background-position:65% 65%; }.service-image-maintenance { background-image:linear-gradient(135deg,rgba(0,0,0,.04),rgba(0,0,0,.5)),url("assets/hoist-original.png"); background-position:75% 45%; }.service-detail p { max-width:460px; margin:0; color:#d2d2ce; font-size:14px; line-height:1.65; }.service-detail ul { display:grid; grid-template-columns:1fr 1fr; gap:9px 15px; margin:18px 0 0; padding:0; color:#aaa; font-size:11px; line-height:1.45; list-style:none; }.service-detail li::before { margin-right:7px; color:var(--orange); content:"—"; }
.products-top { display:grid; grid-template-columns:1fr .77fr; gap:12%; align-items:end; }.products-top>p { max-width:470px; margin:0 0 7px; color:#626360; font-size:16px; line-height:1.7; }.filter-row { display:flex; flex-wrap:wrap; gap:10px; margin:55px 0 33px; }.filter { padding:11px 17px; color:#5d5e5b; border:1px solid var(--line); border-radius:100px; background:transparent; font-size:12px; font-weight:700; transition:.2s; }.filter:hover,.filter.active { color:#fff; border-color:var(--ink); background:var(--ink); }.product-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.product-card { position:relative; display:block; height:350px; padding:0; overflow:hidden; color:#fff; border:0; border-radius:var(--radius); background:#333; text-align:left; transition:opacity .25s,transform .25s; }.product-card.feature { height:460px; }.product-card img { width:100%; height:100%; object-fit:cover; filter:contrast(1.04) saturate(.87); transition:transform .65s cubic-bezier(.2,.75,.2,1); }.product-card:nth-child(1) img { object-position:center 57%; }.product-card:nth-child(2) img { object-position:center; }.product-card:nth-child(3) img { object-position:67% center; }.product-card:nth-child(4) img { object-position:70% center; }.product-card::after { position:absolute; inset:0; content:""; background:linear-gradient(180deg,rgba(0,0,0,.05) 38%,rgba(0,0,0,.86)); }.product-card:hover img { transform:scale(1.07); }.product-card:hover .product-overlay b { color:#fff; background:var(--orange); }.product-card.is-hidden { display:none; }.product-overlay { position:absolute; z-index:1; inset:auto 22px 19px; display:grid; grid-template-columns:1fr auto; gap:3px; align-items:end; }.product-overlay small { color:#ff8b3e; font-size:10px; font-weight:800; letter-spacing:1.3px; }.product-overlay strong { grid-column:1; font-size:27px; font-weight:900; letter-spacing:-.06em; }.product-overlay em { grid-column:1; margin-top:4px; color:#d8d8d4; font-size:10px; font-style:normal; }.product-overlay b { grid-column:2; grid-row:1/4; display:grid; width:36px; height:36px; place-items:center; color:var(--ink); border-radius:50%; background:#fff; font-family:Arial,sans-serif; transition:.2s; }.filter-empty { margin:22px 0; font-size:14px; }
.quality { padding-top:0; }.quality-card { display:grid; grid-template-columns:.84fr 1.16fr; overflow:hidden; border:1px solid rgba(10,12,13,.09); border-radius:var(--radius); background:#e5e4df; }.quality-art { position:relative; min-height:620px; overflow:hidden; background:#1a1d1e; }.quality-art::after { position:absolute; inset:0; content:""; background:linear-gradient(135deg,rgba(4,5,6,.14),rgba(4,5,6,.72)); }.quality-art img { width:100%; height:100%; object-fit:cover; object-position:75% center; }.quality-index { position:absolute; z-index:1; bottom:35px; left:40px; color:#fff; }.quality-index span { display:block; color:var(--orange); font-family:Arial,sans-serif; font-size:76px; font-style:italic; font-weight:900; letter-spacing:-.12em; }.quality-index p { margin:5px 0 0; font-size:10px; font-weight:800; letter-spacing:1.5px; }.quality-copy { padding:72px 11%; align-self:center; }.quality-copy>p:not(.eyebrow) { max-width:500px; margin:28px 0; color:#5f605e; font-size:15px; line-height:1.7; }.quality-points { margin:32px 0 0; border-top:1px solid rgba(10,12,13,.15); }.quality-point { display:grid; grid-template-columns:42px 1fr auto; width:100%; padding:14px 0; color:#3e403e; border:0; border-bottom:1px solid rgba(10,12,13,.15); background:none; text-align:left; align-items:center; }.quality-point span { color:var(--orange); font-family:Arial,sans-serif; font-size:11px; font-weight:900; }.quality-point b { font-size:13px; }.quality-point i { color:var(--orange); font-family:Arial,sans-serif; font-size:19px; font-style:normal; transition:transform .2s; }.quality-point.active i { transform:rotate(45deg); }.quality-readout { min-height:49px; padding:12px 14px; border-left:2px solid var(--orange); background:rgba(255,255,255,.53); }.quality-readout p { margin:0; color:#5a5b58; font-size:11px; line-height:1.55; }.quality-copy .button { margin-top:25px; }
.site-footer { padding-top:112px; }.footer-main { display:grid; grid-template-columns:1.2fr .8fr; gap:10%; padding-bottom:88px; }.footer-copy h2 { max-width:680px; }.footer-copy .button { margin-top:35px; }.contact-list { margin:24px 0 0; font-style:normal; }.contact-list p { margin:0 0 30px; font-size:14px; line-height:1.7; }.contact-list small { display:block; margin-bottom:8px; color:var(--orange); font-size:9px; font-weight:800; letter-spacing:1.2px; }.contact-list a { display:block; }.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding-block:20px; color:#aaa; border-top:1px solid rgba(255,255,255,.2); font-size:10px; }.footer-bottom .brand { color:#fff; }.back-top { display:grid; width:28px; height:28px; place-items:center; color:#fff; border:1px solid rgba(255,255,255,.3); border-radius:50%; }
dialog { color:var(--ink); border:0; box-shadow:0 30px 90px rgba(0,0,0,.45); }.product-dialog,.inquiry-dialog { width:min(790px,calc(100% - 32px)); padding:0; overflow:hidden; border-radius:22px; }.product-dialog::backdrop,.inquiry-dialog::backdrop { background:rgba(0,0,0,.68); backdrop-filter:blur(4px); }.dialog-close { position:absolute; z-index:2; top:15px; right:15px; display:grid; width:34px; height:34px; place-items:center; color:#fff; border:0; border-radius:50%; background:var(--ink); font-size:22px; line-height:1; }.product-dialog-hero { position:relative; height:300px; background:#222; }.product-dialog-hero::after { position:absolute; inset:0; content:""; background:linear-gradient(90deg,rgba(0,0,0,.14),rgba(0,0,0,.65)); }.product-dialog-hero img { width:100%; height:100%; object-fit:cover; }.product-dialog-title { position:absolute; z-index:1; right:44px; bottom:30px; max-width:56%; color:#fff; text-align:right; }.product-dialog-title small { color:#ff8b3e; font-size:10px; font-weight:800; letter-spacing:1.3px; }.product-dialog-title h2 { margin-top:5px; font-size:clamp(35px,5vw,57px); }.product-dialog-body { display:grid; grid-template-columns:1.1fr .9fr; gap:28px; padding:38px 44px 45px; }.product-dialog-body>p { margin:0; font-size:15px; line-height:1.75; }.product-specs { display:grid; gap:0; margin:0; border-top:1px solid var(--line); }.product-specs div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--line); font-size:11px; }.product-specs dt { color:#6b6c68; }.product-specs dd { margin:0; font-weight:800; text-align:right; }.product-dialog-footer { display:flex; gap:12px; align-items:center; padding:0 44px 42px; }.product-dialog-footer p { margin:0; color:#666; font-size:11px; }.dialog-heading { padding:54px 56px 35px; background:#ededeb; }.dialog-heading h2 { font-size:clamp(35px,5vw,60px); }.inquiry-form { display:grid; gap:18px; padding:34px 56px 45px; }.inquiry-form label { display:grid; gap:7px; font-size:11px; font-weight:800; }.form-pair { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.inquiry-form input,.inquiry-form textarea,.inquiry-form select { width:100%; padding:12px; border:1px solid #d5d5d2; border-radius:7px; outline-color:var(--orange); background:#fff; }.inquiry-form textarea { resize:vertical; }.inquiry-form .button { width:max-content; }.form-note { margin:0; color:#777; font-size:10px; line-height:1.5; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1); }.reveal.in-view { opacity:1; transform:translateY(0); }.reveal-delay { transition-delay:.14s; }.reveal-delay-2 { transition-delay:.26s; }
@media (max-width:720px) { .wrap { width:min(100% - 32px,560px); }.section-space { padding-block:82px; }.site-header { top:11px; width:calc(100% - 28px); height:55px; padding:0 13px; gap:10px; }.brand { font-size:15px; }.menu-toggle { display:grid; width:36px; height:36px; place-content:center; gap:5px; order:3; color:inherit; border:0; background:transparent; }.menu-toggle span { width:18px; height:1px; background:currentColor; transition:transform .2s; }.menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-3px) rotate(-45deg); }.header-actions { margin-left:auto; }.header-cta { display:none; } nav { position:absolute; top:63px; right:0; left:0; display:none; flex-direction:column; gap:15px; padding:18px; color:#fff; border-radius:14px; background:var(--ink); box-shadow:0 15px 30px rgba(0,0,0,.2); }.scrolled nav { color:var(--ink); background:#fff; }.site-header.menu-open nav { display:flex; }.hero-copy { width:calc(100% - 32px); margin:121px 16px 115px; }.hero h1 { font-size:clamp(52px,15vw,75px); }.hero-summary { font-size:14px; }.hero-fact { bottom:35px; left:16px; right:auto; width:220px; }.hero-scroll { display:none; }.hero-image img { object-position:62% center; }.intro { display:block; }.intro-body { margin:34px 0 51px; }.intro-body>p { font-size:15px; }.photo-window { height:310px; }.stats { width:100%; }.stat-card { padding:20px 14px; }.stat-number { font-size:36px; }.stat-card sup { font-size:15px; }.stat-card p { font-size:9px; }.services { padding:82px 0; }.service-layout,.quality-card,.footer-main { grid-template-columns:1fr; }.services-intro { position:static; margin-bottom:51px; }.service-caption { margin-top:34px; }.accordion-item button { grid-template-columns:42px 1fr auto; }.accordion-item button strong { font-size:17px; }.service-detail { grid-template-columns:1fr; gap:15px; padding:0 0 18px 42px; }.service-image { min-height:152px; }.service-detail ul { grid-template-columns:1fr; margin-top:15px; }.accordion-panel>span { padding-left:42px; }.products-top { display:block; }.products-top>p { margin-top:28px; }.filter-row { margin-top:32px; }.product-grid { gap:12px; }.product-card,.product-card.feature { height:280px; }.product-overlay { inset:auto 14px 13px; }.product-overlay strong { font-size:19px; }.quality-art { min-height:300px; }.quality-copy { padding:49px 27px; }.quality-index { bottom:24px; left:27px; }.quality-index span { font-size:60px; }.product-dialog-hero { height:245px; }.product-dialog-title { right:25px; bottom:23px; max-width:67%; }.product-dialog-body { grid-template-columns:1fr; gap:22px; padding:30px 25px; }.product-dialog-footer { padding:0 25px 29px; flex-direction:column; align-items:flex-start; }.form-pair { grid-template-columns:1fr; }.dialog-heading,.inquiry-form { padding-left:25px; padding-right:25px; }.dialog-heading { padding-top:48px; }.site-footer { padding-top:80px; }.footer-main { padding-bottom:55px; }.contact-list { margin-top:0; }.reveal-delay,.reveal-delay-2 { transition-delay:0s; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }

/* Iteration two: accessible metrics, industrial brand motion, and image-led detail views */
.stat-number { display:inline-block; margin-right:.12em; letter-spacing:-.06em; line-height:1; } .stat-card sup { display:inline-block; margin-left:.05em; font-size:32px; line-height:1; vertical-align:.08em; }
.services h2 { max-width:440px; letter-spacing:-.055em; line-height:1.04; }.services h2 em { display:inline-block; margin-top:.08em; }.service-caption { gap:22px; align-items:center; margin-top:44px; }.service-caption span { flex:0 0 auto; letter-spacing:-.055em; }.service-caption p { max-width:190px; font-size:12px; line-height:1.6; }
.service-detail ul li { padding:6px 8px; border:1px solid transparent; border-radius:7px; cursor:pointer; transition:color .2s,border-color .2s,background .2s; }.service-detail ul li:hover,.service-detail ul li.active { color:#fff; border-color:rgba(238,101,0,.68); background:rgba(238,101,0,.1); }.service-detail ul li::before { content:"→"; }.service-subdetail { display:grid; grid-template-columns:132px 1fr; gap:14px; margin-top:16px; padding:12px; border:1px solid rgba(255,255,255,.15); border-radius:10px; background:rgba(255,255,255,.04); }.service-subdetail img { width:132px; height:88px; object-fit:cover; border-radius:6px; }.service-subdetail small { display:block; margin-bottom:5px; color:var(--orange); font-size:9px; font-weight:800; letter-spacing:1.2px; }.service-subdetail p { font-size:11px; line-height:1.55; }
.brand { padding-bottom:5px; overflow:visible; }.brand::after { position:absolute; right:-13px; bottom:3px; width:9px; height:9px; content:""; border:2px solid var(--orange); border-top:0; border-left:0; transform:rotate(45deg); opacity:.75; animation:brandHook 3.6s ease-in-out infinite; }.brand i { width:28px; transition:width .35s ease; }.brand:hover i { width:100%; }.brand:hover::after { animation-duration:1.1s; } @keyframes brandHook { 0%,100% { transform:translateX(0) rotate(45deg); } 50% { transform:translateX(-6px) translateY(2px) rotate(45deg); } }
.site-header nav a,.header-cta,.language-toggle { min-height:40px; display:inline-flex; align-items:center; }.site-header nav a { padding-inline:4px; font-size:13px; }.header-cta { padding:10px 13px 10px 17px; font-size:12px; }.footer-copy .button { min-height:58px; padding:17px 26px; font-size:14px; }.back-top { width:44px; height:44px; font-size:18px; }.footer-bottom .brand { font-size:20px; }
.quality-art { min-height:670px; }.quality-point { min-height:58px; grid-template-columns:50px 1fr auto; }.quality-point span { font-size:14px; }.quality-point b { font-size:16px; }.quality-point i { font-size:25px; }.quality-readout { min-height:0; padding:0; border:0; background:none; }.quality-readout>p { display:none; }.quality-gallery { display:grid; grid-template-columns:158px 1fr; gap:16px; padding:14px; border-left:3px solid var(--orange); background:rgba(255,255,255,.55); }.quality-gallery img { width:158px; height:100px; object-fit:cover; border-radius:7px; }.quality-gallery small { display:block; color:var(--orange); font-size:9px; font-weight:800; letter-spacing:1.2px; }.quality-gallery strong { display:block; margin:5px 0; font-size:14px; }.quality-gallery p { margin:0; color:#595a57; font-size:12px; line-height:1.6; }
.product-gallery { position:relative; padding:20px 44px 0; overflow:hidden; }.gallery-track { display:flex; gap:10px; overflow-x:auto; padding-bottom:13px; scroll-snap-type:x mandatory; scrollbar-width:thin; }.gallery-card { position:relative; flex:0 0 min(300px,72%); height:165px; overflow:hidden; border:0; border-radius:10px; background:#222; scroll-snap-align:start; text-align:left; }.gallery-card img { width:100%; height:100%; object-fit:cover; }.gallery-card span { position:absolute; inset:auto 0 0; padding:22px 12px 10px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.85)); font-size:10px; line-height:1.35; }.gallery-card.active { outline:3px solid var(--orange); outline-offset:2px; }.gallery-arrows { position:absolute; top:87px; right:50px; display:flex; gap:6px; }.gallery-arrows button { display:grid; width:30px; height:30px; place-items:center; color:#fff; border:0; border-radius:50%; background:rgba(10,12,13,.8); }
.service-image-design { background-image:linear-gradient(135deg,rgba(0,0,0,.08),rgba(0,0,0,.45)),url("assets/service-engineering-original.png"); background-position:center; }.service-image-fabrication { background-image:linear-gradient(135deg,rgba(0,0,0,.06),rgba(0,0,0,.48)),url("assets/service-fabrication-original.png"); background-position:center; }.service-image-logistics { background-image:linear-gradient(135deg,rgba(0,0,0,.1),rgba(0,0,0,.45)),url("assets/service-logistics-original.png"); background-position:center; }.service-image-installation { background-image:linear-gradient(135deg,rgba(0,0,0,.1),rgba(0,0,0,.42)),url("assets/service-installation-original.png"); background-position:center; }
@media (max-width:720px) { .stat-number { margin-right:.1em; letter-spacing:-.04em; }.stat-card sup { font-size:22px; vertical-align:.06em; }.services h2 { max-width:360px; letter-spacing:-.04em; }.service-caption { gap:14px; margin-top:31px; }.service-caption span { font-size:28px; }.service-caption p { max-width:180px; font-size:11px; }.service-subdetail { grid-template-columns:1fr; }.service-subdetail img { width:100%; height:140px; }.site-header nav a,.language-toggle { min-height:42px; font-size:13px; }.footer-copy .button { min-height:54px; font-size:13px; }.back-top { width:42px; height:42px; }.footer-bottom .brand { font-size:17px; }.quality-point b { font-size:15px; }.quality-gallery { grid-template-columns:1fr; }.quality-gallery img { width:100%; height:150px; }.product-gallery { padding:16px 25px 0; }.gallery-card { flex-basis:84%; height:150px; }.gallery-arrows { display:none; } }

/* Revision 01 — deliberately simple, direct image selection. */
.intro-body > p { max-width:680px; color:#20211f; font-size:clamp(20px,1.65vw,27px); font-weight:500; line-height:1.72; letter-spacing:-.025em; }
.company-name { display:inline; color:#0b0d0f; font-family:var(--display); font-size:1.13em; font-weight:900; letter-spacing:-.055em; box-shadow:inset 0 -.18em 0 rgba(238,101,0,.45); }
.service-stage { border-top:1px solid rgba(255,255,255,.2); }
.service-stage:last-child { border-bottom:1px solid rgba(255,255,255,.2); }
.service-trigger { display:grid; grid-template-columns:58px 1fr 36px; width:100%; min-height:84px; align-items:center; color:#fff; border:0; background:transparent; text-align:left; cursor:pointer; }
.service-trigger span { color:var(--orange); font-size:15px; font-style:italic; font-weight:800; }
.service-trigger strong { font-size:clamp(20px,2vw,31px); letter-spacing:-.045em; }
.service-trigger i { color:#fff; font-size:28px; font-style:normal; font-weight:300; text-align:right; transition:transform .2s ease; }
.service-stage.is-active .service-trigger i { transform:rotate(45deg); color:var(--orange); }
.service-stage-panel { display:none; padding:0 0 28px 58px; }
.service-stage.is-active .service-stage-panel { display:block; animation:stage-open .26s ease both; }
@keyframes stage-open { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:none } }
.service-stage-main { display:grid; grid-template-columns:minmax(230px,.95fr) minmax(280px,1.25fr); gap:26px; align-items:stretch; }
.service-stage-copy { display:flex; flex-direction:column; justify-content:space-between; padding:5px 0; }
.service-stage-copy > p { margin:0 0 18px; color:#dadada; font-size:15px; line-height:1.75; }
.service-stage-copy ul { display:grid; gap:8px; margin:0; padding:0; list-style:none; }
.service-stage-copy li { padding-left:16px; color:#aeaeae; font-size:13px; line-height:1.5; }
.service-stage-copy li::before { content:'—'; position:absolute; margin-left:-16px; color:var(--orange); }
.service-stage-visual { position:relative; min-height:225px; margin:0; overflow:hidden; border-radius:12px; background:#17191a; }
.service-stage-visual img { width:100%; height:100%; min-height:225px; object-fit:cover; }
.service-stage-visual figcaption { position:absolute; inset:auto 0 0; display:grid; gap:3px; padding:42px 17px 14px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.9)); font-size:12px; }
.service-stage-visual figcaption span { color:var(--orange); font-size:10px; font-weight:800; letter-spacing:.12em; }
.service-stage-selectors { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-top:12px; }
.service-stage-thumb { position:relative; height:72px; padding:0; overflow:hidden; border:1px solid transparent; border-radius:7px; background:#252525; cursor:pointer; }
.service-stage-thumb img { width:100%; height:100%; object-fit:cover; opacity:.62; transition:opacity .18s,transform .18s; }
.service-stage-thumb span { position:absolute; inset:auto 6px 5px auto; color:#fff; font-size:10px; font-weight:800; text-shadow:0 1px 4px #000; }
.service-stage-thumb:hover img,.service-stage-thumb.is-selected img { opacity:1; transform:scale(1.04); }
.service-stage-thumb.is-selected { border-color:var(--orange); box-shadow:0 0 0 1px var(--orange); }
.quality-art { display:grid; min-height:680px; place-items:center; overflow:hidden; background:linear-gradient(145deg,#101518,#050606); }
.quality-art::after { display:none; }
.quality-art img { position:relative; z-index:1; width:76%; height:auto; max-height:65%; padding:26px; object-fit:contain; border-radius:12px; background:#c8cbc9; box-shadow:0 24px 50px rgba(0,0,0,.3); }
.quality-index { z-index:2; right:24px; bottom:26px; left:24px; display:flex; align-items:end; justify-content:space-between; }
.quality-index span { color:var(--orange); font-size:clamp(38px,5vw,74px); font-style:italic; letter-spacing:-.08em; }
.quality-index p { max-width:170px; font-size:10px; line-height:1.55; text-align:right; }
.quality-readout[hidden] { display:none; }
.quality-points { margin-top:22px; }
.quality-point { position:relative; width:100%; min-height:62px; cursor:pointer; }
.quality-inline-detail { display:grid; grid-template-columns:1fr 1.1fr; gap:16px; margin:0 0 6px; padding:16px 0 18px 52px; border-left:2px solid var(--orange); animation:stage-open .22s ease both; }
.quality-inline-copy small { display:block; margin-bottom:6px; color:var(--orange); font-size:10px; font-weight:900; letter-spacing:.11em; }
.quality-inline-copy strong { display:block; margin-bottom:7px; font-size:18px; }
.quality-inline-copy p { margin:0; color:#575956; font-size:13px; line-height:1.65; }
.quality-inline-detail figure { position:relative; min-height:144px; margin:0; overflow:hidden; border-radius:8px; background:#1b1b1b; }
.quality-inline-detail figure img { width:100%; height:100%; min-height:144px; object-fit:cover; }
.quality-inline-detail figcaption { position:absolute; inset:auto 0 0; padding:28px 11px 9px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.86)); font-size:10px; line-height:1.45; }
.quality-inline-detail figcaption span { display:block; margin-bottom:2px; color:var(--orange); font-weight:800; letter-spacing:.1em; }
.quality-image-picks { grid-column:1/-1; display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.quality-image-picks button { min-height:42px; padding:5px 4px; color:#6b6c68; border:1px solid #cececa; background:#f7f6f2; cursor:pointer; font-size:12px; font-weight:800; }
.quality-image-picks button span { display:block; overflow:hidden; margin-top:3px; font-size:9px; font-weight:500; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.quality-image-picks button.is-selected,.quality-image-picks button:hover { color:#101010; border-color:var(--orange); background:#fff; }
.clean-product-gallery { display:grid; grid-template-columns:repeat(5,1fr); gap:9px; padding:14px 0 0; }
.clean-product-gallery button { position:relative; height:90px; padding:0; overflow:hidden; border:2px solid transparent; border-radius:8px; background:#222; cursor:pointer; text-align:left; }
.clean-product-gallery img { width:100%; height:100%; object-fit:cover; opacity:.68; transition:opacity .18s; }
.clean-product-gallery span { position:absolute; inset:auto 0 0; padding:22px 7px 6px; overflow:hidden; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.88)); font-size:9px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.clean-product-gallery button:hover img,.clean-product-gallery button.is-selected img { opacity:1; }
.clean-product-gallery button.is-selected { border-color:var(--orange); }
@media (max-width:720px) { .intro-body > p { font-size:19px; line-height:1.78; }.service-trigger { grid-template-columns:42px 1fr 30px; min-height:66px; }.service-trigger strong { font-size:18px; }.service-stage-panel { padding:0 0 20px 0; }.service-stage-main { grid-template-columns:1fr; gap:14px; }.service-stage-copy > p { font-size:13px; }.service-stage-visual,.service-stage-visual img { min-height:190px; }.service-stage-selectors { gap:5px; }.service-stage-thumb { height:54px; }.quality-art { min-height:310px; }.quality-art img { width:64%; max-height:68%; padding:16px; }.quality-index { right:15px; bottom:15px; left:15px; }.quality-index span { font-size:35px; }.quality-index p { font-size:8px; }.quality-inline-detail { grid-template-columns:1fr; padding-left:16px; }.quality-inline-detail figure,.quality-inline-detail figure img { min-height:160px; }.quality-image-picks { grid-template-columns:repeat(5,1fr); }.quality-image-picks button { min-height:38px; font-size:11px; }.quality-image-picks button span { display:none; }.clean-product-gallery { grid-template-columns:repeat(3,1fr); }.clean-product-gallery button { height:78px; } }

/* Current visual QA pass: stronger service eyebrow, quality rail and a real industrial quality visual. */
.services-intro .eyebrow { gap:15px; font-size:clamp(17px,1.35vw,22px) !important; font-weight:850; letter-spacing:.035em; }
.services-intro .eyebrow span:first-child { width:42px; height:3px; }
.quality-art { position:relative; display:block; background:#0a0d0f; }
.quality-art > img:not(.quality-official-mark) { width:100%; height:100%; max-width:none; max-height:none; padding:0; object-fit:cover; border-radius:0; background:transparent; box-shadow:none; filter:saturate(.9) contrast(1.08); }
.quality-art::before { position:absolute; z-index:1; inset:0; content:""; background:linear-gradient(145deg,rgba(4,8,10,.1) 20%,rgba(3,6,7,.88) 84%),linear-gradient(90deg,rgba(238,101,0,.35),transparent 44%); pointer-events:none; }
.quality-official-mark { position:absolute !important; z-index:3; top:28px; left:28px; width:148px !important; height:auto !important; max-height:none !important; padding:13px !important; object-fit:contain !important; border-radius:8px !important; background:rgba(226,229,225,.94) !important; box-shadow:0 10px 30px rgba(0,0,0,.26) !important; }
.quality-index { z-index:4; }
.quality-gallery-nav { display:grid; grid-template-columns:36px minmax(0,1fr) 36px; gap:9px; grid-column:1/-1; align-items:center; }
.quality-gallery-nav .quality-image-picks { grid-column:auto; }
.quality-image-picks { display:flex; min-width:0; gap:7px; overflow-x:auto; padding:3px 0 9px; scroll-snap-type:x mandatory; scrollbar-color:var(--orange) rgba(0,0,0,.12); scrollbar-width:thin; }
.quality-image-picks::-webkit-scrollbar { height:7px; }.quality-image-picks::-webkit-scrollbar-track { border-radius:8px; background:rgba(0,0,0,.11); }.quality-image-picks::-webkit-scrollbar-thumb { border-radius:8px; background:var(--orange); }
.quality-image-picks button { flex:0 0 150px; min-width:150px; min-height:54px; scroll-snap-align:start; }
.quality-rail-arrow { display:grid; width:36px; height:36px; place-items:center; color:#fff; border:0; border-radius:50%; background:#101214; cursor:pointer; font-size:18px; transition:background .18s,transform .18s; }.quality-rail-arrow:hover { background:var(--orange); transform:scale(1.06); }
.quality-gallery-range { grid-column:1/-1; width:100%; height:22px; margin:1px 0 0; accent-color:var(--orange); cursor:ew-resize; }
@media (max-width:720px) { .services-intro .eyebrow { font-size:15px; }.services-intro .eyebrow span:first-child { width:32px; }.quality-official-mark { top:16px; left:16px; width:105px !important; padding:8px !important; }.quality-gallery-nav { grid-template-columns:32px minmax(0,1fr) 32px; gap:5px; }.quality-rail-arrow { width:32px; height:32px; }.quality-image-picks button { flex-basis:122px; min-width:122px; }.quality-image-picks button span { display:block; }.quality-gallery-range { height:20px; } }