@charset "utf-8";
/* ============================================================
   biz_03 (HERITAGE) 테마 · 메인화면 전용 스타일
   ============================================================ */

/* 히어로 : 풀블리드 크로스페이드, 좌하단 세리프 대형 타이포 */
.hero{position:relative;height:min(86vh,820px);min-height:520px;overflow:hidden;background:var(--ink)}
.hero .slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease;display:flex;align-items:flex-end}
.hero .slide.on{opacity:1}
.hero .slide .wrap{width:100%;padding-bottom:130px;color:#F5F0E6}
.hero .key{display:block;font-family:var(--latin);font-style:italic;font-size:18px;letter-spacing:.26em;color:var(--gold);margin-bottom:18px}
.hero h2{font-family:var(--serif);font-weight:300;font-size:clamp(32px,4.6vw,60px);line-height:1.32;color:#fff}
.hero h2 em{font-style:normal;color:var(--gold)}
.hero p{margin-top:20px;max-width:520px;font-size:15px;font-weight:300;color:rgba(245,240,230,.78)}
.hero-foot{position:absolute;left:0;right:0;bottom:0;z-index:5}
.hero-foot .wrap{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:34px}
.hero-foot .scroll{display:inline-flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:rgba(245,240,230,.65)}
.hero-foot .scroll .bar{display:block;width:1px;height:44px;background:linear-gradient(to bottom,var(--gold),transparent);animation:b03drop 2s infinite}
@keyframes b03drop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.hero-foot .dots{display:flex;gap:12px}
.hero-foot .dots button{width:34px;height:2px;padding:8px 0;background:none;border:0;position:relative}
.hero-foot .dots button::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(245,240,230,.35);transition:background .3s}
.hero-foot .dots button.on::after{background:var(--gold);height:2px}

/* 공통 섹션 머리 */
.sec{padding:104px 0}
.sec-head{text-align:center;margin-bottom:56px}
.sec-head .lb{display:block;font-family:var(--latin);font-style:italic;font-size:17px;letter-spacing:.24em;color:var(--gold);margin-bottom:10px}
.sec-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3vw,38px);line-height:1.35}
.sec-head.row{display:flex;justify-content:space-between;align-items:flex-end;text-align:left;gap:20px;flex-wrap:wrap}
.sec-head.row .more{font-size:13px;letter-spacing:.08em;color:var(--graphite);border-bottom:1px solid var(--line);padding-bottom:4px;transition:.25s}
.sec-head.row .more:hover{color:var(--wine);border-color:var(--gold)}

/* 철학 / 원칙 : 로마숫자 3열, 얇은 세로 구분선 */
.principles{border-bottom:1px solid var(--line)}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.principles .pr{padding:10px 44px;border-left:1px solid var(--line)}
.principles .pr:first-child{border-left:0}
.principles .no{display:block;font-family:var(--latin);font-size:34px;color:var(--gold);margin-bottom:18px}
.principles h3{font-family:var(--serif);font-weight:500;font-size:20px;margin-bottom:12px}
.principles p{font-size:14px;color:var(--graphite)}

/* 주요 서비스 : 넘버드 리스트 01~05 */
.services{padding-top:96px}
.svc-list{border-top:1px solid var(--ink);max-width:980px;margin:0 auto}
.svc-list li{border-bottom:1px solid var(--line)}
.svc-list a{display:grid;grid-template-columns:90px 240px minmax(0,1fr) auto;align-items:center;gap:24px;padding:30px 10px;transition:background .3s}
.svc-list .no{font-family:var(--latin);font-size:22px;color:#B4AC9C;transition:color .3s}
.svc-list .tit{font-family:var(--serif);font-size:21px;font-weight:400}
.svc-list .desc{font-size:13px;color:var(--graphite)}
.svc-list .arr{font-size:18px;color:#C8C0B0;transition:transform .3s,color .3s}
.svc-list a:hover{background:#F6F1E9}
.svc-list a:hover .no{color:var(--gold)}
.svc-list a:hover .arr{transform:translateX(6px);color:var(--wine)}

/* 신뢰 지표 : 차콜 밴드 */
.trust{background:var(--ink);color:#F5F0E6;padding:78px 0}
.cols4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;text-align:center}
.trust strong{display:block;font-family:var(--latin);font-weight:500;font-size:clamp(38px,4vw,56px);line-height:1;color:#fff}
.trust strong em{font-style:normal;font-size:.45em;color:var(--gold);margin-left:4px}
.trust span{display:block;margin-top:12px;font-size:13px;color:#B3AB9D;letter-spacing:.04em}

/* 구성원 */
.people .cols3{gap:44px}
.person .ph{aspect-ratio:3/3.6;background:#EFE9DD;margin-bottom:22px;position:relative}
.person .ph::after{content:"";position:absolute;inset:12px;border:1px solid rgba(250,248,244,.5)}
.person .en{display:block;font-family:var(--latin);font-style:italic;font-size:14px;letter-spacing:.2em;color:var(--gold);margin-bottom:6px}
.person h3{font-family:var(--serif);font-weight:500;font-size:22px}
.person h3 small{font-family:var(--sans);font-weight:300;font-size:13px;color:var(--graphite);margin-left:8px}
.person p{margin-top:10px;font-size:13px;color:var(--graphite)}

/* 인사이트 : 첫 글 크게 + 리스트 */
.insight{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.demo-note{margin:-30px 0 30px;font-size:12px;color:#A79D8E;text-align:center}
.ins-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:60px;align-items:start}
.ins-first{display:block;padding:44px;background:var(--porcelain);border:1px solid var(--line);transition:border-color .3s}
.ins-first:hover{border-color:var(--gold)}
.ins-first .cat{display:inline-block;font-family:var(--latin);font-style:italic;font-size:14px;letter-spacing:.16em;color:var(--gold);margin-bottom:14px}
.ins-first h3{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.45}
.ins-first .date{display:block;margin-top:22px;font-family:var(--latin);font-size:14px;color:#A79D8E}
.ins-list li{border-bottom:1px solid var(--line)}
.ins-list li:first-child{border-top:1px solid var(--ink)}
.ins-list a{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:21px 4px;transition:.25s}
.ins-list .tit{min-width:0;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ins-list .date{font-family:var(--latin);font-size:13px;color:#A79D8E;flex-shrink:0}
.ins-list a:hover .tit{color:var(--wine);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--gold)}

/* 문의 CTA */
.cta{background:var(--ink);color:#F5F0E6;text-align:center;padding:110px 0;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;left:50%;top:0;width:1px;height:56px;background:var(--gold)}
.cta .lb{display:block;font-family:var(--latin);font-style:italic;font-size:17px;letter-spacing:.24em;color:var(--gold);margin-bottom:14px}
.cta h2{font-family:var(--serif);font-weight:300;font-size:clamp(26px,3.4vw,42px);color:#fff}
.cta p{margin:16px auto 0;max-width:520px;font-size:14px;color:#B3AB9D}
.cta-act{margin-top:38px;display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.cta .btn.ghost{border-color:#4A453C;color:#D9D2C4}.cta .btn.ghost:hover{border-color:#fff;color:#fff}

/* 반응형 */
@media (max-width:1000px){
  .svc-list a{grid-template-columns:60px minmax(0,1fr) auto;gap:14px}
  .svc-list .desc{grid-column:2/3;grid-row:2;margin-top:-16px;padding-bottom:6px}
  .svc-list .arr{grid-row:1}
}
@media (max-width:900px){
  .sec{padding:70px 0}
  .cols3{grid-template-columns:minmax(0,1fr)}
  .principles .pr{border-left:0;border-top:1px solid var(--line);padding:30px 4px}
  .principles .pr:first-child{border-top:0}
  .cols4{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 20px}
  .people .cols3{gap:32px}
  .person .ph{aspect-ratio:16/10}
  .ins-grid{grid-template-columns:minmax(0,1fr);gap:30px}
  .ins-first{padding:28px 22px}.ins-first h3{font-size:21px}
  .hero .slide .wrap{padding-bottom:110px}
}
@media (max-width:520px){
  .hero{min-height:480px}
  .svc-list .tit{font-size:18px}
  .cta{padding:80px 0}
}
