/* assets/css/php_security.css
   PHP 보안 취약점(PHP2Shell) 안내 페이지 (/php-security) 전용 — 모든 클래스는 .psec-* 로 한정
   2026-10-26 시안 기준. 색은 사이트 토큰(preview_sub.css)을 쓰고, 추가 색은 경고색 #C8382F(및 그 투명도)와
   다크 배경 #0D1F17(띠배너와 동일)만 사용 */

/* 고정 헤더(60px) + 띠배너(--ns-alert-h, 노출 시에만 값 존재) 아래로 앵커 위치 보정 */
.psec-anchor{scroll-margin-top:calc(60px + var(--ns-alert-h, 0px) + 16px);}

.psec{line-height:1.6;}
.psec-wrap{max-width:1000px;margin:0 auto;padding:0 24px;}
.psec-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,'D2Coding',monospace;font-size:.92em;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:1px 6px;color:var(--accent);
}

/* ═══ 히어로 ═══ */
.psec-hero{background:#0D1F17;color:rgba(255,255,255,.9);padding:72px 0 76px;position:relative;overflow:hidden;}
.psec-hero::after{
  content:"";position:absolute;right:-160px;top:-120px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(37,168,112,.16) 0%,transparent 68%);
}
.psec-hero .psec-wrap{position:relative;z-index:1;}
.psec-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(200,56,47,.16);border:1px solid rgba(200,56,47,.45);color:#fff;
  font-size:12px;font-weight:800;letter-spacing:.08em;line-height:1.2;
  padding:6px 13px;border-radius:var(--r-full);margin-bottom:22px;
}
.psec-hero-t{
  font-family:var(--font-h);font-size:clamp(30px,5vw,54px);font-weight:800;line-height:1.24;
  letter-spacing:-.025em;color:#fff;margin-bottom:18px;
}
.psec-hero-t em{font-style:normal;color:var(--accent-l);}
.psec-hero-d{font-size:clamp(15px,1.9vw,18px);color:rgba(255,255,255,.7);max-width:720px;}
.psec-hero-d b{color:#fff;font-weight:700;}
.psec-hero-cta{margin-top:32px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;}

.psec-btn{
  display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  font-size:15px;font-weight:700;line-height:1.3;
  padding:14px 28px;border-radius:var(--r-full);transition:.18s;
}
.psec-btn-p{background:var(--accent-l);color:#fff;}
.psec-btn-p:hover{background:#2EC183;color:#fff;}
.psec-btn-o{border:1px solid rgba(255,255,255,.28);color:rgba(255,255,255,.9);}
.psec-btn-o:hover{border-color:var(--accent-l);color:var(--accent-l);}
.psec-tel{font-size:14px;color:rgba(255,255,255,.7);margin-left:4px;}
.psec-tel b{color:#fff;font-weight:700;font-size:15.5px;}
.psec-tel a{color:inherit;}

/* ═══ 지표 ═══ */
.psec-facts{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:#F2CFC9;border:1px solid #F2CFC9;   /* 불투명 필수 — 히어로(다크) 위에 겹치므로 반투명이면 구분선에 검정이 비침 */
  border-radius:var(--r-lg);overflow:hidden;
  margin:-38px auto 0;position:relative;z-index:2;box-shadow:var(--shadow-sm);
}
.psec-fact{background:#FDF0EE;padding:22px 24px;}
.psec-fact-n{font-family:var(--font-h);font-size:clamp(15px,2.5vw,26px);font-weight:800;color:#C8382F;line-height:1.25;}
.psec-fact-t{font-size:13.5px;color:var(--text-sub);margin-top:5px;}

/* ═══ 본문 공통 ═══ */
.psec-sec{padding:66px 0;}
.psec-sec.alt{background:var(--bg-card);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.psec-eyebrow{
  display:flex;align-items:center;gap:10px;
  font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent);margin-bottom:16px;
}
.psec-eyebrow::before{content:"";width:22px;height:1.5px;background:var(--accent);}
.psec-h2{
  font-family:var(--font-h);font-size:clamp(23px,3.2vw,34px);font-weight:800;line-height:1.3;
  letter-spacing:-.02em;color:var(--text);margin-bottom:14px;
}
.psec-sub{font-size:15.5px;color:var(--text-sub);margin-bottom:30px;max-width:760px;}

/* CVE */
.psec-cve{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.psec-cve-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px 24px;}
.psec-cve-id{
  font-family:ui-monospace,SFMono-Regular,Menlo,'D2Coding',monospace;
  font-size:13px;font-weight:700;color:#C8382F;margin-bottom:8px;
}
.psec-cve-t{font-size:16.5px;font-weight:700;color:var(--text);margin-bottom:8px;}
.psec-cve-d{font-size:14px;color:var(--text-sub);line-height:1.65;}

/* 체크리스트 */
.psec-chk{list-style:none;display:grid;gap:13px;max-width:780px;}
.psec-chk li{display:flex;gap:11px;font-size:15px;line-height:1.55;color:var(--text);}
.psec-chk li::before{
  content:"!";flex:none;width:19px;height:19px;margin-top:3px;border-radius:50%;
  background:#C8382F;color:#fff;font-size:12px;font-weight:800;line-height:1;
  display:flex;align-items:center;justify-content:center;
}
.psec-note{
  margin-top:22px;padding:16px 18px;max-width:780px;
  background:var(--bg-card);border:1px solid var(--border);border-left:3px solid #C8382F;border-radius:var(--r-sm);
  font-size:14px;color:var(--text-sub);line-height:1.65;
}
.psec-sec.alt .psec-note{background:var(--bg);}
.psec-note b{color:#C8382F;font-weight:700;}

/* 명령어 */
.psec-cmd{background:#0D1F17;border-radius:var(--r-lg);padding:24px 26px;margin-top:8px;overflow-x:auto;}
.psec-cmd + .psec-cmd{margin-top:14px;}
.psec-cmd-l{font-size:12.5px;color:rgba(255,255,255,.5);margin-bottom:10px;}
.psec-pre{
  font-family:ui-monospace,SFMono-Regular,Menlo,'D2Coding',monospace;
  font-size:13.5px;color:rgba(255,255,255,.85);line-height:1.9;white-space:pre;
  overflow-wrap:normal;word-break:normal;
}
.psec-pre-c{color:rgba(255,255,255,.42);}

/* 버전표 */
.psec-tbl-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-lg);margin-top:6px;}
.psec-tbl{width:100%;border-collapse:collapse;font-size:14.5px;}
.psec-tbl th{
  background:var(--accent-glow);color:var(--accent);font-weight:700;text-align:left;
  padding:13px 18px;font-size:13.5px;letter-spacing:.02em;white-space:nowrap;
}
.psec-tbl td{padding:13px 18px;border-top:1px solid var(--border);background:var(--bg);color:var(--text);}
.psec-tbl td:first-child{font-weight:700;white-space:nowrap;}
.psec-eol{color:#C8382F !important;font-size:13px;font-weight:700;}
.psec-rev{font-family:ui-monospace,SFMono-Regular,Menlo,'D2Coding',monospace;font-size:12.5px;}

/* 3단계 */
.psec-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:psec-s;}
.psec-steps li{
  counter-increment:psec-s;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px 24px;
}
.psec-steps li::before{
  content:counter(psec-s);display:flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:var(--r-full);background:var(--accent);color:#fff;
  font-size:13.5px;font-weight:800;margin-bottom:14px;
}
.psec-steps strong{display:block;font-size:16.5px;font-weight:700;color:var(--text);margin-bottom:6px;}
.psec-steps p{font-size:14px;color:var(--text-sub);line-height:1.65;}

/* FAQ */
.psec-faq{display:grid;gap:12px;}
.psec-faq details{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;}
.psec-faq summary{
  padding:17px 20px;font-size:15.5px;font-weight:700;color:var(--text);cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;gap:16px;align-items:center;
}
.psec-faq summary::-webkit-details-marker{display:none;}
.psec-faq summary::after{content:"+";flex:none;font-size:19px;color:var(--accent);font-weight:400;line-height:1;}
.psec-faq details[open] summary::after{content:"−";}
.psec-faq p{padding:0 20px 18px;font-size:14.5px;color:var(--text-sub);line-height:1.7;}

/* ═══ 문의 폼 ═══ */
.psec-form-sec{background:var(--accent);color:#fff;padding:64px 0 72px;}
.psec-form-sec .psec-eyebrow{color:rgba(255,255,255,.72);}
.psec-form-sec .psec-eyebrow::before{background:rgba(255,255,255,.72);}
.psec-form-sec .psec-h2{color:#fff;margin-bottom:10px;}
.psec-form-sec .psec-sub{color:rgba(255,255,255,.82);margin-bottom:0;}
.psec-form-grid{display:grid;grid-template-columns:1fr 340px;gap:28px;margin-top:34px;align-items:start;}

.psec-fcard{background:var(--bg-card);border-radius:var(--r-lg);padding:32px 30px;box-shadow:0 10px 30px rgba(0,0,0,.12);}
.psec-frow{display:grid;gap:16px;margin-bottom:16px;}
.psec-frow.two{grid-template-columns:1fr 1fr;}
.psec-fld{min-width:0;}
.psec-fld label{display:block;font-size:13.5px;font-weight:700;color:var(--text);margin-bottom:7px;}
.psec-req{color:#C8382F;margin-left:3px;}
.psec-opt{color:var(--text-muted);font-weight:500;margin-left:4px;}
.psec-fld input,
.psec-fld textarea{
  display:block;width:100%;font-family:inherit;font-size:14.5px;color:var(--text);
  background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);
  padding:12px 14px;transition:.15s;
}
.psec-fld textarea{min-height:104px;resize:vertical;line-height:1.6;}
.psec-fld input:focus,
.psec-fld textarea:focus{outline:none;border-color:var(--accent);background:var(--bg-card);box-shadow:0 0 0 3px rgba(26,122,82,.1);}
.psec-fld input::placeholder,
.psec-fld textarea::placeholder{color:var(--text-muted);}
.psec-hint{font-size:12.5px;color:var(--text-muted);margin-top:6px;line-height:1.5;}

.psec-agree{display:flex;align-items:flex-start;gap:9px;margin:4px 0 20px;font-size:13.5px;color:var(--text-sub);cursor:pointer;}
.psec-agree input{flex:none;width:17px;height:17px;margin-top:2px;accent-color:var(--accent);}
.psec-agree a{color:var(--accent);font-weight:700;}

.psec-fsubmit{
  display:block;width:100%;font-family:inherit;font-size:16px;font-weight:700;color:#fff;
  background:var(--accent);border:0;border-radius:var(--r-full);
  padding:16px 24px;cursor:pointer;transition:.18s;
}
.psec-fsubmit:hover{background:var(--accent-l);}

.psec-aside{display:grid;gap:12px;}
.psec-abox{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:var(--r-lg);padding:20px 22px;}
.psec-abox-k{font-size:12.5px;color:rgba(255,255,255,.7);margin-bottom:5px;}
.psec-abox-v{font-size:17px;font-weight:800;color:#fff;letter-spacing:-.01em;}
.psec-abox-v a{color:#fff;text-decoration:none;}
.psec-abox-v a:hover{text-decoration:underline;}
.psec-abox-m{font-size:12.5px;color:rgba(255,255,255,.65);margin-top:4px;}
.psec-abox.tip{background:rgba(0,0,0,.14);border-color:rgba(255,255,255,.14);}
.psec-abox.tip p{font-size:13.5px;color:rgba(255,255,255,.88);line-height:1.65;}
.psec-abox.tip b{color:#fff;font-weight:700;}

.psec-src{padding:28px 0 60px;font-size:12.5px;color:var(--text-muted);line-height:1.8;}

/* ═══ 플로팅 바로가기 (#nsQuick) ═══
   bottom:92px = 카카오톡 상담 버튼(.kakao-consult-fab, preview_new.css) bottom 24 + 높이 약 52 + 간격 16.
   현재 카톡 버튼은 메인에만 있어 이 페이지에선 겹치지 않지만, 같은 위치 체계를 유지 */
.psec-quick{
  position:fixed;right:24px;bottom:92px;z-index:90;
  display:inline-flex;align-items:center;gap:9px;
  background:var(--accent);color:#fff;text-decoration:none;
  font-size:14.5px;font-weight:700;line-height:1.3;padding:14px 22px;border-radius:var(--r-full);
  box-shadow:0 8px 24px rgba(26,122,82,.34);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .22s,transform .22s,visibility .22s,background .18s;
}
.psec-quick.on{opacity:1;visibility:visible;transform:translateY(0);}
.psec-quick:hover{background:var(--accent-l);color:#fff;}
.psec-quick svg{flex:none;}

/* ═══ 반응형 ═══ */
@media (max-width:900px){
  .psec-form-grid{grid-template-columns:1fr;}
}
@media (max-width:860px){
  .psec-cve,.psec-steps{grid-template-columns:1fr;}
  .psec-facts{grid-template-columns:1fr;margin-top:-28px;}
  .psec-fact{display:flex;align-items:baseline;gap:12px;padding:15px 20px;}
  .psec-fact-t{margin-top:0;}
  .psec-hero{padding:54px 0 64px;}
  .psec-sec{padding:50px 0;}
}
@media (max-width:768px){
  .psec-wrap{padding:0 clamp(16px, 3.13vw, 24px);}
  .psec-fcard{padding:clamp(22px, 4.17vw, 32px) clamp(18px, 3.91vw, 30px);}
  .psec-form-sec{padding:clamp(48px, 8.33vw, 64px) 0 clamp(52px, 9.38vw, 72px);}
  .psec-cmd{padding:clamp(18px, 3.13vw, 24px) clamp(18px, 3.39vw, 26px);}
  .psec-pre{font-size:clamp(12px, 1.76vw, 13.5px);}
}
@media (max-width:720px){
  /* 하단 전체 너비 바 */
  .psec-quick{
    left:0;right:0;bottom:0;justify-content:center;border-radius:0;
    font-size:clamp(14px, 2.01vw, 14.5px);
    padding:clamp(14px, 2.22vw, 16px) clamp(16px, 3.06vw, 22px);
    padding-bottom:calc(clamp(14px, 2.22vw, 16px) + env(safe-area-inset-bottom, 0px));
    box-shadow:0 -4px 16px rgba(0,0,0,.12);
  }
}
@media (prefers-reduced-motion:reduce){
  .psec-quick{transition:none;}
}
@media (max-width:560px){
  .psec-btn{width:100%;justify-content:center;}
  .psec-tel{margin-left:0;width:100%;text-align:center;}
  .psec-frow.two{grid-template-columns:1fr;}
  .psec-tbl{font-size:clamp(13px, 1.89vw, 14.5px);}
  .psec-tbl th,.psec-tbl td{padding:clamp(10px, 1.69vw, 13px) clamp(12px, 2.34vw, 18px);}
}