:root{
  --deep:#240807; --bx:#3F0F0D; --bx-2:#5E1713; --bx-3:#7A2019;
  --gold:#D8B06A; --gold-2:#F1D9A4; --gold-line:rgba(216,176,106,.45);
  --ivory:#FAF6EF; --ivory-2:#F3ECE1; --line:#E6DCCD;
  --ink:#1E1512; --ink-2:#4A3F39; --ink-3:#7A6E66;
  --sans:'Noto Sans KR', system-ui, -apple-system, sans-serif;
  --serif:'Noto Serif KR', 'Nanum Myeongjo', serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.7;word-break:keep-all;-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
section{padding:96px 0}
.h2,.hero h1,.band h2,.point h3,.career h3,.svc h3,.stats b,.svc span,.nobook b{font-family:var(--serif)}
.h2{font-weight:700;font-size:clamp(26px,3.4vw,40px);line-height:1.4;letter-spacing:-.01em}
.lead{font-size:18px;color:var(--ink-2)}
.head{display:flex;flex-direction:column;gap:14px;margin-bottom:44px}
.head.center{align-items:center;text-align:center}
.tag{align-self:flex-start;color:var(--bx-3);font-size:13px;font-weight:700;letter-spacing:.32em;padding-left:44px;position:relative}
.tag::before{content:"";position:absolute;left:0;top:50%;width:32px;height:1px;background:var(--gold)}
.center .tag{align-self:center}
.under{background:linear-gradient(transparent 68%, rgba(216,176,106,.38) 68%)}

/* Buttons: 골드 / 버건디 / 골드 테두리 (예전 클래스 이름도 같은 체계로 연결) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border-radius:4px;font-weight:700;font-size:17px;letter-spacing:.02em;border:1px solid transparent;cursor:pointer;font-family:inherit;transition:transform .15s, box-shadow .15s, background .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(36,8,7,.22)}
.btn-gold,.btn-kakao{background:var(--gold);color:var(--deep)}
.btn-gold:hover,.btn-kakao:hover{background:#E2BE7C}
.btn-bx,.btn-red{background:var(--bx-2);color:var(--gold-2)}
.btn-bx:hover,.btn-red:hover{background:var(--bx-3)}
.btn-line,.btn-white,.btn-naver{background:transparent;color:var(--gold-2);border-color:var(--gold-line)}
.btn-line:hover,.btn-white:hover,.btn-naver:hover{border-color:var(--gold);background:rgba(216,176,106,.08)}
.btn:disabled{opacity:.6;cursor:default;transform:none}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* Header: 기존 로고가 잘 보이도록 아이보리 바탕 */
.header{position:sticky;top:0;z-index:30;background:rgba(250,246,239,.97);border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--gold-line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:84px}
.logo img{height:62px;width:auto;mix-blend-mode:multiply}
.nav{display:flex;gap:36px;font-weight:500;font-size:16px;color:var(--ink-2)}
.nav a{padding:10px 0;border-bottom:1px solid transparent}
.nav a:hover{color:var(--bx-2);border-color:var(--gold)}
.header .btn{min-height:44px;padding:0 22px;font-size:15px;background:var(--bx-2);color:var(--gold-2)}
.header .btn:hover{background:var(--bx-3)}

/* Hero: 버건디 야경 */
.hero{position:relative;overflow:hidden;color:#fff;text-align:center;padding:112px 0 0;background:linear-gradient(180deg,#1E0605 0%,#3A0D0B 45%,#5E1713 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold-line);z-index:3}
.hero .wrap{display:flex;flex-direction:column;align-items:center;gap:24px;position:relative;z-index:2}
.hero .eyebrow{color:var(--gold-2);font-weight:500;font-size:15px;letter-spacing:.4em}
.hero h1{font-weight:900;font-size:clamp(34px,5.6vw,66px);line-height:1.25;letter-spacing:-.01em}
.hero h1 .box{color:var(--gold-2);display:inline-block;margin-top:14px;padding:4px 22px 8px;background:linear-gradient(180deg,rgba(216,176,106,.16),rgba(216,176,106,.30));border-top:1px solid var(--gold-line);border-bottom:1px solid var(--gold-line);box-shadow:0 10px 30px rgba(0,0,0,.35);text-shadow:0 2px 10px rgba(0,0,0,.45)}
.hero .rule{width:180px;height:1px;background:var(--gold)}
.hero p{font-size:18px;color:#E9D9CC;max-width:640px}
.hero p b{color:var(--gold-2)}
.hero .btn-row{justify-content:center}
.stats{display:flex;justify-content:center;margin-top:12px}
.stats div{padding:0 40px;border-left:1px solid var(--gold-line);display:flex;flex-direction:column;align-items:center}
.stats div:first-child{border-left:0}
.stats b{font-size:32px;font-weight:700;color:var(--gold-2);line-height:1.3;white-space:nowrap}
.stats span{color:#D9C3B4;font-size:14px}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg video{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(1.05)}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,6,5,.88) 0%,rgba(46,10,9,.70) 35%,rgba(70,16,13,.38) 68%,rgba(94,23,19,.12) 100%),linear-gradient(0deg,rgba(110,25,18,.28),rgba(110,25,18,.28))}
.hero:has(.hero-bg){padding-bottom:240px;background:#1E0605}

/* Cases */
.cases{background:var(--ivory)}
.cases:has(.case-list) .h2{font-family:var(--sans);font-weight:900;letter-spacing:-.02em}
.case-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.case{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;transition:box-shadow .2s, transform .2s}
.case:hover{box-shadow:0 16px 32px rgba(36,8,7,.14);transform:translateY(-2px)}
.case-img{height:200px;overflow:hidden}
.case-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.case-body{padding:20px 22px 22px;border-top:2px solid var(--gold);display:flex;flex-direction:column;gap:4px}
.case-body small{font-size:14px;color:var(--ink-3)}
.case-body strong{font-size:26px;font-weight:900;color:var(--bx-2);letter-spacing:-.01em}
.cases-note{margin-top:20px;font-size:14px;color:var(--ink-3)}
@media (min-width:641px){
  .case-belt{overflow:hidden;padding:4px 0 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
  .case-list.belt{display:flex;width:max-content;gap:20px;animation:belt 50s linear infinite}
  .case-list.belt .case{flex:0 0 280px}
  .case-belt:hover .case-list.belt{animation-play-state:paused}
}
@keyframes belt{to{transform:translateX(calc(-50% - 10px))}}

/* About */
.about{background:#fff}
.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;margin-bottom:56px}
.intro-quote{font-family:var(--serif);font-weight:500;font-size:clamp(19px,2.1vw,23px);line-height:1.8;color:var(--ink-2);border-left:1px solid var(--gold);padding-left:32px}
.intro-quote b{color:var(--ink)}
.intro-quote .red{color:var(--bx-3);font-weight:700}
.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.point{background:var(--ivory);border:1px solid var(--line);border-top:3px solid var(--bx-2);padding:32px 30px;display:flex;flex-direction:column;gap:14px}
.point small{font-size:12px;letter-spacing:.28em;color:var(--gold);font-weight:700}
.point h3{font-size:23px;font-weight:700;color:var(--bx-2)}
.point p{font-size:16px;color:var(--ink-2)}
.point p b{color:var(--ink)}
.point p .red{color:var(--bx-3);font-weight:700}
.career{margin-top:40px;border-top:1px solid var(--line);padding-top:28px;display:flex;gap:48px;font-size:16px;color:var(--ink-2)}
.career h3{min-width:190px;font-size:20px;font-weight:700;color:var(--ink)}
.career ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 40px}

/* Promise band */
.band{text-align:center;color:#fff;background:linear-gradient(135deg,var(--deep),var(--bx-2));border-top:1px solid var(--gold-line);border-bottom:1px solid var(--gold-line)}
.band h2{font-weight:700;font-size:clamp(24px,3.4vw,40px);line-height:1.45}
.band h2 em{font-style:normal;color:var(--gold-2)}
.band p{margin-top:18px;font-size:18px;color:#E0CFC2}

/* Scope */
.scope{background:var(--ivory-2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:7px 18px;background:var(--bx-2);color:var(--gold-2);font-weight:700;font-size:15px;transition:background .15s}
.chip:hover{background:var(--bx-3)}
.svc-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.svc{background:#fff;border:1px solid var(--line);padding:28px 26px;display:flex;flex-direction:column;gap:10px;transition:border-color .2s}
.svc:hover{border-color:var(--gold)}
.svc span{font-size:30px;color:var(--gold);line-height:1}
.svc h3{font-size:21px;line-height:1.4;font-weight:700}
.svc h3 small{display:block;font-family:var(--sans);font-size:15px;font-weight:500;color:var(--ink-3)}
.nobook{margin-top:20px;background:#fff;border:1px solid var(--bx-2);border-left:6px solid var(--bx-2);padding:24px 28px;display:flex;gap:18px;align-items:center}
.nobook b{font-size:20px;color:var(--bx-2)}
.nobook p{font-size:15px;color:var(--ink-2);margin-top:2px}

/* Reserve */
.reserve{background:#fff}
.reserve .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:start}
.reserve-side{display:flex;flex-direction:column;gap:18px}
.reserve-side .note{font-size:16px;color:var(--ink-2);background:var(--ivory);border-left:3px solid var(--gold);padding:16px 18px}
.form{background:var(--ivory);border:1px solid var(--line);border-top:3px solid var(--bx-2);padding:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:22px}
.field{display:flex;flex-direction:column;gap:8px;border:0;margin:0;padding:0}
.field > label,.field legend{font-weight:700;font-size:16px;padding:0}
.field legend{margin-bottom:8px}
.req{color:var(--bx-3)}
.input{width:100%;min-height:52px;padding:12px 16px;border:1px solid var(--line);border-radius:4px;background:#fff;font:inherit;font-size:16px;color:var(--ink)}
.input:focus{outline:none;border-color:var(--bx-2)}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt span{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:1px solid var(--line);border-radius:4px;background:#fff;font-weight:700;font-size:16px;cursor:pointer}
.opt input:checked + span{background:var(--bx-2);border-color:var(--bx-2);color:var(--gold-2)}
.opt input:focus-visible + span{outline:2px solid var(--gold);outline-offset:2px}
.times{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.times .opt span{width:100%;padding:0}
.fee{background:#fff;border:1px solid var(--gold);border-radius:4px;padding:16px 18px;font-size:15px;color:var(--ink-2)}
.fee b{display:block;color:var(--bx-2);font-size:16px;margin-bottom:2px}
.fee strong{color:var(--ink)}
textarea.input{min-height:96px;resize:vertical;line-height:1.6}
.agree{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--ink-2)}
.agree input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--bx-2);flex:none}
.form .btn{width:100%}
.msg{display:none;padding:14px 16px;border-radius:4px;font-size:16px;font-weight:700}
.msg.ok{display:block;background:#E8F5EC;color:#1F6B3A}
.msg.err{display:block;background:#FDECEA;color:var(--bx-2)}

/* Footer */
.footer{background:var(--deep);color:#CDBDB0;padding:48px 0 56px;font-size:14px;line-height:1.8;border-top:1px solid var(--gold-line)}
.footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.footer b{font-family:var(--serif);font-size:19px;color:#fff;display:block;margin-bottom:8px}
.foot-links{display:flex;flex-wrap:wrap;gap:4px 22px}
.foot-links a{color:var(--gold-2);font-weight:700;padding:8px 0}
.mbar{display:none}

@media (max-width:960px){
  .nav{display:none}
  .intro,.reserve .wrap{grid-template-columns:1fr;gap:32px}
  .case-list,.svc-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .points{grid-template-columns:1fr}
  .career{flex-direction:column;gap:10px}
}
@media (max-width:640px){
  body{font-size:16px;padding-bottom:78px}
  html{scroll-padding-top:68px}
  .wrap{padding:0 20px}
  section{padding:60px 0}
  .head{margin-bottom:28px}
  .header .wrap{min-height:66px}
  .header .btn{display:none}
  .logo img{height:50px}
  .lead,.hero p,.band p{font-size:16px}
  .hero{padding:64px 0 0}
  .hero .eyebrow{font-size:12px;letter-spacing:.24em}
  .hero .btn-row{display:none}
  .stats div{padding:0 12px}
  .stats b{font-size:19px}
  .stats span{font-size:12px;text-align:center}
  .hero:has(.hero-bg){padding-bottom:150px}
  .case-list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:0 20px 6px;gap:12px}
  .case{flex:0 0 80%;scroll-snap-align:start}
  .case-img{height:180px}
  .case-body strong{font-size:22px}
  .intro{margin-bottom:32px}
  .intro-quote{padding-left:20px}
  .point{padding:24px}
  .career ul{grid-template-columns:1fr}
  .svc{padding:20px}
  .svc h3{font-size:18px}
  .nobook{padding:18px;align-items:flex-start}
  .nobook b{font-size:18px}
  .reserve-side .btn{width:100%}
  .mbar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--deep);border-top:1px solid var(--gold-line);padding:10px 10px calc(10px + env(safe-area-inset-bottom))}
  .mbar a{display:flex;align-items:center;justify-content:center;min-height:54px;border-radius:4px;font-weight:700;font-size:15px}
  .mbar .k{background:var(--gold);color:var(--deep)}
  .mbar .r{background:var(--bx-2);color:var(--gold-2)}
  .mbar .b{border:1px solid var(--gold-line);color:var(--gold-2)}
}

/* ===== 세목 페이지 (양도세 등) ===== */
.crumb{font-size:14px;color:#D9C3B4;letter-spacing:.04em}
.crumb a{text-decoration:underline;text-underline-offset:3px}
.sub-hero{padding:88px 0 96px}
.sub-hero h1{font-size:clamp(30px,4.6vw,52px)}
.need-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0}
.need-list li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);padding:18px 22px;font-size:16px;color:var(--ink-2)}
.need-list li::before{content:"✓";flex:none;width:26px;height:26px;border-radius:50%;background:var(--bx-2);color:var(--gold-2);font-weight:900;font-size:14px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.need-list b{color:var(--ink)}
.svc p{font-size:15px;color:var(--ink-2)}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;margin:0;padding:0;counter-reset:step}
.steps li{border-top:2px solid var(--bx-2);padding-top:18px;counter-increment:step;font-size:15px;color:var(--ink-2)}
.steps li::before{content:"STEP " counter(step);display:block;font-size:12px;font-weight:700;letter-spacing:.24em;color:var(--gold);margin-bottom:6px}
.steps b{display:block;font-family:var(--serif);font-size:19px;color:var(--ink);margin-bottom:4px}
.faq{display:flex;flex-direction:column;gap:10px}
.faq details{border:1px solid var(--line);background:#fff}
.faq details[open]{border-color:var(--gold)}
.faq summary{cursor:pointer;list-style:none;padding:18px 52px 18px 22px;font-weight:700;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:24px;font-weight:400;color:var(--gold)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 22px 20px;font-size:16px;color:var(--ink-2)}
.posts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.posts a{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);padding:16px 22px;font-weight:500;font-size:16px;background:#fff;transition:border-color .15s}
.posts a::after{content:"→";color:var(--gold);font-weight:700;flex:none}
.posts a:hover{border-color:var(--gold)}
.cta-band .btn-row{justify-content:center;margin-top:28px}
.chip-link{text-decoration:none}

@media (max-width:960px){
  .steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px}
}
@media (max-width:640px){
  .sub-hero{padding:52px 0 60px}
  .need-list,.posts,.svc-list.wide{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .faq summary{font-size:16px}
}
