:root {
  --ink: #0b0d10;
  --ink-2: #141820;
  --paper: #ffffff;
  --soft: #f3f5f7;
  --line: #d9dee5;
  --muted: #626b78;
  --blue: #2457ff;
  --blue-dark: #173ecc;
  --max: 1240px;
  --radius: 14px;
  --shadow: 0 24px 70px rgba(10, 16, 30, 0.12);
}

* { box-sizing: border-box; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, "Noto Sans SC", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
button { color: inherit; }
.container { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 999; background: white; padding: 12px 18px; border-radius: 8px; }
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(8, 10, 13, .92); color: white;
  border-bottom: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(18px);
}
.nav-wrap { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.logo { display: inline-flex; align-items: center; gap: 12px; font-weight: 900; font-style: italic; letter-spacing: -1.8px; font-size: 25px; }
.logo-mark { width: 34px; height: 8px; position: relative; display: inline-block; transform: skew(-22deg); }
.logo-mark::before, .logo-mark::after { content:""; position:absolute; left:0; height:3px; background:var(--blue); }
.logo-mark::before { width:34px; top:0; }
.logo-mark::after { width:22px; bottom:0; }
.nav-main { display:flex; align-items:center; gap:24px; margin-left:auto; }
.nav-links { display:flex; align-items:center; gap:24px; font-size:14px; }
.nav-links a { position:relative; padding:28px 0; color:#d6d9df; transition:.2s ease; }
.nav-links a:hover, .nav-links a.active { color:white; }
.nav-links a.active::after { content:""; position:absolute; left:0; right:0; bottom:17px; height:2px; background:var(--blue); }
.nav-cta { border:1px solid #5c6572; padding:11px 18px !important; border-radius:6px; color:white !important; }
.nav-cta::after { display:none; }
.language-select {
  width:auto; max-width:112px; height:38px; padding:0 28px 0 11px;
  border:1px solid #505965; border-radius:6px; color:#f3f5f7; background:#15191f;
  font-size:12px; font-weight:650; cursor:pointer; outline:none;
}
.language-select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(36,87,255,.18); }
.language-select option { background:#15191f; color:white; }
.menu-button { display:none; width:44px; height:44px; border:0; background:transparent; padding:10px; cursor:pointer; }
.menu-button span { display:block; height:2px; background:white; margin:5px 0; transition:.2s; }

.hero { min-height: 690px; color: white; background:#090b0e; overflow:hidden; position:relative; display:grid; align-items:center; }
.hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, #080a0d 0%, rgba(8,10,13,.96) 36%, rgba(8,10,13,.2) 70%), url("assets/fan-dual.jpg") 82% center/min(900px,65vw) auto no-repeat; }
.hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,var(--blue),transparent); opacity:.7; }
.hero .container { position:relative; z-index:1; }
.hero-copy { max-width:670px; padding:96px 0 88px; }
.hero h1 { font-size:clamp(48px,6.6vw,92px); line-height:1.04; letter-spacing:-.065em; margin:0 0 28px; max-width:760px; }
.hero p { max-width:580px; color:#c6ccd5; font-size:18px; line-height:1.9; margin:0 0 38px; }
.hero-actions, .button-row { display:flex; flex-wrap:wrap; gap:14px; }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:0 24px; border:1px solid transparent; border-radius:7px; font-size:14px; font-weight:700; transition:.2s ease; cursor:pointer; }
.button svg { width:17px; }
.button-primary { background:var(--blue); color:white; }
.button-primary:hover { background:var(--blue-dark); transform:translateY(-2px); }
.button-outline { border-color:#6e7682; color:white; background:rgba(255,255,255,.02); }
.button-outline:hover { border-color:white; }
.button-dark { background:var(--ink); color:white; }
.button-light { border-color:#cbd0d7; background:white; }

.section { padding:110px 0; }
.section-sm { padding:72px 0; }
.soft { background:var(--soft); }
.dark { background:var(--ink); color:white; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:48px; }
.section-heading h2, .display-title { margin:0; font-size:clamp(34px,4.6vw,62px); line-height:1.08; letter-spacing:-.055em; }
.section-heading p { color:var(--muted); line-height:1.8; max-width:540px; margin:0; }
.dark .section-heading p { color:#aab1bc; }
.blue-line { width:46px; height:4px; background:var(--blue); margin-bottom:24px; }
.intro-grid { display:grid; grid-template-columns:.82fr 1.25fr; gap:80px; align-items:center; }
.intro-copy h2 { font-size:clamp(38px,5vw,64px); letter-spacing:-.05em; line-height:1.08; margin:0 0 28px; }
.intro-copy p { color:#555e6a; font-size:16px; line-height:2; margin:0 0 30px; }
.media-stack { display:grid; grid-template-columns:1.2fr .8fr; gap:12px; }
.media-stack img, .story-media img { width:100%; height:100%; object-fit:cover; border-radius:var(--radius); }
.media-stack .tall { grid-row:span 2; min-height:500px; }
.media-stack .small { height:244px; }

.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.product-card { position:relative; min-height:500px; overflow:hidden; border-radius:var(--radius); background:#080b10; color:white; box-shadow:var(--shadow); }
.product-card img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:.5s ease; }
.product-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.04) 42%, rgba(0,0,0,.9)); }
.product-card:hover img { transform:scale(1.035); }
.product-card-content { position:absolute; z-index:2; left:26px; right:26px; bottom:25px; }
.product-card h3 { margin:0 0 8px; font-size:24px; }
.product-card p { color:#c6cbd3; line-height:1.7; font-size:14px; margin:0 0 20px; }
.text-link { color:var(--blue); font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:9px; }

.quality { overflow:hidden; position:relative; }
.quality::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(11,13,16,.08),#0b0d10 62%),url("assets/fan-round.jpg") left center/55% auto no-repeat; }
.quality-grid { position:relative; display:grid; grid-template-columns:1fr 1.05fr; gap:70px; min-height:470px; align-items:center; }
.quality-copy { grid-column:2; padding:80px 0; }
.quality-copy h2 { font-size:clamp(34px,4.2vw,58px); line-height:1.1; letter-spacing:-.045em; margin:0 0 36px; }
.quality-points { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }
.quality-point { border-top:1px solid #3b414a; padding-top:20px; }
.quality-point b { display:block; font-size:18px; margin-bottom:10px; }
.quality-point p { color:#aeb5c0; font-size:13px; line-height:1.7; margin:0; }
.quality-icon { width:38px; height:38px; display:grid; place-items:center; color:var(--blue); margin-bottom:20px; }
.quality-icon svg { width:34px; height:34px; stroke:currentColor; fill:none; stroke-width:1.6; }

.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.story-media { position:relative; min-height:460px; overflow:hidden; border-radius:var(--radius); }
.story-media img { position:absolute; inset:0; }
.story-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.82)); }
.story-caption { position:absolute; z-index:2; left:30px; right:30px; bottom:28px; color:white; }
.story-caption h3 { font-size:26px; margin:0 0 8px; }
.story-caption p { color:#d2d6dc; margin:0; line-height:1.65; }

.cta-band { background:linear-gradient(110deg,#11151b,#07172e); color:white; overflow:hidden; position:relative; }
.cta-band::after { content:""; position:absolute; width:50%; height:2px; right:-5%; top:50%; background:linear-gradient(90deg,transparent,var(--blue),transparent); transform:rotate(-12deg); box-shadow:0 0 35px var(--blue); }
.cta-inner { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:40px; padding:62px 0; }
.cta-inner h2 { font-size:clamp(32px,4vw,52px); margin:0 0 10px; letter-spacing:-.045em; }
.cta-inner p { color:#aeb7c5; margin:0; }

.site-footer { background:#090c10; color:white; padding:68px 0 26px; }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:70px; }
.footer-brand p { max-width:360px; color:#9da5b0; line-height:1.75; margin:20px 0 0; }
.footer-title { color:#727c8a; font-size:12px; text-transform:uppercase; letter-spacing:.18em; margin:0 0 18px; }
.footer-links { display:grid; gap:12px; color:#d9dde2; font-size:14px; }
.footer-links a:hover { color:var(--blue); }
.footer-contact { display:grid; gap:14px; font-size:14px; }
.footer-contact a, .footer-contact span { color:#dfe3e8; }
.footer-contact small { color:#727c8a; display:block; margin-bottom:3px; }
.copyright { display:flex; justify-content:space-between; gap:20px; border-top:1px solid #29303a; padding-top:22px; margin-top:56px; color:#6f7885; font-size:12px; }

.page-hero { background:#0a0d11; color:white; min-height:420px; display:flex; align-items:center; position:relative; overflow:hidden; }
.page-hero::after { content:""; position:absolute; width:48vw; height:48vw; right:-12vw; top:-26vw; border:1px solid #283c69; border-radius:50%; box-shadow:0 0 100px rgba(36,87,255,.15); }
.page-hero-inner { position:relative; z-index:1; padding:84px 0; max-width:850px; }
.page-hero h1 { font-size:clamp(48px,7vw,88px); letter-spacing:-.065em; margin:0 0 22px; }
.page-hero p { color:#b8c0cb; font-size:18px; line-height:1.85; max-width:720px; margin:0; }
.breadcrumbs { color:#7f8996; font-size:13px; margin-bottom:28px; display:flex; gap:10px; }
.breadcrumbs a { color:#b7bec8; }

.prose-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.sticky-title { position:sticky; top:125px; align-self:start; }
.sticky-title h2 { font-size:clamp(34px,4vw,54px); margin:0; letter-spacing:-.045em; line-height:1.12; }
.prose p { color:#4e5763; line-height:2.05; font-size:16px; margin:0 0 22px; }
.facts { border-top:1px solid var(--line); margin-top:42px; }
.fact-row { display:grid; grid-template-columns:150px 1fr; padding:20px 0; border-bottom:1px solid var(--line); font-size:14px; line-height:1.7; }
.fact-row b { color:#7a8390; font-weight:600; }
.wide-image { width:100%; max-height:620px; object-fit:cover; border-radius:var(--radius); margin-top:48px; }

.catalog-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:34px; }
.filters { display:flex; flex-wrap:wrap; gap:10px; }
.filter { border:1px solid var(--line); background:white; padding:11px 17px; border-radius:6px; cursor:pointer; font-size:14px; }
.filter.active, .filter:hover { background:var(--ink); border-color:var(--ink); color:white; }
.catalog-count { color:#7b8491; font-size:14px; }
.catalog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.catalog-card { border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:white; transition:.25s; }
.catalog-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.catalog-card.hidden { display:none; }
.catalog-image { aspect-ratio:1.28; overflow:hidden; background:#e9ebed; }
.catalog-image img { width:100%; height:100%; object-fit:cover; }
.catalog-card[data-category="motor"] .catalog-image img { object-fit:contain; object-position:center; }
.catalog-body { padding:22px; }
.catalog-body h3 { margin:0 0 9px; font-size:20px; }
.catalog-body p { color:var(--muted); line-height:1.65; margin:0; font-size:14px; }
.catalog-meta { display:flex; justify-content:space-between; color:#8b949f; border-top:1px solid var(--line); padding-top:15px; margin-top:18px; font-size:12px; }

.tech-flow { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.tech-step { padding:42px 35px; border-right:1px solid var(--line); }
.tech-step:last-child { border-right:0; }
.tech-step span { font:700 13px/1 monospace; color:var(--blue); }
.tech-step h3 { font-size:24px; margin:42px 0 12px; }
.tech-step p { color:var(--muted); line-height:1.75; margin:0; }
.principles { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:50px; }
.principle { background:var(--soft); padding:42px; border-radius:var(--radius); }
.principle h3 { font-size:26px; margin:0 0 16px; }
.principle p { color:var(--muted); line-height:1.8; margin:0; }

.contact-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; }
.contact-list { display:grid; gap:0; border-top:1px solid var(--line); }
.contact-item { padding:24px 0; border-bottom:1px solid var(--line); }
.contact-item small { display:block; color:#808997; margin-bottom:7px; }
.contact-item a, .contact-item span { font-size:18px; font-weight:700; }
.contact-form { background:var(--soft); border-radius:var(--radius); padding:42px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field { display:grid; gap:8px; }
.field.full { grid-column:1/-1; }
.field label { font-size:13px; font-weight:700; }
.field input, .field textarea { width:100%; border:1px solid #cbd1d8; border-radius:7px; padding:14px 15px; background:white; color:var(--ink); outline:none; }
.field input:focus, .field textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(36,87,255,.11); }
.field textarea { min-height:140px; resize:vertical; }
.form-note { color:#7e8794; font-size:12px; line-height:1.65; margin:15px 0 0; }
.form-status { min-height:24px; margin-top:14px; font-size:14px; color:var(--blue-dark); }
.address-card { display:grid; grid-template-columns:1.1fr .9fr; background:var(--ink); color:white; border-radius:var(--radius); overflow:hidden; }
.address-copy { padding:48px; }
.address-copy h3 { font-size:32px; margin:0 0 20px; }
.address-copy p { color:#aeb6c1; line-height:1.85; }
.address-card img { width:100%; height:100%; object-fit:cover; }

.reveal { opacity:1; transform:none; }

@media (max-width: 1120px) {
  .menu-button { display:block; }
  .nav-main { margin-left:auto; }
  .nav-links { display:none; position:fixed; inset:76px 0 auto; min-height:calc(100vh - 76px); background:#090c10; padding:40px 24px; flex-direction:column; align-items:flex-start; gap:0; }
  .nav-links.open { display:flex; }
  .nav-links a { width:100%; padding:18px 0; font-size:20px; border-bottom:1px solid #242a33; }
  .nav-links a.active::after { display:none; }
  .nav-cta { margin-top:22px; text-align:center; }
  .hero { min-height:660px; }
  .hero::before { opacity:.55; background:linear-gradient(90deg,#080a0d 0%,rgba(8,10,13,.6)),url("assets/fan-dual.jpg") 62% center/cover no-repeat; }
  .intro-grid, .prose-grid, .contact-layout { grid-template-columns:1fr; gap:50px; }
  .sticky-title { position:static; }
  .product-grid, .catalog-grid { grid-template-columns:repeat(2,1fr); }
  .quality::before { opacity:.24; background:url("assets/fan-round.jpg") center/cover no-repeat; }
  .quality-grid { grid-template-columns:1fr; }
  .quality-copy { grid-column:1; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}

@media (max-width: 680px) {
  .container { width:min(calc(100% - 32px),var(--max)); }
  .section { padding:76px 0; }
  .section-heading { align-items:start; flex-direction:column; margin-bottom:32px; }
  .hero { min-height:620px; }
  .hero-copy { padding:78px 0; }
  .hero h1 { font-size:50px; }
  .hero p { font-size:16px; }
  .media-stack { grid-template-columns:1fr; }
  .media-stack .tall { grid-row:auto; min-height:320px; }
  .media-stack .small { height:240px; }
  .product-grid, .catalog-grid, .story-grid, .principles { grid-template-columns:1fr; }
  .product-card { min-height:460px; }
  .quality-points { grid-template-columns:1fr; }
  .quality-point { display:grid; grid-template-columns:48px 1fr; column-gap:15px; }
  .quality-point .quality-icon { grid-row:1/3; }
  .quality-point b { margin:0; }
  .cta-inner { align-items:flex-start; flex-direction:column; }
  .footer-grid { grid-template-columns:1fr; gap:42px; }
  .footer-brand { grid-column:auto; }
  .copyright { flex-direction:column; }
  .page-hero { min-height:360px; }
  .page-hero h1 { font-size:50px; }
  .catalog-toolbar { align-items:flex-start; flex-direction:column; }
  .tech-flow { grid-template-columns:1fr; }
  .tech-step { border-right:0; border-bottom:1px solid var(--line); padding:34px 8px; }
  .tech-step:last-child { border-bottom:0; }
  .tech-step h3 { margin-top:24px; }
  .form-grid { grid-template-columns:1fr; }
  .contact-form { padding:26px; }
  .address-card { grid-template-columns:1fr; }
  .address-copy { padding:32px; }
  .address-card img { max-height:340px; }
  .fact-row { grid-template-columns:1fr; gap:8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}
  .nav-wrap { gap:10px; }
  .logo { font-size:21px; }
  .logo-mark { width:27px; }
  .language-select { max-width:92px; height:36px; padding-left:8px; font-size:11px; }
