:root{--c1:#23372c;--c2:#b5651d;--bg:#f6f3ee;--ink:#1d1d1b;--mut:#5b5a55;--line:#d9d3c8;--w:1200px;--r:2px}
*{box-sizing:border-box}body{margin:0;font-family:'Pretendard',-apple-system,'Apple SD Gothic Neo',sans-serif;color:var(--ink);background:#fff;line-height:1.75;word-break:keep-all}
img{max-width:100%;height:auto;display:block}a{color:inherit}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
h1{font-size:clamp(2.2rem,4.6vw,3.4rem);font-weight:800;letter-spacing:-.03em;line-height:1.25;margin:0 0 14px;color:var(--c1)}
h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;letter-spacing:-.02em;margin:0 0 18px;color:var(--c1)}
h3{font-size:1.1rem;font-weight:700;margin:0 0 6px}
.sec{padding:56px 0}.sec.alt{background:var(--bg)}.sec.dark{background:var(--c1);color:#fff}.sec.dark h2{color:#fff}
.lead{font-size:1.1rem;max-width:820px;color:var(--ink)}.lab{font-family:'Space Grotesk','Pretendard',sans-serif;letter-spacing:.08em;font-size:.8rem;color:var(--c2);font-weight:700;text-transform:uppercase}
#site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:10}
.hd{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px;flex-wrap:wrap}
.logo{font-weight:800;font-size:1.25rem;text-decoration:none;color:var(--c1)}
.hd nav{display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-size:.95rem}.hd nav a{text-decoration:none}
.btn{display:inline-block;background:var(--c2);color:#fff;padding:12px 24px;border-radius:var(--r);font-weight:700;text-decoration:none}.btn.sm{padding:6px 14px}.btn.ghost{background:transparent;border:1px solid currentColor}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.card{display:block;border:1px solid var(--line);border-radius:var(--r);background:#fff;text-decoration:none;overflow:hidden}
.card-b{padding:16px}.card-b p{margin:0;color:var(--mut);font-size:.95rem}
.rel img{aspect-ratio:4/3;object-fit:cover;width:100%}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:2px}.ba figure{margin:0;position:relative}.ba img{aspect-ratio:4/3;object-fit:cover;width:100%}
.ba figcaption{position:absolute;left:8px;top:8px;background:var(--c1);color:#fff;font-size:.75rem;padding:2px 8px;border-radius:var(--r)}
.case-card dl{margin:8px 0 0;font-size:.9rem}.case-card dl div{display:flex;gap:8px}.case-card dt{color:var(--c2);font-weight:700;min-width:64px}.case-card dd{margin:0}
.tw{overflow-x:auto;margin:16px 0}table{border-collapse:collapse;width:100%}th,td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}@media(max-width:600px){th,td{padding:8px;font-size:.9rem}}th{background:var(--bg)}caption{text-align:left;font-weight:700;padding-bottom:8px}
.faq details{border-bottom:1px solid var(--line);padding:14px 0}.faq summary{cursor:pointer;list-style:none}.faq summary h3{display:inline;margin:0}.faq summary::after{content:"+";float:right;font-weight:700}.faq details[open] summary::after{content:"\2212"}.faq p{margin:10px 0 0;color:var(--mut)}
.pain h3{border-left:3px solid var(--c2);padding-left:10px}
.story figure{margin:20px 0}.story figure img{max-height:640px;width:auto;margin:0 auto;border-radius:var(--r)}.story figcaption{text-align:center;font-size:.9rem;color:var(--mut);margin-top:6px}
.story{max-width:820px}.quote{border-left:4px solid var(--c2);padding:8px 18px;background:var(--bg);margin:24px 0}
.bc{font-size:.85rem;color:var(--mut);padding:14px 0}.bc a{text-decoration:none}
.steps{counter-reset:s;list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.steps li{counter-increment:s;border-top:3px solid var(--c2);padding-top:10px}.steps li::before{content:"0" counter(s);font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--c2);display:block}
.cta{text-align:center}.cta p{margin:0 0 20px}
#site-footer{background:#161f1a;color:#cfd3cf;padding:36px 0 90px;font-size:.9rem}.ft-nav{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}.ft-nav a{text-decoration:none}.biz{margin:6px 0}
.float-cta{position:fixed;right:16px;bottom:16px;background:var(--c2);color:#fff;padding:12px 20px;border-radius:var(--r);font-weight:700;text-decoration:none;z-index:20;box-shadow:0 2px 10px #0003}
@media(max-width:768px){.grid3,.grid2{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.sec{padding:40px 0}}
.hero{position:relative;color:var(--ink);padding:80px 0 72px;background:var(--bg)}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.hero-pic{margin:0}.hero-pic img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:var(--r)}
.hero h1{color:var(--c1)}.hero .lead{color:var(--mut)}.hero .lab{color:var(--c2)}.hero .bc{color:var(--mut)}.hero-txt .btn{margin-top:4px}
@media(max-width:768px){.hero{padding:64px 0 52px}}
/* ===== 디자인 개선 v3 ===== */
body{font-size:16px}
.sec{padding:72px 0}.sec + .sec:not(.alt):not(.dark){border-top:1px solid var(--line)}
.sec-h{margin-bottom:28px}.sec-h .lab{margin:0 0 6px}.sec-h h2{margin:0}
h2{position:relative;padding-top:16px}h2::before{content:"";position:absolute;top:0;left:0;width:40px;height:3px;background:var(--c2)}
.cta h2::before,.hero h2::before{left:50%;transform:translateX(-50%)}.sec.dark h2::before{background:#f0b37a}
.story h2{margin-top:44px}.story h2:first-child,.story .sec-h+*{margin-top:0}.story>h2+*{margin-top:0}
.story h2:not(:first-child){padding-top:28px;border-top:1px solid var(--line)}.story h2:not(:first-child)::before{top:-1px}
.story p,.story li{font-size:1.02rem}.story h3.step-h{margin:30px 0 8px;font-size:1.2rem;color:var(--c1);padding-left:12px;border-left:4px solid var(--c2)}
.story h3.step-h:first-child{margin-top:0}
.lead{line-height:1.8}.hero .lead{font-size:1.15rem;margin:0 0 24px}
.hero-sub{padding:72px 0 64px}.hero-sub h1{margin-bottom:16px}
.bc{display:flex;gap:8px;flex-wrap:wrap;padding:0 0 22px;font-size:.85rem;color:var(--mut)}.bc a{opacity:.85}.bc span[aria-hidden]{opacity:.5}
.btn{transition:transform .15s,background .15s}.btn:hover{background:#9a5216;transform:translateY(-1px)}.btn.ghost.dk{color:var(--c1);border-color:var(--c1)}.btn.ghost.dk:hover{background:var(--c1);color:#fff}
#site-header{box-shadow:0 1px 8px #0000000d}.hd nav a:not(.btn){padding:6px 2px;border-bottom:2px solid transparent}.hd nav a:not(.btn):hover{border-color:var(--c2)}
.card{transition:transform .2s,box-shadow .2s}a.card:hover{transform:translateY(-4px);box-shadow:0 10px 24px #00000018}
.card img{transition:transform .4s}a.card:hover img{transform:scale(1.04)}.rel-img,.ba figure{overflow:hidden;display:block}
.rel{display:flex;flex-direction:column}.rel-img{display:block}.rel .card-b{display:flex;flex-direction:column;gap:6px;flex:1}
.rel-t{font-size:1.1rem;color:var(--c1)}.rel-s{color:var(--mut);font-size:.92rem}.more{margin-top:auto;padding-top:8px;font-weight:700;color:var(--c2);font-size:.92rem}
.case-card .card-b{border-top:3px solid var(--c1)}.case-card h3{font-size:1.2rem;color:var(--c1)}
table{font-size:.95rem}thead th{background:var(--c1);color:#fff;border-color:var(--c1)}tbody tr:nth-child(even){background:#faf8f4}caption{color:var(--c1);font-size:1rem}th[scope],tbody th{background:var(--bg);color:var(--c1);width:30%}
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:0;margin-bottom:10px}.faq summary{padding:16px 18px}.faq details[open]{border-color:var(--c2);background:#fffdf9}.faq p{padding:0 18px 16px;margin:0;color:#3c3b37}
.faq summary::after{color:var(--c2);font-size:1.3rem;line-height:1}
.steps4{list-style:none;counter-reset:q;padding:0;margin:0 0 24px;display:grid;gap:12px}.steps4 li{counter-increment:q;position:relative;padding:14px 16px 14px 60px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--c2);border-radius:var(--r)}
.steps4 li::before{content:counter(q);position:absolute;left:16px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;background:var(--c1);color:#fff;font-weight:700;text-align:center;line-height:30px;font-family:'Space Grotesk',sans-serif}
.alt .steps4 li{background:#fff}
ul.check{list-style:none;padding:0;margin:0 0 20px}ul.check li{padding:10px 0 10px 32px;position:relative;border-bottom:1px dashed var(--line)}ul.check li::before{content:"";position:absolute;left:4px;top:17px;width:12px;height:7px;border-left:3px solid var(--c2);border-bottom:3px solid var(--c2);transform:rotate(-45deg)}
.story ul:not(.check),.story ol:not(.steps4){padding-left:22px}.story li{margin-bottom:4px}
.story figure img{box-shadow:0 4px 16px #0000001a}.story figcaption{font-weight:600}
.quote{border-radius:var(--r);background:#fff;box-shadow:0 2px 10px #0000000d}.quote p:first-child{font-size:1.1rem;font-weight:600;color:var(--c1)}
.sec.dark.cta,.sec.dark .cta{padding:0}.sec.dark{padding:72px 0}.cta .lab{color:#f0b37a;margin:0 0 4px}
.grid2,.grid3{align-items:stretch}.pain h3{padding:2px 0 2px 12px}
@media(max-width:768px){
 .sec{padding:48px 0}.sec.dark{padding:48px 0}.hero-sub{padding:48px 0 44px}.story h2:not(:first-child){margin-top:32px}
 .hd{padding-top:8px;padding-bottom:8px}.hd nav{gap:12px;font-size:.88rem;width:100%;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:4px}
 .steps4 li{padding-left:56px}.float-cta{left:16px;right:16px;text-align:center}
}
@media(max-width:768px){.hero-grid{grid-template-columns:1fr;gap:28px}.hero{padding:40px 0 44px}.hero-pic{order:2}}
.hero-gallery{display:grid;gap:12px}.hero-gallery figure{margin:0}.hero-gallery img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;border-radius:var(--r)}
.hero-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hero-gallery figcaption{font-size:.82rem;color:var(--mut);margin-top:6px}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.hero-tags span{border:1px solid var(--line);background:#fff;padding:5px 12px;font-size:.85rem;color:var(--c1)}
.hero-pic{display:none}
/* ===== 모바일 최적화 ===== */
img{max-width:100%;height:auto}html{-webkit-text-size-adjust:100%}body{overflow-x:hidden;word-break:keep-all;overflow-wrap:break-word}
@media(max-width:768px){
 .wrap{padding-left:18px;padding-right:18px}
 .hd{flex-wrap:wrap;row-gap:0;min-height:0;padding-top:10px;padding-bottom:0}.logo{font-size:1.1rem}
 .hd nav{order:3;width:100%;margin:0 -18px;padding:8px 18px 10px;width:calc(100% + 36px);gap:18px;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}.hd nav::-webkit-scrollbar{display:none}
 .hd nav a{padding:6px 0;flex:none}
 h1{font-size:1.85rem;line-height:1.3}h2{font-size:1.4rem;line-height:1.35}h3{font-size:1.1rem}
 .hero-txt .btn,.cta .btn,.story .btn{display:block;text-align:center;padding:14px 16px}.story .btn+.btn{margin-top:10px}
 .hero .lead{font-size:1.02rem}.hero-tags{margin-top:16px}.hero-tags span{font-size:.8rem;padding:4px 10px}
 .hero-gallery{gap:8px}.hero-row{gap:8px}.hero-gallery figcaption{font-size:.75rem}
 .sec-h{margin-bottom:20px}
 .ba figcaption{font-size:.7rem}.card-b{padding:14px}.case-card dt{min-width:56px}
 .steps{grid-template-columns:1fr}
 .tw{margin:12px -18px;padding:0 18px}.tw table{min-width:440px}
 .faq summary{padding:14px 14px;min-height:44px}.faq p{padding:0 14px 14px}
 .story p,.story li{font-size:1rem;line-height:1.75}.story figure img{max-height:none;width:100%}
 .quote{padding:6px 14px}
 #site-footer{padding:28px 0 96px}.ft-nav{gap:10px 16px}
 .float-cta{left:12px;right:12px;bottom:12px;text-align:center;padding:14px}
}
@media(max-width:380px){h1{font-size:1.6rem}.hero-row{grid-template-columns:1fr 1fr}.btn{padding:12px 16px}}