:root{--bg:#050505;--panel:#0d0d0e;--text:#f4f4f5;--muted:#989da6;--accent:#ccff00;--line:rgba(255,255,255,.11);--font-en:'Urbanist',sans-serif;--font-kr:'Noto Sans KR',sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth;overflow-x:hidden}
body{background:var(--bg);color:var(--text);font-family:var(--font-kr);line-height:1.75;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
strong{color:#fff;font-weight:800}
.site-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:18px 4vw;background:rgba(5,5,5,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo img{display:block;height:27px}
.nav-links{display:flex;align-items:center;gap:1.4rem;font:700 .75rem/1 var(--font-en);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.nav-links a:hover{color:var(--accent)}
.nav-cta{border:1px solid var(--accent);border-radius:999px;padding:.55rem 1rem;color:var(--accent)!important}
.hero,.article,.related,footer .inner{width:min(960px,92vw);margin:0 auto}
.hero{padding:clamp(64px,9vw,130px) 0 clamp(48px,7vw,90px);border-bottom:1px solid var(--line)}
.eyebrow{display:block;margin-bottom:1.2rem;color:var(--accent);font:700 .78rem/1.4 var(--font-en);letter-spacing:.18em;text-transform:uppercase}
h1{max-width:18ch;font-size:clamp(2.15rem,6vw,5rem);font-weight:900;line-height:1.14;letter-spacing:-.035em}
.answer-first{max-width:740px;margin-top:2.2rem;padding:1.5rem 1.6rem;border-left:3px solid var(--accent);background:linear-gradient(90deg,rgba(204,255,0,.08),transparent);font-size:clamp(1.05rem,1.7vw,1.35rem);line-height:1.7}
.answer-first::before{content:'한 줄 답';display:block;margin-bottom:.55rem;color:var(--accent);font:800 .72rem/1 var(--font-en);letter-spacing:.14em;text-transform:uppercase}
.meta{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin-top:1.8rem;color:var(--muted);font-size:.82rem}
.article{padding:clamp(48px,7vw,90px) 0}
.article section{padding:clamp(38px,5vw,64px) 0;border-bottom:1px solid var(--line)}
.article section:first-child{padding-top:0}
.article h2{max-width:25ch;margin-bottom:1.5rem;font-size:clamp(1.45rem,3vw,2.35rem);line-height:1.35;letter-spacing:-.02em}
.article p{max-width:720px;margin-bottom:1rem;color:var(--muted)}
.article ul{max-width:760px;display:grid;gap:.8rem;margin-top:1.4rem;list-style:none}
.article li{position:relative;padding:1rem 1rem 1rem 2.2rem;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--muted)}
.article li::before{content:'→';position:absolute;left:.9rem;color:var(--accent)}
.article li strong{display:block;margin-bottom:.2rem}
.source-note{margin-top:1.7rem!important;padding-top:1rem;border-top:1px dashed var(--line);font-size:.82rem;color:#737882!important}
.related-wrap{background:#0a0a0b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.related{padding:clamp(50px,7vw,84px) 0}
.related h2{margin-bottom:1.5rem;font-size:clamp(1.4rem,3vw,2rem)}
.related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.related-card{padding:1.35rem;border:1px solid var(--line);border-radius:12px;background:var(--panel);transition:.2s ease}
.related-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.related-card span{display:block;margin-bottom:.6rem;color:var(--accent);font:700 .7rem/1 var(--font-en);letter-spacing:.13em;text-transform:uppercase}
.related-card strong{display:block;line-height:1.45}
.cta{padding:clamp(58px,8vw,100px) 4vw;text-align:center}
.cta h2{font:900 clamp(2.4rem,7vw,6rem)/1 var(--font-en);letter-spacing:-.04em}
.cta p{max-width:620px;margin:1.3rem auto 2rem;color:var(--muted)}
.btn{display:inline-block;border:2px solid var(--accent);border-radius:999px;padding:.85rem 1.4rem;color:var(--accent);font-weight:800}
.btn:hover{background:var(--accent);color:#000}
footer{border-top:1px solid var(--line);padding:40px 0 90px;color:var(--muted);font-size:.78rem}
footer .inner{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
footer strong{color:#fff}
@media(max-width:720px){.site-nav{position:static;padding:14px 5vw}.nav-links a[href^="/service/"]{display:none}.nav-links{gap:.8rem;font-size:.65rem;letter-spacing:.03em}.nav-cta{padding:.4rem .65rem}.hero,.article,.related,footer .inner{width:90vw}.related-grid{grid-template-columns:1fr}.answer-first{padding:1.2rem}.article li{padding-right:.8rem}footer{padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.related-card{transition:none}}
