/* ============================================================
   IWANT 리뉴얼 섹션 스타일 (purewhite 테마용)
   메인페이지에 추가된 섹션(히어로/서비스/강점/프로세스)만 꾸밉니다.
   기존 purewhite 헤더/푸터/게시판은 건드리지 않습니다.
   ============================================================ */

:root{
  --iw-ink:#0a1220;
  --iw-navy:#0f1e33;
  --iw-signal:#0aa3d8;
  --iw-signal-deep:#0782b8;
  --iw-bright:#45c5f4;
  --iw-ice:#a9cfe4;
  --iw-ice-dim:#6d93ab;
  --iw-paper:#f4f7fc;
  --iw-line:rgba(10,163,216,.16);
  --iw-text:#3a4a63;
  --iw-text-dim:#69799a;
  --iw-head-dark:#16233c;
}

/* ── 히어로: 그라데이션 배경 (시안 B) ─────────────── */
#iwHero{position:relative; overflow:hidden; display:flex; align-items:center;
  min-height:520px;
  background:
    radial-gradient(720px 420px at 82% 8%, rgba(10,163,216,.28), transparent 62%),
    radial-gradient(560px 380px at 8% 96%, rgba(7,130,184,.20), transparent 60%),
    linear-gradient(160deg,#0c1729 0%,#0a1220 55%,#0e2038 100%); }
#iwHero:before{content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:linear-gradient(rgba(169,207,228,.06) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(169,207,228,.06) 1px, transparent 1px);
  background-size:56px 56px; }
.iwHeroLogo{position:absolute; right:5%; bottom:calc(clamp(240px,32vw,440px) * -0.28);
  width:clamp(240px,32vw,440px); opacity:.9; pointer-events:none;
  filter:drop-shadow(0 0 60px rgba(10,163,216,.35)); }
.iwHeroLogo img{width:100%; height:auto; display:block; }
#iwHero .iwHeroIn{position:relative; z-index:4; width:100%; max-width:1200px;
  margin:0 auto; padding:80px 20px 70px; box-sizing:border-box; }
.iwChips{display:flex; flex-wrap:wrap; gap:8px; margin-top:34px; }
.iwChips span{font-size:13px; color:var(--iw-ice); background:rgba(10,163,216,.14);
  border:1px solid rgba(10,163,216,.3); padding:6px 13px; border-radius:999px; }
.iwEyebrow{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700;
  letter-spacing:.16em; color:var(--iw-ice); border:1px solid rgba(169,207,228,.35);
  padding:6px 14px; border-radius:999px; margin-bottom:24px; }
.iwEyebrow:before{content:""; width:6px; height:6px; border-radius:50%; background:var(--iw-signal); }
#iwHero h2.iwHeroTitle{margin:0 0 18px; color:#fff; font-size:clamp(30px,4.6vw,52px);
  line-height:1.22; font-weight:800; letter-spacing:-.035em; }
#iwHero h2.iwHeroTitle em{font-style:normal; color:var(--iw-bright); }
#iwHero .iwHeroTxt{margin:0 0 34px; color:var(--iw-ice); font-size:clamp(15px,1.6vw,18px); line-height:1.7; }
.iwCtaRow{display:flex; flex-wrap:wrap; gap:12px; }
.iwBtn{display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:16px;
  padding:14px 26px; border-radius:8px; text-decoration:none; }
.iwBtn i{font-size:17px; }
.iwBtnPri{background:var(--iw-signal); color:#fff !important; box-shadow:0 6px 22px rgba(10,163,216,.4); }
.iwBtnPri:hover, .iwBtnPri:focus{background:var(--iw-signal-deep); color:#fff; }
.iwBtnSec{color:#fff !important; border:1px solid rgba(255,255,255,.4); }
.iwBtnSec:hover, .iwBtnSec:focus{border-color:#fff; color:#fff; }

/* ── 공통 섹션 레이아웃 ───────────────────────────── */
.iwSec{padding:76px 20px; }
.iwSec .iwWrap{max-width:1200px; margin:0 auto; }
.iwLabel{font-size:13px; font-weight:700; letter-spacing:.18em; color:var(--iw-signal); margin:0 0 10px; }
.iwH{margin:0 0 12px; font-size:clamp(24px,3vw,32px); font-weight:800; letter-spacing:-.03em; color:var(--iw-head-dark); }
.iwP{margin:0; color:var(--iw-text-dim); font-size:16px; }

/* ── 서비스 카드 ─────────────────────────────────── */
.iwSvc{background:var(--iw-paper); }
.iwSvcGrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin-top:38px; }
.iwSvcCard{background:#fff; border:1px solid var(--iw-line); border-radius:12px; padding:28px 24px;
  transition:transform .18s ease, box-shadow .18s ease; }
.iwSvcCard:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(22,49,91,.12); }
.iwSvcCard .iwIc{width:46px; height:46px; border-radius:10px;
  background:linear-gradient(140deg,#0aa3d8,#0782b8); display:flex; align-items:center; justify-content:center;
  margin-bottom:16px; color:#fff; font-size:20px; }
.iwSvcCard h3{margin:0 0 8px; font-size:17px; font-weight:700; color:var(--iw-head-dark); letter-spacing:-.02em; }
.iwSvcCard p{margin:0; font-size:14px; color:var(--iw-text-dim); line-height:1.6; }

/* ── 숫자 강점 ───────────────────────────────────── */
.iwStats{background:var(--iw-ink); padding:60px 20px; }
.iwStatGrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:26px;
  text-align:center; max-width:1200px; margin:0 auto; }
.iwStat b{display:block; font-size:clamp(34px,4vw,46px); font-weight:800; letter-spacing:-.03em;
  color:var(--iw-bright); font-variant-numeric:tabular-nums; line-height:1.2; }
.iwStat b small{font-size:.55em; font-weight:700; margin-left:2px; }
.iwStat span{font-size:14px; color:var(--iw-ice-dim); }

/* ── 프로세스 + CTA ──────────────────────────────── */
.iwProc{background:#fff; }
.iwProcGrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px;
  margin-top:38px; counter-reset:iwstep; }
.iwStep{border:1px solid var(--iw-line); border-radius:12px; padding:26px 22px;
  counter-increment:iwstep; background:var(--iw-paper); }
.iwStep:before{content:"0" counter(iwstep); font-size:13px; font-weight:800; letter-spacing:.1em; color:var(--iw-signal); }
.iwStep h3{margin:8px 0 6px; font-size:16px; font-weight:700; color:var(--iw-head-dark); }
.iwStep p{margin:0; font-size:14px; color:var(--iw-text-dim); line-height:1.6; }
.iwProcCta{margin-top:42px; background:linear-gradient(120deg,#0f1e33,#173257); border-radius:14px;
  padding:36px 34px; display:flex; flex-wrap:wrap; align-items:center; gap:20px; }
.iwProcCta .iwTxt{flex:1; min-width:220px; }
.iwProcCta h3{margin:0 0 6px; color:#fff; font-size:20px; font-weight:800; letter-spacing:-.02em; }
.iwProcCta p{margin:0; color:var(--iw-ice); font-size:15px; }
.iwProcCta .iwTel{font-size:clamp(22px,3vw,30px); font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums; display:flex; align-items:center; gap:10px; text-decoration:none; }
.iwProcCta .iwTel i{color:var(--iw-bright); }
.iwProcCta .iwTel:hover{color:var(--iw-bright); }

/* ── 반응형 ─────────────────────────────────────── */
@media (max-width:768px){
  #iwHero{min-height:440px; }
  #iwHero .iwHeroIn{padding:60px 20px 50px; }
  .iwHeroLogo{width:170px; right:4%; bottom:-48px; opacity:.5; }
  .iwSec{padding:56px 16px; }
  .iwProcCta{padding:28px 22px; }
}
@media (prefers-reduced-motion: reduce){
  .iwSvcCard{transition:none; }
}