:root{--paper:#fbfbf8;--ink:#171714;--muted:#686861;--line:#deded7;--accent:#ff4d24;--lime:#dfff48}
body{font-family:Pretendard,"Noto Sans KR",system-ui,sans-serif;background:var(--paper)}
.site-header{position:sticky;top:0;z-index:10;background:rgba(251,251,248,.94);backdrop-filter:blur(12px)}
.brand{font-family:Arial Black,Pretendard,sans-serif;letter-spacing:-.04em;font-size:1.2rem}
.site-header nav{font-weight:650;align-items:center}.site-header nav a{position:relative;padding:9px 2px;transition:color .18s ease}.site-header nav a:not(.search-link)::after{content:"";position:absolute;left:0;right:100%;bottom:3px;height:3px;background:var(--accent);transition:right .2s ease}.site-header nav a:hover,.site-header nav a:focus-visible,.site-header nav a.active{color:var(--accent)}.site-header nav a:hover::after,.site-header nav a:focus-visible::after,.site-header nav a.active::after{right:0}.site-header nav a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.search-link{border:1px solid var(--ink);border-radius:99px;padding:6px 15px!important;transition:background .18s ease,color .18s ease,border-color .18s ease!important}.search-link:hover,.search-link:focus-visible,.search-link.active{background:var(--ink);border-color:var(--ink);color:#fff!important}
.page{padding-top:88px}.page>h1{font-family:Pretendard,sans-serif;font-weight:800;letter-spacing:-.055em;max-width:900px}
.page-intro{font-size:1.25rem;color:var(--muted);max-width:680px;margin-top:-45px;margin-bottom:80px}
.eyebrow,.tag{font-weight:800;letter-spacing:.12em;text-transform:uppercase}.tag{display:inline-block;font-size:.69rem;color:var(--accent);margin:14px 0 6px}
.filter-nav{display:flex;gap:10px;flex-wrap:wrap;margin:-45px 0 70px}.filter-nav a{padding:8px 18px;border:1px solid var(--line);border-radius:99px}.filter-nav a.active{background:var(--ink);color:#fff}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:60px 26px}.story-image{aspect-ratio:16/10;background:#e8e8e1;overflow:hidden}.story-image img{width:100%;height:100%;object-fit:cover}.story-grid h2,.story-grid h3{font-family:Pretendard,sans-serif;font-size:1.45rem;line-height:1.35;letter-spacing:-.035em;margin:.3em 0}.story-grid p{color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.article-detail{padding:100px 0 150px}.article-detail>header{max-width:900px;margin:auto;text-align:center}.article-detail h1{font-size:clamp(2.8rem,7vw,5.5rem);line-height:1.12;letter-spacing:-.06em;margin:.3em 0}.article-hero{display:block;width:min(1050px,100%);max-height:600px;object-fit:cover;margin:70px auto}.article-body{max-width:760px;margin:70px auto;font-size:1.08rem}.related-block{max-width:760px;margin:100px auto 0;border-top:1px solid var(--line);padding-top:45px}.related-block h2{font-size:2rem}
.link-list{display:grid}.link-list a{padding:18px 0;border-top:1px solid var(--line);font-weight:700}
.recommendation-list{display:grid;gap:0}.recommendation-list article{display:grid;grid-template-columns:250px 1fr;gap:70px;padding:70px 0;border-top:1px solid var(--line);align-items:center}.recommendation-list article.featured{background:var(--lime);padding:60px;margin-inline:-40px;padding-inline:40px;border:0}.recommendation-cover{aspect-ratio:2/3;background:#e5e5dd}.recommendation-cover img{width:100%;height:100%;object-fit:cover}.recommendation-list h2{font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.05em;margin:.2em 0}.recommendation-list .buy{margin-left:16px}.recommendation-list small{display:block;color:var(--muted);margin-top:15px}
.search-form{display:flex;max-width:850px;border-bottom:3px solid var(--ink);margin-bottom:80px}.search-form input{flex:1;border:0;background:none;font:inherit;font-size:1.5rem;padding:18px 0;outline:0}.search-form button{border:0;background:none;font-weight:800}.search-page section{margin:65px 0}.search-page section h2{font-size:1rem;color:var(--accent)}
@media(max-width:800px){.story-grid{grid-template-columns:1fr}.recommendation-list article,.recommendation-list article.featured{grid-template-columns:110px 1fr;gap:22px;margin-inline:0;padding:35px 0}.recommendation-list h2{font-size:1.5rem}.recommendation-list .button{display:block;margin:12px 0}.article-detail{padding-top:60px}}
