/* ============================================================
   lvyou.css · 旅游度假行业网站建设
   视觉语言：大图叠加文字卡 + 大圆角 24px
   点缀色：暖橙 #EA580C
   ============================================================ */

.banner-lvyou{background-image:url('../images/banner-news.jpg')}

/* ---------- 痛点：三叠图卡 ---------- */
.ly-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ly-card{
  position:relative;border-radius:24px;overflow:hidden;display:block;min-height:380px;
  box-shadow:var(--shadow);
}
.ly-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.ly-card:hover img{transform:scale(1.06)}
.ly-card-ov{
  position:absolute;left:0;right:0;bottom:0;padding:26px 26px 24px;z-index:2;
  background:linear-gradient(to top,rgba(20,26,40,.94) 0%,rgba(20,26,40,.45) 65%,transparent);
}
.ly-card-ov h3{color:#fff;font-size:19px;margin-bottom:8px}
.ly-card-ov p{color:#F1E4D6;font-size:14px;line-height:1.65}

/* ---------- 怎么做：四宫格 ---------- */
.ly-howsec{background:var(--c-ice-2)}
.ly-howgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ly-how{
  background:#fff;border-radius:20px;padding:30px 26px;border:1px solid var(--c-line);
  transition:all var(--trans);position:relative;overflow:hidden;
}
.ly-how:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.ly-how-num{
  font-size:38px;font-weight:800;color:#FFEDD5;position:absolute;right:18px;top:10px;line-height:1;
}
.ly-how h3{font-size:17.5px;margin-bottom:10px;position:relative}
.ly-how p{color:var(--c-text-2);font-size:14px;line-height:1.7;position:relative}

/* ---------- 功能 ---------- */
.ly-feats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ly-feat{
  background:#FFF7ED;border:1px solid #FED7AA;border-radius:20px;padding:30px 26px;
  transition:all var(--trans);
}
.ly-feat:hover{background:#fff;box-shadow:0 14px 34px rgba(234,88,12,.14);transform:translateY(-5px)}
.ly-feat svg{width:34px;height:34px;fill:#EA580C;margin-bottom:16px}
.ly-feat b{display:block;font-size:17px;color:var(--c-primary);margin-bottom:8px}
.ly-feat p{color:var(--c-text-2);font-size:13.5px;line-height:1.7}

/* ---------- 案例 ---------- */
.ly-casusec{background:var(--c-ice-2)}
.ly-caserow{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.ly-case{
  background:#fff;border-radius:24px;overflow:hidden;display:block;box-shadow:var(--shadow);
  transition:all var(--trans);
}
.ly-case:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.ly-case img{width:100%}
.ly-case-body{padding:24px 28px 28px}
.ly-case-tag{
  display:inline-block;font-size:12.5px;font-weight:700;color:#EA580C;
  background:#FFF7ED;padding:3px 12px;border-radius:999px;margin-bottom:10px;
}
.ly-case-body h3{font-size:19px;margin-bottom:8px}
.ly-case-body p{color:var(--c-text-2);font-size:14px;line-height:1.7}

/* ---------- FAQ ---------- */
.ly-faqlist{max-width:840px;margin:0 auto;display:grid;gap:14px}
.ly-faq-item{
  background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:20px 26px;
  border-left:4px solid #EA580C;
}
.ly-faq-item summary{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-weight:700;color:var(--c-primary);font-size:16px;cursor:pointer;list-style:none;
}
.ly-faq-item summary::-webkit-details-marker{display:none}
.ly-faq-item summary i{
  width:10px;height:10px;border-right:2px solid #EA580C;border-bottom:2px solid #EA580C;
  transform:rotate(45deg);transition:transform var(--trans);flex-shrink:0;margin-top:-4px;
}
.ly-faq-item[open] summary i{transform:rotate(-135deg)}
.ly-faq-item p{margin-top:12px;color:var(--c-text-2);font-size:15px;line-height:1.8}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .ly-cards{grid-template-columns:1fr;gap:18px}
  .ly-card{min-height:280px}
  .ly-howgrid{grid-template-columns:1fr 1fr}
  .ly-feats{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .ly-howgrid,.ly-feats{grid-template-columns:1fr}
  .ly-caserow{grid-template-columns:1fr}
}