:root {
  --career-text: #121625;
  --career-muted: #687189;
  --career-line: rgba(104, 111, 151, .16);
  --career-purple: #6d5cff;
  --career-pink: #f06db8;
  --career-grad: linear-gradient(
    90deg,
    #6d5cff 0%,
    #a65de8 54%,
    #f06db8 100%
  );
  --career-bg: #f9f5fc;
  --career-white: #fff;
  --career-shadow: 0 28px 70px rgba(37, 32, 80, .09);
}

* {
  box-sizing: border-box;
}

.sia-strengths-career-page {
  background:
    radial-gradient(
      circle at 86% 8%,
      rgba(246, 164, 221, .25),
      transparent 19%
    ),
    radial-gradient(
      circle at 8% 36%,
      rgba(137, 109, 255, .12),
      transparent 18%
    ),
    linear-gradient(
      180deg,
      #fdfbff 0%,
      #f8f4fb 52%,
      #f3f5fb 100%
    );
  color: var(--career-text);
}

.career-page {
  overflow: hidden;
  padding-bottom: 0;
}

.career-shell {
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
}

.career-section {
  padding: 82px 0;
}

.career-eyebrow {
  display: inline-flex;
  align-items: center;
  font-size: .79rem;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #7162ea;
}

.career-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity .75s ease,
    transform .75s ease;
}

.career-reveal.is-visible {
  opacity: 1;
  transform: none;
}

.career-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 176px;
  padding: 15px 24px;
  border-radius: 999px;
  font-size: .92rem;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform .2s ease,
    box-shadow .2s ease;
}

.career-btn:hover {
  transform: translateY(-2px);
}

.career-btn-primary {
  background: var(--career-grad);
  color: #fff;
  box-shadow: 0 17px 36px rgba(139, 93, 237, .24);
}

.career-btn-light {
  background: rgba(255, 255, 255, .82);
  color: var(--career-text);
  border: 1px solid var(--career-line);
}

.career-btn-white {
  background: #fff;
  color: #151928;
}

.career-copy h2,
.career-section-head h2,
.career-final h2 {
  font-size: clamp(2.65rem, 5vw, 5.15rem);
  line-height: .98;
  letter-spacing: -.055em;
  margin: 17px 0;
}

.career-copy h2 em,
.career-section-head h2 em,
.career-final h2 em {
  font-style: normal;
  background: var(--career-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.career-copy p,
.career-section-head p,
.career-final p {
  font-size: 1.04rem;
  line-height: 1.9;
  color: var(--career-muted);
  word-break: keep-all;
}

.career-lines {
  display: grid;
  gap: 14px;
  margin-top: 26px;
}

.career-lines > div {
  padding: 0 0 14px;
  border-bottom: 1px solid var(--career-line);
}

.career-lines b {
  display: block;
  font-size: 1.03rem;
}

.career-lines span {
  display: block;
  margin-top: 5px;
  color: var(--career-muted);
  line-height: 1.5;
  font-size:1.15rem;
}


/* =========================================================
   HERO
   ========================================================= */

.career-hero {
  padding: 108px 0 70px;
}

.career-hero-grid {
  display: grid;
  grid-template-columns: 1.03fr .97fr;
  gap: 62px;
  align-items: center;
}

.career-hero-copy h1 {
  font-size: clamp(3.2rem, 6.25vw, 6.35rem);
  line-height: 1.15;
  letter-spacing: -.065em;
  margin: 18px 0 22px;
}

.career-hero-copy h1 em {
  font-style: normal;
  background: var(--career-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.career-hero-copy > p {
  max-width: 760px;
  font-size: 1.09rem;
  line-height: 1.5;
  color: var(--career-muted);
  word-break: keep-all;
}

.career-hero-copy > p strong {
  color: var(--career-text);
}

.career-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.career-hero-caption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 28px;
  font-size: .82rem;
  color: #7d8498;
}

.career-hero-caption i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #b4bac7;
}

.career-hero-visual {
  position: relative;
  min-height: 720px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.career-glow {
  position: absolute;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(173, 104, 246, .24),
      rgba(244, 121, 190, .11) 44%,
      transparent 70%
    );
  filter: blur(4px);
}

.career-phone {
  position: relative;
  width: 325px;
  border: 8px solid #171b29;
  border-radius: 38px;
  background: #fff;
  box-shadow: 0 32px 80px rgba(31, 34, 71, .18);
  overflow: hidden;
}

.career-phone-main {
  height: 660px;
  z-index: 2;
}

.career-phone-notch {
  width: 42%;
  height: 24px;
  border-radius: 0 0 15px 15px;
  background: #171b29;
  margin: 0 auto;
}

.career-phone-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 17px;
  color: #8d93a7;
  font-size: 1rem;
}

.career-phone-head b {
  color: #171b29;
  font-size: 1.15rem;
}

.career-phone-body {
  padding: 0 13px 72px;
}

.career-mobile-hello {
  padding: 18px;
  border-radius: 22px;
  background: linear-gradient(135deg, #f4f1ff, #fff);
  border: 1px solid rgba(123, 112, 196, .14);
}

.career-mobile-hello small {
  display: block;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: .14em;
  color: #6d62eb;
}

.career-mobile-hello strong {
  display: block;
  margin-top: 7px;
  font-size: 1.15rem;
  line-height: 1.15;
}

.career-mobile-hello span {
  display: block;
  margin-top: 6px;
  font-size: .85rem;
  color: #9299a8;
}

.career-mobile-block {
  padding: 14px 15px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .13);
  margin-top: 10px;
}

.career-mobile-block small{font-size:1rem;display: block; color: #9299a8;}

.career-mobile-block span {
  display: block;
  color: #9299a8;
  font-size: .85rem;
}

.career-mobile-block b {
  display: block;
  margin-top: 5px;
  font-size: 1rem;
}

.career-mobile-block span {
  margin-top: 5px;
}

.career-mobile-block.is-accent {
  background: linear-gradient(90deg, #5543d7, #7768f3);
  color: #fff;
}

.career-mobile-block.is-accent small,
.career-mobile-block.is-accent span {
  color: #dedaff;
}

.career-mobile-block.is-soft {
  background: #f7f4ff;
}

.career-mobile-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.career-mobile-split .career-mobile-block {
  margin-top: 10px;
}

.is-green {
  color: #0e9a63;
}

.career-phone-nav {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: #fff;
  border-top: 1px solid #eceef4;
}

.career-phone-nav > * {
  padding: 13px 3px;
  text-align: center;
  font-size: .85rem;
  color: #9ba1ae;
}

.career-phone-nav b {
  color: #655bea;
}

.career-floating-note {
  position: absolute;
  z-index: 3;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .93);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(127, 119, 183, .14);
  box-shadow: 0 20px 45px rgba(41, 36, 84, .11);
}

.career-floating-note b {
  display: block;
  font-size: 1.15rem;
}

.career-floating-note span {
  display: block;
  margin-top: 4px;
  font-size: 1rem;
  color: var(--career-muted);
}

.note-one {
  left: -50px;
  top: 145px;
}

.note-two {
  right: -18px;
  bottom: 122px;
}


/* =========================================================
   SUMMARY
   ========================================================= */

.career-summary-strip {
  padding: 8px 0 42px;
}

.career-summary-track {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  border-top: 1px solid var(--career-line);
  border-bottom: 1px solid var(--career-line);
}

.career-summary-track > div {
  padding: 24px 18px;
  border-right: 1px solid var(--career-line);
}

.career-summary-track > div:last-child {
  border-right: 0;
}

.career-summary-track strong {
  display: block;
  font-size: .75rem;
  letter-spacing: .13em;
  color: #6c5feb;
}

.career-summary-track span {
  display: block;
  margin-top: 7px;
  font-size: 1.15rem;
  color: var(--career-muted);
}


/* =========================================================
   PASSPORT
   ========================================================= */

.career-split {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 52px;
  align-items: center;
}

.career-passport-visual {
  display: flex;
  justify-content: flex-end;
}

.passport-window {
  width: min(100%, 600px);
  padding: 30px;
  border-radius: 34px;
  background: linear-gradient(
    145deg,
    #161a27,
    #252550 54%,
    #754586
  );
  color: #fff;
  box-shadow: 0 28px 70px rgba(27, 31, 64, .18);
}

.passport-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.passport-head span {
  display: block;
  font-size: .85rem;
  letter-spacing: .14em;
  color: #cfcdf4;
}

.passport-head strong {
  display: block;
  margin-top: 7px;
  font-size: 2.1rem;
}

.passport-head small {
  display: block;
  margin-top: 6px;
  color: #c8cbe2;
  font-size:1rem;
}

.passport-id {
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
}

.passport-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 22px 0;
}

.passport-stats div {
  padding: 14px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .07);
  text-align: center;
}

.passport-stats b {
  display: block;
  font-size: 1.65rem;
}

.passport-stats span {
  display: block;
  margin-top: 5px;
  font-size: 1rem;
  letter-spacing: .1em;
  color: #cfd2e8;
}

.passport-timeline {
  display: grid;
  gap: 2px;
}

.passport-timeline > div {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 11px;
  position: relative;
}

.passport-timeline > div::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 17px;
  bottom: -18px;
  width: 1px;
  background: rgba(255, 255, 255, .16);
}

.passport-timeline > div:last-child::before {
  display: none;
}

.passport-timeline i {
  width: 15px;
  height: 15px;
  margin-top: 13px;
  border-radius: 50%;
  background: #f46fb9;
  box-shadow: 0 0 0 5px rgba(244, 111, 185, .15);
}

.passport-timeline section {
  padding: 10px 0 18px;
}

.passport-timeline small {
  display: block;
  color: #c2c5dc;
  font-size:.85rem;
}

.passport-timeline b {
  display: block;
  margin-top: 4px;
}

.passport-timeline span {
  display: block;
  margin-top: 4px;
  font-size: 1rem;
  color: #d5d7e6;
}


/* =========================================================
   FIELD
   ========================================================= */

.career-section-head {
  max-width: 860px;
  margin-bottom: 34px;
}

.career-field-layout {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 38px;
  align-items: stretch;
}

.career-field-photo {
  position: relative;
  min-height: 610px;
  border-radius: 34px;
  overflow: hidden;
  box-shadow: var(--career-shadow);
}

.career-field-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.career-field-overlay {
  position: absolute;
  left: 26px;
  right: 26px;
  bottom: 24px;
  padding: 20px 22px;
  border-radius: 22px;
  background: rgba(10, 12, 20, .76);
  backdrop-filter: blur(12px);
  color: #fff;
}

.career-field-overlay span {
  display: block;
  font-size: .68rem;
  letter-spacing: .14em;
  color: #d9dcf5;
}

.career-field-overlay strong {
  display: block;
  margin-top: 7px;
  font-size: 1.35rem;
}

.career-field-overlay small {
  display: block;
  margin-top: 5px;
  color: #d8dbe9;
}

.career-field-flow {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.career-field-flow > div {
  display: grid;
  grid-template-columns: 68px 1fr;
  gap: 14px;
  padding: 23px 0;
  border-bottom: 1px solid var(--career-line);
}

.career-field-flow b {
  font-size: 2rem;
  background: var(--career-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.career-field-flow strong {
  display: block;
  font-size: 1.12rem;
}

.career-field-flow span {
  display: block;
  margin-top: 6px;
  color: var(--career-muted);
  line-height: 1.65;
}


/* =========================================================
   PORTFOLIO
   ========================================================= */

.career-portfolio-grid {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 50px;
  align-items: center;
}

.career-portfolio-devices {
  display: grid;
  grid-template-columns: 1fr 230px;
  gap: 16px;
  align-items: end;
}

.career-browser {
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .13);
  border-radius: 30px;
  overflow: hidden;
  box-shadow: var(--career-shadow);
}

.career-browser-bar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 13px 17px;
  background: #f3f5f9;
  color: #8e95a7;
  font-size: .85rem;
}

.career-browser-bar i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d4d8e3;
}

.career-browser-hero {
  min-height: 250px;
  padding: 28px;
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  color: #fff;
}

.career-browser-hero small {
  display: block;
  font-size: .85rem;
  letter-spacing: .13em;
  color: #d6daf2;
}

.career-browser-hero strong {
  display: block;
  margin-top: 8px;
  font-size: 2.8rem;
  line-height: 1;
}

.career-browser-hero b {
  display: block;
  margin-top: 7px;
  font-size:1rem;
}

.career-browser-hero p {
  margin: 8px 0 0;
  font-size: 1rem;
  color: #e2e5ef;
}

.career-browser-content {
  padding: 18px;
}

.career-browser-content span {
  display: block;
  font-size: .85rem;
  font-weight: 900;
  color: #685deb;
}

.career-browser-content b {
  display: block;
  margin-top: 5px;
}

.career-browser-content small {
  display: block;
  margin-top: 3px;
  color: #9197a7;
  font-size:1rem;
}

.career-browser-gallery {
  display: grid;
  grid-template-columns: 1.15fr .9fr .9fr;
  gap: 8px;
  height: 150px;
  margin-top: 12px;
}

.career-browser-gallery img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 12px;
}

.career-phone-portfolio {
  width: 230px;
  background: #141721;
}

.career-pf-mobile-hero {
  min-height: 270px;
  padding: 25px 17px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-size: cover;
  background-position: center;
  border-radius: 24px;
  color: #fff;
}

.career-pf-mobile-hero span {
  font-size: .85rem;
  letter-spacing: .12em;
  color: #d6daf5;
}

.career-pf-mobile-hero strong {
  font-size: 1.75rem;
  margin-top: 7px;
}

.career-pf-mobile-hero small {
  margin-top: 5px;
  font-size:1rem;
}

.career-pf-mobile-body {
  padding: 15px 10px 18px;
  color: #fff;
}

.career-pf-mobile-body b {
  display: block;
  font-size: .82rem;
}

.career-pf-mobile-body span {
  display: block;
  margin-top: 6px;
  font-size: .67rem;
  color: #cbd0df;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.career-feedback-grid {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  gap: 50px;
  align-items: center;
}

.career-feedback-ui {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  gap: 16px;
  align-items: stretch;
}

.feedback-work,
.feedback-message {
  border-radius: 30px;
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .13);
  box-shadow: var(--career-shadow);
}

.feedback-work {
  overflow: hidden;
}

.feedback-work img {
  width: 100%;
  height: 310px;
  display: block;
  object-fit: cover;
}

.feedback-work > div {
  padding: 18px;
}

.feedback-work small,
.feedback-work span {
  display: block;
  color: #9298a8;
}

.feedback-work b {
  display: block;
  margin: 5px 0;
  font-size: 1.05rem;
}

.feedback-message {
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.feedback-message > span {
  font-size: .71rem;
  letter-spacing: .12em;
  color: #6d60eb;
  font-weight: 900;
}

.feedback-message > b {
  display: block;
  margin-top: 12px;
  font-size: 1.6rem;
  line-height: 1.35;
}

.feedback-message p {
  margin: 14px 0 0;
  color: var(--career-muted);
  line-height: 1.78;
}

.feedback-message small {
  display: block;
  margin-top: 18px;
  color: #9aa0af;
}


/* =========================================================
   VAULT / CERTIFICATE
   ========================================================= */

.career-vault-layout {
  display: grid;
  grid-template-columns: 1fr .72fr;
  gap: 36px;
  align-items: center;
}

.career-vault-list {
  display: grid;
}

.career-vault-list > div {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  padding: 20px 0;
  border-bottom: 1px solid var(--career-line);
}

.career-vault-list i {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 12px;
  background: #eeeaff;
  color: #6558e9;
  font-style: normal;
  font-weight: 900;
}

.career-vault-list b {
  display: block;
  font-size: 1.06rem;
}

.career-vault-list span {
  display: block;
  margin-top: 5px;
  color: var(--career-muted);
  font-size:1.15rem;
}

.career-digital-certificate {
  padding: 34px;
  border-radius: 30px;
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .14);
  box-shadow: var(--career-shadow);
  text-align: center;
}

.certificate-mark {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  margin: 0 auto 18px;
  border-radius: 20px;
  background: var(--career-grad);
  color: #fff;
  font-weight: 900;
}

.career-digital-certificate > small {
  display: block;
  letter-spacing: .14em;
  color: #7162eb;
  font-size:.85rem;
}

.career-digital-certificate > strong {
  display: block;
  margin-top: 12px;
  font-size: 1.6rem;
}

.career-digital-certificate > p {
  color: var(--career-muted);
  font-size:1.15rem;
}

.certificate-qr {
  display: grid;
  grid-template-columns: repeat(3, 14px);
  gap: 4px;
  width: max-content;
  margin: 18px auto;
}

.certificate-qr span {
  width: 14px;
  height: 14px;
  background: #1a1e2b;
}

.certificate-qr span:nth-child(2),
.certificate-qr span:nth-child(6),
.certificate-qr span:nth-child(8) {
  background: #fff;
  border: 2px solid #1a1e2b;
}

.career-digital-certificate > b {
  font-size: 1rem;
  color: #6d60e9;
}


/* =========================================================
   FIELD APPLY
   ========================================================= */

.career-field-apply-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 52px;
  align-items: center;
}

.career-loop {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
  margin-top: 24px;
}

.career-loop span {
  padding: 9px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--career-line);
  font-size: 1rem;
  font-weight: 800;
}

.career-loop i {
  font-style: normal;
  color: #a1a7b5;
}

.career-opportunity-ui {
  padding: 26px;
  border-radius: 32px;
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .13);
  box-shadow: var(--career-shadow);
}

.opportunity-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--career-line);
}

.opportunity-head span {
  font-weight: 900;
  font-size:1.25rem;
}

.opportunity-head b {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #eeeaff;
  color: #6a5ee9;
  font-size:1.5rem;
}

.career-opportunity-ui article {
  display: grid;
  grid-template-columns: 92px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid var(--career-line);
}

.career-opportunity-ui article:last-child {
  border-bottom: 0;
}

.career-opportunity-ui small {
  color: #7063e9;
  font-weight: 800;
  font-size:1rem;
}

.career-opportunity-ui strong {
  display: block;
}

.career-opportunity-ui p {
  margin: 4px 0 0;
  color: var(--career-muted);
  font-size: 1rem;
}

.career-opportunity-ui button {
  border: 0;
  padding: 10px 13px;
  border-radius: 12px;
  background: #f0edff;
  color: #6559e7;
  font-weight: 800;
  font-size:1rem;
}


/* =========================================================
   READINESS
   ========================================================= */

.career-readiness-grid {
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 54px;
  align-items: center;
}

.career-readiness-ui {
  padding: 32px;
  border-radius: 32px;
  background: linear-gradient(
    145deg,
    #161a27,
    #252650 55%,
    #784285
  );
  color: #fff;
  box-shadow: 0 28px 70px rgba(27, 31, 64, .17);
}

.readiness-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
}

.readiness-head span {
  font-size: .85rem;
  letter-spacing: .12em;
  color: #cacdf0;
}

.readiness-head b {
  font-size: 1.28rem;
}

.readiness-track {
  height: 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .11);
  overflow: hidden;
  margin: 22px 0;
}

.readiness-track div {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #7a6cf8, #f173b8);
}

.readiness-list {
  display: grid;
}

.readiness-list > div {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  align-items: center;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.readiness-list i {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .08);
  font-style: normal;
  font-size: .85rem;
}

.readiness-list .is-done i {
  background: #f06cb6;
}

.readiness-list span {
  color: #eceefa;
}


/* =========================================================
   REPORT
   ========================================================= */

.career-report-grid {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  gap: 50px;
  align-items: center;
}

.career-report-paper {
  padding: 34px;
  border-radius: 32px;
  background: #fff;
  border: 1px solid rgba(123, 112, 196, .13);
  box-shadow: var(--career-shadow);
}

.report-top {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--career-line);
}

.report-top span {
  font-size: .85rem;
  color: #7569eb;
  letter-spacing: .12em;
}

.report-top b {
  font-size: 1rem;
}

.report-profile {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 22px 0;
}

.report-avatar {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: var(--career-grad);
  color: #fff;
  font-weight: 900;
}

.report-profile b {
  display: block;
  font-size:1.25rem;
}

.report-profile span {
  display: block;
  margin-top: 4px;
  color: #8c93a7;
  font-size: 1rem;
}

.report-numbers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.report-numbers div {
  padding: 16px;
  border-radius: 18px;
  background: #f7f5fd;
  text-align: center;
}

.report-numbers b {
  display: block;
  font-size: 1.65rem;
}

.report-numbers span {
  display: block;
  margin-top: 4px;
  font-size: 1rem;
  color: #8e95a7;
}

.report-next {
  margin-top: 14px;
  padding: 18px;
  border-radius: 18px;
  background: linear-gradient(90deg, #5745d8, #796af3);
  color: #fff;
}

.report-next span {
  display: block;
  font-size: .85rem;
  letter-spacing: .1em;
  color: #dedaff;
}

.report-next b {
  display: block;
  margin-top: 6px;
}


/* =========================================================
   FINAL
   ========================================================= */

.career-final {
  padding: 58px 0 0;
}

.career-final-box {
  padding: 58px;
  border-radius: 40px;
  background: linear-gradient(
    135deg,
    #151927,
    #24264d 47%,
    #b24c9a 100%
  );
  color: #fff;
  box-shadow: 0 28px 75px rgba(28, 31, 67, .16);
}

.career-final .career-eyebrow {
  color: #d5cfff;
}

.career-final p {
  max-width: 920px;
  color: #e2e4f1;
}

.career-final p strong {
  color: #fff;
}

.career-final .career-btn {
  margin-top: 24px;
}


/* =========================================================
   RESPONSIVE - 1120
   ========================================================= */

@media (max-width: 1120px) {
  .career-hero-grid,
  .career-split,
  .career-field-layout,
  .career-portfolio-grid,
  .career-feedback-grid,
  .career-vault-layout,
  .career-field-apply-grid,
  .career-readiness-grid,
  .career-report-grid {
    grid-template-columns: 1fr;
  }

  .career-hero-visual {
    min-height: 660px;
  }

  .career-passport-visual {
    justify-content: flex-start;
  }

  .career-portfolio-devices {
    max-width: 760px;
  }

  .career-summary-track {
    grid-template-columns: repeat(3, 1fr);
  }

  .career-summary-track > div:nth-child(3) {
    border-right: 0;
  }

  .career-summary-track > div:nth-child(n + 4) {
    border-top: 1px solid var(--career-line);
  }

  .career-feedback-ui {
    max-width: 780px;
  }

  .career-opportunity-ui {
    max-width: 760px;
  }
}


/* =========================================================
   RESPONSIVE - 760
   ========================================================= */

@media (max-width: 760px) {
  .career-shell {
    width: min(100% - 28px, 1240px);
  }

  .career-page {
    padding-bottom: 0;
  }

  .career-section {
    padding: 58px 0;
  }

  .career-hero {
    padding: 84px 0 36px;
  }

  .career-hero-grid {
    gap: 20px;
  }

  .career-hero-copy h1 {
    font-size: 3.05rem;
  }

  .career-hero-copy > p {
    font-size: .97rem;
  }

  .career-hero-actions {
    flex-direction: column;
  }

  .career-btn {
    width: 100%;
  }

  .career-hero-caption {
    font-size: .73rem;
  }

  .career-hero-visual {
    min-height: 620px;
    justify-content: flex-start;
  }

  .career-phone-main {
    width: min(325px, 92vw);
  }

  .note-one {
    left: auto;
    right: 0;
    top: 90px;
  }

  .note-two {
    right: 0;
    bottom: 72px;
  }

  .career-summary-track {
    grid-template-columns: 1fr;
  }

  .career-summary-track > div {
    border-right: 0 !important;
    border-top: 1px solid var(--career-line);
  }

  .career-summary-track > div:first-child {
    border-top: 0;
  }

  .career-copy h2,
  .career-section-head h2,
  .career-final h2 {
    font-size: 2.55rem;
  }

  .career-field-photo {
    min-height: 470px;
  }

  .career-portfolio-devices {
    grid-template-columns: 1fr;
  }

  .career-phone-portfolio {
    width: min(240px, 100%);
  }

  .career-browser-gallery {
    grid-template-columns: 1fr;
    height: auto;
  }

  .career-browser-gallery img {
    height: 150px;
  }

  .career-feedback-ui {
    grid-template-columns: 1fr;
  }

  .feedback-work img {
    height: 260px;
  }

  .career-opportunity-ui article {
    grid-template-columns: 1fr;
  }

  .career-opportunity-ui button {
    justify-self: start;
  }

  .report-top {
    flex-direction: column;
  }

  .report-numbers {
    grid-template-columns: 1fr;
  }

  .career-final-box {
    padding: 38px 24px;
    border-radius: 30px;
  }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .career-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .career-btn {
    transition: none;
  }
}


/* =========================================================
   SIA MY 자체 개발 앱 강조 + 페이지 공통 타이포 스케일
   Desktop: 3.5 / 1.75 / 1.15 / 1rem
   Mobile <=768: 1.75 / 1.5 / 1 / .85rem
   ========================================================= */

:root {
  --career-font-xl: 2.5rem;
  --career-font-lg: 1.75rem;
  --career-font-md: 1.15rem;
  --career-font-sm: 1rem;
}


/* SIA 자체 개발 앱 소개 */

.career-inhouse-section {
  padding-top: 68px;
  padding-bottom: 68px;
}

.career-inhouse-grid {
  display: grid;
  grid-template-columns: .94fr 1.06fr;
  gap: 52px;
  align-items: center;
}

.career-inhouse-copy h2 {
  margin: 17px 0;
  line-height: 1.02;
  letter-spacing: -.055em;
}

.career-inhouse-copy h2 em {
  font-style: normal;
  background: var(--career-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.career-inhouse-copy > p {
  line-height: 1.5;
  color: var(--career-muted);
  word-break: keep-all;
}

.career-inhouse-copy > p strong {
  color: var(--career-text);
}

.career-inhouse-points {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.career-inhouse-points > div {
  padding: 0 0 15px;
  border-bottom: 1px solid var(--career-line);
}

.career-inhouse-points b {
  display: block;
}

.career-inhouse-points span {
  display: block;
  margin-top: 6px;
  color: var(--career-muted);
  line-height: 1.65;
}

.career-inhouse-ui {
  position: relative;
  padding: 28px;
  border-radius: 34px;
  background: linear-gradient(
    145deg,
    #171a28 0%,
    #27274d 52%,
    #78458d 100%
  );
  color: #fff;
  box-shadow: 0 30px 76px rgba(27, 31, 70, .18);
  overflow: hidden;
}

.career-inhouse-ui::before {
  content: "";
  position: absolute;
  width: 270px;
  height: 270px;
  right: -80px;
  top: -90px;
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(244, 111, 184, .38),
      transparent 68%
    );
  pointer-events: none;
}

.inhouse-ui-head {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .13);
}

.inhouse-ui-head span {
  font-weight: 900;
  letter-spacing: .02em;
  font-size:1.25rem;
}

.inhouse-ui-head b {
  color: #d9d5ff;
  letter-spacing: .08em;
  font-size:1.15rem;
}

.inhouse-ui-screen {
  position: relative;
  padding: 25px 0 20px;
}

.inhouse-ui-title small {
  display: block;
  color: #c9c8e6;
  letter-spacing: .12em;
  font-weight: 900;
  font-size:.85rem;
}

.inhouse-ui-title h3 {
  margin: 10px 0 0;
  line-height: 1.18;
  letter-spacing: -.04em;
}

.inhouse-ui-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 24px;
}

.inhouse-ui-grid > div {
  padding: 18px;
  border-radius: 20px;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .12);
  backdrop-filter: blur(10px);
}

.inhouse-ui-grid span {
  display: block;
  color: #c6c8dd;
  letter-spacing: .08em;
  font-weight: 800;
  font-size:1rem;
}

.inhouse-ui-grid b {
  display: block;
  margin-top: 8px;
  color: #fff;
}

.inhouse-ui-grid small {
  display: block;
  margin-top: 5px;
  color: #cfd2e1;
  line-height: 1.5;
  font-size:1.15rem;
}

.inhouse-ui-footer {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-top: 17px;
  border-top: 1px solid rgba(255, 255, 255, .13);
  font-size:.85rem;
}

.inhouse-ui-footer span {
  color: #c6c8dd;
  letter-spacing: .08em;
}

.inhouse-ui-footer b {
  color: #fff;
}


/* =========================================================
   요청한 데스크톱 타이포 기준
   ========================================================= */

.career-hero-copy h1,
.career-copy h2,
.career-section-head h2,
.career-inhouse-copy h2{
  font-size: 2.75rem !important;
}

.consult h2{font-size:2.5rem;}

.inhouse-ui-title h3{font-size:1.75rem; line-height: 1.15;}
.career-mobile-hello strong{font-size:1.75rem;}
.passport-head strong{font-size:1.75rem;}
.passport-stats b{font-size:1.75rem;}
.career-browser-hero strong{font-size:1.5rem;}
.career-digital-certificate > strong{font-size:1.5rem;}
.readiness-head b{font-size:1.5rem;}
.report-numbers b{font-size:1.75rem;}


.career-field-overlay strong,
.feedback-message > b{
  font-size: var(--career-font-lg) !important;
}

.career-summary-track strong{font-size:1.15rem;}
.career-inhouse-points b{font-size:1.25rem;}
.inhouse-ui-grid b{font-size:1.25rem;}
.career-lines b{font-size:1.25rem;}
.passport-timeline b{font-size:1.25rem;}
.career-browser-content b{font-size:1.25rem;}
.career-vault-list b{font-size:1.25rem;}
.career-opportunity-ui strong{font-size:1.25rem;}
.readiness-list span{font-size:1.15rem;}
.report-next b{font-size:1.25rem;}

.career-field-flow strong,
.feedback-work b {
  font-size: var(--career-font-md) !important;
}

.career-eyebrow{font-size:1rem;}
.career-hero-copy > p{font-size:1.15rem;}
.career-btn{font-size:1rem;}
.career-hero-caption{font-size:1rem;}
.career-inhouse-copy > p{font-size:1.15rem;}
.career-inhouse-points span{font-size:1.15rem;}
.career-copy p{font-size:1.15rem;line-height: 1.5;}
.career-section-head p{font-size:1.15rem;}
#consultForm input{font-size:1rem;}
#consultForm button{font-size:1rem;}
#consultForm select{font-size:1rem;}

.consult p,
#consultForm .consult-privacy {
  font-size: var(--career-font-sm) !important;
}


/* 홈(index) 하단 상담 영역을 strengths에서도 동일한 구조로 사용 */

.sia-strengths-career-page .consult {
  margin-top: 72px;
}

.sia-strengths-career-page .consult-layout {
  align-items: center;
}

.sia-strengths-career-page #consultForm input,
.sia-strengths-career-page #consultForm select,
.sia-strengths-career-page #consultForm > button {
  font-family: inherit;
}


@media (max-width: 1120px) {
  .career-inhouse-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .career-inhouse-ui {
    max-width: 820px;
  }
}


/* =========================================================
   TYPO MOBILE <= 768
   ========================================================= */

@media (max-width: 768px) {
  :root {
    --career-font-xl: 1.75rem;
    --career-font-lg: 1.5rem;
    --career-font-md: 1rem;
    --career-font-sm: .85rem;
  }

  .career-shell {
    width: min(100% - 28px, 1240px);
  }

  .career-page {
    padding-bottom: 0;
  }

  .career-section {
    padding: 48px 0;
  }

  .career-hero {
    padding: 72px 0 30px;
  }

  .career-hero-copy h1,
  .career-copy h2,
  .career-section-head h2,
  .career-inhouse-copy h2,
  .consult h2 {
    font-size: 1.75rem !important;
    line-height: 1.15 !important;
  }

  .career-mobile-hello strong,
  .passport-head strong,
  .passport-stats b,
  .career-field-overlay strong,
  .career-browser-hero strong,
  .feedback-message > b,
  .career-digital-certificate > strong,
  .readiness-head b,
  .report-numbers b,
  .inhouse-ui-title h3 {
    font-size: 1.5rem !important;
  }

  .career-summary-track strong,
  .career-lines b,
  .passport-timeline b,
  .career-field-flow strong,
  .career-browser-content b,
  .feedback-work b,
  .career-vault-list b,
  .career-opportunity-ui strong,
  .readiness-list span,
  .report-next b,
  .career-inhouse-points b,
  .inhouse-ui-grid b {
    font-size: 1rem !important;
  }

   #consultForm input{font-size:1rem;}
   #consultForm select{font-size:1rem;}

  .career-hero-copy > p,
  .career-copy p,
  .career-section-head p,
  .career-inhouse-copy > p,
  .career-inhouse-points span,
  .career-btn,
  .career-eyebrow,
  .career-hero-caption,
  .consult p,
  #consultForm .consult-privacy {
    font-size: .85rem !important;
  }

  #consultForm button{font-size:1rem;}

  .career-inhouse-section {
    padding: 48px 0;
  }

  .career-inhouse-ui {
    padding: 22px;
    border-radius: 28px;
  }

  .inhouse-ui-head,
  .inhouse-ui-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .inhouse-ui-grid {
    grid-template-columns: 1fr;
  }

  .sia-strengths-career-page .consult {
    height: auto !important;
    margin-top: 48px;
    padding: 46px 0 96px !important;
  }

  .sia-strengths-career-page .consult-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .sia-strengths-career-page .consult form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
  }

  .sia-strengths-career-page .consult input,
  .sia-strengths-career-page .consult select,
  .sia-strengths-career-page .consult form > button {
    width: 100% !important;
    height: 46px !important;
  }

  .sia-strengths-career-page #consultForm > button {
    grid-column: 1 !important;
  }

  .sia-strengths-career-page #consultForm .consult-privacy {
    grid-column: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 3px 2px !important;
  }
}


/* =========================================================
   V3.1 — strengths 하단 상담 영역을 HOME(index)와 동일한 레이아웃으로 고정
   ========================================================= */

.sia-strengths-career-page .consult {
  width: 100%;
  height: 270px;
  margin-top: 72px;
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(
      circle at 8% 5%,
      rgba(255, 255, 255, .16),
      transparent 28%
    ),
    radial-gradient(
      circle at 92% 90%,
      rgba(255, 176, 224, .16),
      transparent 31%
    ),
    linear-gradient(
      120deg,
      #fd4d9d 0%,
      #8d54f9 60%,
      #4f7dff 100%
    ) !important;
}

.sia-strengths-career-page .consult::after {
  content: "SIA";
  position: absolute;
  right: 28px;
  bottom: -58px;
  color: rgba(255, 255, 255, .045);
  font-size: 10rem;
  font-weight: 1000;
  line-height: 1;
  letter-spacing: -.08em;
  pointer-events: none;
}

.sia-strengths-career-page .consult > .content {
  width: min(1380px, calc(100% - 160px));
  height: 100%;
  margin: 0 auto;
}

.sia-strengths-career-page .consult-layout {
  display: grid;
  grid-template-columns: 345px minmax(0, 1fr);
  align-items: center;
  gap: 44px;
  position: relative;
  z-index: 2;
}

.sia-strengths-career-page .consult .kicker.white {
  color: #7360e8;
  font-size: 1rem !important;
  font-weight: 900;
  letter-spacing: .14em;
}

.sia-strengths-career-page .consult h2 {
  margin: 10px 0;
  font-size: 2.5rem;
  letter-spacing: -2px;
}

.sia-strengths-career-page .consult p {
  margin: 0;
  font-size: 1.15rem !important;
  line-height: 1.5;
  color: #fff;
  opacity: .9;
}

.sia-strengths-career-page .consult form {
  display: grid;
  grid-template-columns: 1fr 1fr 1.18fr 1.18fr 100px;
  gap: 8px;
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 15px;
  background: rgba(255, 255, 255, .095);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .08),
    0 18px 45px rgba(57, 33, 93, .12);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.sia-strengths-career-page .consult input,
.sia-strengths-career-page .consult select {
  width: 100%;
  min-width: 0;
  height: 50px;
  border: 1px solid rgba(255, 255, 255, .48);
  border-radius: 9px;
  background: rgba(255, 255, 255, .96);
  color: #332c3c;
  padding: 0 14px;
  font-family: inherit;
  font-size: 1rem !important;
  box-shadow: 0 4px 12px rgba(45, 28, 70, .055);
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.sia-strengths-career-page .consult input:focus,
.sia-strengths-career-page .consult select:focus {
  outline: 0;
  border-color: rgba(107, 72, 197, .42);
  background: #fff;
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, .18),
    0 5px 14px rgba(45, 28, 70, .09);
}

.sia-strengths-career-page .consult form > button[type="submit"] {
  width: 100%;
  height: 50px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 9px;
  background: #201a2a;
  color: #fff;
  font-family: inherit;
  font-size: 1rem !important;
  font-weight: 900;
  box-shadow: 0 9px 20px rgba(42, 25, 65, .22);
  cursor: pointer;
  transition:
    transform .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

.sia-strengths-career-page .consult form > button[type="submit"]:hover {
  background: #2b2138;
  box-shadow: 0 12px 26px rgba(42, 25, 65, .28);
  transform: translateY(-1px);
}

.sia-strengths-career-page #consultForm .consult-privacy {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 20px;
  padding: 0 2px;
  color: #fff;
  font-size: 1rem !important;
}

.sia-strengths-career-page #consultForm .consult-privacy label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.sia-strengths-career-page #consultForm .consult-privacy input[type="checkbox"] {
  width: 16px !important;
  min-width: 16px;
  height: 16px !important;
  margin: 0;
  padding: 0;
  box-shadow: none;
  accent-color: #fff;
}

.sia-strengths-career-page #consultForm .privacy-view {
  width: auto !important;
  min-width: 0;
  height: auto !important;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff;
  font-family: inherit;
  font-size: 1rem !important;
  font-weight: 800;
  text-decoration: underline;
  cursor: pointer;
}

.sia-strengths-career-page #consultForm .privacy-view:hover {
  background: transparent;
  box-shadow: none;
  transform: none;
}


@media (max-width: 1100px) and (min-width: 769px) {
  .sia-strengths-career-page .consult > .content {
    width: min(100% - 64px, 1380px);
  }

  .sia-strengths-career-page .consult-layout {
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 28px;
  }

  .sia-strengths-career-page .consult form {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .sia-strengths-career-page .consult form > button[type="submit"] {
    grid-column: 3;
  }

  .sia-strengths-career-page #consultForm .consult-privacy {
    grid-column: 1 / -1;
  }
}


@media (max-width: 768px) {
  .sia-strengths-career-page .consult {
    height: auto !important;
    margin-top: 48px;
    padding: 46px 0 96px !important;
  }

  .sia-strengths-career-page .consult > .content {
    width: calc(100% - 28px) !important;
    height: auto;
  }

  .sia-strengths-career-page .consult-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .sia-strengths-career-page .consult .kicker.white {
    font-size: .85rem !important;
  }

  .sia-strengths-career-page .consult h2 {
    margin: 8px 0 !important;
    font-size: 1.75rem !important;
    line-height: 1.15 !important;
  }

  .sia-strengths-career-page .consult p {
    font-size: 1.15rem !important;
  }

  .sia-strengths-career-page .consult form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
  }
  .sia-strengths-career-page .consult input{font-size:1rem;}

  .sia-strengths-career-page .consult select,
  .sia-strengths-career-page .consult form > button[type="submit"] {
    width: 100% !important;
    height: 46px !important;
    font-size: .85rem !important;
  }

  .sia-strengths-career-page #consultForm > button[type="submit"] {
    grid-column: 1 !important;
  }

  .sia-strengths-career-page #consultForm .consult-privacy {
    grid-column: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 3px 2px !important;
    font-size: .85rem !important;
  }

  .sia-strengths-career-page #consultForm .privacy-view {
    font-size: .85rem !important;
  }
}


/* =========================================================
   PORTFOLIO PC / MOBILE 예시 높이 통일 + 모바일 이미지 표시
   ========================================================= */

@media (min-width: 761px) {
  .career-portfolio-devices {
    align-items: stretch;
  }

  .career-browser,
  .career-phone-portfolio {
    height: 500px;
  }

  .career-browser {
    display: flex;
    flex-direction: column;
  }

  .career-browser-bar {
    flex: 0 0 auto;
  }

  .career-browser-hero {
    flex: 0 0 238px;
    min-height: 0;
  }

  .career-browser-content {
    flex: 1 1 auto;
    min-height: 0;
  }
}

.career-phone-portfolio {
  display: flex;
  flex-direction: column;
  background: #fff;
}

.career-phone-portfolio .career-phone-notch {
  flex: 0 0 24px;
}

.career-phone-portfolio .career-pf-mobile-hero {
  flex: 0 0 218px;
  min-height: 0;
  border-radius: 0;
}

.career-pf-mobile-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 14px 12px 14px;
  background: #fff;
  color: var(--career-text);
}

.career-pf-mobile-label {
  display: block;
  color: #685deb !important;
  font-size: .85rem !important;
  font-weight: 900;
  letter-spacing: .08em;
}

.career-pf-mobile-body > b {
  display: block;
  margin-top: 5px;
  color: var(--career-text);
  font-size: 1.15rem !important;
}

.career-pf-mobile-body > small {
  display: block;
  margin-top: 3px;
  color: #9297a7;
  font-size: 1rem !important;
}

.career-pf-mobile-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  height: 112px;
  margin-top: 10px;
}

.career-pf-mobile-gallery img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 9px;
}

.career-pf-mobile-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 8px;
}

.career-pf-mobile-actions span {
  display: block;
  padding: 7px 4px;
  border-radius: 8px;
  background: #f1f3f8;
  color: #596071;
  text-align: center;
  font-size: .7rem !important;
  font-weight: 800;
}


@media (max-width: 760px) {
  .career-phone-portfolio {
    width: min(240px, 100%);
    height: 500px;
  }

  .career-phone-portfolio .career-pf-mobile-hero {
    flex-basis: 218px;
  }

  .career-pf-mobile-gallery {
    height: 112px;
  }
}


/* =========================================================
   V5 - 02/04 섹션 제거 후 03 포트폴리오 제목 좌측 상단 배치
   ========================================================= */

.career-portfolio-heading {
  max-width: 860px;
  margin: 0 0 34px;
}

.career-portfolio-heading h2 {
  margin-bottom: 0;
}

.career-portfolio-grid-body {
  align-items: start;
}

.career-portfolio-body {
  padding-top: 2px;
}

.career-portfolio-body > p {
  margin-top: 0;
}


@media (max-width: 1120px) {
  .career-portfolio-heading {
    max-width: 760px;
    margin-bottom: 26px;
  }
}


@media (max-width: 768px) {
  .career-portfolio-heading {
    margin-bottom: 20px;
  }

  .career-portfolio-grid-body {
    gap: 26px;
  }

  .career-portfolio-body {
    padding-top: 0;
  }
}

/* =========================================================
   MOBILE FINAL OVERRIDE <= 760px
   - PC/base styles are intentionally untouched.
   - Type scale: 1.5rem / 1.15rem / 1rem / .85rem
   ========================================================= */
@media (max-width: 760px) {
  /* ---------- Base / spacing ---------- */
  .career-shell {
    width: calc(100% - 32px);
    max-width: 100%;
  }

  .career-section {
    padding: 46px 0;
  }

  .career-hero {
    padding: 60px 0 34px;
  }

  .career-hero-grid,
  .career-split,
  .career-field-layout,
  .career-portfolio-grid,
  .career-feedback-grid,
  .career-vault-layout,
  .career-field-apply-grid,
  .career-readiness-grid,
  .career-report-grid,
  .career-inhouse-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 28px;
  }

  .career-copy,
  .career-section-head,
  .career-inhouse-copy,
  .career-hero-copy,
  .career-portfolio-body {
    min-width: 0;
  }
   .sia-strengths-career-page .consult h2{font-size:1.75rem;}
  /* ---------- Typography: LARGE 1.5rem ---------- */
  .career-hero-copy h1,
  .career-copy h2,
  .career-section-head h2,
  .career-inhouse-copy h2,
  .career-final h2,
  {
    margin-top: 12px;
    margin-bottom: 14px;
    font-size: 1.5rem !important;
    line-height: 1.25 !important;
    letter-spacing: -.035em !important;
    word-break: keep-all;
  }

  /* ---------- Typography: MEDIUM 1.15rem ---------- */
  .career-mobile-hello strong,
  .passport-head strong,
  .passport-stats b,
  .career-field-overlay strong,
  .career-field-flow strong,
  .career-browser-hero strong,
  .career-browser-content b,
  .career-pf-mobile-hero strong,
  .career-pf-mobile-body > b,
  .feedback-message > b,
  .feedback-work b,
  .career-digital-certificate > strong,
  .career-vault-list b,
  .opportunity-head span,
  .career-opportunity-ui strong,
  .readiness-head b,
  .readiness-list span,
  .report-profile b,
  .report-numbers b,
  .report-next b,
  .career-summary-track strong,
  .career-lines b,
  .passport-timeline b,
  .career-inhouse-points b,
  .inhouse-ui-head span,
  .inhouse-ui-head b,
  .inhouse-ui-title h3,
  .inhouse-ui-grid b {
    font-size: 1.15rem !important;
    line-height: 1.35;
  }

  .sia-strengths-career-page .consult input{font-size:1.15rem;}
  .sia-strengths-career-page .consult p{font-size:1.15rem;}

  /* ---------- Typography: BODY / BUTTON 1rem ---------- */
  .career-hero-copy > p,
  .career-copy p,
  .career-section-head p,
  .career-final p,
  .career-inhouse-copy > p,
  .career-inhouse-points span,
  .career-lines span,
  .career-field-flow span,
  .career-vault-list span,
  .career-digital-certificate > p,
  .career-loop span,
  .career-opportunity-ui p,
  .career-opportunity-ui button,
  .career-btn,
  .career-summary-track span,
  .passport-timeline span,
  .career-browser-hero b,
  .career-browser-hero p,
  .career-browser-content small,
  .career-pf-mobile-hero small,
  .career-pf-mobile-body > small,
  .feedback-message p,
  .report-profile span,
  .report-top b,
  .inhouse-ui-grid span,
  .inhouse-ui-grid small,
  .sia-strengths-career-page .consult select,
  .sia-strengths-career-page .consult form > button[type="submit"] {
    font-size: 1rem !important;
  }

  .career-hero-copy > p,
  .career-copy p,
  .career-section-head p,
  .career-final p,
  .career-inhouse-copy > p {
    line-height: 1.65;
    word-break: keep-all;
  }

  /* ---------- Typography: SMALL .85rem ---------- */
  .career-eyebrow,
  .career-hero-caption,
  .career-phone-head,
  .career-mobile-hello small,
  .career-mobile-hello span,
  .career-mobile-block small,
  .career-mobile-block span,
  .career-phone-nav > *,
  .career-floating-note span,
  .career-field-overlay span,
  .career-field-overlay small,
  .passport-head span,
  .passport-head small,
  .passport-stats span,
  .passport-timeline small,
  .career-browser-bar,
  .career-browser-hero small,
  .career-browser-content span,
  .career-pf-mobile-hero span,
  .career-pf-mobile-label,
  .career-pf-mobile-actions span,
  .feedback-work small,
  .feedback-work span,
  .feedback-message > span,
  .feedback-message small,
  .career-digital-certificate > small,
  .career-opportunity-ui small,
  .readiness-head span,
  .readiness-list i,
  .report-top span,
  .report-numbers span,
  .report-next span,
  .inhouse-ui-title small,
  .inhouse-ui-footer,
  .sia-strengths-career-page .consult .kicker.white,
  .sia-strengths-career-page #consultForm .consult-privacy,
  .sia-strengths-career-page #consultForm .privacy-view {
    font-size: .85rem !important;
  }

  /* ---------- Hero ---------- */
  .career-hero-grid {
    gap: 30px;
  }

  .career-hero-copy h1 br,
  .career-copy h2 br,
  .career-section-head h2 br,
  .career-inhouse-copy h2 br,
  .career-final h2 br {
    display: none;
  }

  .career-hero-copy > p br {
    display: none;
  }

  .career-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 22px;
  }

  .career-btn {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 13px 18px;
  }

  .career-hero-caption {
    gap: 7px;
    margin-top: 20px;
    line-height: 1.5;
  }

  .career-hero-visual {
    min-height: 0;
    padding: 6px 0 0;
    justify-content: center;
  }

  .career-glow {
    width: min(86vw, 360px);
    height: min(86vw, 360px);
  }

  .career-phone-main {
    width: min(100%, 320px);
    height: 620px;
  }

  .career-phone-head {
    padding: 12px 14px;
  }

  .career-phone-head b {
    font-size: 1.15rem;
  }

  .career-phone-body {
    padding: 0 11px 66px;
  }

  .career-mobile-hello {
    padding: 16px;
    border-radius: 18px;
  }

  .career-mobile-block {
    padding: 12px 13px;
    border-radius: 15px;
  }

  .career-mobile-block b {
    font-size: 1rem;
  }

  .career-floating-note {
    display: none;
  }

  /* ---------- Summary ---------- */
  .career-summary-strip {
    padding: 4px 0 28px;
  }

  .career-summary-track {
    grid-template-columns: 1fr 1fr;
  }

  .career-summary-track > div {
    min-width: 0;
    padding: 16px 12px;
    border-top: 1px solid var(--career-line);
    border-right: 1px solid var(--career-line) !important;
  }

  .career-summary-track > div:nth-child(-n + 2) {
    border-top: 0;
  }

  .career-summary-track > div:nth-child(2n) {
    border-right: 0 !important;
  }

  .career-summary-track > div:last-child {
    grid-column: 1 / -1;
    border-right: 0 !important;
  }

  .career-summary-track span {
    margin-top: 4px;
    line-height: 1.45;
  }

  /* ---------- In-house ---------- */
  .career-inhouse-section {
    padding: 46px 0;
  }

  .career-inhouse-points {
    gap: 12px;
    margin-top: 22px;
  }

  .career-inhouse-ui {
    padding: 18px;
    border-radius: 24px;
  }

  .inhouse-ui-head,
  .inhouse-ui-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .inhouse-ui-screen {
    padding: 20px 0 16px;
  }

  .inhouse-ui-grid {
    grid-template-columns: 1fr;
    gap: 9px;
    margin-top: 18px;
  }

  .inhouse-ui-grid > div {
    padding: 15px;
    border-radius: 16px;
  }

  /* ---------- Passport ---------- */
  .career-passport-visual {
    justify-content: stretch;
  }

  .passport-window {
    width: 100%;
    padding: 20px;
    border-radius: 24px;
  }

  .passport-head {
    align-items: flex-start;
    flex-direction: column;
    padding-bottom: 18px;
  }

  .passport-id {
    padding: 7px 10px;
  }

  .passport-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 18px 0;
  }

  .passport-stats div {
    padding: 12px 8px;
    border-radius: 14px;
  }

  .passport-timeline > div {
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
  }

  /* ---------- Field ---------- */
  .career-section-head {
    margin-bottom: 24px;
  }

  .career-field-photo {
    min-height: 360px;
    border-radius: 24px;
  }

  .career-field-overlay {
    left: 14px;
    right: 14px;
    bottom: 14px;
    padding: 16px;
    border-radius: 16px;
  }

  .career-field-flow > div {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
    padding: 17px 0;
  }

  .career-field-flow b {
    font-size: 1.5rem;
  }

  /* ---------- Portfolio ---------- */
  .career-portfolio-heading {
    margin-bottom: 22px;
  }

  .career-portfolio-grid-body {
    gap: 26px;
  }

  .career-portfolio-devices {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    width: 100%;
  }

  .career-browser {
    width: 100%;
    border-radius: 22px;
  }

  .career-browser-bar {
    min-width: 0;
    padding: 11px 12px;
  }

  .career-browser-bar span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .career-browser-hero {
    min-height: 210px;
    padding: 18px;
  }

  .career-browser-content {
    padding: 15px;
  }

  .career-browser-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    height: 108px;
  }

  .career-browser-gallery img {
    height: 108px;
    border-radius: 9px;
  }

  .career-phone-portfolio {
    width: min(100%, 280px);
    height: 500px;
    margin: 0 auto;
  }

  /* ---------- Feedback ---------- */
  .career-feedback-ui {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .feedback-work,
  .feedback-message {
    border-radius: 22px;
  }

  .feedback-work img {
    height: 220px;
  }

  .feedback-work > div,
  .feedback-message {
    padding: 18px;
  }

  /* ---------- Vault ---------- */
  .career-vault-list > div {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;
    padding: 16px 0;
  }

  .career-vault-list i {
    width: 34px;
    height: 34px;
  }

  .career-digital-certificate {
    padding: 22px 18px;
    border-radius: 22px;
  }

  /* ---------- Field application ---------- */
  .career-loop {
    gap: 7px;
    margin-top: 18px;
  }

  .career-loop span {
    padding: 8px 10px;
  }

  .career-loop i {
    font-size: .85rem;
  }

  .career-opportunity-ui {
    padding: 18px;
    border-radius: 22px;
  }

  .career-opportunity-ui article {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    padding: 15px 0;
  }

  .career-opportunity-ui button {
    width: 100%;
    min-height: 42px;
    margin-top: 4px;
  }

  /* ---------- Readiness ---------- */
  .career-readiness-ui {
    padding: 20px;
    border-radius: 22px;
  }

  .readiness-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .readiness-track {
    margin: 18px 0;
  }

  .readiness-list > div {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    padding: 12px 0;
  }

  /* ---------- Report ---------- */
  .career-report-paper {
    padding: 20px;
    border-radius: 22px;
  }

  .report-top {
    gap: 6px;
    padding-bottom: 14px;
  }

  .report-profile {
    padding: 18px 0;
  }

  .report-avatar {
    width: 48px;
    height: 48px;
    border-radius: 14px;
  }

  .report-numbers {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .report-numbers div {
    min-width: 0;
    padding: 12px 5px;
    border-radius: 14px;
  }

  .report-next {
    padding: 15px;
    border-radius: 14px;
  }

  /* ---------- Final ---------- */
  .career-final {
    padding-top: 34px;
  }

  .career-final-box {
    padding: 26px 20px;
    border-radius: 24px;
  }

  /* ---------- Consult ---------- */
  .sia-strengths-career-page .consult {
    height: auto !important;
    margin-top: 42px;
    padding: 42px 0 88px !important;
  }

  .sia-strengths-career-page .consult > .content {
    width: calc(100% - 32px) !important;
    height: auto;
  }

  .sia-strengths-career-page .consult-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 22px !important;
  }

  .sia-strengths-career-page .consult form {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 10px !important;
  }

  .sia-strengths-career-page .consult input,
  .sia-strengths-career-page .consult select,
  .sia-strengths-career-page .consult form > button[type="submit"] {
    width: 100% !important;
    min-width: 0;
    height: 48px !important;
  }

  .sia-strengths-career-page #consultForm > button[type="submit"] {
    grid-column: 1 !important;
  }

  .sia-strengths-career-page #consultForm .consult-privacy {
    grid-column: 1 !important;
    flex-wrap: wrap;
    gap: 7px !important;
    padding: 4px 2px !important;
  }

  .sia-strengths-career-page #consultForm .consult-privacy input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
  }

  .sia-strengths-career-page .consult::after {
    right: 10px;
    bottom: -26px;
    font-size: 6rem;
  }
}

/* Mobile consult: privacy consent above submit button */
@media (max-width: 760px) {
  .sia-strengths-career-page #consultForm .consult-privacy {
    order: 5 !important;
  }

  .sia-strengths-career-page #consultForm > button[type="submit"] {
    order: 6 !important;
  }
}
