:root {
  --op-bg: #f4f1e9;
  --op-paper: rgba(255, 255, 255, .88);
  --op-ink: #18372b;
  --op-muted: #68766f;
  --op-line: rgba(36, 58, 49, .13);
  --op-shadow: 0 24px 65px rgba(44, 57, 49, .09);
  --op-radius: 28px;
  --op-project: #52748c;
  --op-project-soft: #e9f0f4;
  --op-doctoral: #71618d;
  --op-doctoral-soft: #f0edf5;
  --op-talent: #a26d48;
  --op-talent-soft: #f6eee7;
  --op-job: #667553;
  --op-job-soft: #edf1e8;
  --op-overseas: #397e7b;
  --op-overseas-soft: #e7f2f1;
  --op-danger: #bd5d51;
  --op-warning: #b47d3d;
  --op-ease: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.opportunity-page { margin: 0; color: var(--op-ink); background: var(--op-bg); }
.opportunity-page main { overflow: clip; }
.opportunity-page .rh-shell { width: min(calc(100% - 56px), 1520px); margin-inline: auto; }
.op-eyebrow { margin: 0; color: #457365; font-size: 11px; font-weight: 760; letter-spacing: .22em; }

.op-hero { position: relative; min-height: 520px; padding: clamp(74px, 8vw, 118px) 0 96px; background: radial-gradient(circle at 73% 31%, rgba(196, 175, 138, .18), transparent 30%), linear-gradient(150deg, #f8f6ef 0%, #f1eee4 100%); }
.op-hero::after { position: absolute; inset: auto 0 0; height: 1px; background: var(--op-line); content: ""; }
.op-hero-grid { display: grid; grid-template-columns: minmax(420px, .88fr) minmax(560px, 1.12fr); align-items: center; gap: clamp(56px, 7vw, 112px); }
.op-hero-copy { position: relative; z-index: 2; }
.op-hero h1 { margin: 22px 0 25px; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: clamp(64px, 7.5vw, 112px); font-weight: 590; letter-spacing: -.07em; line-height: .94; }
.op-intro { max-width: 660px; margin: 0; color: var(--op-muted); font-size: clamp(16px, 1.5vw, 22px); line-height: 1.9; }
.op-hero-facts { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 34px; color: #79837f; font-size: 12px; }
.op-hero-facts span { display: inline-flex; align-items: baseline; gap: 5px; }
.op-hero-facts b { color: var(--op-ink); font-size: 18px; font-weight: 720; }
.op-hero-visual { position: relative; min-width: 0; height: 405px; margin: 0; }
.op-hero-visual > img { width: 100%; height: 100%; border-radius: 48% 52% 45% 55% / 54% 46% 54% 46%; object-fit: cover; filter: saturate(.72) contrast(.92); box-shadow: 0 28px 74px rgba(46, 62, 51, .17); }
.op-hero-visual::after { position: absolute; inset: 0; border-radius: 48% 52% 45% 55% / 54% 46% 54% 46%; background: linear-gradient(100deg, transparent 35%, rgba(22, 48, 36, .14)); content: ""; pointer-events: none; }
.op-hero-visual figcaption { position: absolute; right: 18px; bottom: 19px; z-index: 2; display: flex; gap: 9px; align-items: center; padding: 13px 19px; border-radius: 999px; color: #fff; background: rgba(29, 75, 52, .86); box-shadow: 0 12px 30px rgba(18, 50, 34, .18); backdrop-filter: blur(12px); font-size: 12px; }
.op-hero-visual figcaption span { color: rgba(255,255,255,.68); }

.op-console { position: relative; z-index: 4; margin-top: -48px; padding: clamp(34px, 4vw, 58px); border: 1px solid rgba(255,255,255,.82); border-radius: 34px; background: var(--op-paper); box-shadow: var(--op-shadow); backdrop-filter: blur(20px); }
.op-console-head { display: grid; grid-template-columns: .82fr 1.18fr; align-items: end; gap: 40px; padding-bottom: 28px; }
.op-console-head h2 { margin: 10px 0 0; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: clamp(34px, 3.5vw, 52px); font-weight: 570; letter-spacing: -.045em; }
.op-console-head > p { max-width: 670px; margin: 0 0 4px auto; color: var(--op-muted); font-size: 13px; line-height: 1.8; }
.op-toolbar { display: grid; grid-template-columns: minmax(320px, .95fr) minmax(520px, 1.38fr) auto; align-items: center; gap: 16px; padding: 14px; border: 1px solid var(--op-line); border-radius: 25px; background: rgba(244, 242, 236, .86); }
.op-search { display: flex; align-items: center; min-width: 0; height: 54px; padding: 0 15px; border-radius: 17px; background: rgba(255,255,255,.88); box-shadow: inset 0 0 0 1px rgba(38, 59, 50, .08); }
.op-search img { width: 20px; opacity: .66; }
.op-search input { min-width: 0; flex: 1; height: 100%; padding: 0 12px; border: 0; outline: 0; color: var(--op-ink); background: transparent; font: inherit; font-size: 13px; }
.op-search input::placeholder { color: #939b97; }
.op-search:focus-within { box-shadow: inset 0 0 0 1.5px rgba(82,116,140,.48), 0 8px 24px rgba(51,74,64,.08); }
.op-search kbd { padding: 4px 7px; border: 0; border-radius: 7px; color: #8b938e; background: #f1f0ec; font-size: 9px; }
.op-filters { display: flex; gap: 6px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.op-filters::-webkit-scrollbar { display: none; }
.op-filters button { --type: #7d817e; display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 44px; padding: 0 13px; border: 1px solid transparent; border-radius: 14px; color: #606c67; background: transparent; cursor: pointer; font: inherit; font-size: 11px; transition: color 220ms ease, background 220ms ease, box-shadow 220ms ease, transform 220ms var(--op-ease); }
.op-filters button[data-op-type="project"] { --type: var(--op-project); }
.op-filters button[data-op-type="doctoral"] { --type: var(--op-doctoral); }
.op-filters button[data-op-type="talent"] { --type: var(--op-talent); }
.op-filters button[data-op-type="job"] { --type: var(--op-job); }
.op-filters button[data-op-type="overseas"] { --type: var(--op-overseas); }
.op-filters button:hover { color: var(--op-ink); background: rgba(255,255,255,.7); }
.op-filters button.is-active { color: #fff; background: var(--type); box-shadow: 0 9px 20px color-mix(in srgb, var(--type) 20%, transparent); }
.op-filters b { min-width: 17px; color: currentColor; opacity: .65; font-size: 9px; text-align: center; }
.op-selects { display: flex; gap: 8px; }
.op-selects label { position: relative; }
.op-selects label > span { position: absolute; left: 12px; top: 8px; z-index: 1; color: #8a948f; font-size: 8px; pointer-events: none; }
.op-selects select { width: 94px; height: 54px; padding: 17px 26px 3px 12px; border: 1px solid rgba(38,59,50,.1); border-radius: 17px; outline: 0; color: var(--op-ink); background: #fff; font: inherit; font-size: 11px; appearance: auto; }
.op-board-status { display: flex; align-items: center; gap: 9px; min-height: 53px; padding: 13px 2px 2px; color: var(--op-muted); font-size: 11px; }
.op-board-status p, .op-board-status time { margin: 0; }
.op-board-status time { margin-left: auto; color: #8d9792; }
.op-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #5a8a72; box-shadow: 0 0 0 5px rgba(90,138,114,.1); }

.op-notice-list { display: grid; gap: 12px; margin-top: 18px; }
.op-notice { --type: var(--op-project); --soft: var(--op-project-soft); position: relative; display: grid; grid-template-columns: 132px minmax(0, 1fr) 190px; min-height: 178px; overflow: hidden; border: 1px solid var(--op-line); border-radius: var(--op-radius); color: inherit; background: rgba(255,255,255,.82); text-decoration: none; box-shadow: 0 10px 30px rgba(35,56,46,.045); transition: transform 320ms var(--op-ease), box-shadow 320ms var(--op-ease), border-color 220ms ease; }
.op-notice::before { position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--type); content: ""; }
.op-notice[data-type="doctoral"] { --type: var(--op-doctoral); --soft: var(--op-doctoral-soft); }
.op-notice[data-type="talent"] { --type: var(--op-talent); --soft: var(--op-talent-soft); }
.op-notice[data-type="job"] { --type: var(--op-job); --soft: var(--op-job-soft); }
.op-notice[data-type="overseas"] { --type: var(--op-overseas); --soft: var(--op-overseas-soft); }
.op-notice:hover { border-color: color-mix(in srgb, var(--type) 34%, transparent); box-shadow: 0 18px 45px rgba(35,56,46,.1); transform: translateY(-3px); }
.op-notice-date { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; padding: 24px 16px; background: var(--soft); text-align: center; }
.op-notice-date small { color: var(--type); font-size: 9px; font-weight: 760; letter-spacing: .12em; }
.op-notice-date strong { color: var(--type); font-family: Georgia, "Times New Roman", serif; font-size: 30px; line-height: 1; }
.op-notice-date span { color: #7d8983; font-size: 9px; }
.op-notice-main { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 25px 32px; }
.op-notice-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; align-items: center; color: #7c8983; font-size: 10px; }
.op-type-chip { padding: 5px 8px; border-radius: 999px; color: var(--type); background: var(--soft); font-weight: 720; }
.op-new-chip { display: inline-flex; align-items: center; gap: 4px; color: var(--op-danger); font-weight: 760; }
.op-new-chip::before { width: 5px; height: 5px; border-radius: 50%; background: currentColor; content: ""; }
.op-notice h3 { margin: 12px 0 10px; color: var(--op-ink); font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: clamp(19px, 1.55vw, 25px); font-weight: 610; letter-spacing: -.022em; line-height: 1.45; text-wrap: pretty; }
.op-audience { margin: 0; color: var(--op-muted); font-size: 11px; line-height: 1.65; }
.op-audience b { color: #53625b; font-weight: 680; }
.op-deadline { display: flex; flex-direction: column; justify-content: center; gap: 8px; margin: 20px 20px 20px 0; padding: 19px; border: 1px solid color-mix(in srgb, var(--type) 17%, transparent); border-radius: 20px; background: color-mix(in srgb, var(--soft) 60%, white); }
.op-deadline-label { color: #7d8883; font-size: 9px; letter-spacing: .08em; }
.op-deadline strong { color: var(--type); font-size: 16px; line-height: 1.35; }
.op-deadline small { color: var(--op-muted); font-size: 10px; }
.op-deadline .op-remaining { display: inline-flex; align-items: center; gap: 6px; color: var(--op-ink); font-size: 11px; font-weight: 700; }
.op-deadline .op-remaining::before { width: 7px; height: 7px; border-radius: 50%; background: var(--type); box-shadow: 0 0 0 5px color-mix(in srgb, var(--type) 12%, transparent); content: ""; }
.op-notice[data-urgency="urgent"] .op-deadline { --type: var(--op-danger); background: #fbefed; }
.op-notice[data-urgency="soon"] .op-deadline { --type: var(--op-warning); background: #faf3e9; }
.op-loading { display: grid; gap: 12px; }
.op-loading span { height: 178px; border-radius: var(--op-radius); background: linear-gradient(100deg, rgba(255,255,255,.52) 20%, rgba(255,255,255,.96) 42%, rgba(255,255,255,.52) 64%); background-size: 240% 100%; animation: op-shimmer 1.35s linear infinite; }
@keyframes op-shimmer { to { background-position: -240% 0; } }
.op-empty { margin-top: 18px; padding: 58px 24px; border: 1px dashed rgba(38,59,50,.2); border-radius: var(--op-radius); text-align: center; }
.op-empty span { font-family: "Noto Serif SC", "Songti SC", serif; font-size: 25px; }
.op-empty p { color: var(--op-muted); font-size: 12px; }
.op-empty button { padding: 11px 16px; border: 0; border-radius: 999px; color: #fff; background: var(--op-project); cursor: pointer; }


html[data-theme="dark"] {
  --op-bg: #121614;
  --op-paper: rgba(27, 34, 30, .91);
  --op-ink: #e7eee9;
  --op-muted: #a0aaa5;
  --op-line: rgba(223, 235, 228, .12);
  --op-project-soft: #23333b;
  --op-doctoral-soft: #302b38;
  --op-talent-soft: #3b3028;
  --op-job-soft: #2c3327;
  --op-overseas-soft: #203534;
}
html[data-theme="dark"] .op-hero { background: radial-gradient(circle at 73% 31%, rgba(144,112,76,.16), transparent 30%), #151a17; }
html[data-theme="dark"] .op-toolbar { background: #1a201c; }
html[data-theme="dark"] :is(.op-search,.op-selects select,.op-notice) { background: rgba(29,36,32,.94); }

@media (max-width: 1160px) {
  .op-hero-grid { grid-template-columns: .82fr 1.18fr; gap: 38px; }
  .op-hero-visual { height: 350px; }
  .op-toolbar { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); }
  .op-selects { grid-column: 1 / -1; justify-content: flex-end; }
  .op-console-head { grid-template-columns: 1fr; gap: 14px; }
  .op-console-head > p { margin-left: 0; }
}

@media (max-width: 860px) {
  .opportunity-page .rh-shell { width: min(calc(100% - 28px), 720px); }
  .op-hero { min-height: auto; padding: 58px 0 78px; }
  .op-hero-grid { grid-template-columns: 1fr; gap: 35px; }
  .op-hero h1 { font-size: clamp(62px, 16vw, 92px); }
  .op-intro { font-size: 15px; }
  .op-hero-visual { height: 300px; }
  .op-console { margin-top: -35px; padding: 28px 20px; border-radius: 28px; }
  .op-toolbar { grid-template-columns: 1fr; padding: 10px; }
  .op-filters { margin-inline: -1px; }
  .op-selects { grid-column: auto; justify-content: stretch; }
  .op-selects label { flex: 1; }
  .op-selects select { width: 100%; }
  .op-notice { grid-template-columns: 96px minmax(0, 1fr); }
  .op-deadline { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr auto; align-items: center; margin: 0 14px 14px; }
  .op-deadline strong { font-size: 14px; }
}

@media (max-width: 560px) {
  .opportunity-page .rh-shell { width: min(calc(100% - 20px), 520px); }
  .op-hero { padding-top: 42px; }
  .op-hero-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .op-hero-facts span { display: block; }
  .op-hero-facts b { display: block; font-size: 16px; }
  .op-hero-visual { height: 235px; }
  .op-hero-visual figcaption { right: 10px; bottom: 10px; padding: 10px 13px; }
  .op-console { padding: 24px 14px; }
  .op-console-head h2 { font-size: 36px; }
  .op-search kbd { display: none; }
  .op-filter-row { overflow-x: auto; }
  .op-board-status time { display: none; }
  .op-notice { grid-template-columns: 74px minmax(0,1fr); border-radius: 22px; }
  .op-notice-date { padding-inline: 8px; }
  .op-notice-date strong { font-size: 22px; }
  .op-notice-main { padding: 22px 17px; }
  .op-notice h3 { font-size: 18px; }
  .op-deadline { grid-template-columns: 1fr auto; gap: 6px 14px; padding: 14px; }
  .op-deadline-label { grid-column: 1 / -1; }
  .op-deadline small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .op-notice, .op-loading span { animation: none; transition: none; }
}