@charset "UTF-8";
/* 카르마 탐정연구소 — 업무분야 페이지 공통 (탐정 서비스 / 불법기기 전파탐지)
   공통 요소(.gt-label, .gt-badge, .gt-cta, .gt-reveal …)는 greeting.css 사용 */

/* 히어로 배너 */
.sv-hero{position:relative;overflow:hidden;padding:64px 60px;background:#141311;color:#fff;border-top:2px solid #8f7a45}
.sv-hero-icon{display:none}
.sv-hero{text-align:left}
.sv-hero>*:not(.sv-hero-icon){position:relative}
.sv-hero .gt-badge{display:flex;width:max-content;max-width:100%}
.sv-hero h2{margin-top:26px;font-family:var(--f-serif);font-size:clamp(30px,4vw,52px);font-weight:400;line-height:1.3}
.sv-hero h2 em{color:#c9a85a}
.sv-hero p.sv-lead{margin-top:20px;max-width:620px;color:#e6e2d8;font-size:16px;line-height:1.9}
.sv-keys{margin-top:30px;display:flex;flex-wrap:wrap;gap:10px}
.sv-keys{gap:0 26px}
.sv-keys li{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:#ddd}
.sv-keys i{color:#bfa25a;font-size:16px}

/* 섹션 제목 */
.sv-sec{margin-top:120px}
.sv-head{text-align:center;margin-bottom:46px}
.sv-head h3{margin-top:12px;font-family:var(--f-serif);font-size:clamp(26px,2.6vw,36px);font-weight:400}
.sv-head p:not(.gt-label){margin-top:12px;color:#5f584f;font-size:15px}

/* 서비스 분야 리스트 (가로 바) */
.sv-areas{display:grid;gap:14px;margin:0;padding:0}
.sv-areas{gap:0;border-top:1px solid rgba(30,77,107,.18)}
.sv-areas li{display:grid;grid-template-columns:90px 70px 1fr auto;align-items:center;gap:0;border-bottom:1px solid var(--gt-line);transition:background .3s}
.sv-areas li:hover{background:#f4f8fb}
.sv-areas .no{align-self:stretch;display:grid;place-items:center;font-family:var(--f-en);font-size:30px;color:#1e4d6b}
.sv-areas .ic{justify-self:center;font-size:28px;color:#c4654a}
.sv-areas .tx{padding:26px 24px 26px 6px}
.sv-areas b{display:block;font-family:var(--f-serif);font-size:21px;font-weight:500}
.sv-areas p{margin-top:6px;font-size:15px;color:#5f584f}
.sv-areas .tags{padding-right:28px;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;max-width:280px}
.sv-areas .tags span{font-size:15px;color:#3d7a62;white-space:nowrap}
.sv-areas .tags span+span::before{content:"·";margin:0 6px 0 0;color:#666}

/* 절차 (가로 스텝) */
.sv-steps{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:0;padding:0}
.sv-steps.is-4{grid-template-columns:repeat(4,1fr)}
.sv-steps li{position:relative;text-align:left;padding:26px 18px 22px;border-top:3px solid #1e4d6b;background:#fff;box-shadow:0 8px 20px rgba(28,25,21,.05)}
.sv-steps li:nth-child(2){border-top-color:#1a5f96}
.sv-steps li:nth-child(3){border-top-color:#3d7a62}
.sv-steps li:nth-child(4){border-top-color:#c4654a}
.sv-steps li:nth-child(5){border-top-color:#1e4d6b}
.sv-steps li:nth-child(6){border-top-color:#1a5f96}
.sv-steps li+li::before{display:none}
.sv-steps .n{font-family:var(--f-num);font-size:15px;font-weight:600;letter-spacing:2px;color:#1e4d6b}
.sv-steps i{display:block;margin-top:16px;color:#1a5f96;font-size:26px;line-height:1}
.sv-steps b{display:block;margin-top:16px;font-size:16.5px;font-weight:600}
.sv-steps p{margin-top:8px;font-size:15px;color:#5f584f;line-height:1.7}

/* 기준 / 핵심 카드 */
.sv-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:0;padding:0}
.sv-cards.is-3{grid-template-columns:repeat(3,1fr)}
.sv-cards.is-4{grid-template-columns:repeat(4,1fr)}
.sv-cards li{padding:28px 22px;border-top:3px solid #1e4d6b;background:#fff;box-shadow:0 8px 20px rgba(28,25,21,.05)}
.sv-cards li:nth-child(2){border-top-color:#1a5f96}
.sv-cards li:nth-child(3){border-top-color:#3d7a62}
.sv-cards li:nth-child(4){border-top-color:#c4654a}
.sv-cards li:nth-child(5){border-top-color:#1e4d6b}
.sv-cards i{display:block;color:#1e4d6b;font-size:26px;line-height:1}
.sv-cards b{display:block;margin-top:20px;font-size:17px;font-weight:600;line-height:1.45}
.sv-cards p{margin-top:8px;font-size:15px;color:#5f584f;line-height:1.75}
.sv-cards li.is-danger{border-top-color:#c0504a}
.sv-cards li.is-danger i{color:#e06b62}
.sv-cards li.is-danger b{color:#e88a82}

/* 대상 카드 (큰 카드) */
.sv-targets{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0;padding:0}
.sv-targets>li{position:relative;overflow:hidden;padding:32px 28px 30px;background:#fff;border-top:3px solid #1e4d6b;box-shadow:0 10px 24px rgba(28,25,21,.05)}
.sv-targets>li:nth-child(2){border-top-color:#1a5f96}
.sv-targets>li:nth-child(3){border-top-color:#3d7a62}
.sv-targets .big{display:block;color:#1e4d6b;font-size:34px;line-height:1}
.sv-targets b{display:block;margin-top:22px;font-family:var(--f-serif);font-size:22px;font-weight:500}
.sv-targets ul{margin-top:14px;display:grid;gap:8px}
.sv-targets ul li{position:relative;padding-left:22px;font-size:15px;color:#5f584f;line-height:1.6}
.sv-targets ul li::before{content:"";position:absolute;left:2px;top:.75em;width:10px;height:1px;background:#1a5f96}

/* 체크 패널 (장비·방법) */
.sv-panel{display:grid;grid-template-columns:1.1fr 1fr;gap:0;overflow:hidden;background:#fff;border-top:3px solid #1e4d6b;box-shadow:0 12px 28px rgba(28,25,21,.06)}
.sv-panel-l{padding:46px 44px}
.sv-panel-l h4{margin-top:12px;font-family:var(--f-serif);font-size:26px;font-weight:400}
.sv-panel-l>p{margin-top:12px;color:#5f584f;font-size:15px}
.sv-checks{margin-top:26px;display:grid;gap:12px}
.sv-checks{gap:0}
.sv-checks li{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--gt-line)}
.sv-checks i{flex:none;margin-top:2px;color:#1a5f96;font-size:20px}
.sv-checks b{display:block;font-size:15.5px;font-weight:600}
.sv-checks span{display:block;margin-top:2px;font-size:15px;color:#5f584f}
.sv-panel-r{position:relative;display:grid;place-items:center;min-height:360px;background:#0b0b0b;border-left:1px solid var(--gt-line);overflow:hidden}
.sv-radar{position:relative;width:260px;height:260px;border-radius:50%;border:1px solid rgba(212,175,55,.35);background:repeating-radial-gradient(circle,transparent 0 42px,rgba(212,175,55,.18) 42px 43px)}
.sv-radar::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(212,175,55,.45),transparent 22%);animation:svSweep 3.2s linear infinite}
.sv-radar::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--gt-gold);box-shadow:0 0 18px var(--gt-gold)}
.sv-radar i{position:absolute;width:8px;height:8px;border-radius:50%;background:#ff6b5e;box-shadow:0 0 12px #ff6b5e;animation:svBlink 3.2s ease-in-out infinite}
.sv-radar i:nth-child(1){left:68%;top:30%}
.sv-radar i:nth-child(2){left:28%;top:62%;animation-delay:1.4s}
@keyframes svSweep{to{transform:rotate(360deg)}}
@keyframes svBlink{0%,70%,100%{opacity:.15}80%{opacity:1}}

/* 강조 띠 / 경고 */
.sv-banner{margin-top:24px;display:flex;align-items:center;justify-content:center;gap:14px;padding:24px 30px;background:#e7f1f8;text-align:center}
.sv-banner i{font-size:26px;color:#1a5f96}
.sv-banner p{font-family:var(--f-serif);font-size:clamp(17px,1.8vw,22px)}
.sv-banner p em{color:#1a5f96}
.sv-warn{margin-top:24px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:30px;padding:28px 34px;background:#f8ece8;border-left:3px solid #c4654a}
.sv-warn-tit{display:flex;align-items:center;gap:12px;font-family:var(--f-serif);font-size:24px;color:#a33b32;padding-right:30px;border-right:1px solid rgba(163,59,50,.18)}
.sv-warn-tit i{font-size:34px}
.sv-warn p{font-size:15px;color:#5c403c;line-height:1.8}
.sv-warn p b{color:#a33b32}
.sv-tip{margin-top:24px;display:flex;gap:16px;align-items:flex-start;padding:22px 26px;background:#eef6f1;border-left:3px solid #3d7a62}
.sv-tip i{flex:none;font-size:24px;color:#3d7a62}
.sv-tip b{display:block;font-size:15.5px}
.sv-tip p{margin-top:4px;font-size:15px;color:#3d5348;line-height:1.75}
.sv .gt-cta{margin-top:110px}

/* 반응형 */
@media (max-width:1100px){
  .sv-steps{grid-template-columns:repeat(3,1fr);row-gap:16px}
  .sv-steps li:nth-child(4)::before{display:none}
  .sv-cards{grid-template-columns:repeat(3,1fr)}
  .sv-areas li{grid-template-columns:80px 60px 1fr}
  .sv-areas .tags{grid-column:3;justify-content:flex-start;padding:0 24px 22px 6px;max-width:none;margin-top:-12px}
}
@media (max-width:900px){
  .sv-hero{padding:50px 32px}
  .sv-hero-icon{font-size:150px;right:20px;top:auto;bottom:-20px;transform:none}
  .sv-targets,.sv-cards.is-3{grid-template-columns:1fr}
  .sv-cards,.sv-cards.is-4{grid-template-columns:1fr 1fr}
  .sv-panel{grid-template-columns:1fr}
  .sv-panel-r{min-height:280px;border-left:0;border-top:1px solid var(--gt-line)}
  .sv-steps.is-4{grid-template-columns:1fr 1fr}
  .sv-steps.is-4 li:nth-child(3)::before{display:none}
  .sv-warn{grid-template-columns:1fr;gap:16px}
  .sv-warn-tit{padding-right:0;border-right:0}
}
@media (max-width:560px){
  .sv-hero{padding:40px 22px}
  .sv-hero p.sv-lead{font-size:15px}
  .sv-sec{margin-top:90px}
  .sv-areas li{grid-template-columns:64px 1fr}
  .sv-areas .ic{display:none}
  .sv-areas .no{font-size:24px;grid-row:span 2}
  .sv-areas .tx{padding:20px 18px 8px}
  .sv-areas .tags{grid-column:2;padding:0 18px 18px;margin-top:0}
  .sv-areas b{font-size:18px}
  .sv-steps,.sv-steps.is-4{grid-template-columns:1fr 1fr}
  .sv-steps li::before{display:none}
  .sv-cards,.sv-cards.is-4{grid-template-columns:1fr}
  .sv-panel-l{padding:32px 22px}
  .sv-radar{width:200px;height:200px}
  .sv-banner{flex-direction:column;gap:8px}
  .sv-warn{padding:24px 22px}
  .sv .gt-cta{margin-top:90px}
}
@media (prefers-reduced-motion:reduce){.sv-radar::before,.sv-radar i{animation:none}}

/* ---------- 사진 ---------- */
.sv-hero .sv-hero-bg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:.55}
.sv-hero.has-bg{background:#0c0c0c}
.sv-hero.has-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.92) 0%,rgba(10,10,10,.55) 60%,rgba(10,10,10,.2))}
.sv-hero.has-bg>*:not(.sv-hero-bg){z-index:1}
.sv-areas li.has-ph{grid-template-columns:90px 180px 1fr auto}
.sv-areas .ph{display:block;align-self:stretch;margin:14px 0;height:96px;overflow:hidden}
.sv-areas .ph img{width:100%;height:100%;max-width:none;object-fit:cover;filter:grayscale(.25);transition:filter .4s,transform 1s}
.sv-areas li:hover .ph img{filter:none;transform:scale(1.04)}
.sv-areas li.has-ph .tx{padding-left:28px}
.sv-targets .ph{display:block;margin:-32px -28px 24px;height:190px;overflow:hidden}
.sv-targets .ph img{width:100%;height:100%;max-width:none;object-fit:cover}
.sv-targets .ph+.big{margin-top:-58px;position:relative;width:52px;height:52px;display:grid;place-items:center;background:#fff;color:#1e4d6b;font-size:26px;box-shadow:0 6px 16px rgba(28,25,21,.12)}
.sv-cards .ph{display:block;margin:-28px -22px 22px;height:150px;overflow:hidden}
.sv-cards .ph img{width:100%;height:100%;max-width:none;object-fit:cover}
@media (max-width:1100px){
  .sv-areas li.has-ph{grid-template-columns:80px 140px 1fr}
  .sv-areas li.has-ph .tags{grid-column:3}
}
@media (max-width:560px){
  .sv-areas li.has-ph{grid-template-columns:64px 1fr}
  .sv-areas li.has-ph .ph{grid-column:2;margin:16px 18px 0;height:140px}
  .sv-areas li.has-ph .tx{padding-left:18px;grid-column:2}
  .sv-areas li.has-ph .tags{grid-column:2}
  .sv-areas li.has-ph .no{grid-row:span 3}
}