/* 기본 = 다크(사이트 기본 테마), [data-theme="light"] = 라이트 */
.post-content{
  --espresso:#f5ece2; --roast:#e6c9a8; --bean:#d9a679; --crema:#c8a27a;
  --milk:#111c33; --panel:#16223b; --line:#2b3d5e; --muted:#9fb0c8; --lead:#cdd7e6;
  --crystal-line:#3f6b7a; --crystal-a:#12303a; --crystal-b:#16223b; --crystal-k:#9fd6e6; --crystal-p:#a9c6d0;
  --tag-bg:rgba(255,255,255,.92); --radius:18px;
  --sec-y:clamp(26px,7vw,24px);
}
[data-theme="light"] .post-content{
  --espresso:#2b1a12; --roast:#4a2c1d; --bean:#7a4a2e; --crema:#c8a27a;
  --milk:#faf6f0; --panel:#ffffff; --line:#e3d6c6; --muted:#7b6b62; --lead:#4a3d36;
  --crystal-line:#9fc1cc; --crystal-a:#e9f1f4; --crystal-b:#ffffff; --crystal-k:#24424d; --crystal-p:#4b6670;
}
.post-content .wrap{max-width:none;width:100%;margin:0;padding:0}
.post-content i.ph{line-height:1;font-style:normal}
.post-content section{width:100%}
.post-content .serif{font-family:'Noto Serif KR',serif;letter-spacing: -2px;}

/* ===== Intro ===== */
.intro{padding:20px 0 35px 0;text-align:center}
.eyebrow{display:inline-block;font-size:13px;letter-spacing:.2em;color:var(--bean);font-weight:700;margin-bottom:16px}
.intro h2{font-size:clamp(24px,3.4vw,40px);line-height:1.4;color:var(--espresso);margin-bottom:20px}
.intro h2 strong{color:var(--bean)}
.intro p{color:var(--muted);max-width:720px;margin:0 auto;font-size:clamp(15px,1.5vw,17px)}

/* ===== Value chain ===== */
.chain{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:clamp(36px,5vw,60px);position:relative}
.chain::before{content:"";position:absolute;top:44px;left:10%;right:10%;height:2px;background:repeating-linear-gradient(90deg,var(--crema) 0 8px,transparent 8px 14px)}
.chain a{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 8px;text-decoration:none}
.chain .dot{width:88px;height:88px;border-radius:50%;background:var(--panel);border:2px solid var(--line);display:grid;place-items:center;transition:.3s;position:relative;z-index:1}
.chain .dot i{font-size:38px;color:var(--bean);transition:.3s}
.chain a:hover .dot{background:var(--bean);border-color:var(--bean)}
.chain a:hover .dot i{color:#fff}
.chain .num{font-size:12px;color:var(--crema);font-weight:700;letter-spacing:.1em}
.chain strong{font-size:16px;color:var(--espresso);text-align:center;line-height:1.4}

/* ===== Business sections ===== */
.biz{padding:var(--sec-y) 0;border-top:1px solid var(--line);scroll-margin-top:120px}
.biz-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.biz.rev .visual{order:2}
.visual{position:relative;aspect-ratio:5/4;border-radius:var(--radius);overflow:hidden;display:grid;place-items:center;box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.visual>i{font-size:clamp(72px,9vw,128px);color:#fff;opacity:.95;position:relative}
.visual .big{font-family:'Noto Serif KR',serif;font-size:clamp(80px,10vw,140px);font-weight:900;color:rgba(255,255,255,.12);position:absolute;right:24px;bottom:-16px;line-height:1}
.v1{background:linear-gradient(140deg,#3d5a3a,#6b7f4a 60%,#a38b5a)}
.v2{background:linear-gradient(140deg,#2e3a4a,#4b5f73 55%,#8a7a6a)}
.v3{background:linear-gradient(140deg,#d9e7ec,#a9c6d0 45%,#6c8e9a)}
.v3>i{color:#24424d}
.v3 .big{color:rgba(255,255,255,.4)}
.v4{background:linear-gradient(140deg,#3a2216,#6a3e26 55%,#a0663d)}
.v5{background:linear-gradient(140deg,#4a2c1d,#7a4a2e 50%,#c8a27a)}
.tag{position:absolute;left:24px;top:24px;background:var(--tag-bg);color:#4a2c1d;font-size:12px;font-weight:700;letter-spacing:.08em;padding:7px 14px;border-radius:30px}

.text .no{font-family:'Noto Serif KR',serif;font-size:15px;color:var(--bean);font-weight:700;letter-spacing:.1em;display:flex;align-items:center;gap:12px;margin-bottom:12px}
.text .no::after{content:"";width:40px;height:1px;background:var(--crema)}
.text h3{font-size:clamp(24px,2.8vw,34px);color:var(--espresso);line-height:1.35;margin:0 0 8px}
.text .en{font-size:13px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase;margin-bottom:22px}
.text .lead{font-size:clamp(15px,1.4vw,17px);color:var(--lead);margin-bottom:26px}
.text .lead strong{color:var(--bean)}
.points{list-style:none;margin:0 0 28px 0;padding:0;display:grid;gap:12px}
.points li{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.points li>i{flex:0 0 24px;font-size:24px;color:var(--bean);margin-top:1px}
.points strong{display:block;color:var(--espresso);font-size:15.5px;margin-bottom:2px}
.points span{display:block;font-size:14.5px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips em{font-style:normal;font-size:13px;padding:6px 14px;border-radius:30px;border:1px solid var(--crema);color:var(--bean)}

/* Crystal highlight */
.crystal-box{margin-top:clamp(36px,5vw,60px);border-radius:var(--radius);background:linear-gradient(120deg,var(--crystal-a),var(--crystal-b) 70%);border:1px solid var(--crystal-line);padding:clamp(24px,3.5vw,44px);display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.crystal-box>div{text-align:center}
.crystal-box .k{font-family:'Noto Serif KR',serif;font-size:clamp(20px,2.2vw,26px);font-weight:900;color:var(--crystal-k);margin-bottom:6px}
.crystal-box p{font-size:14.5px;color:var(--crystal-p);margin:0}

/* OEM process */
.process{margin-top:clamp(36px,5vw,60px);display:grid;grid-template-columns:repeat(6,1fr);gap:12px;counter-reset:st}
.process>div{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 14px;text-align:center;counter-increment:st}
.process>div::before{content:"STEP " counter(st,decimal-leading-zero);display:block;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--crema);margin-bottom:8px}
.process strong{display:block;font-size:15px;color:var(--espresso);margin-bottom:4px}
.process span{font-size:13px;color:var(--muted);line-height:1.5;display:block}

/* Responsive */
@media (max-width:1024px){.process{grid-template-columns:repeat(3,1fr)}}
@media (max-width:860px){
  .biz-grid{grid-template-columns:1fr}
  .biz.rev .visual{order:0}
  .chain{grid-template-columns:repeat(5,minmax(110px,1fr));overflow-x:auto;padding-bottom:10px}
  .crystal-box{grid-template-columns:1fr}
}
@media (max-width:520px){.process{grid-template-columns:repeat(2,1fr)}}

/* 이미지 박스: 여백 없이 꽉 채움(cover) */
.post-content .visual{display:block;padding:0}
.post-content .visual img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;border-radius:0!important;object-fit:cover;display:block;z-index:0}
.post-content .visual .tag,.post-content .visual .big{z-index:2}
.post-content .visual img~.big{color:rgba(255,255,255,.85);text-shadow:0 2px 12px rgba(0,0,0,.35)}