/* === 단골픽 블로그(마케팅 인사이트) — site.css 토큰 재사용 === */
.bl-hero{padding:64px 0 30px;text-align:center;background:
  radial-gradient(900px 380px at 50% -10%,rgba(95,230,168,.20),transparent 70%);}
.bl-hero .eyebrow{display:block;margin-bottom:12px}
.bl-hero h1{font-size:clamp(30px,5vw,50px);font-weight:850;letter-spacing:-1.4px;line-height:1.14;font-family:'GmarketSansBold','Pretendard',sans-serif}
.bl-hero p{max-width:640px;margin:16px auto 0;color:var(--body);font-size:clamp(15px,2vw,18px)}
.bl-cats{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:30px 0 8px}
.bl-cats a{border:1.5px solid var(--line);background:#fff;color:var(--body);font-weight:700;font-size:14px;padding:9px 18px;border-radius:999px;transition:.18s}
.bl-cats a:hover{border-color:var(--accent);color:var(--accent-d)}
.bl-cats a.on{background:var(--ink);color:#fff;border-color:var(--ink)}

.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding:34px 0 70px}
@media(max-width:900px){.bl-grid{grid-template-columns:1fr 1fr;gap:18px}}
@media(max-width:600px){.bl-grid{grid-template-columns:1fr}}
.bl-card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;transition:.24s cubic-bezier(.2,.7,.2,1);box-shadow:0 10px 30px rgba(10,80,48,.06)}
.bl-card:hover{transform:translateY(-6px);box-shadow:0 26px 56px rgba(10,80,48,.16);border-color:transparent}
.bl-cover{aspect-ratio:16/10;display:flex;align-items:flex-end;padding:18px;position:relative;color:#fff;overflow:hidden}
.bl-cover .k{font-weight:800;font-size:12.5px;letter-spacing:.5px;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);padding:6px 12px;border-radius:999px}
.bl-cover .deco{position:absolute;right:-30px;top:-30px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.14)}
.bl-cover .deco2{position:absolute;right:30px;bottom:-50px;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.10)}
.g0{background:linear-gradient(135deg,#0aa766,#13c57f 55%,#5fe6a8)}
.g1{background:linear-gradient(135deg,#0c8f6e,#1bb98a 60%,#7fe3c0)}
.g2{background:linear-gradient(135deg,#0a7d8a,#16b0a6 60%,#6fe3d8)}
.g3{background:linear-gradient(135deg,#1f7a5e,#13c57f 60%,#a7f0cf)}
.g4{background:linear-gradient(135deg,#0e5d4a,#0aa766 60%,#5fe6a8)}
.bl-body{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.bl-body h3{font-size:18.5px;font-weight:800;line-height:1.35;letter-spacing:-.4px;margin-bottom:8px}
.bl-body p{color:var(--muted);font-size:14px;line-height:1.6;flex:1}
.bl-meta{display:flex;gap:10px;align-items:center;margin-top:14px;color:var(--muted);font-size:12.5px;font-weight:600}
.bl-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--muted)}

/* === 아티클 === */
.art-wrap{max-width:760px;margin:0 auto;padding:0 24px}
.art-head{padding:46px 0 8px}
.bc{font-size:13px;color:var(--muted);font-weight:600;margin-bottom:18px}
.bc a:hover{color:var(--accent-d)}
.art-k{display:inline-block;font-weight:800;font-size:12.5px;color:var(--accent-d);background:var(--accent-l);padding:6px 13px;border-radius:999px}
.art-head h1{font-size:clamp(26px,4.4vw,40px);font-weight:850;letter-spacing:-1px;line-height:1.22;margin:16px 0 14px;font-family:'GmarketSansBold','Pretendard',sans-serif}
.art-head .sub{color:var(--body);font-size:17px;line-height:1.6}
.art-info{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:13.5px;font-weight:600;margin-top:18px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.art-cover{margin:26px 0 8px;border-radius:20px;aspect-ratio:16/7;display:flex;align-items:flex-end;padding:22px;color:#fff;position:relative;overflow:hidden}
.art-cover .deco{position:absolute;right:-40px;top:-40px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.14)}
.art-body{font-size:16.5px;line-height:1.85;color:var(--ink);padding:14px 0 10px}
.art-body h2{font-size:23px;font-weight:850;letter-spacing:-.6px;margin:38px 0 14px;line-height:1.3}
.art-body h3{font-size:18.5px;font-weight:800;margin:26px 0 10px}
.art-body p{margin:0 0 16px;color:#26352c}
.art-body ul,.art-body ol{margin:0 0 18px;padding-left:22px}
.art-body li{margin:0 0 9px;color:#26352c}
.art-body strong{font-weight:800;color:var(--ink)}
.art-body a{color:var(--accent-d);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.callout{background:var(--green-l);border:1px solid #c5edda;border-left:4px solid var(--accent);border-radius:14px;padding:18px 20px;margin:24px 0;font-size:15.5px;line-height:1.7}
.callout b{color:var(--accent-d)}
.art-cta{background:var(--forest);color:#fff;border-radius:22px;padding:34px 30px;margin:40px 0 12px;text-align:center;position:relative;overflow:hidden}
.art-cta:before{content:"";position:absolute;inset:0;background:radial-gradient(500px 200px at 80% 0,rgba(95,230,168,.28),transparent 70%)}
.art-cta h3{font-size:23px;font-weight:850;letter-spacing:-.6px;margin-bottom:10px;position:relative;font-family:'GmarketSansBold','Pretendard',sans-serif}
.art-cta p{color:rgba(255,255,255,.82);margin-bottom:20px;position:relative}
.art-cta .btn{position:relative}
.art-tags{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0}
.art-tags span{font-size:13px;color:var(--muted);background:var(--soft);padding:7px 13px;border-radius:999px;font-weight:600}
.art-more{border-top:1px solid var(--line);padding:34px 0 70px}
.art-more h4{font-size:15px;font-weight:800;color:var(--muted);margin-bottom:18px;letter-spacing:.3px}
.am-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.am-grid{grid-template-columns:1fr}}
.am-card{border:1px solid var(--line);border-radius:16px;padding:18px;transition:.2s}
.am-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.am-card .k{font-size:11.5px;font-weight:800;color:var(--accent-d)}
.am-card h5{font-size:15.5px;font-weight:800;line-height:1.4;margin-top:7px}