/* *******************************************************
 * filename : partner.css
 * description : Products > Partner Products (kr/product/partner.php)
 * date : 2026-10-26
******************************************************** */
.pp-page {padding: 2rem 0 16rem;}
.pp-shell {display: grid; grid-template-columns: 28rem minmax(0, 1fr); gap: 7rem; align-items: start; padding-top: 4rem; border-top: 1px solid #e7e7e7;}

/* 좌측: 제품군 탭 + 제품 목록 */
.pp-side {position: sticky; top: calc(var(--header-height, 90px) + 3rem);}
.pp-tabs {display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #d5d5d5; border-radius: 0.6rem; overflow: hidden; margin-bottom: 2.4rem;}
.pp-tab {min-height: 5.6rem; padding: 0.8rem 0.5rem; border: 0; background: #fff; color: #777; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; cursor: pointer; transition: background 0.2s, color 0.2s;}
.pp-tab + .pp-tab {border-left: 1px solid #d5d5d5;}
.pp-tab:hover {color: #000;}
.pp-tab.is-active {background: #3386ff; color: #fff;}
.pp-tab:focus-visible {outline: 2px solid #1e7dce; outline-offset: -4px;}

.pp-list[hidden] {display: none;}
.pp-list li + li {margin-top: 0.2rem;}
.pp-item {display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; box-sizing: border-box; min-height: 5.6rem; padding: 0.8rem 1.6rem; border-left: 3px solid transparent; color: #333; font-size: 1.7rem; font-weight: 500; transition: background 0.2s, color 0.2s;}
.pp-item i {font-size: 1.8rem; opacity: 0; transition: opacity 0.2s;}
.pp-item:hover {background: #f5f6f8; color: #000;}
.pp-item.is-active {border-left-color: #3386ff; background: #eef5ff; color: #1e6fe0; font-weight: 600;}
.pp-item.is-active i {opacity: 1;}
.pp-item:focus-visible {outline: 2px solid #1e7dce; outline-offset: -2px;}

/* 우측: 제품 상세 */
.pp-detail[hidden] {display: none;}
.pp-detail-wrap {min-width: 0; scroll-margin-top: calc(var(--header-height, 90px) + 2rem);}
.pp-head {padding-bottom: 3.2rem;}
.pp-name {font-size: 4.6rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.02em; color: #000;}
.pp-tagline {margin-top: 1.4rem; font-size: 2rem; font-weight: 400; line-height: 1.5; letter-spacing: -0.05em; color: #555;}

.pp-docs {padding: 2.8rem 0 3.4rem; border-top: 1px solid #e7e7e7;}
.pp-docs-tit {display: block; margin-bottom: 1.6rem; font-size: 1.8rem; font-weight: 700; color: #000;}
.pp-docs-list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem;}
.pp-doc {display: grid; grid-template-columns: 4.2rem minmax(0, 1fr) 2.2rem; align-items: center; gap: 1.3rem; min-height: 7.6rem; padding: 1.2rem 1.6rem; border: 1px solid #e7e7e7; border-radius: 0.6rem; background: #fff; transition: border-color 0.2s;}
.pp-doc:hover, .pp-doc:focus-visible {border-color: #3386ff;}
.pp-doc > i:first-child {display: grid; width: 4.2rem; height: 4.2rem; place-items: center; border-radius: 0.4rem; background: #eef5ff; color: #3386ff; font-size: 2rem;}
.pp-doc strong, .pp-doc small {display: block; min-width: 0;}
.pp-doc strong {overflow: hidden; font-size: 1.5rem; font-weight: 600; color: #000; text-overflow: ellipsis; white-space: nowrap;}
.pp-doc small {margin-top: 0.2rem; font-size: 1.3rem; color: #888;}
.pp-doc > i:last-child {font-size: 2rem; color: #555;}

/* 문의 안내 */
.pp-contact {display: flex; align-items: center; justify-content: space-between; gap: 3rem; margin-top: 6rem; padding: 3.6rem 4rem; border-radius: 1rem; background: #10263a; color: #fff;}
.pp-contact-txt strong {display: block; font-size: 2.2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.4;}
.pp-contact-txt p {margin-top: 0.6rem; font-size: 1.5rem; line-height: 1.6; color: rgba(255, 255, 255, 0.72); word-break: keep-all;}
.pp-contact-btn {display: inline-flex; flex: 0 0 auto; align-items: center; gap: 1rem; height: 5.4rem; padding: 0 2.8rem; border-radius: 0.6rem; background: #fff; color: #000; font-size: 1.6rem; font-weight: 700; transition: background 0.2s, color 0.2s;}
.pp-contact-btn:hover, .pp-contact-btn:focus-visible {background: #3386ff; color: #fff;}

/* 상세 본문 공통 블록 (기존 제품 페이지 내용 이관용) */
.pp-block {padding: 4.4rem 0 5rem; border-top: 3px solid #000;}
.pp-block + .pp-block {margin-top: 6rem;}
.pp-block-gray {padding: 4.4rem 4rem 5rem; border-top: 0; border-radius: 1rem; background: #f9f9f9;}
.pp-block-tit {margin-bottom: 2.6rem; font-size: 3rem; font-weight: 700; line-height: 1.3; letter-spacing: -0.03em; color: #000;}
.pp-lead {margin-bottom: 3rem; font-size: 2.2rem; font-weight: 300; line-height: 1.55; letter-spacing: -0.05em; color: #000; word-break: keep-all;}
.pp-figure {margin-bottom: 3rem;}
.pp-figure-scroll {overflow-x: auto; -webkit-overflow-scrolling: touch;}
.pp-figure img {display: block; width: 100%; height: auto; border-radius: 1.2rem;}

/* CrowdStrike 본문: 기존 .crowdstrike-page 스타일 재사용 + 좁은 폭 보정 */
.pp-cs .service-point-txt-con dl dt {font-size: 2rem;}
.pp-cs .service-point-txt-con dl dd .txt {font-size: 1.7rem;}
.pp-cs.crowdstrike-page .service-point-txt-con dl dd .txt-box {margin: 1rem 0; padding: 2.4rem;}
.pp-cs .crowdstrike-inner .feature-box {padding: 3rem 3rem 2.6rem;}
.pp-cs .crowdstrike-inner .feature-box .feature-tit {font-size: 2rem;}
.pp-cs .crowdstrike-inner .function-tbl-box .function-tbl tbody th {padding-left: 1.6rem; text-align: left;}
.pp-cs .crowdstrike-inner .function-tbl-box .function-tbl tbody td {padding: 1.6rem 2rem;}

/* ****************** 반응형 ****************** */
@media all and (max-width: 1200px) {
	.pp-shell {grid-template-columns: 24rem minmax(0, 1fr); gap: 4.4rem;}
	.pp-name {font-size: 4rem;}
}

@media all and (max-width: 1024px) {
	.pp-page {padding-bottom: 10rem;}
	.pp-shell {display: block; padding-top: 3rem;}
	.pp-side {position: static; margin-bottom: 4rem;}
	.pp-tabs {margin-bottom: 1.6rem;}
	.pp-list {display: flex; flex-wrap: wrap; gap: 0.8rem;}
	.pp-list[hidden] {display: none;}
	.pp-list li + li {margin-top: 0;}
	.pp-item {min-height: 4.4rem; padding: 0.8rem 1.6rem; border: 1px solid #d5d5d5; border-radius: 2.2rem; font-size: 1.5rem;}
	.pp-item i {display: none;}
	.pp-item.is-active {border-color: #3386ff; background: #3386ff; color: #fff;}
	.pp-docs-list {grid-template-columns: minmax(0, 1fr);}
}

@media all and (max-width: 767px) {
	.pp-name {font-size: 3.2rem;}
	.pp-tagline {font-size: 1.7rem;}
	.pp-tab {min-height: 5rem; font-size: 1.5rem;}
	.pp-contact {flex-direction: column; align-items: flex-start; gap: 2rem; padding: 3rem 2.4rem;}
	.pp-contact-txt strong {font-size: 1.9rem;}
	.pp-contact-btn {width: 100%; justify-content: center;}
	.pp-block-gray {padding: 3.4rem 2rem 4rem;}
	.pp-block-tit {font-size: 2.4rem;}
	.pp-lead {font-size: 1.8rem;}
	.pp-figure img {width: 72rem; max-width: none;}
	.pp-cs .crowdstrike-inner .feature-box {padding: 2.4rem 2rem;}
	.pp-cs .crowdstrike-inner .function-tbl-box {overflow-x: auto;}
	.pp-cs .crowdstrike-inner .function-tbl-box .function-tbl {min-width: 48rem;}
}