/* =========================================================
   법률사무소 삼청 - 광고 랜딩페이지 전용 스타일
   ========================================================= */

body.landing-page { padding-bottom: 0; }

/* ---- Hero ---- */
.landing-hero {
  position: relative;
  min-height: 460px;
  display: flex;
  align-items: center;
  padding: 150px 0 70px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.landing-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(120deg, rgba(0,0,0,0.88), rgba(10,10,10,0.55));
}
.landing-hero .container { position: relative; z-index: 1; }
.landing-hero-badge {
  display: inline-block;
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px;
  color: var(--color-navy-950);
  background: var(--color-gold-400);
  padding: 6px 14px; border-radius: 20px;
  margin-bottom: 18px;
}
.landing-hero-eng { color: var(--color-gold-400); font-size: 13px; letter-spacing: 3px; font-weight: 700; margin: 0 0 10px; }
.landing-hero h1 { color: #fff; font-size: 36px; line-height: 1.45; margin: 0 0 16px; max-width: 760px; }
.landing-hero p.lead { color: rgba(255,255,255,0.85); font-size: 15.5px; line-height: 1.85; max-width: 640px; margin: 0 0 30px; }
.landing-hero-btns { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---- Trust strip ---- */
.landing-trust-strip { background: var(--color-gray-100); padding: 26px 0; }
.landing-trust-strip .container { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
.landing-trust-strip span { font-size: 14px; color: var(--color-navy-900); font-weight: 600; display: flex; align-items: center; gap: 8px; }
.landing-trust-strip i { color: var(--color-gold-500); }

/* ---- Content ---- */
.landing-content { padding: 80px 0; background: #fff; }
.landing-content-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 50px; align-items: center; }
.landing-content-grid.reverse { grid-template-columns: 0.9fr 1.1fr; }
.landing-content-grid.reverse .landing-img { order: -1; }
.landing-content-tag { font-size: 12px; font-weight: 700; letter-spacing: 1.5px; color: var(--color-gold-500); margin: 0 0 10px; }
.landing-content h2 { font-size: 27px; color: var(--color-navy-900); margin: 0 0 18px; }
.landing-content .desc { font-size: 15px; color: var(--color-gray-700); line-height: 1.85; margin-bottom: 26px; }
.landing-img { border-radius: 6px; overflow: hidden; box-shadow: 0 20px 50px rgba(10,17,40,0.15); aspect-ratio: 4/3; }
.landing-img img { width: 100%; height: 100%; object-fit: cover; display: block; background: #e6e8ee; }

/* ---- Why strip ---- */
.landing-why { background: var(--color-navy-950); padding: 70px 0; }
.landing-why .section-head { margin-bottom: 36px; }
.landing-why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.landing-why-card { background: var(--color-navy-800); border: 1px solid rgba(255,255,255,0.08); border-radius: 6px; padding: 30px 26px; }
.landing-why-card i { color: var(--color-gold-400); font-size: 22px; margin-bottom: 16px; display: block; }
.landing-why-card h3 { color: #fff; font-size: 17px; margin: 0 0 10px; }
.landing-why-card p { color: rgba(255,255,255,0.68); font-size: 13.5px; line-height: 1.7; margin: 0; }

/* ---- CTA banner ---- */
.landing-cta-banner { background: linear-gradient(120deg, var(--color-navy-900), var(--color-navy-700)); padding: 64px 0; text-align: center; }
.landing-cta-banner h2 { color: #fff; font-size: 25px; margin: 0 0 10px; }
.landing-cta-banner p { color: rgba(255,255,255,0.72); margin: 0 0 28px; }
.landing-cta-btns { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }

/* ---- Mobile sticky CTA ---- */
.landing-sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 500;
  display: none;
  background: #fff;
  border-top: 1px solid #eee;
  box-shadow: 0 -6px 20px rgba(0,0,0,0.1);
}
.landing-sticky-cta .inner { display: flex; }
.landing-sticky-cta a { flex: 1; text-align: center; padding: 15px 0; font-weight: 700; font-size: 14.5px; }
.landing-sticky-cta a.call { background: var(--color-navy-950); color: #fff; }
.landing-sticky-cta a.consult { background: var(--color-gold-500); color: var(--color-navy-950); }

@media (max-width: 860px) {
  .landing-content-grid, .landing-content-grid.reverse { grid-template-columns: 1fr; }
  .landing-content-grid.reverse .landing-img { order: 0; }
  .landing-why-grid { grid-template-columns: 1fr; }
  .landing-hero { padding: 130px 0 60px; min-height: 380px; }
  .landing-hero h1 { font-size: 26px; }
  .landing-sticky-cta { display: block; }
  body.landing-page { padding-bottom: 58px; }
}