/* LVCHA VPN — 单文件样式表（合并自 common / home / news 6 文件） */

/* ===== Reset ===== */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: clamp(13px, 0.7vw + 11px, 18px); -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  line-height: 1.6;
  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  color: #313131;
  background: #fff;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; }
a { color: inherit; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.skip-link { position: absolute; left: -9999px; top: 0; padding: 8px 12px; background: #313131; color: #fff; z-index: 9999; }
.skip-link:focus { left: 8px; top: 8px; }

/* ===== Header ===== */
.header {
  position: fixed; z-index: 999; top: 0; left: 0;
  width: 100%;
  height: clamp(60px, 4vw + 50px, 70px);
  padding: 0 clamp(10px, 1.5vw, 30px);
  display: flex; justify-content: space-between; align-items: center;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
}
.header .logo img { height: clamp(20px, 1.4vw + 16px, 30px); display: block; }
.menu { display: flex; align-items: center; gap: clamp(10px, 1.2vw, 30px); }
.menu .nav { display: flex; align-items: center; }
.menu .nav a {
  padding: 0 clamp(10px, 0.4vw + 8px, 17px);
  color: #6C6D75;
  text-decoration: none;
  font-weight: 500;
  font-size: clamp(12px, 0.4vw + 10px, 18px);
  transition: color .3s;
}
.menu .nav a:hover { color: #FF546A; }
.menu .nav a.active { color: #313131; font-weight: 600; }

/* ===== Footer ===== */
.footer { width: 100%; background: #000; color: #fff; }
.footer .top { padding: clamp(40px, 4vw + 20px, 120px) clamp(15px, 2vw, 40px); text-align: center; }
.footer .top .title { font-weight: 500; font-size: clamp(24px, 1.3vw + 18px, 48px); }
.footer .top .social { margin: clamp(24px, 0.6vw + 20px, 36px) 0; display: flex; justify-content: center; gap: clamp(20px, 0.8vw + 16px, 36px); }
.footer .top .social img { width: clamp(32px, 0.6vw + 28px, 48px); }
.footer .top .social a { transition: transform .3s; display: inline-block; }
.footer .top .social a:hover { transform: scale(1.3); }
.footer .top .subtitle { font-size: clamp(10px, 0.3vw + 8px, 16px); }
.footer .bottom {
  width: 100%;
  padding: 20px clamp(20px, 4vw, 60px);
  display: flex; flex-direction: column; gap: 20px;
}
.footer .bottom .nav { width: 100%; padding-bottom: 10px; display: flex; justify-content: space-around; }
.footer .bottom .nav a { color: #e0e0e0; text-decoration: none; }
.footer .bottom .nav a:hover { color: #FC3C49; }
.footer .bottom .nav .group { padding: 10px; }
.footer .bottom .nav .group > div { margin-bottom: 10px; font-size: clamp(12px, 0.3vw + 10px, 16px); }
.footer .bottom .nav .group div:first-child { color: #fff; font-weight: 500; font-size: clamp(15px, 0.3vw + 13px, 20px); }
.footer .bottom .identifier img { height: clamp(20px, 1vw + 16px, 30px); display: block; }
.footer .bottom .identifier div { margin-top: 6px; color: #565B5E; max-width: 280px; font-size: clamp(11px, 0.2vw + 10px, 14px); }
.footer .copyright { border-top: 1px solid #313131; padding: 15px 20px 20px; text-align: center; font-size: clamp(11px, 0.2vw + 10px, 13px); }

/* Friend links (replaces footer .nav on index) */
.footer .friend-links { width: 100%; padding-bottom: 10px; }
.footer .friend-links-title {
  margin: 0 0 14px;
  color: #fff; font-weight: 500;
  font-size: clamp(15px, 0.3vw + 13px, 20px);
  position: relative;
  padding-left: 12px;
}
.footer .friend-links-title::before {
  content: ''; position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 3px; height: 1em; background: #FC3C49; border-radius: 2px;
}
.footer .friend-links-list {
  display: flex; flex-wrap: wrap;
  gap: 8px 18px;
  font-size: clamp(12px, 0.3vw + 10px, 14px);
}
.footer .friend-links-list a {
  color: #e0e0e0; text-decoration: none;
  position: relative;
  transition: color .3s;
}
.footer .friend-links-list a:hover { color: #FC3C49; }
.footer .friend-links-list a:not(:last-child)::after {
  content: '·'; margin-left: 18px; color: #565B5E;
  pointer-events: none;
  position: absolute; right: -14px; top: 50%; transform: translateY(-50%);
}

@media (min-width: 768px) {
  .footer .bottom { flex-direction: row; justify-content: space-between; align-items: flex-start; }
  .footer .bottom .nav { max-width: 55%; }
  .footer .bottom .friend-links { flex: 1; max-width: 70%; }
  .footer .bottom .identifier { text-align: right; flex-shrink: 0; padding-top: 4px; }
  .footer .bottom .identifier img { margin-left: auto; }
  .footer .bottom .identifier div { margin-left: auto; }
}

/* ===== Sections ===== */
.section {
  padding: clamp(30px, 2vw + 20px, 60px) clamp(15px, 1vw + 10px, 30px);
  display: flex; flex-direction: column; align-items: center; text-align: center;
}
.section .title { margin: clamp(20px, 1.5vw + 14px, 50px) 0; max-width: 1280px; font-weight: 500; }
.section .title .t0 { font-size: clamp(26px, 1.6vw + 18px, 45px); }
.section .title .t1 { font-size: clamp(14px, 0.6vw + 10px, 23px); }
.section .content { width: 100%; max-width: min(90%, 1280px); margin: 0 auto; }

/* ===== S1: Hero ===== */
.s1 {
  position: relative;
  margin-top: clamp(60px, 4vw + 50px, 70px);
  padding-top: clamp(40px, 4vw + 20px, 150px);
  padding-bottom: 0;
  min-height: 86vh;
}
.s1 .content ._ { width: 100%; margin: 30px 0 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: clamp(10px, 1vw, 40px); }
.s1 .content ._0 { max-width: 100%; }
.s1 .title { margin: 30px 0; cursor: default; }
.s1 .title .t0 { font-size: clamp(36px, 2.4vw + 24px, 60px); font-weight: 500; color: #313131; transition: transform 1.5s ease; }
.s1 .title .t0:hover { transform: scale(1.05); }
.s1 .title .t1 { font-size: clamp(12px, 0.7vw + 9px, 24px); font-weight: 500; color: #313131; }
.s1 .title .t1 img { height: clamp(16px, 0.5vw + 14px, 25px); margin-top: -2px; vertical-align: middle; }
.s1 .title .t2 {
  display: inline-block;
  margin-top: 13px;
  padding: 3px 15px;
  border: 1px solid #E7E7E7;
  border-radius: 30px;
  color: #6C6D75;
  font-size: clamp(10px, 0.4vw + 8px, 18px);
}
.s1 .features {
  margin-top: clamp(30px, 1.5vw + 22px, 55px);
  display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end;
  gap: clamp(20px, 1vw + 16px, 50px);
  color: #fff; text-align: center; font-weight: 500;
}
.s1 .features .sep { height: clamp(24px, 0.4vw + 22px, 35px); width: 1px; background: #E7E7E7; }
.s1 .features .feature img { height: clamp(20px, 0.5vw + 18px, 35px); }
.s1 .features .feature div:nth-of-type(1) { color: #FC3C49; font-size: clamp(14px, 0.4vw + 12px, 20px); }
.s1 .features .feature div:nth-of-type(2) { color: #313131; white-space: nowrap; font-size: clamp(11px, 0.3vw + 10px, 16px); }
.s1 .download-area { margin-top: clamp(30px, 1.8vw + 22px, 60px); }
.s1 .download { display: flex; flex-direction: column; align-items: center; gap: 15px; }
.s1 .download > * {
  display: flex; justify-content: center; align-items: center; gap: 8px;
  width: 100%;
  padding: clamp(8px, 0.3vw + 6px, 14px) clamp(10px, 0.5vw + 8px, 20px);
  border-radius: 12px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: box-shadow .3s ease, transform .3s ease;
}
.s1 .download > *:hover { box-shadow: 0 0 10px rgb(203, 248, 2); transform: translateY(-2px); }
.s1 .download img { height: clamp(30px, 0.5vw + 28px, 40px); }
.s1 .download div:first-child { font-size: clamp(9px, 0.3vw + 7px, 14px); }
.s1 .download div:last-child { font-weight: 500; font-size: clamp(13px, 0.4vw + 11px, 18px); }
.s1 .apk { background: #020202; color: #fff; }
.s1 .google-play, .s1 .app-store { border: 1px solid #020202; color: #020202; background: #fff; }
.s1 .other-download { margin-top: 30px; color: #313131; font-size: clamp(11px, 0.3vw + 10px, 15px); }
.s1 .more {
  display: inline-flex; flex-wrap: wrap; justify-content: center;
  max-width: 100%; margin-top: 10px; padding: clamp(8px, 0.3vw + 7px, 12px) clamp(15px, 0.5vw + 12px, 25px);
  border: 1px solid #E7E7E7; border-radius: 30px;
  gap: clamp(10px, 0.4vw + 8px, 20px);
  color: #6C6D75; font-size: clamp(10px, 0.3vw + 9px, 14px);
}
.s1 .more img { height: clamp(12px, 0.2vw + 11px, 16px); margin-top: -2px; vertical-align: middle; }
.s1 .more > div { display: inline-flex; align-items: center; gap: 6px; }
.s1 .content ._1 { margin-top: 30px; width: 100%; text-align: center; }
.s1 .content ._1 img { max-width: 80%; transition: transform .3s ease; }
.s1 .content ._1 img:hover { transform: scale(1.05); }
@media (min-width: 1025px) {
  .s1 .content ._ { margin-top: 0; flex-direction: row; justify-content: center; }
  .s1 .content ._0 { text-align: left; padding-right: 60px; }
  .s1 .content ._1 { margin-top: 0; max-width: 45%; text-align: center; }
  .s1 .content ._1 img { max-width: 460px; }
  .s1 .features { justify-content: flex-start; }
  .s1 .download { align-items: flex-start; }
}

/* ===== S2: Affiliate cards ===== */
.s2 .content { display: flex; flex-direction: column; gap: 30px; }
.s2 .content .card {
  min-height: 120px; width: 100%;
  border: 1px solid #F2F2F2; border-radius: 15px;
  text-align: left;
  transition: box-shadow .3s ease, transform .3s ease;
  overflow: hidden;
}
.s2 .content .card:hover { box-shadow: 0 0 10px rgba(0, 208, 255, .5); transform: scale(1.03); }
.s2 .content .card .name { font-size: clamp(16px, 0.6vw + 13px, 22px); font-weight: 500; }
.s2 .content .card .desc { margin-top: clamp(10px, 0.4vw + 8px, 20px); font-size: clamp(13px, 0.4vw + 11px, 18px); text-shadow: 0 0 3px rgba(255, 255, 255, .9); }
.s2 .content .others { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
.s2 .others .card { padding: clamp(15px, 0.6vw + 12px, 24px) clamp(20px, 0.8vw + 16px, 32px); display: flex; flex-direction: column; }
.s2 .c0 { display: flex; flex-direction: column; }
.s2 .c0 > div:nth-of-type(1) { padding: 20px; }
.s2 .c0 > div:nth-of-type(2) {
  min-height: clamp(120px, 8vw + 80px, 280px);
  border-radius: 0 0 15px 15px;
  background: url("../images/cards_0.webp") no-repeat center center;
  background-size: cover;
}
.s2 .c1 { background: url("../images/cards_1.webp") no-repeat center right; background-size: contain; }
.s2 .c2 { background: url("../images/cards_2.webp") no-repeat center right; background-size: contain; }
@media (min-width: 1025px) {
  .s2 .c0 { position: relative; justify-content: center; }
  .s2 .c0 > div:nth-of-type(1) { z-index: 2; max-width: 60%; }
  .s2 .c0 > div:nth-of-type(2) { position: absolute; inset: 0 0 0 auto; width: 50%; z-index: 1; border-radius: 15px; background-position: right; background-size: contain; }
  .s2 .others .card { width: calc(50% - 10px); }
}

/* ===== S3: Features ===== */
.s3 .content { border-radius: 15px; background: linear-gradient(180deg, #FAFAFA, #FFF); }
.s3 .content > div { display: flex; }
.s3 .feature { transition: transform .3s ease; }
.s3 .feature:hover { transform: scale(1.1); }
.s3 .content .all-features {
  padding: clamp(20px, 1.5vw + 14px, 60px) 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 20px;
  justify-items: center;
}
.s3 .content .all-features .feature img { height: clamp(36px, 0.7vw + 30px, 50px); }
.s3 .content .all-features .feature .name { font-size: clamp(10px, 0.3vw + 9px, 16px); margin-top: 6px; }
.s3 .content .main-features { padding: 0 5px; flex-direction: column; }
.s3 .content .main-features .feature {
  margin-top: clamp(60px, 4vw + 40px, 150px);
  display: flex; flex-direction: row; justify-content: center; align-items: center;
  gap: clamp(20px, 4vw, 12%);
  text-align: left;
}
.s3 .content .main-features .feature .illustration { max-width: clamp(100px, 8vw + 60px, 200px); width: 30%; }
.s3 .content .main-features .feature .info { max-width: 50%; }
.s3 .content .main-features .feature .hot {
  display: inline-block;
  margin-bottom: 8px;
  padding: clamp(2px, 0.15vw + 1px, 8px) clamp(5px, 0.3vw + 4px, 16px);
  border-radius: 20px;
  background: linear-gradient(45deg, #FE1B60 50%, #FC3C49 80%, #FC3C49);
  color: #fff;
  font-size: clamp(8px, 0.2vw + 7px, 14px);
}
.s3 .content .main-features .feature .hot img { height: clamp(10px, 0.2vw + 9px, 17px); margin-top: -1px; vertical-align: middle; }
.s3 .content .main-features .feature .title-0 { font-size: clamp(16px, 0.7vw + 12px, 25px); font-weight: 500; }
.s3 .content .main-features .feature .title-1 { font-size: clamp(11px, 0.4vw + 9px, 19px); font-weight: 500; }
.s3 .content .main-features .feature .desc { margin-top: 8px; font-size: clamp(10px, 0.4vw + 8px, 19px); }

/* ===== S4: Testimonial ===== */
.s4 .content .avatars { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: clamp(20px, 1.4vw + 14px, 50px); }
.s4 .content .avatars img { transition: transform .3s ease; }
.s4 .content .avatars img:hover { transform: scale(1.2); }
.s4 .content .avatars img:nth-of-type(3) { height: clamp(60px, 4vw + 40px, 150px); }
.s4 .content .avatars img:nth-of-type(1),
.s4 .content .avatars img:nth-of-type(5) { height: clamp(35px, 1.6vw + 24px, 70px); }
.s4 .content .avatars img:nth-of-type(2),
.s4 .content .avatars img:nth-of-type(4) { height: clamp(45px, 2.6vw + 32px, 110px); }
.s4 .content .name { margin-top: clamp(20px, 1.2vw + 14px, 40px); font-weight: 500; font-size: clamp(16px, 0.5vw + 13px, 24px); }
.s4 .content .store { color: #6C6D75; font-size: clamp(11px, 0.2vw + 10px, 16px); }

/* ===== S5: Pricing/feature table ===== */
.s5 .content .table-view { width: 100%; border-radius: 10px; background: linear-gradient(180deg, #FAFAFA, #FFF); display: flex; justify-content: center; }
.s5 table { width: 100%; border-collapse: collapse; }
.s5 table tbody tr { transition: background .3s ease, transform .3s ease; }
.s5 table tbody tr:hover { background: #F3F3F3; transform: scale(1.02); }
.s5 table thead th { padding: clamp(12px, 0.3vw + 10px, 18px); color: #FC3C49; font-weight: 500; font-size: clamp(14px, 0.4vw + 12px, 20px); }
.s5 table tbody td { padding: clamp(10px, 0.4vw + 8px, 18px); font-size: clamp(12px, 0.3vw + 10px, 16px); }
.s5 table tbody tr:nth-of-type(3) td:not(:first-child) { color: #FC3C49; font-weight: 500; }
.s5 table tbody td img { width: clamp(16px, 0.4vw + 13px, 22px); vertical-align: middle; }
.s5 .join {
  display: inline-flex; align-items: center; gap: 6px;
  padding: clamp(15px, 0.8vw + 10px, 50px) clamp(20px, 1.2vw + 14px, 70px);
  margin-top: clamp(30px, 2vw + 16px, 90px);
  border-radius: 10px;
  background: linear-gradient(45deg, #FE1B60 50%, #FC3C49 80%, #FC3C49);
  color: #fff;
  font-weight: 500; font-size: clamp(16px, 0.6vw + 12px, 26px);
  text-decoration: none;
  transition: box-shadow .3s ease, transform .3s ease;
}
.s5 .join:hover { box-shadow: 0 0 10px rgb(183, 0, 255); transform: scale(1.03); }
.s5 .join img { margin-left: 6px; vertical-align: middle; }

/* ===== News (list + detail) ===== */
.news {
  width: 100%;
  min-height: calc(75vh + 60px);
  display: flex; flex-direction: column; align-items: center;
  padding-top: clamp(60px, 4vw + 50px, 70px);
}
.news .banner {
  width: 100%;
  max-height: clamp(240px, 12vw + 200px, 500px);
  object-fit: cover;
}
.list-page, .detail-page { width: 100%; max-width: 1000px; padding: 40px clamp(15px, 1.5vw, 30px); }
.list-page { max-width: 900px; }
.list .item {
  display: block;
  padding: clamp(20px, 1vw + 16px, 35px) clamp(10px, 0.5vw + 8px, 20px);
  border-bottom: 1px solid #f1f1f1;
  color: inherit;
  text-decoration: none;
  transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}
.list .item:hover { border-radius: 8px; border-bottom-color: transparent; box-shadow: 0 2px 10px rgba(0, 0, 0, .1); transform: scale(1.02); }
.list .item .news-title { font-size: clamp(16px, 0.4vw + 14px, 18px); font-weight: 500; color: #333; transition: color .3s; }
.list .item:hover .news-title { color: #FC3C49; }
.list .item .news-title img { height: 16px; width: 16px; margin-top: -2px; margin-right: 10px; vertical-align: middle; }
.list .item .summary { font-size: clamp(13px, 0.2vw + 12px, 14px); color: #474747; margin-top: clamp(10px, 0.3vw + 8px, 15px); }
.list .item .time { margin-top: clamp(15px, 0.4vw + 12px, 20px); color: #a0a0a9; font-weight: 500; font-size: clamp(11px, 0.2vw + 10px, 13px); }
.is-top { font-weight: 600; }

.detail-page { background: #fff; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, .05); }
.detail-page .crumb { font-size: 12px; color: #888; margin-bottom: 20px; }
.detail-page .crumb a { color: #888; text-decoration: none; }
.detail-page .crumb a:hover { color: #FC3C49; }
.detail-page .news-title { font-size: clamp(20px, 0.8vw + 16px, 28px); font-weight: 600; color: #222; }
.detail-page .news-time { margin-top: 12px; color: #888; font-size: clamp(11px, 0.2vw + 10px, 13px); }
.detail-page .line { width: 100%; height: 1px; margin: 20px 0; background: #f1f1f1; }
.detail-page .news-content { font-size: clamp(14px, 0.2vw + 13px, 16px); line-height: 1.8; color: #333; }
.detail-page .news-content h2 { font-size: clamp(17px, 0.4vw + 15px, 20px); margin: 28px 0 12px; }
.detail-page .news-content h3 { font-size: clamp(15px, 0.3vw + 14px, 17px); margin: 22px 0 10px; }
.detail-page .news-content p { margin: 12px 0; }
.detail-page .news-content ul, .detail-page .news-content ol { padding-left: 22px; }
.detail-page .news-content li { margin: 6px 0; }
.detail-page .news-content blockquote { border-left: 3px solid #FC3C49; margin: 16px 0; padding: 4px 14px; color: #555; background: #fafafa; }
.detail-page .news-content code { background: #f3f3f3; padding: 2px 6px; border-radius: 3px; font-size: .92em; }
.detail-page .back { display: inline-block; margin-top: 30px; padding: 8px 20px; border-radius: 20px; border: 1px solid #ddd; color: #555; text-decoration: none; font-size: 13px; transition: all .3s; }
.detail-page .back:hover { background: #FC3C49; color: #fff; border-color: #FC3C49; }

/* ===== Pagination ===== */
.pagination { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 30px 0 10px; font-size: 13px; }
.pagination a, .pagination span { padding: 6px 12px; border-radius: 4px; color: #555; text-decoration: none; border: 1px solid #eee; transition: all .3s; }
.pagination a:hover { background: #FC3C49; color: #fff; border-color: #FC3C49; }
.pagination .current { background: #FC3C49; color: #fff; border-color: #FC3C49; font-weight: 500; }
.pagination .disabled { color: #ccc; }

/* ===== Download page ===== */
.down-page {
  width: 100%;
  padding: calc(clamp(60px, 4vw + 50px, 70px) + 40px) clamp(15px, 1.5vw, 30px) 60px;
  max-width: 1000px;
  margin: 0 auto;
}
.down-page h1 { font-size: clamp(26px, 1.4vw + 18px, 40px); font-weight: 500; text-align: center; margin: 10px 0 8px; }
.down-page .subhead { text-align: center; color: #6C6D75; font-size: clamp(13px, 0.3vw + 11px, 16px); margin-bottom: 36px; }
.platforms { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.platform-card {
  padding: 24px;
  border: 1px solid #f0f0f0;
  border-radius: 14px;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  text-align: center;
  transition: box-shadow .3s ease, transform .3s ease;
  text-decoration: none;
  color: inherit;
  background: #fff;
}
.platform-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0, 0, 0, .08); }
.platform-card .icon { width: 48px; height: 48px; }
.platform-card .name { font-size: clamp(15px, 0.3vw + 13px, 18px); font-weight: 600; }
.platform-card .ver { color: #888; font-size: 12px; }
.platform-card .btn {
  margin-top: 6px;
  padding: 8px 22px;
  border-radius: 22px;
  background: linear-gradient(45deg, #FE1B60 50%, #FC3C49 80%, #FC3C49);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
}
.platform-card.coming .btn { background: #ccc; cursor: not-allowed; }

.install-guide { margin-top: 50px; padding: 28px; border-radius: 14px; background: linear-gradient(180deg, #FAFAFA, #FFF); }
.install-guide h2 { margin: 0 0 14px; font-size: clamp(18px, 0.4vw + 15px, 22px); }
.install-guide ol { padding-left: 22px; margin: 0; font-size: clamp(13px, 0.2vw + 12px, 15px); }
.install-guide li { margin: 8px 0; line-height: 1.7; }

/* ===== FAQ page ===== */
.faq-page { width: 100%; padding: calc(clamp(60px, 4vw + 50px, 70px) + 40px) clamp(15px, 1.5vw, 30px) 60px; max-width: 900px; margin: 0 auto; }
.faq-page h1 { font-size: clamp(26px, 1.4vw + 18px, 40px); font-weight: 500; text-align: center; margin: 10px 0 8px; }
.faq-page .subhead { text-align: center; color: #6C6D75; font-size: clamp(13px, 0.3vw + 11px, 16px); margin-bottom: 36px; }
.faq-list { display: flex; flex-direction: column; gap: 14px; }
.faq-item {
  border: 1px solid #f0f0f0; border-radius: 12px; overflow: hidden;
  background: #fff;
  transition: box-shadow .3s ease;
}
.faq-item:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .05); }
.faq-item summary {
  list-style: none;
  padding: 18px 22px;
  font-size: clamp(14px, 0.3vw + 13px, 17px);
  font-weight: 500;
  cursor: pointer;
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: '＋';
  color: #FC3C49;
  font-size: 18px;
  flex-shrink: 0;
  transition: transform .3s;
}
.faq-item[open] summary::after { content: '－'; }
.faq-item .answer {
  padding: 0 22px 18px;
  font-size: clamp(13px, 0.2vw + 12px, 15px);
  line-height: 1.8;
  color: #555;
}
.faq-item .answer p { margin: 6px 0; }

/* ===== Page head (shared by list / faq / down) ===== */
.page-head { width: 100%; text-align: center; padding: 30px clamp(15px, 1.5vw, 30px) 0; }
.page-head .crumb { font-size: 12px; color: #888; }
.page-head .crumb a { color: #888; text-decoration: none; }
.page-head .crumb a:hover { color: #FC3C49; }