:root {
  --cv-brand: #d35400;
  --cv-brandHover: #b54700;
  --cv-navy: #1d3557;
  --cv-ink: #0f0d1d;
  --cv-canvas: #f3f7fb;
  --cv-white: #ffffff;
  --cv-muted: #585858;
  --cv-border: #e3e3e3;
  --cv-danger: #b42332;
  --cv-success: #176b4d;
  --cv-blueSoft: #eaf0f8;
  --cv-successSoft: #e9f5ee;
  --cv-dangerSoft: #fdedef;
  --cv-orangeSoft: #fff2e8;
  --radius-8: 8px;
  --radius-12: 12px;
  --radius-16: 16px;
  --radius-999: 999px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body.cv360 {
  font-family: "Kumbh Sans", sans-serif;
  color: var(--cv-ink);
  background: var(--cv-canvas);
}
button, input, select, textarea { font: inherit; }
a { color: inherit; }
img { max-width: 100%; display: block; }

.cv-display { font-size: 56px; line-height: 64px; font-weight: 700; margin: 0; }
.cv-h1 { font-size: 32px; line-height: 40px; font-weight: 700; margin: 0; }
.cv-h3 { font-size: 20px; line-height: 28px; font-weight: 600; margin: 0; }
.cv-body { font-size: 16px; line-height: 24px; font-weight: 400; }
.cv-small { font-size: 14px; line-height: 20px; color: var(--cv-muted); }
.cv-caption { font-size: 12px; line-height: 18px; font-weight: 500; color: var(--cv-muted); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 16px;
  border-radius: var(--radius-8);
  border: 1px solid transparent;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  cursor: pointer;
  background: var(--cv-brandHover);
  color: var(--cv-white);
}
.btn:hover { filter: brightness(0.96); }
.btn:focus-visible { outline: 2px solid var(--cv-navy); outline-offset: 2px; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.btn.secondary { background: var(--cv-white); color: var(--cv-navy); border-color: var(--cv-border); }
.btn.quiet { background: var(--cv-canvas); color: var(--cv-navy); }
.btn.full { width: 100%; }
.btn.w160 { width: 160px; }
.btn.w220 { width: 220px; }
.btn.w120 { width: 120px; }

.badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: fit-content;
  padding: 4px 12px;
  border-radius: var(--radius-999);
  background: var(--cv-orangeSoft);
  color: var(--cv-brandHover);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}
.badge.navy { background: var(--cv-blueSoft); color: var(--cv-navy); }
.badge.ok { background: var(--cv-successSoft); color: var(--cv-success); }

.field { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; }
.field label { font-size: 14px; font-weight: 600; line-height: 20px; }
.field input, .field select, .field textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px;
  border: 1px solid var(--cv-border);
  border-radius: var(--radius-8);
  background: var(--cv-white);
  color: var(--cv-ink);
}
.field input:focus, .field select:focus {
  outline: 2px solid rgba(29, 53, 87, 0.25);
  border-color: var(--cv-navy);
}

.card {
  background: var(--cv-white);
  border: 1px solid var(--cv-border);
  border-radius: var(--radius-12);
}
.notice {
  background: var(--cv-blueSoft);
  border: 1px solid var(--cv-border);
  border-radius: var(--radius-12);
  padding: 12px 24px;
}
.notice.danger { background: var(--cv-dangerSoft); }

.topbar {
  background: var(--cv-ink);
  color: var(--cv-white);
  display: flex;
  gap: 32px;
  padding: 8px 24px 8px 80px;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}
.public-nav {
  background: var(--cv-white);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 32px;
  padding: 32px;
}
.public-nav .logo { width: 197px; height: 38px; object-fit: contain; flex-shrink: 0; }
.public-nav .links { display: flex; gap: 24px; flex: 1 1 auto; flex-wrap: wrap; font-size: 14px; }
.public-nav .links a { text-decoration: none; color: var(--cv-navy); }
.public-footer {
  background: var(--cv-navy);
  color: var(--cv-white);
  display: flex;
  gap: 40px;
  padding: 40px;
  font-size: 14px;
}
.public-footer a { color: var(--cv-white); text-decoration: none; }

.public-main { padding: 80px; display: flex; flex-direction: column; gap: 32px; }
.hero-join {
  background: var(--cv-navy);
  color: var(--cv-white);
  display: grid;
  grid-template-columns: 1fr 416px;
  gap: 64px;
  padding: 80px;
}
.hero-join .card { color: var(--cv-navy); padding: 32px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: var(--radius-16); border: 0; }
.filters { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.job-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 24px;
  text-decoration: none;
  background: var(--cv-white);
  border: 1px solid var(--cv-border);
  border-radius: var(--radius-12);
}
.job-card h3 { margin: 0; font-size: 20px; line-height: 28px; font-weight: 600; }
.benefit-grid, .split-2 { display: grid; gap: 24px; }
.benefit-grid { grid-template-columns: repeat(3, 1fr); }
.split-2 { grid-template-columns: 1fr 1fr; }
.detail-grid { display: grid; grid-template-columns: 800px 448px; gap: 32px; align-items: start; }
.benefit { padding: 24px; }
.navy-panel {
  background: var(--cv-navy);
  color: var(--cv-white);
  border-radius: var(--radius-12);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.auth-split { display: grid; grid-template-columns: 520px 640px; gap: 80px; align-items: start; }
.auth-card { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.pager { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pager .range { flex: 1; color: var(--cv-muted); font-size: 14px; }
.pager a, .pager span {
  min-width: 44px;
  height: 44px;
  border-radius: var(--radius-8);
  border: 1px solid var(--cv-border);
  background: var(--cv-white);
  color: var(--cv-navy);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
}
.pager a[aria-current="page"] { background: var(--cv-brandHover); color: var(--cv-white); border-color: transparent; }
.pager a[aria-disabled="true"] { color: var(--cv-muted); background: var(--cv-canvas); pointer-events: none; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; }
hr.rule { border: 0; border-top: 1px solid var(--cv-border); width: 100%; margin: 0; }

.activate-page {
  min-height: 100vh;
  padding: 80px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  background: var(--cv-canvas);
}
.activate-logo { width: 197px; height: 38px; object-fit: contain; }
.activate-card {
  width: 640px;
  max-width: 100%;
  background: var(--cv-white);
  border-radius: 20px;
  padding: 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  border: 0;
}
.activate-kicker {
  margin: 0;
  font-size: 12px;
  line-height: 17px;
  font-weight: 700;
  color: var(--cv-brand);
}
.activate-kicker.success { color: var(--cv-success); }
.activate-title {
  margin: 0;
  font-size: 36px;
  line-height: 52px;
  font-weight: 700;
  color: var(--cv-navy);
}
.activate-lead {
  margin: 0;
  font-size: 17px;
  line-height: 25px;
  color: var(--cv-muted);
}
.activate-card .field { padding: 12px 0; }
.activate-note, .activate-footnote {
  margin: 0;
  font-size: 13px;
  line-height: 19px;
  color: var(--cv-muted);
}
.activate-submit { min-height: 52px; height: 52px; }
.activate-card[hidden],
.activate-page .notice[hidden] {
  display: none !important;
}

@media (max-width: 1100px) {
  .topbar { padding-left: 24px; }
  .public-nav, .public-main, .hero-join, .activate-page { padding: 24px; }
  .hero-join, .filters, .benefit-grid, .split-2, .auth-split, .detail-grid { grid-template-columns: 1fr; }
}