:root {
  /* Brand / neutrals */
  --color-black: #000000;
  --color-white: #ffffff;
  --color-navy: #162f56;
  --color-navy-dark: #0f2038;

  /* Surfaces */
  --color-cream: #fff9ef;
  --color-cream-light: #fdf6e9;
  --color-blue-pale: #e1eaf0;
  --color-blue-muted: #a9c8d0;
  --color-surface: #f4f6fa;

  /* Borders */
  --color-border: #eef0f3;

  /* Text / grays */
  --color-gray: #6b7280;
  --color-gray-mid: #4a5568;
  --color-gray-light: #cbd5e0;
  --color-gray-dark: #222222;
  --color-gray-arrow: #888888;

  /* Accents */
  --color-green: #7ab42a;
  --color-gold: #8b5a00;
  --color-gold-border: #eebf34;

  /* Component aliases */
  --hj-bg: var(--color-blue-muted);
  --hj-logo-well-bg: var(--color-black);
  --hj-urgent-bg: var(--color-cream);
  --hj-urgent-color: var(--color-gold);
  --hj-urgent-border: var(--color-gold-border);
}

/* Page overrides */
.breadcrumb { display: none !important; }
.main > .container:first-of-type { padding-top: 0 !important; }

/* Global link styles */
.main a, .main a:link, .main a:visited { color: var(--color-black); }
.main a:not(.nav-link):not(.dropdown-item):hover, .main a:not(.nav-link):not(.dropdown-item):focus, .main a:not(.nav-link):not(.dropdown-item):active { color: var(--color-black); text-decoration: underline; }

/* Legacy styles */
.avstand { margin-top: 50px; margin-bottom: 50px; margin-left: 5%; margin-right: auto; }
.section-title { font-size: 2rem; font-weight: 500; letter-spacing: 0.02em; }
.presentation-slider-wrapper { position: relative; }
.presentation-slider { scroll-behavior: smooth; gap: 1.5rem; width: 100%; }
.presentation-card { background: var(--color-cream); width: 220px; min-width: 220px; transition: box-shadow .2s; display: flex; flex-direction: column; align-items: center; }
.company-logo { height: 120px; width: 160px; object-fit: contain; background: var(--color-white); }
.event-date { font-size: 1.1rem; font-weight: 500; color: var(--color-gray-dark); }
.register-btn { margin-top: 12px; padding: .5rem 1.5rem; }
.slider-arrow { border: none; background: none; font-size: 2rem; color: var(--color-gray-arrow); cursor: pointer; width: 40px; height: 80px; opacity: .7; transition: color .2s; }
.slider-arrow:hover { color: var(--color-gray-dark); opacity: 1; }

/* Hero */
.hero-section { }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr;}
.hero-text { background: var(--color-blue-pale); padding: clamp(28px, 6vw, 72px); display: flex; align-items: center; aspect-ratio: 4 / 3; }
/* Fluid type so the text content scales with the column width and keeps the
   text panel inside its 4/3 box — both halves shrink in lockstep on resize. */
.hero-text h5 { font-size: clamp(0.9rem, 1.4vw, 1.25rem); }
.hero-text h1 { font-size: clamp(1.5rem, 3.2vw, 2.5rem); line-height: 1.15; }
.hero-wrapper { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--color-blue-pale); }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }

@media (max-width: 767px) {
  /* Image is hidden (d-none) below this width, so collapse to a single
     column and let the text panel span the full hero width. */
  .hero-grid { grid-template-columns: 1fr; }
  .hero-text { aspect-ratio: auto; padding: 40px 28px; }
}

/* Promoted Jobs */
.hj-section { background: var(--hj-bg); padding: 40px 0; font-family: 'Poppins', sans-serif; color: var(--color-navy); }
.hj-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; align-items: start; }
.hj-sidebar { display: flex; flex-direction: column; gap: 12px; }
.hj-box { background: var(--color-white); padding: 20px; display: flex; flex-direction: column; align-items: center; }
.hj-box-img { width: 100%; height: auto; display: block; }
.hj-box-link { display: inline-block; margin-top: 12px; font-size: 13px; padding-bottom: 1px; }
.hj-box-partner { display: block; text-decoration: none !important; color: inherit !important; }
.hj-box-partner-logo { width: 100%; height: auto; display: block; margin-top: 16px; }
@media (max-width: 767px) { .hj-layout { grid-template-columns: 1fr; } }
.hj-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 24px; }
.hj-eyebrow { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-gray); font-weight: 500; margin-bottom: 8px; }
.hj-h2 { font-size: 30px; font-weight: 300; margin: 0; letter-spacing: -0.025em; }
.hj-view-all { font-size: 13px; color: var(--color-navy) !important; text-decoration: none !important; border-bottom: 1px solid var(--color-navy); padding-bottom: 1px; font-weight: 500; }
.hj-list { display: flex; flex-direction: column; gap: 12px; }
.hj-card-link { text-decoration: none !important; color: inherit !important; display: block; }
.hj-card { display: grid; grid-template-columns: 1fr auto; gap: 24px; padding: 20px; background-color: var(--color-cream); align-items: center; transition: background .15s; }
.hj-card:hover { background: var(--color-blue-pale); }
.hj-left { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.hj-tag-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.hj-tag { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-gray); font-weight: 600; }
.hj-tag-dot { color: var(--color-gray-light); font-size: 11px; }
.hj-type-tag { font-size: 11px; color: var(--color-gray); letter-spacing: 0.04em; }
.hj-featured-badge { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; background: var(--color-navy); color: var(--color-white); padding: 3px 8px; margin-left: 6px; font-weight: 600; }
.hj-role { font-size: 18px; font-weight: 600; margin: 0; letter-spacing: -0.01em; line-height: 1.3; color: var(--color-navy); }
.hj-meta-row { display: flex; gap: 8px; font-size: 13px; color: var(--color-gray-mid); align-items: center; flex-wrap: wrap; }
.hj-meta-company { font-weight: 500; color: var(--color-navy); }
.hj-meta-dot { color: var(--color-gray-light); }
.hj-right { display: flex; align-items: center; gap: 22px; }
.hj-logo-well { width: 80px; height: 80px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hj-logo-well img { width: 100%; height: 100%; object-fit: contain; }
.hj-deadline-col { text-align: right; display: flex; flex-direction: column; gap: 2px; min-width: 100px; }
.hj-deadline-label { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-gray); font-weight: 600; }
.hj-deadline-date { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; color: var(--color-navy); }
.hj-days-chip { font-size: 10px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; padding: 3px 7px; margin-top: 4px; align-self: flex-end; display: inline-block; border: 1px solid var(--color-blue-pale); color: var(--color-gray); }
.hj-days-chip.hj-urgent { color: var(--hj-urgent-color); background: var(--hj-urgent-bg); border-color: var(--hj-urgent-border); }
.hj-empty { background: var(--color-surface); padding: 32px; text-align: center; color: var(--color-gray); font-size: 14px; }

/* Promoted Jobs — mobile */
@media (max-width: 640px) {
  .hj-card { grid-template-columns: 1fr; padding: 16px; gap: 0; }
  .hj-right { order: -1; width: 100%; flex-direction: column-reverse; gap: 10px; align-items: stretch; margin-bottom: 12px; }
  .hj-logo-well { width: 100%; height: 110px; }
  .hj-deadline-col { text-align: left; flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: center; min-width: unset; }
  .hj-days-chip { margin-top: 0; align-self: center; }
}

/* Upcoming Presentations */
.upcoming-presentations-section { background: var(--color-surface); padding: 56px 0 64px; font-family: 'Poppins', sans-serif; }
.up-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 32px; gap: 24px; flex-wrap: wrap; }
.up-eyebrow { font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-gray); font-weight: 500; margin-bottom: 8px; }
.up-h2 { font-size: 36px; font-weight: 600; color: var(--color-navy); margin: 0; letter-spacing: -0.02em; }
.up-header-right { display: flex; align-items: center; gap: 24px; }
.up-view-all { color: var(--color-navy) !important; text-decoration: none !important; font-size: 14px; font-weight: 500; border-bottom: 1px solid var(--color-navy); padding-bottom: 2px; }
.up-nav { display: flex; gap: 8px; }
.up-nav-btn { width: 40px; height: 40px; border: 1.5px solid var(--color-navy); background: var(--color-white); color: var(--color-navy); font-size: 18px; cursor: pointer; border-radius: 0; transition: background .15s, color .15s; }
.up-nav-btn:hover:not(:disabled) { background: var(--color-navy); color: var(--color-white); }
.up-nav-btn:disabled { opacity: .35; cursor: not-allowed; }
.up-viewport { overflow: hidden; }
.up-track { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; transition: transform .4s ease; }
.up-track.is-carousel { display: flex; align-items: stretch; }
.up-track.is-carousel > .up-card { flex: 0 0 calc((100% - 40px) / 3); height: auto; }
@media (max-width: 991px) { .up-track.is-carousel > .up-card { flex: 0 0 calc((100% - 20px) / 2); } }
@media (max-width: 700px) { .up-track.is-carousel > .up-card { flex: 0 0 100%; } }
.up-card { background: var(--color-white); border: 1px solid var(--color-blue-pale); display: flex; flex-direction: column; position: relative; transition: transform .2s, box-shadow .2s; }
.up-badge { position: absolute; top: 12px; right: 12px; background: var(--color-navy); color: var(--color-white); font-size: 10px; letter-spacing: 0.12em; padding: 4px 8px; font-weight: 600; z-index: 1; }
.up-logo-well { background: var(--color-white); height: 160px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--color-surface); padding: 16px; }
.up-logo-well img { max-width: 100%; max-height: 100%; object-fit: contain; }
.up-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.up-date-row { display: flex; align-items: center; gap: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--color-border); }
.up-date-big { font-size: 36px; font-weight: 300; color: var(--color-navy); line-height: 1; font-feature-settings: "tnum"; }
.up-date-month { font-size: 13px; font-weight: 600; color: var(--color-navy); text-transform: uppercase; letter-spacing: 0.06em; }
.up-date-time { font-size: 12px; color: var(--color-gray); margin-top: 2px; }
.up-company { font-size: 16px; font-weight: 600; color: var(--color-navy); margin: 0; }
.up-title { font-size: 13px; color: var(--color-gray-mid); margin: 0; line-height: 1.5; min-height: 39px; }
.up-meta { display: flex; gap: 14px; font-size: 12px; color: var(--color-gray); }
.up-meta-item { display: inline-flex; align-items: center; gap: 5px; }
.up-cap-row { margin-top: 6px; }
.up-cap-bar { height: 4px; background: var(--color-border); overflow: hidden; }
.up-cap-fill { height: 100%; background: var(--color-green); transition: width .3s; }
.up-cap-fill.is-full { background: var(--color-navy); }
.up-cap-label { font-size: 11px; color: var(--color-gray); margin-top: 6px; }
.up-btn { margin-top: auto; padding: 11px 0; font-size: 13px; font-weight: 500; cursor: pointer; border-radius: 0; letter-spacing: 0.02em; background: var(--color-navy); color: var(--color-white) !important; border: 1.5px solid var(--color-navy); text-align: center; text-decoration: none !important; transition: background .15s, color .15s; display: block; }
.up-btn:hover { background: var(--color-navy-dark); }
.up-btn-outline { background: var(--color-white); color: var(--color-navy) !important; }
.up-btn-outline:hover { background: var(--color-navy); color: var(--color-white) !important; }

/* Upcoming Presentations — hide clones on desktop/tablet */
@media (min-width: 701px) {
  .up-card[data-clone] { display: none; }
}

/* Upcoming Presentations — mobile */
@media (max-width: 700px) {
  .up-title { display: none; }
  .up-track.is-carousel { gap: 0; }
}

/* Upcoming Presentations — empty state */
.no-events-info-box {
  background: linear-gradient(135deg, var(--color-cream) 0%, var(--color-cream-light) 100%);
  border-radius: 15px;
  padding: 2.5rem;
  border: 1px solid var(--color-black);
}