/* ─── Guide Pages v4: 랜딩 문법 (세리프 히어로 · 논증 스텝 · Q&A) ─── */

/* 히어로 */
.g-hero{
  text-align:center;
  padding:calc(54px + 42px) 0 6px;   /* 고정 헤더(모바일 54px) + 여백 */
}
@media(min-width:769px){
  .g-hero{ padding-top:calc(58px + 58px); }  /* 데스크톱 헤더 58px */
}
.g-hero h1{
  font-family:'Noto Serif KR',serif; font-weight:700;
  font-size:clamp(25px,6.8vw,33px); color:var(--white);
  line-height:1.42; letter-spacing:-.02em;
  margin:16px 0 0;
}
.g-hero h1 span{ color:var(--gold); }
.g-hero .g-sub{
  margin-top:15px; font-size:13.5px; font-weight:300;
  color:var(--body); line-height:1.75; letter-spacing:-.01em;
}

/* 섹션 */
.g-sec{ margin-top:52px; }
.g-sec .label-upper{ display:block; text-align:center; margin-bottom:6px; }
.g-sec-lead{
  font-family:'Noto Serif KR',serif; font-weight:600;
  font-size:clamp(17px,4.4vw,21px); line-height:1.6;
  color:var(--white); letter-spacing:-.02em;
  text-align:center; margin:0 0 30px;
}
.g-sec-lead span{ color:var(--gold); }

/* 논증 스텝 (랜딩 .step 문법) */
.g-why{ display:flex; flex-direction:column; }
.g-why-item{
  display:grid; grid-template-columns:44px 1fr; gap:0 14px;
  padding:22px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.g-why-item:last-child{ border-bottom:none; }
.g-why-num{
  font-family:'Cormorant Garamond',serif; font-weight:400;
  font-size:28px; color:rgba(201,165,92,.22);
  line-height:1.2; padding-top:1px;
}
.g-why-t{
  font-weight:600; font-size:14.5px; color:var(--gold-lt);
  letter-spacing:-.01em; margin:0 0 7px;
}
.g-why-d{
  font-size:13.5px; color:var(--body);
  line-height:1.8; letter-spacing:-.01em; margin:0;
}
.g-why-d b{ color:var(--white); font-weight:600; }

/* 예시 질문: 읽는 목록 */
.g-exlist{ margin:4px 0 0; padding:0; list-style:none; }
.g-exlist li{
  position:relative; padding:9px 0 9px 16px;
  font-size:13.5px; line-height:1.75; color:var(--body);
  letter-spacing:-.01em;
}
.g-exlist li::before{
  content:'✦'; position:absolute; left:0; top:11px;
  font-size:8px; color:var(--gold-dk); opacity:.6;
}

/* Q&A */
.g-qa{ padding:20px 2px; border-bottom:1px solid rgba(255,255,255,.07); }
.g-qa:last-of-type{ border-bottom:none; }
.g-qa .q{
  display:grid; grid-template-columns:24px 1fr; gap:0 4px;
  font-size:14.5px; font-weight:600; color:var(--white);
  line-height:1.6; letter-spacing:-.01em;
}
.g-qa .a{
  display:grid; grid-template-columns:24px 1fr; gap:0 4px;
  margin-top:9px;
  font-size:13.5px; color:var(--body);
  line-height:1.8; letter-spacing:-.01em;
}
.g-qa .m{
  font-family:'Cormorant Garamond',serif; font-weight:600;
  font-size:15px; letter-spacing:.02em; padding-top:1px;
}
.g-qa .q .m{ color:var(--gold); }
.g-qa .a .m{ color:var(--gold-dk); }
.g-qa .a b{ color:var(--gold-lt); font-weight:600; }
.g-qa .a a{ color:var(--gold); text-decoration:none; border-bottom:1px solid rgba(201,165,92,.3); }

/* 함께 읽기 */
.g-more a{
  display:flex; align-items:baseline; gap:10px;
  padding:14px 2px;
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:13.5px; color:var(--body);
  text-decoration:none; letter-spacing:-.01em;
  transition:color .25s ease;
}
.g-more a:last-child{ border-bottom:none; }
.g-more a::before{ content:'✦'; flex:none; font-size:8px; color:var(--gold-dk); opacity:.5; }
.g-more a:hover{ color:var(--gold-lt); }

/* 히어로 직하 리딩 배너 (충전 배너 문법: 골드 그라데이션 + 숨쉬는 글로우 + sheen) */
.g-banner{
  display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:12px;
  margin:30px 0 0; padding:15px 18px;
  background:linear-gradient(135deg,rgba(201,165,92,.14),rgba(201,165,92,.04));
  border:1px solid rgba(201,165,92,.24);
  border-radius:14px;
  text-decoration:none;
  position:relative; overflow:hidden;
}
.g-banner::after{
  content:''; position:absolute; top:0; bottom:0; left:-60%;
  width:38%;
  background:linear-gradient(105deg,transparent,rgba(242,223,171,.14) 45%,rgba(242,223,171,.24) 50%,rgba(242,223,171,.14) 55%,transparent);
  transform:skewX(-18deg);
  animation:g-bn-sheen 3.8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes g-bn-sheen{ 0%{ left:-60%; } 55%{ left:135%; } 100%{ left:135%; } }
.g-banner-txt{ min-width:0; grid-row:1; grid-column:1; }
.g-banner-label{
  font-family:'Cormorant Garamond',serif; font-weight:500;
  font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-dk); display:block; margin-bottom:4px;
}
.g-banner-title{
  font-size:14.5px; font-weight:600; color:var(--white);
  letter-spacing:-.01em; line-height:1.45;
}
.g-banner-title em{
  font-style:normal;
  background:linear-gradient(120deg,#f2dfab,var(--gold-lt) 45%,var(--gold));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.g-banner-go{
  grid-row:2; grid-column:2;
  display:block; margin-top:2px; text-align:center;
  font-size:11px; color:var(--gold-lt);
  letter-spacing:-.01em; white-space:nowrap;
}
.g-banner-art{ grid-row:1; grid-column:2; width:78px; position:relative; }
.g-banner-art svg{ width:78px; height:58px; display:block; }
.g-banner-art::before{
  content:''; position:absolute; inset:-10px;
  background:radial-gradient(closest-side,rgba(223,192,126,.22),transparent 72%);
  animation:g-bn-breathe 4.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes g-bn-breathe{ 0%,100%{ opacity:.5; } 50%{ opacity:1; } }

/* 공유: 최하단 조용한 아이콘 버튼 */
.g-share-wrap{ text-align:center; margin:40px 0 6px; }
.g-share{
  display:inline-flex; align-items:center; gap:7px;
  background:none; border:none; cursor:pointer;
  padding:10px 14px;
  font-size:12px; color:var(--muted);
  letter-spacing:-.01em; font-family:inherit;
  transition:color .25s ease;
}
.g-share svg{ width:14px; height:14px; display:block; stroke:currentColor; }
.g-share:hover{ color:var(--gold-lt); }
