/* 2026-10-09 creatorinfo (그록 봇): /creator-info 'Creator Info' 영어 페이지 전용 (cd_creator.py, templates_company/creator_info.html) */
.ci{display:block;width:100%;background:#f6f7fb;color:#1d2230;font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;line-height:1.75}
.ci *{box-sizing:border-box}
.ci a{color:#0a4ae3;text-decoration:none}
.ci a:hover{text-decoration:underline}
.ci-wrap{max-width:1080px;margin:0 auto;padding:0 28px}
/* hero */
.ci-hero{position:relative;overflow:hidden;background:#07090f;color:#e9ecf5;padding:72px 0 64px}
.ci-hero__bg{position:absolute;inset:0;pointer-events:none}
.ci-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.ci-orb--a{width:420px;height:420px;left:-120px;top:-160px;background:radial-gradient(circle,#2f6bff 0,transparent 70%)}
.ci-orb--b{width:380px;height:380px;right:-100px;bottom:-200px;background:radial-gradient(circle,#8b5cf6 0,transparent 70%)}
.ci-ring{position:absolute;right:8%;top:50%;width:260px;height:260px;margin-top:-130px;border-radius:50%;border:1px dashed rgba(255,255,255,.16);animation:ci-spin 40s linear infinite}
.ci-ring:after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#7aa2ff;box-shadow:0 0 14px #7aa2ff}
@keyframes ci-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ci-ring{animation:none}}
.ci-hero .ci-wrap{position:relative}
.ci-crumb{font-size:13px;color:#8a93ab;margin:0 0 22px;display:flex;gap:8px;flex-wrap:wrap}
.ci-crumb a{color:#aab6d6}
.ci-eyebrow{display:inline-block;margin:0 0 14px;padding:5px 14px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9db8ff;background:rgba(10,74,227,.14)}
.ci-title{margin:0 0 18px;padding:0;border:0;color:#fff;font-family:inherit;font-size:clamp(32px,5vw,54px);font-weight:800;line-height:1.15;letter-spacing:-.035em}
.ci-title em{font-style:normal;background:linear-gradient(90deg,#6f9bff,#b18cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.ci-lead{max-width:720px;margin:0 0 26px;font-size:17px;line-height:1.75;color:#c3c9da}
.ci-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ci-chips li{padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:13px;color:#dfe5f5}
/* toc */
.ci-toc{position:sticky;top:var(--co-hdr,65px);z-index:5;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(8px);-webkit-backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid #e6e9f0}
.ci-toc__in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-top:10px;padding-bottom:10px}
.ci-toc__in::-webkit-scrollbar{display:none}
.ci-toc a{flex:0 0 auto;padding:7px 14px;border-radius:999px;font-size:13.5px;font-weight:600;color:#4a5165;white-space:nowrap}
.ci-toc a:hover{background:#eef2ff;color:#0a4ae3;text-decoration:none}
/* sections */
.ci-body{padding-top:48px;padding-bottom:72px}
.ci-sec{background:#fff;border:1px solid #e8ebf2;border-radius:22px;padding:40px 44px;margin:0 0 28px;scroll-margin-top:140px;box-shadow:0 1px 2px rgba(16,24,40,.03)}
.ci-num{margin:0 0 4px;font-size:13px;font-weight:800;letter-spacing:.14em;color:#8b5cf6}
.ci h2{margin:0 0 16px;padding:0;border:0;font-family:inherit;font-size:clamp(24px,3vw,32px);font-weight:800;line-height:1.3;letter-spacing:-.03em;color:#111522}
.ci h3{margin:0 0 8px;padding:0;border:0;font-family:inherit;font-size:18px;font-weight:700;line-height:1.4;color:#151a28}
.ci p{margin:0 0 14px;font-size:16px;color:#3a4152}
.ci p:last-child{margin-bottom:0}
.ci strong{color:#151a28}
.ci-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:26px}
.ci-card{border:1px solid #e8ebf2;border-radius:18px;padding:24px 22px;background:linear-gradient(180deg,#fff,#fafbff);transition:transform .2s,box-shadow .2s}
.ci-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px -12px rgba(30,60,160,.25)}
.ci-card__ico{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:#eef2ff;font-size:22px;margin-bottom:14px}
.ci-card p{font-size:14.5px;line-height:1.7}
.ci-sec--accent{background:linear-gradient(135deg,#0b1020 0,#141a35 100%);border-color:#141a35;color:#d6dbea}
.ci-sec--accent h2,.ci-sec--accent h3,.ci-sec--accent strong{color:#fff}
.ci-sec--accent p,.ci-sec--accent li{color:#c3c9da}
.ci-sec--accent .ci-num{color:#b18cff}
.ci-flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:22px 0 26px}
.ci-flow span{padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:14px;font-weight:600;color:#fff}
.ci-flow b{color:#7aa2ff;font-weight:700}
.ci-list{margin:0 0 18px;padding:0 0 0 20px}
.ci-list li{margin:0 0 10px;font-size:15.5px;line-height:1.7}
.ci-cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:24px 0 18px}
.ci-cat{border:1px solid #e8ebf2;border-radius:16px;padding:20px 22px;background:#fbfcff}
.ci-cat h3 a{color:#111522}
.ci-cat h3 a:hover{color:#0a4ae3}
.ci-cat p{font-size:14.5px;line-height:1.7}
.ci-sub{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px!important}
.ci-sub a{font-size:12.5px;padding:4px 10px;border-radius:999px;background:#eef2ff;color:#2b4fd8}
.ci-note{font-size:15px}
.ci-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}
.ci-pr{padding:20px;border-radius:16px;border-left:4px solid #6f9bff;background:#f7f9ff}
.ci-pr:nth-child(2n){border-left-color:#b18cff;background:#faf7ff}
.ci-pr p{font-size:14.5px;line-height:1.7}
.ci-steps{list-style:none;counter-reset:ci;margin:22px 0 0;padding:0}
.ci-steps li{counter-increment:ci;position:relative;padding:0 0 22px 58px}
.ci-steps li:before{content:counter(ci);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;background:#0a4ae3;color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}
.ci-steps li:after{content:"";position:absolute;left:18px;top:42px;bottom:4px;width:2px;background:#e1e6f5}
.ci-steps li:last-child{padding-bottom:0}
.ci-steps li:last-child:after{display:none}
.ci-faq{margin-top:18px}
.ci-qa{border:1px solid #e8ebf2;border-radius:14px;margin:0 0 10px;background:#fbfcff}
.ci-qa summary{cursor:pointer;list-style:none;padding:16px 48px 16px 20px;position:relative}
.ci-qa summary::-webkit-details-marker{display:none}
.ci-qa summary:after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:22px;color:#8b93a7}
.ci-qa[open] summary:after{content:"−"}
.ci-qa summary h3{display:inline;margin:0;font-size:16px}
.ci-qa p{padding:0 20px 18px;font-size:15px}
.ci-contact{text-align:center;background:linear-gradient(135deg,#eef2ff,#f6efff)}
.ci-btn{display:inline-block;margin-top:18px;padding:12px 26px;border-radius:999px;background:#0a4ae3;color:#fff!important;font-weight:700;font-size:15px}
.ci-btn:hover{background:#083bb8;text-decoration:none!important}
@media (max-width:960px){.ci-grid,.ci-principles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .ci-wrap{padding:0 18px}
  .ci-hero{padding:48px 0 44px}
  .ci-ring{display:none}
  .ci-lead{font-size:15.5px}
  .ci-body{padding-top:28px;padding-bottom:48px}
  .ci-sec{padding:26px 20px;border-radius:18px;margin-bottom:18px}
  .ci p{font-size:15px}
  .ci-grid,.ci-principles,.ci-cats{grid-template-columns:1fr}
  .ci-steps li{padding-left:50px}
  .ci-flow span{font-size:13px;padding:6px 10px}
}
/* ci2 2026-10-09: hero 문단 색 (.ci p 보다 우선) */
.ci-hero p.ci-lead{color:#c3c9da}
.ci-hero p.ci-eyebrow{color:#9db8ff}
.ci-hero .ci-crumb span{color:#8a93ab}
