/* ================================================================
   林氏毛织厂 · pages-home.css
   首页专属样式 — 仅 index.html 引入
   ================================================================ */

/* ═══ 首页专属样式 ═══ */

/* HERO */
.hero {
  background: linear-gradient(150deg,#1B3A5C 0%,#243f62 55%,#2e5280 100%);
  min-height: clamp(520px,70vh,720px); display:flex; align-items:center;
  position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:60px 60px;
}
.hero-arc {
  position:absolute; right:-5%; bottom:-10%;
  width:52%; aspect-ratio:1;
  border-radius:50%;
  border: 1px solid rgba(255,255,255,.06);
  pointer-events:none;
}
.hero-arc::after {
  content:''; position:absolute;
  inset: 14%;
  border-radius:50%;
  border: 1px solid rgba(255,255,255,.05);
}
.hero-inner {
  position:relative; z-index:1; width:100%;
  max-width:var(--max); margin:0 auto; padding:60px 24px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:72px; align-items:center;
}
@media(max-width:960px){ .hero-inner{grid-template-columns:1fr 600px; gap:40px;padding:64px 16px 52px;} }

.hero-eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--fe); font-size:11px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase;
  color:rgba(255,255,255,.45); margin-bottom:20px;
}
.hero-eyebrow::before { content:''; width:20px; height:1px; background:rgba(255,255,255,.3); }

.hero-h1 {
  font-size:clamp(28px,4.8vw,50px); font-weight:700;
  color:#fff; line-height:1.16; letter-spacing:-.02em; margin-bottom:20px;
}
.hero-h1 em { font-style:normal; color:#7BB8FF; }

.hero-lead {
  font-size:16px; color:rgba(255,255,255,.58);
  line-height:1.85; max-width:480px; margin-bottom:36px;
}

.hero-ctas { display:flex; gap:12px; flex-wrap:wrap; }

/* 客户痛点条 */
.hero-pain {
  display:flex; flex-direction:column; gap:10px;
  margin-top:40px;
  padding-top:36px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.pain-item {
  display:flex; align-items:flex-start; gap:12px;
  font-size:13px; color:rgba(255,255,255,.55);
  line-height:1.6;
}
.pain-icon {
  width:20px; height:20px; flex-shrink:0; margin-top:1px;
  background:rgba(123,184,255,.15);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.pain-icon svg { width:11px; height:11px; fill:#7BB8FF; }
.pain-item strong { color:rgba(255,255,255,.82); font-weight:600; }

/* 右侧图片区 */
.hero-visual {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-auto-rows:220px;
  gap:12px;
}
.hv-img {
  border-radius:13px; overflow:hidden;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  position:relative;
}
.hv-img img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.hv-img:hover img { transform:scale(1.05); }
.hv-img.tall { grid-row:1/3; border-radius:15px; }
.hv-label {
  position:absolute; bottom:8px; left:8px; right:8px;
  background:rgba(15,30,55,.72);
  backdrop-filter:blur(8px);
  border-radius:7px; padding:6px 10px;
  font-size:11px; color:rgba(255,255,255,.85); font-weight:600;
  letter-spacing:.04em;
}

/* ═══ 痛点/解决区 ═══ */
.pain-sec { background:#fff; }
.pain-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
@media(max-width:768px){ .pain-grid{grid-template-columns:1fr;} }

.pain-card {
  border-radius:16px;
  border:1.5px solid var(--line-lt);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease;
}
.pain-card:hover { transform:translateY(-4px); box-shadow:var(--sh-md); }
.pain-card-top {
  background:var(--bg);
  padding:22px 20px 18px;
  border-bottom:1.5px solid var(--line-lt);
}
.pain-q {
  font-size:13px; font-weight:700; color:var(--t1);
  line-height:1.5; margin-bottom:6px;
}
.pain-q::before {
  content:'遇到过？';
  display:inline-block;
  background:#FFF3E8; color:#C55A10;
  font-size:10px; font-weight:700; letter-spacing:.06em;
  padding:2px 7px; border-radius:4px; margin-right:8px;
  vertical-align:middle;
}
.pain-sub { font-size:12px; color:var(--t3); line-height:1.55; }
.pain-card-bot {
  background:#fff;
  padding:18px 20px;
}
.pain-sol-label {
  font-size:10px; font-weight:700; letter-spacing:.1em;
  color:var(--blue); text-transform:uppercase; margin-bottom:8px;
}
.pain-sol-text { font-size:13px; color:var(--t2); line-height:1.7; }

/* ═══ 产品区 ═══ */
.prod-tabs{ display:flex;gap:6px;flex-wrap:wrap;margin-bottom:28px; }
.pt{ padding:8px 18px;font-size:13px;font-weight:600;border-radius:99px;border:1.5px solid var(--line);color:var(--t2);background:var(--white);transition:all .18s;cursor:pointer; }
.pt:hover{ border-color:var(--blue);color:var(--blue); }
.pt.on{ background:var(--navy);color:#fff;border-color:var(--navy); }
.tab-pane{ display:none; }
.tab-pane.show{ display:grid; }

/* ═══ 合作流程 ═══ */
/* steps already in style.css */

/* ═══ 工厂区 ═══ */
.factory-grid{ display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center; }
@media(max-width:768px){ .factory-grid{grid-template-columns:1fr;gap:24px;} }
.fi-grid{ display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:1fr 1fr;gap:10px;height:440px; }
@media(max-width:768px){ .fi-grid{height:300px;} }
.fi{ border-radius:10px;overflow:hidden;background:var(--bg2); }
.fi img{ width:100%;height:100%;object-fit:cover; }
.fi.tall{ grid-row:1/3; }

/* 工艺亮点列表 */
.craft-list { display:flex; flex-direction:column; gap:0; }
.craft-item {
  display:flex; gap:16px; padding:16px 0;
  border-bottom:1px solid var(--line-lt);
  align-items:flex-start;
}
.craft-item:last-child { border-bottom:none; }
.craft-num {
  font-family:var(--fe); font-size:28px; font-weight:800;
  color:var(--navy); line-height:1; flex-shrink:0; width:52px;
  letter-spacing:-.03em;
}
.craft-num span { font-size:14px; font-weight:600; color:var(--blue); }
.craft-title { font-size:14px; font-weight:700; color:var(--t1); margin-bottom:4px; }
.craft-desc { font-size:12px; color:var(--t2); line-height:1.65; }

/* ═══ 客户说 ═══ */
.voice-sec { background:var(--bg); }
.voice-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
}
@media(max-width:768px){ .voice-grid{grid-template-columns:1fr;} }
.voice-card {
  background:#fff; border-radius:14px;
  padding:22px 20px;
  border:1px solid var(--line-lt);
  box-shadow:var(--sh);
  position:relative;
}
.voice-card::before {
  content:'\201C';
  position:absolute; top:14px; right:18px;
  font-size:52px; line-height:1; font-family:Georgia,serif;
  color:var(--blue-soft); font-weight:700;
}
.voice-text {
  font-size:13px; color:var(--t2);
  line-height:1.8; margin-bottom:16px;
  position:relative; z-index:1;
}
.voice-from {
  display:flex; align-items:center; gap:10px;
  border-top:1px solid var(--line-lt); padding-top:12px;
}
.voice-avatar {
  width:34px; height:34px; border-radius:50%;
  background:var(--navy);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--fe); font-size:13px; font-weight:700; color:#fff;
  flex-shrink:0;
}
.voice-name { font-size:13px; font-weight:700; color:var(--t1); }
.voice-role { font-size:11px; color:var(--t3); margin-top:1px; }

/* ═══ CTA ═══ */
.cta-sec{ background:linear-gradient(130deg,#1B3A5C,#2A5080);padding:72px 0;text-align:center; }