/* ===== 제품소개 블럭 (product1) — 자체 완결형, 외부 CDN 없음 ===== */
.pintro{--pi-blue:#134a8e;--pi-dark:#1f2937;--pi-line:#e5e9f0;--pi-ph:#f3f5f9;--pi-ph-bd:#dfe4ee;color:#1e293b;font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;-webkit-font-smoothing:antialiased}
.pintro *{box-sizing:border-box}
.pintro-wrap{max-width:1440px;margin:0 auto;padding:0 24px}

/* 상단 탭 */
.pintro-tabs{position:sticky;top:0;z-index:40;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);padding:16px 0;border-bottom:1px solid var(--pi-line)}
.pintro-tab{display:inline-flex;align-items:center;padding:10px 22px;border-radius:999px;font-size:15px;font-weight:700;color:#475569;background:#f1f4f9;text-decoration:none;transition:.18s;border:1px solid transparent}
.pintro-tab:hover{color:var(--pi-blue);background:#e7eefa}
.pintro-tab.active{color:#fff;background:var(--pi-blue);border-color:var(--pi-blue)}

/* 본문 2단 — align-items:stretch(기본)로 좌측 컬럼이 본문 전체 높이만큼 늘어나야
   내부 sticky 메뉴가 스크롤 끝까지 따라옴 */
.pintro-body{display:flex;gap:44px;align-items:stretch;padding:40px 0 80px}

/* 좌측 고정 메뉴 */
.pintro-side{flex:0 0 220px;width:220px}
.pintro-side-inner{position:sticky;top:88px}
.pintro-side-group{margin-bottom:26px}
.pintro-side-cat{font-size:15px;font-weight:800;color:#0f172a;padding:0 0 10px;margin-bottom:8px;border-bottom:2px solid var(--pi-dark);cursor:pointer}
.pintro-side-group ul{list-style:none;margin:0;padding:0}
.pintro-side-group li{margin:0}
.pintro-side-group li a{display:block;padding:8px 12px;font-size:14px;color:#64748b;text-decoration:none;border-left:2px solid transparent;border-radius:0 6px 6px 0;transition:.15s}
.pintro-side-group li a:hover{color:var(--pi-blue);background:#f5f8fd}
.pintro-side-group li a.active{color:var(--pi-blue);font-weight:700;background:#eef4fd;border-left-color:var(--pi-blue)}

/* 우측 컨텐츠 */
.pintro-main{flex:1;min-width:0}
.pintro-cat{scroll-margin-top:96px}
.pintro-cat+.pintro-cat{margin-top:70px}
.pintro-cat-title{font-size:15px;font-weight:800;letter-spacing:.02em;color:var(--pi-blue);margin:0 0 30px;padding:8px 16px;background:#eef4fd;border-radius:8px;display:inline-block}

/* 제품 항목 */
.pintro-item{scroll-margin-top:96px;padding-bottom:56px;margin-bottom:56px;border-bottom:1px solid var(--pi-line)}
.pintro-cat .pintro-item:last-child{border-bottom:0;margin-bottom:0}
.pintro-item-title{font-size:24px;font-weight:800;color:#111827;margin:0 0 34px;letter-spacing:-.01em}
.pintro-item-title .tri{color:var(--pi-blue);font-size:18px;margin-right:6px}

/* 이미지/버튼 2단 */
.pintro-media{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;margin-bottom:34px}
.pintro-media-col{display:flex;flex-direction:column;align-items:center}
.pintro-imgs{display:grid;grid-template-columns:1fr;gap:16px;width:100%;margin-bottom:26px}
.pintro-imgs.cols-2{grid-template-columns:1fr 1fr}
.pintro-imgs.cols-3{grid-template-columns:1fr 1fr 1fr}

/* 빈 이미지(엑박) placeholder */
.pintro-ph{position:relative;aspect-ratio:4/3;background:var(--pi-ph);border:1px solid var(--pi-ph-bd);border-radius:12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='58' height='58' viewBox='0 0 24 24' fill='none' stroke='%23bcc5d6' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.6'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:52px 52px}

/* 버튼(pill) */
.pintro-pill{display:inline-flex;align-items:center;justify-content:center;min-width:200px;padding:14px 30px;border-radius:999px;font-size:16px;font-weight:800;color:#fff;letter-spacing:.02em}
.pill-dark{background:var(--pi-dark)}
.pill-blue{background:var(--pi-blue)}

/* 설명 */
.pintro-desc-name{font-size:18px;font-weight:800;color:#0f172a;margin-bottom:12px}
.pintro-desc-text{font-size:15px;line-height:1.7;color:#64748b;margin:0}

/* 반응형 */
@media(max-width:900px){
  .pintro-body{flex-direction:column;gap:0}
  .pintro-side{display:none}
  .pintro-media{gap:28px}
  .pintro-pill{min-width:150px;font-size:14px;padding:12px 20px}
  .pintro-item-title{font-size:20px}
}
@media(max-width:560px){
  .pintro-media{grid-template-columns:1fr;gap:34px}
}
