/* =========================================================
   CareerScope Partners — shared stylesheet
   Every rule is scoped under .cs-partners so it will not
   leak into the rest of the site. Mobile-first fixes live
   in the media queries at the bottom of each block.
   ========================================================= */

.cs-partners {
  --cs-ink: #0B1A3A;
  --cs-ink-2: #22304D;
  --cs-text: #3A4A66;
  --cs-muted: #5B6A85;
  --cs-line: #DCE4F8;
  --cs-line-2: #E4EAF6;
  --cs-soft: #F6F9FF;
  --cs-soft-2: #F3F7FF;
  --cs-blue-900: #102A9E;
  --cs-blue-800: #1838C8;
  --cs-blue-600: #2350F5;
  --cs-blue-500: #2F5BFF;
  --cs-blue-soft: #EAF0FF;
  --cs-cyan: #19A3E0;
  --cs-cyan-ink: #075985;
  --cs-cyan-soft: #E0F6FF;
  --cs-violet: #5B4CF0;
  --cs-violet-ink: #4A3BD6;
  --cs-violet-soft: #ECE9FF;
  --cs-warn-ink: #9A3F00;
  --cs-warn-soft: #FFF1E6;
  --cs-grad-end: var(--cs-violet);
  --cs-radius: 20px;
  --cs-shadow: 0 22px 54px rgba(24, 56, 200, 0.14);
  --cs-font: 'IBM Plex Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --cs-font-num: 'Space Grotesk', 'IBM Plex Sans KR', sans-serif;

  font-family: var(--cs-font);
  color: var(--cs-ink);
  background: #FFFFFF;
  line-height: 1.6;
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}
.cs-partners.cs-theme-career { --cs-grad-end: var(--cs-cyan); }

.cs-partners *, .cs-partners *::before, .cs-partners *::after { box-sizing: border-box; }
.cs-partners h1, .cs-partners h2, .cs-partners h3, .cs-partners h4,
.cs-partners p, .cs-partners ul, .cs-partners figure { margin: 0; }
.cs-partners ul { padding: 0; list-style: none; }
.cs-partners img, .cs-partners svg { display: block; max-width: 100%; }
.cs-partners a { color: var(--cs-blue-800); }
.cs-partners button { font-family: inherit; }
.cs-num { font-family: var(--cs-font-num); }
.cs-nowrap { white-space: nowrap; }
.cs-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- layout ---------- */
.cs-wrap { width: 100%; max-width: 1248px; margin: 0 auto; padding: 0 24px; }
.cs-sec { padding: 96px 0; }
.cs-sec--top-sm { padding-top: 48px; }
.cs-sec--bottom-sm { padding-bottom: 40px; }
.cs-sec--flush { padding: 24px 0; }
.cs-sec--tint { background: linear-gradient(180deg, var(--cs-soft-2) 0%, #F8FAFF 100%); border-top: 1px solid var(--cs-line-2); border-bottom: 1px solid var(--cs-line-2); }
.cs-sec--fade { background: linear-gradient(180deg, #FFFFFF 0%, var(--cs-soft) 100%); border-top: 1px solid var(--cs-line-2); }
.cs-sec--plans {
  background:
    radial-gradient(circle at 12% 0%, rgba(25,182,245,0.18) 0%, rgba(25,182,245,0) 40%),
    radial-gradient(circle at 90% 30%, rgba(91,76,240,0.14) 0%, rgba(91,76,240,0) 42%),
    linear-gradient(180deg, #EEF3FF 0%, #F7F9FF 60%, #FFFFFF 100%);
  border-top: 1px solid var(--cs-line);
  padding: 104px 0 96px;
}

.cs-grid { display: grid; gap: 16px; }
.cs-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cs-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cs-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cs-gap-lg { gap: 20px; }
.cs-mt-40 { margin-top: 40px; }
.cs-mt-24 { margin-top: 24px; }
.cs-mt-16 { margin-top: 16px; }

/* ---------- type ---------- */
.cs-h2 { font-size: 38px; line-height: 1.3; letter-spacing: -0.02em; font-weight: 700; }
.cs-h2--lg { font-size: 44px; line-height: 1.25; letter-spacing: -0.03em; }
.cs-h2--sm { font-size: 28px; line-height: 1.35; }
.cs-grad {
  background: linear-gradient(110deg, var(--cs-blue-800) 0%, var(--cs-blue-500) 48%, var(--cs-grad-end) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cs-lead { margin-top: 16px; font-size: 18px; color: var(--cs-text); max-width: 800px; }
.cs-lead--strong { margin-top: 10px; color: var(--cs-ink); font-weight: 600; }
.cs-lead--sm { margin-top: 10px; font-size: 16px; }
.cs-note { margin-top: 14px; font-size: 14px; color: var(--cs-muted); }

/* ---------- chips & buttons ---------- */
.cs-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; padding: 4px 11px; border-radius: 999px; background: #F0F2F6; color: #4A5878; white-space: nowrap; }
.cs-chip--blue { background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-chip--cyan { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }
.cs-chip--violet { background: var(--cs-violet-soft); color: var(--cs-violet-ink); }
.cs-chip--glass { background: rgba(255,255,255,0.18); color: #FFFFFF; }
.cs-chip--white { background: #FFFFFF; color: var(--cs-blue-800); font-weight: 700; }
.cs-chip--solid { background: var(--cs-blue-600); color: #FFFFFF; }
.cs-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.cs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 14px 26px; border-radius: 12px; border: 0;
  font-size: 17px; font-weight: 600; text-decoration: none; cursor: pointer;
  color: #FFFFFF !important;
  background: linear-gradient(120deg, var(--cs-blue-600) 0%, var(--cs-violet) 100%);
  box-shadow: 0 10px 30px rgba(35, 80, 245, 0.25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.cs-btn:hover { transform: translateY(-1px); box-shadow: 0 14px 34px rgba(35, 80, 245, 0.32); }
.cs-btn--line {
  min-height: 44px; padding: 10px 18px; font-size: 15px; border-radius: 10px;
  background: #FFFFFF; color: var(--cs-blue-800) !important; border: 1px solid #C9D5F2; box-shadow: none;
}
.cs-btn--line:hover { background: var(--cs-soft-2); box-shadow: none; }
.cs-btn:focus-visible, .cs-tab:focus-visible, .cs-rtab:focus-visible { outline: 3px solid rgba(47,91,255,0.45); outline-offset: 2px; }

/* ---------- cards ---------- */
.cs-card { background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: var(--cs-radius); padding: 28px; }
.cs-card--soft { background: var(--cs-soft); }
.cs-card--grad {
  color: #FFFFFF; border: 0;
  background: radial-gradient(circle at 100% 0%, rgba(25,182,245,0.48) 0%, rgba(25,182,245,0) 55%),
              linear-gradient(140deg, var(--cs-blue-800) 0%, var(--cs-blue-500) 55%, var(--cs-grad-end) 100%);
  box-shadow: 0 20px 50px rgba(35, 80, 245, 0.25);
}
.cs-card__kicker { font-family: var(--cs-font-num); font-size: 13px; font-weight: 700; color: var(--cs-muted); }
.cs-card--grad .cs-card__kicker { color: #DCE6FF; }
.cs-card h3 { font-size: 21px; line-height: 1.4; margin-top: 12px; }
.cs-card p { margin-top: 8px; font-size: 15.5px; color: var(--cs-text); line-height: 1.65; }
.cs-card--grad p { color: #E6ECFF; }
.cs-icon { width: 46px; height: 46px; border-radius: 13px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.cs-icon--blue { background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-icon--cyan { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }
.cs-icon--violet { background: var(--cs-violet-soft); color: var(--cs-violet-ink); }
.cs-icon--glass { background: rgba(255,255,255,0.2); color: #FFFFFF; }
.cs-icon svg { width: 22px; height: 22px; }

/* ---------- header ---------- */
/* Sticky GNB. If the site already has a fixed bar above this one,
   set --cs-sticky-top to its height, e.g. .cs-partners { --cs-sticky-top: 64px; } */
.cs-header { position: -webkit-sticky; position: sticky; top: var(--cs-sticky-top, 0px); z-index: 40; background: rgba(255,255,255,0.95); border-bottom: 1px solid var(--cs-line-2); backdrop-filter: blur(8px); }
.cs-header__in { display: flex; flex-wrap: wrap; align-items: center; gap: 0 40px; }
.cs-brand { display: flex; align-items: center; gap: 14px; min-height: 68px; text-decoration: none; }
.cs-brand img { height: 24px; width: auto; }
.cs-brand__sep { width: 1px; height: 20px; background: #C9D2E3; }
.cs-brand__label { font-family: var(--cs-font-num); font-size: 17px; font-weight: 600; color: var(--cs-blue-600); }
.cs-tabs { display: flex; align-self: stretch; gap: 28px; }
.cs-tab {
  display: flex; align-items: center; min-height: 68px; padding-top: 3px;
  border-bottom: 3px solid transparent; font-size: 16px; font-weight: 500;
  color: var(--cs-muted) !important; text-decoration: none; white-space: nowrap;
}
.cs-tab:hover { color: var(--cs-ink) !important; }
.cs-tab.is-active { color: var(--cs-ink) !important; font-weight: 700; border-bottom-color: var(--cs-blue-600); }

/* ---------- hero ---------- */
.cs-hero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(circle at 88% 12%, rgba(47,91,255,0.25) 0%, rgba(47,91,255,0) 42%),
    radial-gradient(circle at 70% 86%, rgba(91,76,240,0.16) 0%, rgba(91,76,240,0) 40%),
    radial-gradient(circle at 4% 70%, rgba(25,182,245,0.18) 0%, rgba(25,182,245,0) 38%),
    linear-gradient(180deg, #FFFFFF 0%, var(--cs-soft-2) 100%);
}
.cs-dots { position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(35,80,245,0.16) 1px, transparent 1.2px); background-size: 22px 22px; opacity: .6; }
.cs-hero__in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 590px); gap: 48px; align-items: center; min-height: 600px; padding-top: 80px; padding-bottom: 96px; }
.cs-theme-career .cs-hero__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.cs-hero h1 { font-size: 46px; line-height: 1.22; letter-spacing: -0.03em; font-weight: 700; }
.cs-hero__pre { display: block; font-size: 30px; line-height: 1.35; color: var(--cs-ink-2); }
.cs-hero__main { display: block; margin-top: 10px; font-size: 58px; line-height: 1.15; }
.cs-hero__hook { margin-top: 26px; font-size: 21px; line-height: 1.6; font-weight: 600; }
.cs-hero__desc { margin-top: 16px; font-size: 17px; line-height: 1.75; color: var(--cs-text); }
.cs-hero__desc--lg { margin-top: 24px; font-size: 19px; }
.cs-pill { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 22px; padding: 6px 14px; border-radius: 999px; background: #FFFFFF; border: 1px solid #D6E0FA; font-size: 13px; font-weight: 600; color: var(--cs-blue-800); }
.cs-pill::before { content: ""; width: 7px; height: 7px; border-radius: 99px; background: var(--cs-blue-600); }
.cs-hero__visual { position: relative; width: 100%; justify-self: end; }
.cs-hero__visual--ai { max-width: 590px; }
.cs-hero__visual--career { max-width: 540px; }
.cs-glow { position: absolute; inset: -20px; border-radius: 30px; filter: blur(30px); pointer-events: none; background: linear-gradient(135deg, rgba(47,91,255,0.3), rgba(25,182,245,0.24), rgba(91,76,240,0.26)); }

/* exam mock (AI hero) */
.cs-exam { position: relative; background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 18px; box-shadow: 0 28px 70px rgba(24,56,200,0.18); overflow: hidden; }
.cs-exam__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #E8EDF7; background: #FAFBFF; }
.cs-exam__title { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; min-width: 0; }
.cs-dots3 { display: flex; gap: 5px; }
.cs-dots3 span { width: 9px; height: 9px; border-radius: 99px; background: #D5DCEA; }
.cs-exam__meta { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.cs-timer { display: inline-flex; align-items: center; gap: 5px; font-family: var(--cs-font-num); font-size: 13px; font-weight: 700; color: var(--cs-blue-800); background: var(--cs-blue-soft); padding: 4px 10px; border-radius: 8px; }
.cs-timer svg { width: 14px; height: 14px; }
.cs-submit { font-size: 12px; font-weight: 700; color: #FFFFFF; background: linear-gradient(120deg, var(--cs-blue-600), var(--cs-violet)); padding: 5px 12px; border-radius: 8px; }
.cs-exam__body { display: grid; grid-template-columns: 0.9fr 1.4fr 1.2fr; }
.cs-exam__topic { padding: 16px; border-right: 1px solid #E8EDF7; background: #FAFBFF; }
.cs-exam__topic small { display: block; font-size: 11px; font-weight: 700; color: var(--cs-muted); letter-spacing: .04em; }
.cs-exam__topic strong { display: block; margin-top: 8px; font-size: 14px; line-height: 1.5; }
.cs-exam__topic p { margin-top: 8px; font-size: 12px; line-height: 1.6; color: var(--cs-text); }
.cs-exam__rules { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; font-size: 11px; color: var(--cs-text); }
.cs-exam__rules span { background: #FFFFFF; border: 1px solid #E3E9F6; border-radius: 6px; padding: 5px 8px; }
.cs-exam__editor { padding: 16px; display: flex; flex-direction: column; min-width: 0; }
.cs-toolbar { display: flex; gap: 4px; padding-bottom: 10px; border-bottom: 1px solid #EDF1F8; }
.cs-toolbar span { width: 22px; height: 22px; border-radius: 5px; background: #F0F3F9; font-size: 12px; font-weight: 700; color: var(--cs-text); display: flex; align-items: center; justify-content: center; }
.cs-exam__editor h4 { margin-top: 12px; font-size: 13px; }
.cs-exam__answer { margin-top: 6px; font-size: 12.5px; line-height: 1.75; color: var(--cs-ink-2); }
.cs-caret { display: inline-block; width: 2px; height: 14px; background: var(--cs-blue-600); vertical-align: -2px; margin-left: 1px; }
.cs-exam__count { margin-top: auto; padding-top: 10px; text-align: right; font-family: var(--cs-font-num); font-size: 11px; color: var(--cs-muted); }
.cs-exam__chat { border-left: 1px solid #E8EDF7; display: flex; flex-direction: column; background: linear-gradient(180deg, var(--cs-soft) 0%, #FFFFFF 100%); min-width: 0; }
.cs-exam__chathead { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid #E8EDF7; font-size: 13px; font-weight: 700; }
.cs-ai-dot { width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg, var(--cs-blue-600), var(--cs-violet)); display: flex; align-items: center; justify-content: center; }
.cs-ai-dot svg { width: 12px; height: 12px; }
.cs-bubbles { padding: 12px; display: flex; flex-direction: column; gap: 8px; font-size: 12px; line-height: 1.55; }
.cs-bubble { max-width: 90%; padding: 8px 10px; }
.cs-bubble--me { align-self: flex-end; background: var(--cs-blue-600); color: #FFFFFF; border-radius: 12px 12px 3px 12px; }
.cs-bubble--ai { align-self: flex-start; background: #EEF2F9; color: var(--cs-ink-2); border-radius: 12px 12px 12px 3px; }
.cs-chatinput { margin: auto 12px 12px; display: flex; justify-content: space-between; align-items: center; padding: 8px 10px; border: 1px solid var(--cs-line); border-radius: 10px; background: #FFFFFF; font-size: 12px; color: #7C8DB0; }
.cs-chatinput svg { width: 14px; height: 14px; }
.cs-analyzing { position: absolute; right: 20px; bottom: -18px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; background: var(--cs-ink); color: #FFFFFF; font-size: 13px; font-weight: 600; box-shadow: 0 12px 30px rgba(11,26,58,0.3); }
.cs-analyzing::before { content: ""; width: 8px; height: 8px; border-radius: 99px; background: #19B6F5; }

/* career hero visual */
.cs-cv { position: relative; display: flex; flex-direction: column; gap: 8px; }
.cs-cv__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cs-mini { background: rgba(255,255,255,0.95); border: 1px solid var(--cs-line); border-radius: 18px; padding: 14px; box-shadow: 0 14px 34px rgba(24,56,200,0.1); display: flex; flex-direction: column; }
.cs-mini__head { display: flex; justify-content: space-between; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; }
.cs-mini__head .cs-chip { font-size: 11px; padding: 2px 8px; font-weight: 700; }
.cs-radar { margin-top: 2px; width: 100%; height: auto; max-height: 128px; overflow: visible; }
.cs-vbars { display: flex; flex-direction: column; justify-content: center; gap: 7px; flex: 1 1 auto; margin-top: 10px; }
.cs-vbar { display: grid; grid-template-columns: 74px minmax(0, 1fr) 22px; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--cs-ink-2); }
.cs-vbar.is-top { color: var(--cs-cyan-ink); font-weight: 700; }
.cs-vbar b { text-align: right; font-family: var(--cs-font-num); color: var(--cs-cyan-ink); }
.cs-track { height: 10px; border-radius: 99px; background: #EDF1F8; overflow: hidden; }
.cs-track i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--cs-cyan), var(--cs-blue-500)); }
.cs-track i.is-dim { opacity: .55; }
.cs-down { display: flex; justify-content: center; align-items: center; height: 28px; color: var(--cs-blue-500); }
.cs-down svg { width: 26px; height: 26px; }
.cs-dream { position: relative; overflow: hidden; display: flex; align-items: center; gap: 18px; padding: 18px 22px; border-radius: 22px; color: #FFFFFF; background: radial-gradient(circle at 100% 0%, rgba(25,182,245,0.6) 0%, rgba(25,182,245,0) 55%), linear-gradient(130deg, var(--cs-blue-800) 0%, var(--cs-blue-500) 60%, #3B8BF0 100%); box-shadow: 0 26px 60px rgba(24,56,200,0.28); }
.cs-dream__text { flex: 1 1 auto; min-width: 0; }
.cs-dream__quote { margin-top: 8px; font-size: 19px; font-weight: 700; line-height: 1.42; letter-spacing: -0.01em; }
.cs-dream .cs-chips { margin-top: 10px; }
.cs-dream .cs-chip { font-size: 12px; padding: 3px 10px; }
.cs-dream__art { flex: 0 0 auto; width: 64px; height: auto; }

/* ---------- AI: companies panel ---------- */
.cs-panel-grad { position: relative; overflow: hidden; border-radius: 28px; padding: 56px 48px; color: #FFFFFF; background: radial-gradient(circle at 0% 0%, rgba(25,182,245,0.5) 0%, rgba(25,182,245,0) 40%), radial-gradient(circle at 100% 100%, rgba(140,120,255,0.55) 0%, rgba(140,120,255,0) 45%), linear-gradient(135deg, #0B1F7A 0%, var(--cs-blue-800) 50%, #3B2FC0 100%); box-shadow: 0 30px 80px rgba(24,56,200,0.25); }
.cs-panel-grad .cs-dots { opacity: .3; }
.cs-companies { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 40px; align-items: center; }
.cs-bignum { display: flex; align-items: flex-end; gap: 10px; }
.cs-bignum b { font-family: var(--cs-font-num); font-size: 96px; line-height: .9; letter-spacing: -0.04em; }
.cs-bignum span { font-size: 26px; font-weight: 700; padding-bottom: 6px; }
.cs-companies h2 { margin-top: 20px; font-size: 34px; line-height: 1.32; letter-spacing: -0.02em; }
.cs-companies p { margin-top: 14px; font-size: 17px; line-height: 1.7; color: #DCE6FF; }
.cs-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.cs-tile { border-radius: 16px; padding: 18px 18px 16px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.22); min-width: 0; }
.cs-tile strong { display: block; font-size: 18px; letter-spacing: -0.03em; line-height: 1.3; }
.cs-tile span { display: block; margin-top: 6px; font-size: 13px; color: #DCE6FF; line-height: 1.45; }

/* ---------- AI: VS compare ---------- */
.cs-vs { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.3fr); gap: 20px; align-items: stretch; margin-top: 40px; }
.cs-vs__card { border-radius: var(--cs-radius); padding: 32px; }
.cs-vs__card--plain { background: #F5F6F9; border: 1px solid #E3E6EC; color: #4A5878; }
.cs-vs__list { margin-top: 20px; display: flex; flex-direction: column; gap: 14px; font-size: 16px; }
.cs-vs__list li { display: flex; gap: 10px; align-items: flex-start; }
.cs-vs__list svg { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 3px; }
.cs-vs__card--grad .cs-vs__list { font-size: 17px; font-weight: 500; }
.cs-vs__badge { align-self: center; width: 72px; height: 72px; border-radius: 999px; padding: 3px; background: linear-gradient(140deg, var(--cs-blue-500), #19B6F5 50%, var(--cs-violet)); box-shadow: 0 12px 30px rgba(35,80,245,0.25); }
.cs-vs__badge span { width: 100%; height: 100%; border-radius: 999px; background: #FFFFFF; display: flex; align-items: center; justify-content: center; font-family: var(--cs-font-num); font-size: 24px; font-weight: 700; color: var(--cs-blue-800); }

/* ---------- AI: process ---------- */
.cs-panel-soft { border-radius: 28px; padding: 56px 48px; border: 1px solid var(--cs-line); background: radial-gradient(circle at 0% 0%, rgba(25,182,245,0.14) 0%, rgba(25,182,245,0) 40%), radial-gradient(circle at 100% 100%, rgba(91,76,240,0.14) 0%, rgba(91,76,240,0) 45%), var(--cs-soft); }
.cs-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.cs-split--dash { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 56px; }
.cs-criteria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.cs-criteria div { background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 14px; padding: 16px 18px; }
.cs-criteria b { display: block; font-size: 16px; }
.cs-criteria span { display: block; margin-top: 2px; font-size: 14px; color: var(--cs-text); }
.cs-chatlog { background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 22px; box-shadow: 0 24px 60px rgba(24,56,200,0.12); overflow: hidden; }
.cs-chatlog__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 20px; border-bottom: 1px solid #EDF1F8; background: #FAFBFF; font-size: 14px; font-weight: 600; color: var(--cs-text); }
.cs-chatlog__head em { font-style: normal; color: #7C8DB0; font-weight: 500; }
.cs-chatlog__tag { font-family: var(--cs-font-num); font-size: 12px; font-weight: 700; color: #FFFFFF; background: linear-gradient(120deg, var(--cs-blue-600), var(--cs-violet)); padding: 3px 10px; border-radius: 999px; }
.cs-chatlog__body { padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.cs-turn { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.cs-turn--ai { align-items: flex-start; }
.cs-turn .cs-bubble { max-width: 84%; padding: 12px 14px; font-size: 14px; line-height: 1.55; }
.cs-turn .cs-bubble--me { border-radius: 16px 16px 4px 16px; }
.cs-turn .cs-bubble--ai { background: #F0F3F9; border-radius: 16px 16px 16px 4px; }
.cs-turn .cs-chip { font-size: 12px; padding: 3px 10px; }

/* ---------- AI: evolve ---------- */
.cs-stage__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cs-stage__dot { width: 10px; height: 10px; border-radius: 99px; background: #9AA8C4; }
.cs-stage__dot--blue { background: var(--cs-blue-500); }
.cs-stage__kicker--blue { color: var(--cs-blue-500) !important; }
.cs-live { display: inline-flex; align-items: center; gap: 6px; font-family: var(--cs-font-num); font-size: 11px; font-weight: 700; background: #FFFFFF; color: var(--cs-blue-800); padding: 3px 9px; border-radius: 999px; }
.cs-live::before { content: ""; width: 7px; height: 7px; border-radius: 99px; background: #19B6F5; }
.cs-stage .cs-chips { margin-top: 14px; }
.cs-row-card { display: flex; gap: 16px; align-items: flex-start; border-radius: 18px; padding: 24px; background: var(--cs-soft); border: 1px solid var(--cs-line); }
.cs-row-card .cs-icon { width: 44px; height: 44px; border-radius: 12px; background: #FFFFFF; border: 1px solid var(--cs-line); color: var(--cs-blue-800); }
.cs-row-card b { display: block; font-size: 18px; }
.cs-row-card p { margin-top: 4px; font-size: 15px; color: var(--cs-text); line-height: 1.6; }

/* ---------- AI: why ---------- */
.cs-why { border-radius: 18px; padding: 30px; border: 1px solid var(--cs-line); }
.cs-why--1 { background: linear-gradient(160deg, var(--cs-soft-2) 0%, #FFFFFF 70%); }
.cs-why--2 { background: linear-gradient(160deg, #EFFAFF 0%, #FFFFFF 70%); border-color: #D6EDF8; }
.cs-why--3 { background: linear-gradient(160deg, #F2F0FF 0%, #FFFFFF 70%); border-color: #E0DCFA; }
.cs-why .cs-card__kicker { font-size: 15px; }
.cs-why--1 .cs-card__kicker { color: var(--cs-blue-500); }
.cs-why--2 .cs-card__kicker { color: var(--cs-cyan-ink); }
.cs-why--3 .cs-card__kicker { color: var(--cs-violet-ink); }
.cs-why p { font-size: 16px; }

/* ---------- results cards ---------- */
.cs-result { display: flex; flex-direction: column; align-items: flex-start; padding: 26px 28px; }
.cs-result h3 { font-size: 20px; }
.cs-bullets { margin-top: 10px; padding-left: 20px !important; list-style: disc !important; font-size: 15px; line-height: 1.85; color: var(--cs-text); }
.cs-result .cs-btn { margin-top: 20px; }

/* ---------- dialogs (previews) ---------- */
.cs-modal { width: min(100% - 32px, 480px); max-height: calc(100% - 48px); padding: 0; border: 0; background: transparent; overflow: visible; }
.cs-modal--wide { width: min(100% - 32px, 780px); }
.cs-modal::backdrop { background: rgba(11,26,58,0.6); }
.cs-modal__bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; color: #FFFFFF; font-size: 14px; font-weight: 600; }
.cs-modal__close { width: 44px; height: 44px; flex: 0 0 auto; border-radius: 999px; border: 0; background: #FFFFFF; color: var(--cs-ink); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cs-modal__close svg { width: 18px; height: 18px; }
.cs-modal__scroll { max-height: calc(100vh - 140px); overflow-y: auto; border-radius: 20px; }
.cs-sheet { background: #FFFFFF; border-radius: 20px; overflow: hidden; }
.cs-sheet__head { padding: 22px 24px; color: #FFFFFF; background: radial-gradient(circle at 100% 0%, rgba(25,182,245,0.5) 0%, rgba(25,182,245,0) 55%), linear-gradient(130deg, var(--cs-blue-800), var(--cs-blue-500) 60%, var(--cs-violet)); }
.cs-sheet__head small { display: block; font-size: 13px; color: #DCE6FF; }
.cs-sheet__head strong { display: block; margin-top: 4px; font-size: 20px; }
.cs-score { display: flex; align-items: flex-end; gap: 16px; margin-top: 18px; }
.cs-score b { font-family: var(--cs-font-num); font-size: 52px; line-height: 1; }
.cs-score div { padding-bottom: 6px; font-size: 15px; font-weight: 600; }
.cs-score small { font-size: 13px; color: #DCE6FF; font-weight: 400; }
.cs-sheet__body { padding: 22px 24px; }
.cs-sheet__label { font-size: 14px; font-weight: 700; color: var(--cs-text); }
.cs-bars { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; }
.cs-bar__top { display: flex; justify-content: space-between; font-size: 14px; font-weight: 600; }
.cs-bar__top b { font-family: var(--cs-font-num); color: var(--cs-blue-800); }
.cs-bar.is-low .cs-bar__top b { color: var(--cs-warn-ink); }
.cs-bar .cs-track { margin-top: 5px; }
.cs-bar .cs-track i { background: linear-gradient(90deg, var(--cs-blue-500), var(--cs-violet)); }
.cs-bar.is-low .cs-track i { background: #F29A55; }
.cs-bars--sm .cs-bar__top { font-size: 13px; font-weight: 400; }
.cs-bars--sm .cs-track { height: 8px; margin-top: 4px; }
.cs-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.cs-duo div { border-radius: 12px; padding: 12px 14px; font-size: 14px; font-weight: 600; }
.cs-duo small { display: block; font-size: 12px; font-weight: 700; }
.cs-duo .is-good { background: var(--cs-blue-soft); }
.cs-duo .is-good small { color: var(--cs-blue-800); }
.cs-duo .is-weak { background: var(--cs-warn-soft); }
.cs-duo .is-weak small { color: var(--cs-warn-ink); }
.cs-comment { margin-top: 14px; border: 1px solid var(--cs-line); border-radius: 12px; padding: 14px; font-size: 14px; line-height: 1.6; color: var(--cs-text); }
.cs-comment small { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 700; color: var(--cs-violet-ink); }
.cs-dash__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-bottom: 1px solid #EDF1F8; background: #FAFBFF; font-size: 14px; font-weight: 600; color: var(--cs-text); }
.cs-dash__bar > div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cs-dash__body { padding: 22px; }
.cs-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cs-kpi { border: 1px solid var(--cs-line); border-radius: 14px; padding: 14px 16px; }
.cs-kpi small { display: block; font-size: 13px; color: var(--cs-muted); }
.cs-kpi b { font-family: var(--cs-font-num); font-size: 30px; font-weight: 700; }
.cs-kpi b span { font-family: var(--cs-font); font-size: 15px; font-weight: 500; color: var(--cs-muted); }
.cs-kpi.is-warn b { color: var(--cs-warn-ink); }
.cs-dash__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; margin-top: 16px; }
.cs-box { border: 1px solid var(--cs-line); border-radius: 14px; padding: 16px; min-width: 0; }
.cs-box h5 { margin: 0; font-size: 14px; font-weight: 700; }
.cs-cols { display: flex; align-items: flex-end; gap: 10px; height: 150px; margin-top: 14px; border-bottom: 1px solid var(--cs-line); }
.cs-col { flex: 1 1 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; font-family: var(--cs-font-num); font-size: 12px; font-weight: 700; color: var(--cs-ink-2); }
.cs-col i { width: 100%; max-width: 34px; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, #5B7BFF, var(--cs-blue-800)); }
.cs-col-labels { display: flex; gap: 10px; margin-top: 6px; }
.cs-col-labels span { flex: 1 1 0; text-align: center; font-size: 12px; color: var(--cs-muted); }
.cs-alert { margin-top: 16px; display: flex; gap: 12px; align-items: flex-start; border-radius: 14px; padding: 14px 16px; font-size: 14px; line-height: 1.6; color: var(--cs-text); background: #FFF6EE; border: 1px solid #FBDCC2; }
.cs-alert svg { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 2px; color: var(--cs-warn-ink); }
.cs-alert b { color: var(--cs-warn-ink); }
.cs-alert--info { background: var(--cs-soft-2); border-color: var(--cs-line); }
.cs-alert--info svg, .cs-alert--info b { color: var(--cs-blue-800); }
.cs-hbars { display: flex; flex-direction: column; gap: 9px; margin-top: 14px; }
.cs-hbar { display: grid; grid-template-columns: 76px minmax(0, 1fr) 36px; align-items: center; gap: 10px; font-size: 13px; }
.cs-hbar b { text-align: right; font-family: var(--cs-font-num); }
.cs-hbar .cs-track i { background: linear-gradient(90deg, var(--cs-blue-500), var(--cs-cyan)); }
.cs-hbar.is-warn .cs-track i { background: #F29A55; }
.cs-rank { margin-top: 10px; }
.cs-rank li { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #EDF1F8; font-size: 14px; }
.cs-rank li > span b { font-family: var(--cs-font-num); color: var(--cs-blue-500); margin-right: 8px; }
.cs-rank li > b { font-family: var(--cs-font-num); }
.cs-rank li > b small { font-family: var(--cs-font); font-weight: 500; color: var(--cs-muted); font-size: 12px; }

/* ---------- plans ---------- */
.cs-plan { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px; padding: 38px 32px 32px; border: 1px solid #D3DEF8; border-radius: 22px; background: #FFFFFF; box-shadow: var(--cs-shadow); }
.cs-plan::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: linear-gradient(90deg, #19B6F5, var(--cs-blue-500)); }
.cs-plan--2::before { background: linear-gradient(90deg, var(--cs-blue-500), var(--cs-violet)); }
.cs-plan--3::before { background: linear-gradient(90deg, var(--cs-violet), #19B6F5); }
.cs-plan .cs-icon { width: 48px; height: 48px; border-radius: 12px; }
.cs-plan .cs-icon svg { width: 24px; height: 24px; }
.cs-plan h3 { font-size: 28px; line-height: 1.3; letter-spacing: -0.02em; }
.cs-plan__tag { font-size: 16px; font-weight: 600; color: var(--cs-blue-800); }
.cs-plan__for { font-size: 15px; color: var(--cs-muted); }
.cs-plan__desc { font-size: 15px; color: var(--cs-text); line-height: 1.65; padding-bottom: 18px; border-bottom: 1px solid var(--cs-line-2); }
.cs-plan .cs-bullets { margin-top: 4px; font-size: 16px; line-height: 1.9; color: var(--cs-ink); }
.cs-checks { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.cs-checks li { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; }
.cs-checks li::before { content: ""; flex: 0 0 18px; height: 18px; margin-top: 3px; background: no-repeat center/18px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232350F5' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E"); }
.cs-plan__foot { margin-top: auto; font-size: 14px; color: var(--cs-text); background: var(--cs-soft-2); border-radius: 12px; padding: 14px 16px; }

.cs-lectures { margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--cs-line-2); }
.cs-lectures__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 16px; }
.cs-lectures__head h3 { font-size: 22px; }
.cs-lectures__head h3 small { font-size: 15px; font-weight: 500; color: var(--cs-muted); }
.cs-lectures__head > span { font-size: 15px; color: var(--cs-muted); }
.cs-lecture-list { margin-top: 18px; background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 16px; overflow: hidden; }
.cs-lecture { display: grid; grid-template-columns: 32px minmax(0, 1fr) minmax(0, 1.2fr) 76px; align-items: center; gap: 6px 16px; padding: 16px 20px; border-bottom: 1px solid #EDF1F8; font-size: 15px; }
.cs-lecture:last-child { border-bottom: 0; }
.cs-lecture > b { font-family: var(--cs-font-num); color: var(--cs-blue-500); }
.cs-lecture > strong { font-weight: 600; }
.cs-lecture > span { color: var(--cs-text); }
.cs-lecture .cs-chip { justify-self: end; font-size: 12px; padding: 3px 9px; }

/* ---------- closing & contact ---------- */
.cs-closing { position: relative; overflow: hidden; border-radius: 28px; padding: 72px 48px; text-align: center; color: #FFFFFF; background: radial-gradient(circle at 15% 0%, rgba(25,182,245,0.55) 0%, rgba(25,182,245,0) 45%), radial-gradient(circle at 90% 100%, rgba(140,120,255,0.5) 0%, rgba(140,120,255,0) 45%), linear-gradient(135deg, var(--cs-blue-900) 0%, var(--cs-blue-600) 55%, var(--cs-violet-ink) 100%); }
.cs-theme-career .cs-closing { background: radial-gradient(circle at 15% 0%, rgba(25,182,245,0.55) 0%, rgba(25,182,245,0) 45%), radial-gradient(circle at 90% 100%, rgba(120,170,255,0.5) 0%, rgba(120,170,255,0) 45%), linear-gradient(135deg, var(--cs-blue-900) 0%, var(--cs-blue-600) 60%, #2F7BE8 100%); }
.cs-closing .cs-dots { opacity: .35; }
.cs-closing__in { position: relative; max-width: 860px; margin: 0 auto; }
.cs-closing h2 { font-size: 46px; line-height: 1.28; letter-spacing: -0.03em; }
.cs-closing p { margin: 22px auto 0; max-width: 680px; font-size: 19px; line-height: 1.7; color: #E6ECFF; }
.cs-contact { display: flex; flex-wrap: wrap; gap: 32px 40px; align-items: center; justify-content: space-between; padding: 48px; border-radius: 24px; border: 1px solid var(--cs-line); background: radial-gradient(circle at 100% 100%, rgba(47,91,255,0.14) 0%, rgba(47,91,255,0) 50%), var(--cs-soft); }
.cs-contact__copy { flex: 999 1 460px; min-width: 0; }
.cs-contact h2 { font-size: 40px; line-height: 1.3; letter-spacing: -0.02em; }
.cs-contact p { margin-top: 16px; font-size: 17px; color: var(--cs-text); }
.cs-contact__cta { flex: 1 1 260px; display: flex; flex-direction: column; }
.cs-footer { border-top: 1px solid var(--cs-line-2); padding: 28px 0; font-size: 14px; color: var(--cs-muted); }

/* ---------- career: steps ---------- */
.cs-steps { display: flex; align-items: stretch; gap: 10px; margin-top: 40px; }
.cs-step { flex: 1 1 0; min-width: 0; border-radius: 20px; padding: 28px 24px; background: #FFFFFF; border: 1px solid var(--cs-line); }
.cs-step--first { color: #FFFFFF; border: 0; background: linear-gradient(140deg, var(--cs-blue-800) 0%, var(--cs-blue-500) 60%, #3B8BF0 100%); box-shadow: 0 18px 44px rgba(35,80,245,0.22); }
.cs-step__top { display: flex; justify-content: space-between; align-items: center; }
.cs-step .cs-icon { width: 48px; height: 48px; border-radius: 14px; }
.cs-step .cs-icon svg { width: 24px; height: 24px; }
.cs-step small { display: block; margin-top: 18px; font-family: var(--cs-font-num); font-size: 13px; font-weight: 700; color: var(--cs-muted); }
.cs-step--first small { color: #DCE6FF; }
.cs-step strong { display: block; margin-top: 2px; font-size: 21px; }
.cs-step p { margin-top: 4px; font-size: 15px; color: var(--cs-text); }
.cs-step--first p { color: #E6ECFF; }
.cs-step-arrow { flex: 0 0 auto; align-self: center; width: 36px; height: 36px; border-radius: 999px; background: #FFFFFF; border: 1px solid var(--cs-line); box-shadow: 0 6px 16px rgba(24,56,200,0.12); display: flex; align-items: center; justify-content: center; color: var(--cs-blue-500); }
.cs-step-arrow svg { width: 18px; height: 18px; }

/* ---------- career: test ---------- */
.cs-stat { background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 16px; padding: 18px 20px; }
.cs-stat small { display: block; font-size: 13px; font-weight: 600; color: var(--cs-muted); }
.cs-stat b { font-size: 24px; }
.cs-theory { border-radius: 22px; padding: 32px; }
.cs-theory__label { font-size: 13px; font-weight: 700; color: var(--cs-blue-800); }
.cs-theory__label--cyan { color: var(--cs-cyan-ink); }
.cs-theory h3 { margin-top: 6px; font-size: 25px; letter-spacing: -0.02em; }
.cs-theory > p { margin-top: 8px; font-size: 16px; color: var(--cs-text); }
.cs-types { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 20px; }
.cs-type { background: var(--cs-soft-2); border-radius: 14px; padding: 13px 14px; min-width: 0; }
.cs-type b { display: flex; align-items: center; gap: 7px; font-size: 15px; color: var(--cs-blue-800); }
.cs-type b i { font-style: normal; width: 22px; height: 22px; border-radius: 6px; background: var(--cs-blue-600); color: #FFFFFF; font-family: var(--cs-font-num); font-size: 12px; display: flex; align-items: center; justify-content: center; }
.cs-type span { display: block; margin-top: 5px; font-size: 13px; line-height: 1.45; color: var(--cs-ink-2); }
.cs-values { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.cs-values span { padding: 9px 14px; border-radius: 999px; background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); font-weight: 700; font-size: 14px; }
.cs-why-box { margin-top: 18px; border-radius: 14px; padding: 15px 18px; font-size: 14.5px; line-height: 1.65; color: var(--cs-ink-2); background: var(--cs-soft); border: 1px solid var(--cs-line); }
.cs-why-box b { display: block; margin-bottom: 3px; font-size: 14px; color: var(--cs-blue-800); }
.cs-why-box--cyan { background: #F2FBFF; border-color: #D3EDF8; }
.cs-why-box--cyan b { color: var(--cs-cyan-ink); }
.cs-info { display: flex; gap: 8px; align-items: flex-start; margin-top: 18px; font-size: 14px; color: var(--cs-muted); }
.cs-info svg { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; }

/* ---------- career: explore ---------- */
.cs-explore { max-width: 920px; }
.cs-exc { position: relative; overflow: hidden; text-align: center; padding: 32px; border-radius: 22px; background: #FFFFFF; border: 1px solid var(--cs-line); box-shadow: 0 16px 40px rgba(24,56,200,0.08); }
.cs-exc::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, var(--cs-blue-500), var(--cs-cyan)); }
.cs-exc--b::before { background: linear-gradient(90deg, var(--cs-violet), var(--cs-blue-500)); }
.cs-exc__label { font-size: 15px; font-weight: 700; color: var(--cs-blue-800); }
.cs-exc--b .cs-exc__label { color: var(--cs-violet-ink); }
.cs-exc .cs-chips { justify-content: center; gap: 8px; margin-top: 18px; }
.cs-exc .cs-chip { font-size: 14.5px; font-weight: 700; padding: 8px 14px; }
.cs-exc--b .cs-chip { border: 1px dashed #8B7EF5; }
.cs-exc__arrow { display: flex; justify-content: center; margin: 14px 0; color: #9AA8C4; }
.cs-exc__arrow svg { width: 22px; height: 22px; }
.cs-exc p { font-size: 16px; color: var(--cs-text); line-height: 1.6; }
.cs-exc p b { font-size: 20px; color: var(--cs-ink); }

/* ---------- career: dream cards ---------- */
.cs-dcard { display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; background: #FFFFFF; border: 1px solid var(--cs-line); box-shadow: 0 18px 44px rgba(24,56,200,0.12); }
.cs-dcard__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; color: #FFFFFF; background: radial-gradient(circle at 100% 0%, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0) 50%), linear-gradient(135deg, var(--cs-blue-800) 0%, var(--cs-blue-500) 60%, #3B8BF0 100%); }
.cs-dcard--violet .cs-dcard__head { background: radial-gradient(circle at 100% 0%, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0) 50%), linear-gradient(135deg, #3B2FC0 0%, var(--cs-violet) 60%, #7C6CF5 100%); }
.cs-dcard--teal .cs-dcard__head { background: radial-gradient(circle at 100% 0%, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0) 50%), linear-gradient(135deg, #0B6E8F 0%, #1690B8 55%, #19B6C8 100%); }
.cs-dcard__head .cs-chip { font-weight: 700; background: rgba(255,255,255,0.2); color: #FFFFFF; }
.cs-dcard__art { width: 60px; height: auto; flex: 0 0 auto; }
.cs-dcard__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 14px; padding: 22px 24px 24px; }
.cs-dcard__quote { font-size: 20px; font-weight: 700; line-height: 1.45; letter-spacing: -0.01em; }
.cs-dres { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.cs-dres__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.cs-dres__row > small { flex: 0 0 92px; font-size: 12px; font-weight: 700; color: var(--cs-blue-800); }
.cs-dres__row > small.is-cyan { color: var(--cs-cyan-ink); }
.cs-score-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 8px; background: var(--cs-soft-2); }
.cs-score-chip.is-cyan { background: #EAF8FF; }
.cs-score-chip i { font-style: normal; width: 20px; height: 20px; border-radius: 6px; margin-left: -5px; background: var(--cs-blue-600); color: #FFFFFF; font-family: var(--cs-font-num); font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.cs-score-chip b { font-weight: 600; }
.cs-score-chip em { font-style: normal; font-family: var(--cs-font-num); font-weight: 700; color: var(--cs-blue-800); }
.cs-score-chip.is-cyan em { color: var(--cs-cyan-ink); }
.cs-dcard__subs { margin-top: auto; padding-top: 14px; border-top: 1px solid #EDF1F8; }
.cs-dcard__subs small { display: block; font-size: 12px; font-weight: 700; color: var(--cs-muted); }
.cs-dcard__subs .cs-chips { margin-top: 8px; }
.cs-subj { font-size: 13px; font-weight: 600; padding: 4px 10px; border-radius: 8px; background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-subj--cyan { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }

/* ---------- career: report viewer ---------- */
.cs-viewer { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; align-items: start; margin-top: 40px; }
.cs-rtabs { display: flex; flex-direction: column; gap: 4px; }
.cs-rtabs__part { padding: 14px 14px 4px; font-size: 12px; font-weight: 700; color: var(--cs-muted); }
.cs-rtabs__part:first-child { padding-top: 0; }
.cs-rtab { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 12px 14px; border: 0; border-radius: 12px; background: transparent; color: var(--cs-text); font-size: 15px; font-weight: 600; text-align: left; cursor: pointer; }
.cs-rtab i { font-style: normal; flex: 0 0 24px; height: 24px; border-radius: 8px; background: #EDF1F8; color: var(--cs-muted); font-family: var(--cs-font-num); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.cs-rtab:hover { background: var(--cs-soft-2); }
.cs-rtab[aria-selected="true"] { background: linear-gradient(120deg, var(--cs-blue-800), var(--cs-blue-500)); color: #FFFFFF; box-shadow: 0 10px 24px rgba(35,80,245,0.25); }
.cs-rtab[aria-selected="true"] i { background: #FFFFFF; color: var(--cs-blue-800); }
.cs-paper { background: #FFFFFF; border: 1px solid var(--cs-line); border-radius: 22px; box-shadow: 0 24px 60px rgba(24,56,200,0.12); overflow: hidden; min-width: 0; }
.cs-paper__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 16px 24px; background: var(--cs-soft); border-bottom: 1px solid var(--cs-line-2); }
.cs-paper__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--cs-muted); }
.cs-paper__meta b { color: var(--cs-ink); }
.cs-panel { padding: 28px 28px 32px; min-height: 460px; }
.cs-panel + .cs-panel { border-top: 1px solid var(--cs-line-2); }
.cs-js .cs-panel + .cs-panel { border-top: 0; }
.cs-js .cs-panel[hidden] { display: none; }
.cs-panel__step { font-family: var(--cs-font-num); font-size: 13px; font-weight: 700; color: var(--cs-blue-500); }
.cs-panel h3 { margin-top: 2px; font-size: 22px; }
.cs-panel__desc { margin: 6px 0 20px; font-size: 14.5px; color: var(--cs-muted); }
.cs-top { border: 1px solid var(--cs-line); border-radius: 16px; padding: 18px; min-width: 0; }
.cs-top--first { background: linear-gradient(180deg, var(--cs-soft-2) 0%, #FFFFFF 60%); }
.cs-top small { font-family: var(--cs-font-num); font-size: 12px; font-weight: 700; color: var(--cs-blue-500); }
.cs-top h4 { margin: 4px 0 8px; font-size: 17px; }
.cs-top p { font-size: 13.5px; color: var(--cs-text); line-height: 1.6; }
.cs-top h5 { margin: 12px 0 6px; font-size: 12px; }
.cs-top .cs-chips { gap: 5px; }
.cs-tag { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 6px; background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-tag--cyan { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }
.cs-kv { border: 1px solid var(--cs-line); border-top: 4px solid var(--cs-blue-500); border-radius: 16px; padding: 18px; }
.cs-kv--cyan { border-top-color: var(--cs-cyan); }
.cs-kv small { font-size: 12px; font-weight: 700; color: var(--cs-blue-500); }
.cs-kv--cyan small { color: var(--cs-cyan-ink); }
.cs-kv h4 { margin: 4px 0 6px; font-size: 17px; }
.cs-kv dl { margin: 0; font-size: 13.5px; line-height: 1.55; }
.cs-kv dl div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--cs-line); }
.cs-kv dl div:last-child { border-bottom: 0; }
.cs-kv dt { color: var(--cs-muted); font-weight: 600; }
.cs-kv dd { margin: 0; }
.cs-likes { border-radius: 14px; padding: 16px; font-size: 14px; background: var(--cs-blue-soft); }
.cs-likes b { display: block; margin-bottom: 4px; color: var(--cs-blue-800); }
.cs-likes--no { background: #F3F5F9; }
.cs-likes--no b { color: #4A5878; }
.cs-radar-lg { width: 100%; max-height: 230px; }
.cs-vlist { display: flex; flex-direction: column; gap: 9px; }
.cs-vlist .cs-vbar { grid-template-columns: 72px minmax(0, 1fr) 26px; font-size: 13px; font-weight: 400; color: var(--cs-ink); }
.cs-vlist .cs-track { height: 9px; }
.cs-vlist .is-more { opacity: .5; }
.cs-quote-main { border-radius: 16px; padding: 20px 22px; color: #FFFFFF; margin-bottom: 10px; background: radial-gradient(circle at 100% 0%, rgba(25,182,245,0.5) 0%, rgba(25,182,245,0) 55%), linear-gradient(130deg, var(--cs-blue-800), var(--cs-blue-500) 65%, #3B8BF0); }
.cs-quote-main small { font-size: 12px; font-weight: 700; color: #DCE6FF; }
.cs-quote-main strong { display: block; margin-top: 6px; font-size: 17px; line-height: 1.5; }
.cs-quote-main p { margin-top: 8px; font-size: 13.5px; color: #E6ECFF; }
.cs-quote { border-left: 4px solid var(--cs-blue-500); background: var(--cs-soft-2); border-radius: 0 14px 14px 0; padding: 16px 20px; margin-bottom: 10px; }
.cs-quote--cyan { border-left-color: var(--cs-cyan); background: #F2FBFF; }
.cs-quote small { font-size: 12px; font-weight: 700; color: var(--cs-muted); }
.cs-quote strong { display: block; margin-top: 4px; font-size: 16px; line-height: 1.5; }
.cs-road { display: flex; flex-direction: column; gap: 10px; }
.cs-road li { display: flex; gap: 12px; align-items: flex-start; }
.cs-road li > b { flex: 0 0 auto; margin-top: 2px; padding: 4px 10px; border-radius: 8px; background: var(--cs-ink); color: #FFFFFF; font-size: 12px; }
.cs-road .cs-chips span { padding: 5px 10px; border-radius: 8px; font-size: 13px; font-weight: 600; background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-road .is-common span { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }
.cs-tip { margin-top: 8px; border-radius: 12px; padding: 13px 15px; font-size: 13.5px; line-height: 1.6; background: var(--cs-soft-2); }
.cs-tip:first-of-type { margin-top: 16px; }
.cs-tip b { color: var(--cs-blue-800); }
.cs-tip--cyan { background: #F2FBFF; }
.cs-tip--cyan b { color: var(--cs-cyan-ink); }
.cs-formula { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.cs-formula span { flex: 1 1 120px; text-align: center; padding: 12px; border-radius: 12px; color: #FFFFFF; font-weight: 700; font-size: 14px; background: var(--cs-blue-800); }
.cs-formula span:nth-child(2) { background: var(--cs-blue-500); }
.cs-formula span:nth-child(3) { background: #2F7BE8; }
.cs-qrow { display: flex; gap: 12px; padding: 14px 16px; border-radius: 12px; background: var(--cs-soft); margin-bottom: 8px; font-size: 14px; }
.cs-qrow > b { flex: 0 0 auto; height: fit-content; margin-top: 2px; padding: 3px 8px; border-radius: 6px; font-size: 11px; background: var(--cs-blue-soft); color: var(--cs-blue-800); white-space: nowrap; }
.cs-qrow > b.is-cyan { background: var(--cs-cyan-soft); color: var(--cs-cyan-ink); }
.cs-qrow > b.is-violet { background: var(--cs-violet-soft); color: var(--cs-violet-ink); }
.cs-qrow small { display: block; margin-top: 3px; font-size: 12.5px; color: var(--cs-muted); }
.cs-qrow--more { font-size: 13.5px; color: var(--cs-muted); }

/* ---------- career: use + dashboard ---------- */
.cs-use { display: flex; flex-direction: column; gap: 8px; padding: 26px; }
.cs-use h3 { margin-top: 6px; font-size: 19px; }
.cs-use p { margin-top: 0; font-size: 14.5px; }
.cs-use .cs-chip { align-self: flex-start; margin-top: 6px; border-radius: 8px; font-size: 12px; font-weight: 700; background: var(--cs-soft-2); color: var(--cs-ink-2); }
.cs-feats { display: flex; flex-direction: column; gap: 18px; margin-top: 30px; }
.cs-feat { display: flex; gap: 14px; }
.cs-feat .cs-icon { width: 44px; height: 44px; border-radius: 12px; }
.cs-feat .cs-icon svg { width: 20px; height: 20px; }
.cs-feat b { display: block; font-size: 17px; }
.cs-feat p { font-size: 15px; color: var(--cs-text); }
.cs-adm { border-radius: 24px; padding: 16px; background: radial-gradient(circle at 100% 0%, rgba(25,182,245,0.5) 0%, rgba(25,182,245,0) 50%), linear-gradient(135deg, var(--cs-blue-900) 0%, var(--cs-blue-600) 60%, #2F7BE8 100%); box-shadow: 0 30px 70px rgba(24,56,200,0.25); }
.cs-adm__in { background: #FFFFFF; border-radius: 14px; padding: 20px; }
.cs-adm__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 16px; }
.cs-adm__top b { font-size: 16px; }
.cs-adm__top span { font-size: 12px; border: 1px solid var(--cs-line); border-radius: 8px; padding: 5px 10px; color: var(--cs-muted); }
.cs-adm__kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.cs-adm__kpis div { background: var(--cs-soft); border-radius: 12px; padding: 12px; }
.cs-adm__kpis small { display: block; font-size: 12px; color: var(--cs-muted); }
.cs-adm__kpis b { font-family: var(--cs-font-num); font-size: 22px; }
.cs-adm__kpis .is-done b { color: var(--cs-blue-800); }
.cs-adm__table { border: 1px solid var(--cs-line); border-radius: 12px; overflow: hidden; }
.cs-adm__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; padding: 10px 16px; border-top: 1px solid #EDF1F8; font-size: 13.5px; }
.cs-adm__row:first-child { border-top: 0; background: var(--cs-soft); font-size: 12px; font-weight: 700; color: var(--cs-muted); }
.cs-adm__row > :last-child { justify-self: end; }
.cs-st { justify-self: start; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 6px; background: var(--cs-blue-soft); color: var(--cs-blue-800); }
.cs-st.is-wait { background: #F0F2F6; color: var(--cs-muted); }
.cs-rb { font-size: 12px; font-weight: 700; padding: 6px 11px; border-radius: 8px; background: var(--cs-blue-600); color: #FFFFFF; }
.cs-rb.is-off { background: transparent; color: #9AA8C4; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1080px) {
  .cs-hero__in, .cs-theme-career .cs-hero__in { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 40px; padding-top: 64px; padding-bottom: 72px; }
  .cs-hero__visual { justify-self: center; }
  .cs-companies { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .cs-split, .cs-split--dash { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .cs-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-grid--3.cs-grid--stack-md { grid-template-columns: minmax(0, 1fr); }
  .cs-viewer { grid-template-columns: minmax(0, 1fr); }
  .cs-rtabs { flex-direction: row; overflow-x: auto; gap: 6px; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .cs-rtabs::-webkit-scrollbar { display: none; }
  .cs-rtabs__part { display: none; }
  .cs-rtab { width: auto; flex: 0 0 auto; white-space: nowrap; background: #FFFFFF; border: 1px solid var(--cs-line); }
  .cs-rtab[aria-selected="true"] { border-color: transparent; }
}

@media (max-width: 860px) {
  .cs-sec { padding: 72px 0; }
  .cs-sec--top-sm { padding-top: 40px; }
  .cs-sec--bottom-sm { padding-bottom: 32px; }
  .cs-sec--plans { padding: 72px 0; }
  .cs-h2 { font-size: 30px; }
  .cs-h2--lg { font-size: 32px; }
  .cs-h2--sm { font-size: 24px; }
  .cs-lead { font-size: 16.5px; }
  .cs-grid--2, .cs-grid--3 { grid-template-columns: minmax(0, 1fr); }
  .cs-vs { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .cs-vs__badge { justify-self: center; width: 60px; height: 60px; }
  .cs-vs__badge span { font-size: 20px; }
  .cs-steps { flex-direction: column; }
  .cs-step-arrow { transform: rotate(90deg); }
  .cs-panel-grad, .cs-panel-soft { padding: 40px 28px; border-radius: 24px; }
  .cs-closing { padding: 56px 28px; border-radius: 24px; }
  .cs-closing h2 { font-size: 32px; }
  .cs-closing p { font-size: 17px; }
  .cs-contact { padding: 36px 28px; }
  .cs-contact h2 { font-size: 30px; }
  .cs-lecture { grid-template-columns: 28px minmax(0, 1fr) 72px; }
  .cs-lecture > span { grid-column: 2 / -1; grid-row: 2; font-size: 14px; }
  .cs-dash__grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
  .cs-wrap { padding: 0 16px; }
  .cs-header__in { gap: 0; }
  .cs-brand { min-height: 56px; gap: 10px; }
  .cs-brand img { height: 20px; }
  .cs-brand__label { font-size: 15px; }
  .cs-tabs { width: 100%; gap: 20px; overflow-x: auto; scrollbar-width: none; border-top: 1px solid var(--cs-line-2); }
  .cs-tabs::-webkit-scrollbar { display: none; }
  .cs-tab { min-height: 48px; font-size: 15px; }
  .cs-hero__in, .cs-theme-career .cs-hero__in { padding-top: 44px; padding-bottom: 56px; gap: 32px; }
  .cs-hero h1 { font-size: 30px; }
  .cs-nowrap { white-space: normal; }
  .cs-hero__pre { font-size: 20px; }
  .cs-hero__main { font-size: 40px; }
  .cs-hero__hook { margin-top: 20px; font-size: 18px; }
  .cs-hero__hook br, .cs-hero__desc br { display: none; }
  .cs-hero__desc { font-size: 16px; }
  .cs-hero__desc--lg { font-size: 16.5px; }
  .cs-pill { font-size: 12px; margin-bottom: 16px; }
  /* exam mock: drop the editor column, stack topic + chat */
  .cs-exam__body { grid-template-columns: minmax(0, 1fr); }
  .cs-exam__editor { display: none; }
  .cs-exam__topic { border-right: 0; border-bottom: 1px solid #E8EDF7; }
  .cs-exam__chat { border-left: 0; }
  .cs-exam__title > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cs-analyzing { position: static; margin: 14px auto 0; display: flex; width: fit-content; }
  .cs-cv__row { grid-template-columns: minmax(0, 1fr); }
  .cs-radar { max-height: 180px; }
  .cs-dream { padding: 18px; }
  .cs-dream__quote { font-size: 17px; }
  .cs-bignum b { font-size: 72px; }
  .cs-companies h2 { font-size: 26px; }
  .cs-companies p { font-size: 15.5px; }
  .cs-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .cs-tile { padding: 14px; }
  .cs-tile strong { font-size: 15.5px; }
  .cs-tile span { font-size: 12px; }
  .cs-panel-grad, .cs-panel-soft { padding: 32px 20px; }
  .cs-criteria { grid-template-columns: minmax(0, 1fr); }
  .cs-vs__card, .cs-theory, .cs-card, .cs-why { padding: 24px; }
  .cs-grid--4 { grid-template-columns: minmax(0, 1fr); }
  .cs-grid--stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-stat b { font-size: 20px; }
  .cs-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-plan { padding: 32px 24px 26px; }
  .cs-plan h3 { font-size: 24px; }
  .cs-panel { padding: 22px 18px 26px; min-height: 0; }
  .cs-paper__head { padding: 14px 18px; }
  .cs-kv dl div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .cs-kpis, .cs-adm__kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .cs-kpi { padding: 12px; }
  .cs-kpi b { font-size: 22px; }
  .cs-adm { padding: 10px; border-radius: 18px; }
  .cs-adm__in { padding: 14px; }
  .cs-adm__row { padding: 10px 12px; font-size: 13px; }
  .cs-closing { padding: 44px 20px; }
  .cs-closing h2 { font-size: 26px; }
  .cs-closing h2 br { display: none; }
  .cs-contact { padding: 28px 20px; }
  .cs-contact h2 { font-size: 26px; }
  .cs-contact__cta { flex-basis: 100%; }
  .cs-dres__row > small { flex-basis: 100%; }
  .cs-modal__scroll { max-height: calc(100vh - 110px); }
}

@media (prefers-reduced-motion: reduce) {
  .cs-partners * { transition: none !important; animation: none !important; }
}