/* Landing styles loaded after the page-specific club shelf rules. */
/* The landing Clubs panel has no top badge, so let the active information card
   use the full stage while retaining one adjacent-card cue for navigation. */
@media (min-width: 768px) {
  #offer-panel-clubs .offer-club-shelf {
    inset: 0.75rem !important;
    padding: 0.25rem 0.35rem;
    scroll-padding-inline: 0.35rem;
  }

  #offer-panel-clubs .offer-club-shelf-card.is-active {
    flex-basis: min(680px, calc(100% - 5.5rem));
    min-width: min(680px, calc(100% - 5.5rem));
    scroll-margin-inline: 0.35rem;
  }

  #offer-panel-clubs .offer-club-expanded {
    gap: clamp(1.5rem, 3vh, 2.5rem);
    justify-content: space-between;
    padding: clamp(1.75rem, 3vw, 2.75rem);
  }
}

@media (max-width: 767px) {
  #offer-panel-clubs .offer-club-shelf-card,
  #offer-panel-clubs .offer-club-shelf-card.is-active {
    flex-basis: min(86vw, 420px);
    height: var(--offer-mobile-card-height);
    min-width: min(86vw, 420px);
    width: min(86vw, 420px);
  }
}

.offer-project-poster {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: inherit;
  opacity: 1;
  transition: opacity 180ms ease;
}
.offer-project-clip.has-loaded-iframe .offer-project-poster {
  opacity: 0;
  pointer-events: none;
}
.offer-project-clip:not(.has-loaded-iframe) .offer-project-iframe {
  opacity: 0;
  pointer-events: none;
}
.offer-project-carousel {
  --project-card-vertical-inset: 6%;
  --project-center-half-width: 120px;
  display: block !important;
  overflow: visible;
  perspective: 1000px;
  position: absolute;
  transform-style: preserve-3d;
  touch-action: pan-y;
}

.offer-project-hit-area {
  -webkit-tap-highlight-color: transparent;
  appearance: none;
  background: transparent;
  border: 0;
  bottom: var(--project-card-vertical-inset);
  cursor: pointer;
  padding: 0;
  position: absolute;
  top: var(--project-card-vertical-inset);
  touch-action: pan-y;
  width: max(28px, calc(50% - var(--project-center-half-width) - 2px));
  z-index: 8;
}

.offer-project-hit-area-left {
  left: 0;
}

.offer-project-hit-area-right {
  right: 0;
}

.offer-project-hit-area:focus-visible {
  border-radius: 20px;
  outline: 2px solid rgba(237, 28, 36, 0.72);
  outline-offset: -2px;
}

#offer-panel-projects {
  /* `contain: paint` on the generic panel clips the Project card's outline
     and shadow at the panel's top and bottom edges. The outer desktop stage
     still provides the final boundary. */
  contain: layout style;
  overflow: visible;
}
.offer-project-clip {
  position: absolute !important;
  left: 50%;
  top: 50%;
  height: 88% !important;
  max-height: none !important;
  border-radius: 24px !important;
  isolation: isolate;
  overflow: hidden !important;
  transform-style: preserve-3d;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
              opacity 420ms ease,
              filter 420ms ease,
              border-color 420ms ease;
  will-change: transform, opacity;
  touch-action: pan-y;
}
.offer-project-clip iframe,
.offer-project-clip .offer-project-poster,
.offer-project-clip .offer-project-video {
  border-radius: inherit;
}
.offer-project-clip.is-video-media .offer-project-poster,
.offer-project-clip.is-video-media .offer-project-video {
  object-fit: contain;
}
.offer-project-clip::after {
  border: 1px solid rgba(17, 19, 24, 0.12);
  border-radius: inherit;
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 12;
}
.offer-project-clip.is-local-video .offer-project-video {
  display: block !important;
  background: #000;
}
.offer-project-clip:not(.is-center) iframe {
  pointer-events: none;
}
.offer-project-clip:not(.is-center) {
  cursor: pointer;
  pointer-events: auto;
}
.offer-project-clip.is-center {
  z-index: 4;
  opacity: 1;
  border-color: rgba(255, 255, 255, 0.3);
  filter: saturate(1) brightness(1);
  transform: translate3d(-50%, -50%, 0) rotateY(0deg) scale(1);
}
.offer-project-clip.is-left {
  z-index: 2;
  opacity: 0.72;
  border-color: rgba(255, 255, 255, 0.14);
  filter: saturate(0.78) brightness(0.84);
  transform: translate3d(-116%, -50%, 0) rotateY(34deg) scale(0.76);
}
.offer-project-clip.is-right {
  z-index: 2;
  opacity: 0.72;
  border-color: rgba(255, 255, 255, 0.14);
  filter: saturate(0.78) brightness(0.84);
  transform: translate3d(16%, -50%, 0) rotateY(-34deg) scale(0.76);
}
.offer-instagram-embed-shell {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scrollbar-color: rgba(255, 255, 255, 0.24) transparent;
}
.offer-instagram-embed-shell::-webkit-scrollbar {
  display: none;
}

.offer-media-controls {
  align-items: center;
  display: flex;
  inset: 50% 0.75rem auto;
  justify-content: space-between;
  pointer-events: none;
  position: absolute;
  transform: translateY(-50%);
  z-index: 20;
}

.offer-media-controls[hidden] {
  display: none;
}

.offer-media-control {
  align-items: center;
  -webkit-appearance: none;
  appearance: none;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 9999px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
  color: #111318;
  cursor: pointer;
  display: inline-flex;
  font-size: 1.15rem;
  font-weight: 800;
  height: 2.75rem;
  justify-content: center;
  line-height: 1;
  pointer-events: auto;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
  width: 2.75rem;
}

.offer-media-control:hover {
  background: #fff;
  transform: scale(1.06);
}

.offer-media-control:active {
  transform: scale(0.96);
}

.offer-media-control:focus-visible {
  outline: 3px solid rgba(255, 91, 91, 0.72);
  outline-offset: 3px;
}

.offer-media-control-dark {
  background: rgba(17, 19, 24, 0.86);
  border-color: rgba(255, 255, 255, 0.32);
  color: #fff;
}

.offer-media-control-dark:hover {
  background: #111318;
}

.offer-instagram-carousel {
  position: relative;
  height: 100%;
  overflow: hidden;
  perspective: 1000px;
  transform-style: preserve-3d;
  touch-action: pan-y;
}
.offer-instagram-post-card {
  position: absolute;
  left: 50%;
  top: 50%;
  height: min(calc(100% - 8px), 700px);
  width: min(54vw, 430px);
  min-width: 320px;
  padding: 10px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
              opacity 420ms ease,
              filter 420ms ease,
              border-color 420ms ease;
  will-change: transform, opacity;
  box-sizing: border-box;
  transform-origin: center center;
  backface-visibility: hidden;
}
.offer-instagram-post-card.is-center {
  z-index: 4;
  opacity: 1;
  filter: saturate(1) brightness(1);
  border-color: rgba(255, 255, 255, 0.28);
  cursor: default;
  transform: translate3d(-50%, -50%, 0) rotateY(0deg) scale(1);
}
.offer-instagram-post-card.is-center.has-embed {
  height: min(calc(100% - 8px), 700px);
  padding: 0;
  overflow: hidden;
  border-color: transparent;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
  backdrop-filter: none;
}
.offer-instagram-post-card.is-left {
  z-index: 2;
  opacity: 0.78;
  border-color: transparent;
  filter: saturate(0.82) brightness(0.86);
  transform: translate3d(-116%, -50%, -90px) rotateY(34deg) scale(0.78);
}
.offer-instagram-post-card.is-right {
  z-index: 2;
  opacity: 0.78;
  border-color: transparent;
  filter: saturate(0.82) brightness(0.86);
  transform: translate3d(16%, -50%, -90px) rotateY(-34deg) scale(0.78);
}
.offer-instagram-post-card.is-back {
  z-index: 1;
  opacity: 0.44;
  border-color: transparent;
  filter: saturate(0.68) brightness(0.72);
  transform: translate3d(-50%, -50%, -170px) rotateY(0deg) scale(0.62);
}
.offer-instagram-post-scroll {
  display: none;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 20px;
  background: #fff;
  padding: 0 0 18px;
  overscroll-behavior: contain;
  scrollbar-width: none;
}
.offer-instagram-post-scroll::-webkit-scrollbar {
  display: none;
}
.offer-instagram-post-card.is-center.has-embed .offer-instagram-post-scroll {
  display: block;
}
.offer-instagram-post-card.is-center.has-embed .offer-instagram-preview {
  display: none;
}
.offer-instagram-preview {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 18px;
  background: #fff;
  padding: 22px;
  color: #111827;
  overflow: hidden;
}
.offer-instagram-preview-mark {
  display: inline-flex;
  height: 42px;
  width: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #f97316, #ef4444 50%, #a855f7);
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}
.offer-instagram-preview-lines span {
  display: block;
  height: 10px;
  border-radius: 999px;
  background: #e5e7eb;
}
.offer-instagram-embed-card {
  display: flex;
  position: relative;
  min-height: 100%;
  min-width: 0;
  align-items: flex-start;
  justify-content: center;
}
.offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card::before {
  content: "";
  position: absolute;
  inset: 18px;
  z-index: 2;
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(243, 244, 246, 0.72), rgba(255, 255, 255, 0.96), rgba(243, 244, 246, 0.72)),
    linear-gradient(#e5e7eb 0 0) 24px 28px / 44px 44px no-repeat,
    linear-gradient(#e5e7eb 0 0) 84px 30px / 150px 12px no-repeat,
    linear-gradient(#f3f4f6 0 0) 84px 52px / 112px 10px no-repeat,
    linear-gradient(#f3f4f6 0 0) 24px 104px / calc(100% - 48px) 220px no-repeat,
    #fff;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
  animation: katchup-instagram-loading-pulse 1.15s ease-in-out infinite;
  pointer-events: none;
}
.offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  transform: translate(-50%, -50%);
  width: 72px;
  height: 72px;
  border: 1px solid rgba(237, 28, 36, 0.16);
  border-radius: 9999px;
  background:
    rgba(255, 255, 255, 0.96)
    url("/icon-transparent.svg")
    center / 42px 42px
    no-repeat;
  box-shadow:
    0 14px 34px rgba(17, 24, 39, 0.16),
    0 0 0 0 rgba(237, 28, 36, 0.2);
  animation: katchup-instagram-icon-loading 1.15s cubic-bezier(0.22, 1, 0.36, 1) infinite;
  pointer-events: none;
}
.offer-instagram-embed-card .instagram-media,
.offer-instagram-embed-card iframe {
  display: block !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  opacity: 1;
}
.offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card .instagram-media,
.offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card iframe {
  opacity: 0;
}
.offer-instagram-post-card.is-center.has-embed.is-instagram-ready .offer-instagram-embed-card .instagram-media,
.offer-instagram-post-card.is-center.has-embed.is-instagram-ready .offer-instagram-embed-card iframe {
  opacity: 1;
  transition: opacity 180ms ease;
}
.offer-instagram-post-card.is-center.has-embed .offer-instagram-embed-card .instagram-media,
.offer-instagram-post-card.is-center.has-embed .offer-instagram-embed-card iframe {
  border-radius: 20px !important;
  overflow: hidden !important;
}
@keyframes katchup-instagram-loading-pulse {
  0%, 100% {
    opacity: 0.82;
  }
  50% {
    opacity: 1;
  }
}

@keyframes katchup-instagram-icon-loading {
  0%, 100% {
    opacity: 0.86;
    transform: translate(-50%, -50%) scale(0.94);
    box-shadow:
      0 14px 34px rgba(17, 24, 39, 0.16),
      0 0 0 0 rgba(237, 28, 36, 0.2);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.04);
    box-shadow:
      0 16px 38px rgba(17, 24, 39, 0.18),
      0 0 0 13px rgba(237, 28, 36, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card::before,
  .offer-instagram-post-card.is-center.has-embed.is-loading-instagram .offer-instagram-embed-card::after {
    animation: none;
  }
}
.offer-project-play {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 9;
  display: inline-flex;
  height: 56px;
  width: 56px;
  transform: translate(-50%, -50%);
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.92);
  color: rgb(15, 23, 42);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.32);
  transition: opacity 180ms ease, transform 180ms ease;
  -webkit-tap-highlight-color: transparent;
}
.offer-project-play:active {
  transform: translate(-50%, -50%) scale(0.95);
}
.offer-project-clip:not(.is-center) .offer-project-play,
.offer-project-clip.is-playing .offer-project-play {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 767px) {
  .offer-project-clip {
    height: var(--offer-mobile-card-height) !important;
  }
  .offer-project-carousel.is-dragging .offer-project-clip {
    transition: none !important;
  }
  .offer-project-iframe {
    display: none;
  }
  .offer-project-video {
    display: block !important;
    border-radius: inherit;
    background: #000;
  }
  .offer-project-clip.is-center {
    transform: translate3d(-50%, -50%, 0) rotateY(0deg) scale(1);
  }
  .offer-project-clip.is-left {
    transform: translate3d(-116%, -50%, 0) rotateY(34deg) scale(0.74);
  }
  .offer-project-clip.is-right {
    transform: translate3d(16%, -50%, 0) rotateY(-34deg) scale(0.74);
  }
  .offer-instagram-post-card {
    height: var(--offer-mobile-card-height);
    width: min(82vw, 360px);
    min-width: min(82vw, 360px);
    border-radius: 22px;
  }
  .offer-instagram-post-card.is-center.has-embed {
    height: var(--offer-mobile-card-height);
  }
  .offer-instagram-post-card.is-left {
    transform: translate3d(-102%, -50%, -90px) rotateY(34deg) scale(0.76);
  }
  .offer-instagram-post-card.is-right {
    transform: translate3d(2%, -50%, -90px) rotateY(-34deg) scale(0.76);
  }
  .offer-instagram-post-card.is-back {
    transform: translate3d(-50%, -50%, -170px) rotateY(0deg) scale(0.58);
  }
}

.offer-instagram-carousel {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
  justify-content: flex-start;
  overflow-x: auto;
  overflow-y: hidden;
  box-sizing: border-box;
  overflow-anchor: none;
  overscroll-behavior-inline: contain;
  padding: 0.375rem 3.25rem 0.125rem;
  perspective: none;
  scroll-behavior: smooth;
  scroll-padding-inline: 3.25rem;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  transform-style: flat;
  touch-action: auto;
}
.offer-instagram-carousel.is-auto-navigating {
  scroll-behavior: auto;
  scroll-snap-type: none;
}
.offer-instagram-carousel::-webkit-scrollbar {
  display: none;
}
.offer-instagram-post-card {
  position: relative;
  left: auto;
  top: auto;
  flex: 0 0 76px;
  width: 76px;
  min-width: 76px;
  height: 100%;
  padding: 0;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.18);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
  transform: translateY(0) !important;
  transition: flex-basis 440ms cubic-bezier(0.22, 1, 0.36, 1),
              width 440ms cubic-bezier(0.22, 1, 0.36, 1),
              min-width 440ms cubic-bezier(0.22, 1, 0.36, 1),
              opacity 260ms ease,
              border-color 260ms ease,
              box-shadow 260ms ease,
              transform 260ms ease,
              background-color 260ms ease;
  will-change: flex-basis, opacity;
  scroll-snap-align: center;
  scroll-margin-inline: 3.25rem;
}
.offer-instagram-post-card:not(.is-center):focus-visible {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.34);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24);
  outline: 2px solid rgba(255, 255, 255, 0.7);
  outline-offset: 3px;
}
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .offer-instagram-post-card:not(.is-center):hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.34);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24);
  }
}
.offer-instagram-post-card.is-center,
.offer-instagram-post-card.is-center.has-embed {
  order: initial;
  flex: 0 0 clamp(320px, 38vw, 460px);
  width: clamp(320px, 38vw, 460px);
  min-width: min(460px, 64vw);
  max-width: 460px;
  height: 100%;
  border-radius: 22px;
  opacity: 1;
  filter: none;
  transform: none !important;
}
.offer-instagram-post-card.is-center.has-embed {
  overflow: hidden;
  background: #fff;
  border-color: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}
.offer-instagram-post-card.is-left,
.offer-instagram-post-card.is-right,
.offer-instagram-post-card.is-back {
  order: initial;
  opacity: 0.94;
  filter: none;
  border-color: rgba(255, 255, 255, 0.16);
}
.offer-instagram-post-card:not(.is-center) .offer-instagram-preview {
  position: relative;
  height: 100%;
  align-items: center;
  justify-content: space-between;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.9);
  padding: 1rem 0.55rem;
  color: #111827;
}
.offer-instagram-post-card:not(.is-center)::after {
  content: attr(data-offer-instagram-source);
  position: absolute;
  left: 50%;
  top: 50%;
  width: 220px;
  transform: translate(-50%, -50%) rotate(-90deg);
  color: #111827;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-align: center;
  text-transform: uppercase;
  pointer-events: none;
  white-space: nowrap;
}
.offer-instagram-post-card:not(.is-center) .offer-instagram-preview-mark {
  height: 34px;
  width: 34px;
  border-radius: 11px;
  font-size: 14px;
}
.offer-instagram-post-card:not(.is-center) .offer-instagram-preview > div:not(:first-child),
.offer-instagram-post-card:not(.is-center) .offer-instagram-preview span {
  display: none;
}
.offer-instagram-post-card:not(.is-center) .offer-instagram-preview > div:first-child {
  width: 100%;
  justify-content: center;
}
.offer-instagram-post-card.is-center.has-embed .offer-instagram-post-scroll {
  display: block;
  border-radius: 22px;
}
.offer-instagram-post-card.is-center.has-embed .offer-instagram-embed-card .instagram-media,
.offer-instagram-post-card.is-center.has-embed .offer-instagram-embed-card iframe {
  border-radius: 22px !important;
}
@media (max-width: 767px) {
  .offer-instagram-carousel {
    display: block !important;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    perspective: 1000px;
    transform-style: preserve-3d;
    touch-action: pan-y;
  }
  .offer-instagram-carousel.is-dragging .offer-instagram-post-card {
    transition: none !important;
  }
  .offer-instagram-carousel::-webkit-scrollbar {
    display: none;
  }
  .offer-instagram-post-card {
    display: none;
    flex: none;
    height: var(--offer-mobile-card-height) !important;
    left: 50%;
    min-width: min(78vw, 380px);
    position: absolute !important;
    top: 50%;
    width: min(78vw, 380px);
    border-radius: 22px;
    transition: opacity 260ms ease,
                transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
                filter 260ms ease,
                box-shadow 260ms ease;
  }
  .offer-instagram-post-card.is-center,
  .offer-instagram-post-card.is-center.has-embed {
    display: block;
    height: var(--offer-mobile-card-height) !important;
    min-width: min(78vw, 380px);
    opacity: 1;
    transform: translate3d(-50%, -50%, 80px) rotateY(0deg) scale(1) !important;
    width: min(78vw, 380px);
    z-index: 4;
  }
  .offer-instagram-post-card.is-left,
  .offer-instagram-post-card.is-right {
    display: block;
    opacity: 0.68;
    pointer-events: auto;
    z-index: 2;
  }
  .offer-instagram-post-card.is-left {
    transform: translate3d(-116%, -50%, -90px) rotateY(34deg) scale(0.76) !important;
  }
  .offer-instagram-post-card.is-right {
    transform: translate3d(16%, -50%, -90px) rotateY(-34deg) scale(0.76) !important;
  }
  .offer-instagram-post-card.is-back {
    display: none;
  }
  .offer-instagram-post-card:not(.is-center)::after {
    width: 180px;
    font-size: 10px;
  }
  .offer-instagram-post-card:not(.is-center) .offer-instagram-preview-mark {
    height: 28px;
    width: 28px;
    border-radius: 9px;
    font-size: 12px;
  }
}

/* Projects — light editorial media rail
   Keep the uploaded project media as the focal point while matching the
   white landing canvas used by Jobs and Clubs. The neutral clip surface also
   avoids a black flash while a poster or Stream player is still loading. */
#offer-panel-projects .offer-project-backdrop {
  background-color: #f8f9fb;
  background-image:
    radial-gradient(circle at 18% 16%, rgba(237, 28, 36, 0.1), transparent 34%),
    radial-gradient(circle at 86% 84%, rgba(248, 113, 113, 0.065), transparent 38%),
    linear-gradient(145deg, #ffffff 0%, #f7f8fa 100%);
}

#offer-panel-projects .offer-project-clip {
  background: #f4f5f7;
  border-color: rgba(17, 19, 24, 0.1);
  box-shadow: 0 18px 42px rgba(17, 19, 24, 0.11);
}

#offer-panel-projects .offer-project-clip.is-center {
  border-color: rgba(237, 28, 36, 0.16);
  box-shadow: 0 22px 56px rgba(17, 19, 24, 0.14);
}

#offer-panel-projects .offer-project-clip.is-left,
#offer-panel-projects .offer-project-clip.is-right {
  border-color: rgba(17, 19, 24, 0.08);
  filter: saturate(0.9) brightness(0.98);
}

/* Jobs + Clubs — flat editorial card rails
   Keep the existing data attributes and active-card lifecycle, but replace
   the narrow 76px "book spines" and 3D rotation with readable preview cards.
   The active item remains prominent without changing the surrounding stage. */
#offer-panel-jobs.offer-flat-carousel-panel > .absolute.inset-0:first-child {
  background:
    radial-gradient(circle at 82% 14%, rgba(237, 28, 36, 0.11), transparent 34%),
    radial-gradient(circle at 16% 88%, rgba(248, 113, 113, 0.08), transparent 38%),
    linear-gradient(145deg, #ffffff 0%, #f8f9fb 100%) !important;
}

#offer-panel-clubs.offer-flat-carousel-panel > .absolute.inset-0:first-child {
  background:
    radial-gradient(circle at 18% 18%, rgba(237, 28, 36, 0.1), transparent 34%),
    radial-gradient(circle at 86% 82%, rgba(248, 113, 113, 0.07), transparent 38%),
    linear-gradient(145deg, #ffffff 0%, #f7f8fa 100%) !important;
}

#offer-panel-jobs .offer-instagram-carousel,
#offer-panel-clubs .offer-club-shelf {
  display: block;
  overflow: hidden;
  padding: 0;
  perspective: none;
  scroll-behavior: auto;
  scroll-snap-type: none;
  touch-action: pan-y;
  transform-style: flat;
}

#offer-panel-jobs .offer-instagram-carousel {
  --offer-rail-shift: clamp(300px, 24vw, 350px);
  --offer-rail-far-shift: clamp(450px, 36vw, 540px);
  position: relative;
}

#offer-panel-jobs [data-offer-instagram-empty] p {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(17, 19, 24, 0.1);
  box-shadow: 0 14px 34px rgba(17, 19, 24, 0.08);
  color: #565a63;
}

#offer-panel-clubs .offer-club-shelf {
  --offer-rail-shift: clamp(330px, 26vw, 380px);
  --offer-rail-far-shift: clamp(490px, 39vw, 580px);
  inset: 0.75rem !important;
  position: absolute;
}

#offer-panel-jobs .offer-instagram-post-card {
  backface-visibility: hidden;
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(17, 19, 24, 0.09);
  border-radius: 24px;
  box-shadow: 0 16px 38px rgba(17, 19, 24, 0.09);
  contain: layout style;
  display: block;
  flex: none;
  height: 100%;
  left: 50%;
  min-width: min(460px, calc(100% - 5rem));
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0) scale(0.78) !important;
  transform-origin: center;
  transition:
    transform 580ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: min(460px, calc(100% - 5rem));
  will-change: transform, opacity;
  z-index: 0;
}

#offer-panel-jobs .offer-instagram-post-card.is-center,
#offer-panel-jobs .offer-instagram-post-card.is-center.has-embed {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.16);
  box-shadow: 0 22px 56px rgba(17, 19, 24, 0.14);
  height: 100%;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, -50%, 0) scale(1) !important;
  z-index: 4;
}

#offer-panel-jobs .offer-instagram-post-card.is-left {
  opacity: 0.66;
  pointer-events: auto;
  transform: translate3d(calc(-50% - var(--offer-rail-shift)), -50%, 0) scale(0.54) !important;
  z-index: 2;
}

#offer-panel-jobs .offer-instagram-post-card.is-right {
  opacity: 0.66;
  pointer-events: auto;
  transform: translate3d(calc(-50% + var(--offer-rail-shift)), -50%, 0) scale(0.54) !important;
  z-index: 2;
}

#offer-panel-jobs .offer-instagram-post-card.is-far-left {
  opacity: 0.08;
  transform: translate3d(calc(-50% - var(--offer-rail-far-shift)), -50%, 0) scale(0.42) !important;
  z-index: 1;
}

#offer-panel-jobs .offer-instagram-post-card.is-far-right {
  opacity: 0.08;
  transform: translate3d(calc(-50% + var(--offer-rail-far-shift)), -50%, 0) scale(0.42) !important;
  z-index: 1;
}

#offer-panel-jobs .offer-instagram-post-card.is-back {
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(0.78) !important;
  z-index: 0;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center)::after {
  content: none;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview {
  align-items: stretch;
  background: #fff;
  border-radius: 22px;
  justify-content: space-between;
  padding: 1.25rem;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview > div,
#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview > div:not(:first-child) {
  display: block;
  width: auto;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview > div:first-child {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview span {
  display: inline-flex;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center) .offer-instagram-preview-lines span {
  display: block;
}

#offer-panel-jobs .offer-instagram-post-card:not(.is-center):hover,
#offer-panel-jobs .offer-instagram-post-card:not(.is-center):focus-visible {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.25);
  box-shadow: 0 20px 46px rgba(17, 19, 24, 0.13);
  opacity: 0.82;
}

#offer-panel-jobs .offer-instagram-post-card.is-left:hover,
#offer-panel-jobs .offer-instagram-post-card.is-left:focus-visible {
  transform: translate3d(calc(-50% - var(--offer-rail-shift)), -50%, 0) scale(0.54) !important;
}

#offer-panel-jobs .offer-instagram-post-card.is-right:hover,
#offer-panel-jobs .offer-instagram-post-card.is-right:focus-visible {
  transform: translate3d(calc(-50% + var(--offer-rail-shift)), -50%, 0) scale(0.54) !important;
}

#offer-panel-clubs .offer-club-shelf-card {
  backface-visibility: hidden;
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(17, 19, 24, 0.09);
  border-radius: 24px;
  box-shadow: 0 16px 38px rgba(17, 19, 24, 0.09);
  contain: layout style;
  display: block;
  flex: none;
  height: 100%;
  left: 50%;
  min-width: min(540px, calc(100% - 5rem));
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0) scale(0.78) !important;
  transform-origin: center;
  transition:
    transform 580ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: min(540px, calc(100% - 5rem));
  will-change: transform, opacity;
  z-index: 0;
}

#offer-panel-clubs .offer-club-shelf-card.is-active {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.14);
  box-shadow: 0 22px 56px rgba(17, 19, 24, 0.13);
  height: 100%;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, -50%, 0) scale(1) !important;
  z-index: 4;
}

#offer-panel-clubs .offer-club-shelf-card.is-left {
  opacity: 0.66;
  pointer-events: auto;
  transform: translate3d(calc(-50% - var(--offer-rail-shift)), -50%, 0) scale(0.5) !important;
  z-index: 2;
}

#offer-panel-clubs .offer-club-shelf-card.is-right {
  opacity: 0.66;
  pointer-events: auto;
  transform: translate3d(calc(-50% + var(--offer-rail-shift)), -50%, 0) scale(0.5) !important;
  z-index: 2;
}

#offer-panel-clubs .offer-club-shelf-card.is-far-left {
  opacity: 0.08;
  transform: translate3d(calc(-50% - var(--offer-rail-far-shift)), -50%, 0) scale(0.4) !important;
  z-index: 1;
}

#offer-panel-clubs .offer-club-shelf-card.is-far-right {
  opacity: 0.08;
  transform: translate3d(calc(-50% + var(--offer-rail-far-shift)), -50%, 0) scale(0.4) !important;
  z-index: 1;
}

#offer-panel-clubs .offer-club-shelf-card.is-back {
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(0.78) !important;
  z-index: 0;
}

#offer-panel-clubs .offer-club-shelf-card:not(.is-active):hover,
#offer-panel-clubs .offer-club-shelf-card:not(.is-active):focus-visible {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.24);
  box-shadow: 0 20px 46px rgba(17, 19, 24, 0.13);
  opacity: 0.82;
}

#offer-panel-clubs .offer-club-spine {
  align-items: flex-start;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(252, 247, 247, 0.94));
  display: flex !important;
  flex-direction: column;
  gap: 0;
  inset: 0;
  justify-content: flex-start;
  opacity: 1;
  padding: 1.35rem;
  position: absolute;
  transition: opacity 240ms ease, visibility 0s linear 0s;
  visibility: visible;
}

#offer-panel-clubs .offer-club-spine::before {
  color: #ed1c24;
  content: "CAMPUS COMMUNITY";
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.13em;
  margin-bottom: 1rem;
}

#offer-panel-clubs .offer-club-spine > div:first-child {
  height: 3.5rem;
  width: 3.5rem;
}

#offer-panel-clubs .offer-club-spine-name {
  color: #17191e;
  display: -webkit-box;
  font-size: 1.05rem;
  font-weight: 850;
  line-height: 1.25;
  margin-top: 1.1rem;
  max-height: none;
  overflow: hidden;
  text-align: left;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  writing-mode: horizontal-tb;
}

#offer-panel-clubs .offer-club-spine::after {
  color: #6b707a;
  content: "View club details  \2192";
  font-size: 0.75rem;
  font-weight: 750;
  margin-top: auto;
}

#offer-panel-clubs .offer-club-spine > span:last-child {
  display: none;
}

#offer-panel-clubs .offer-club-expanded {
  background: #fff;
  display: flex !important;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 260ms ease, visibility 0s linear 260ms;
  visibility: hidden;
}

#offer-panel-clubs .offer-club-shelf-card.is-active .offer-club-spine {
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease, visibility 0s linear 180ms;
  visibility: hidden;
}

#offer-panel-clubs .offer-club-shelf-card.is-active .offer-club-expanded {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 300ms ease 100ms, visibility 0s linear 0s;
  visibility: visible;
}

#offer-panel-events .offer-media-control,
#offer-panel-projects .offer-media-control,
#offer-panel-jobs .offer-media-control,
#offer-panel-clubs .offer-media-control {
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(17, 19, 24, 0.12);
  box-shadow: 0 12px 30px rgba(17, 19, 24, 0.14);
  color: #202228;
}

#offer-panel-events [data-offer-carousel-next="events"],
#offer-panel-projects [data-offer-carousel-next="projects"],
#offer-panel-jobs [data-offer-carousel-next="jobs"],
#offer-panel-clubs [data-offer-carousel-next="clubs"] {
  color: #ed1c24;
}

@media (max-width: 767px) {
  #offer-panel-jobs .offer-instagram-carousel,
  #offer-panel-clubs .offer-club-shelf {
    display: block;
    gap: 0;
    inset: 0 !important;
    overflow: hidden;
    padding: 0;
    perspective: none;
  }

  #offer-panel-jobs .offer-instagram-post-card,
  #offer-panel-clubs .offer-club-shelf-card,
  #offer-panel-clubs .offer-club-shelf-card.is-active {
    height: var(--offer-mobile-card-height) !important;
    min-width: min(82vw, 380px);
    width: min(82vw, 380px);
  }

  #offer-panel-jobs .offer-instagram-post-card.is-center,
  #offer-panel-jobs .offer-instagram-post-card.is-center.has-embed,
  #offer-panel-clubs .offer-club-shelf-card.is-active {
    flex-basis: min(82vw, 380px);
    min-width: min(82vw, 380px);
    transform: translate3d(-50%, -50%, 0) scale(1) !important;
    width: min(82vw, 380px);
  }

  #offer-panel-jobs .offer-instagram-post-card.is-left,
  #offer-panel-clubs .offer-club-shelf-card.is-left {
    opacity: 0.56;
    transform: translate3d(-112%, -50%, 0) scale(0.92) !important;
  }

  #offer-panel-jobs .offer-instagram-post-card.is-right,
  #offer-panel-clubs .offer-club-shelf-card.is-right {
    opacity: 0.56;
    transform: translate3d(12%, -50%, 0) scale(0.92) !important;
  }

  #offer-panel-jobs .offer-instagram-post-card.is-back,
  #offer-panel-jobs .offer-instagram-post-card.is-far-left,
  #offer-panel-jobs .offer-instagram-post-card.is-far-right,
  #offer-panel-clubs .offer-club-shelf-card.is-back,
  #offer-panel-clubs .offer-club-shelf-card.is-far-left,
  #offer-panel-clubs .offer-club-shelf-card.is-far-right {
    display: none;
  }

  #offer-panel-clubs .offer-club-shelf-card.is-left .offer-club-spine,
  #offer-panel-clubs .offer-club-shelf-card.is-right .offer-club-spine {
    display: flex;
    opacity: 1;
    visibility: visible;
  }

  #offer-panel-clubs .offer-club-shelf-card.is-left .offer-club-expanded,
  #offer-panel-clubs .offer-club-shelf-card.is-right .offer-club-expanded {
    display: flex;
    opacity: 0;
    visibility: hidden;
  }

  #offer-panel-jobs .offer-instagram-post-card.is-left:hover,
  #offer-panel-jobs .offer-instagram-post-card.is-left:focus-visible,
  #offer-panel-clubs .offer-club-shelf-card.is-left:hover,
  #offer-panel-clubs .offer-club-shelf-card.is-left:focus-visible {
    transform: translate3d(-112%, -50%, 0) scale(0.92) !important;
  }

  #offer-panel-jobs .offer-instagram-post-card.is-right:hover,
  #offer-panel-jobs .offer-instagram-post-card.is-right:focus-visible,
  #offer-panel-clubs .offer-club-shelf-card.is-right:hover,
  #offer-panel-clubs .offer-club-shelf-card.is-right:focus-visible {
    transform: translate3d(12%, -50%, 0) scale(0.92) !important;
  }
}

@media (min-width: 768px) {
  #offer-panel-projects .offer-project-carousel,
  #offer-panel-jobs .offer-instagram-embed-shell,
  #offer-panel-clubs .offer-club-shelf {
    inset: 0.75rem !important;
  }

  #offer-panel-projects .offer-project-clip {
    /* Portrait video reads taller than the editorial Jobs and Clubs cards
       when it touches both rail edges. Preserve the shared stage height but
       give the media itself equal visual breathing room. */
    height: calc(100% - 1rem) !important;
  }

  .offer-project-video,
  .offer-project-play {
    display: none !important;
  }
}

/* What We Offer — scroll-triggered fade-up. Desktop only to keep mobile snappy. */
@media (min-width: 1024px) {
  .offer-animate {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
    transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, opacity;
  }
  .offer-animate.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* 2026 KATCHUP landing ---------------------------------------------------
   Shared structural primitives. The active light-theme palette and visual
   treatments are declared together in the composition section below. */

.landing-hero {
  isolation: isolate;
  min-height: 100vh;
  min-height: 100dvh;
}

.landing-hero-glow {
  pointer-events: none;
  position: absolute;
  transform: translateZ(0);
}

.landing-hero-vignette {
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.landing-hero-content {
  align-items: center;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  justify-content: center;
}

.landing-hero-title {
  text-wrap: balance;
}

.landing-hero-trust {
  font-size: clamp(0.95rem, 1.35vw, 1.15rem);
  line-height: 1.55;
  max-width: 720px;
}

.landing-hero-trust strong {
  font-weight: 750;
}

.landing-job-search {
  align-items: center;
  border-style: solid;
  border-width: 1px;
  border-radius: 1.5rem;
  display: grid;
  gap: 0.9rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  max-width: 920px;
  padding: 0.62rem;
  transition: box-shadow 180ms ease, transform 180ms ease;
  width: 100%;
}

.landing-job-search:focus-within {
  transform: translateY(-1px);
}

.landing-job-search-icon {
  color: #17181c;
  height: 1.8rem;
  margin-left: 0.55rem;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  width: 1.8rem;
}

.landing-job-search-input {
  background: transparent;
  border: 0;
  color: #17181c;
  font-size: clamp(0.95rem, 1.5vw, 1.15rem);
  font-weight: 500;
  min-width: 0;
  outline: 0;
  padding: 0;
  width: 100%;
}

.landing-job-search-input::placeholder {
  color: #74757c;
  opacity: 1;
}

.landing-job-search-submit {
  align-items: center;
  border: 0;
  border-radius: 0.95rem;
  cursor: pointer;
  display: flex;
  height: 3.55rem;
  justify-content: center;
  transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
  width: 3.55rem;
}

.landing-job-search-submit:hover {
  transform: translateY(-1px);
}

.landing-job-search-submit svg {
  height: 1.4rem;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  width: 1.4rem;
}

.landing-hero-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: center;
  margin-top: 1.2rem;
}

.landing-hero-filters a {
  border-style: solid;
  border-width: 1px;
  border-radius: 0.55rem;
  font-size: 0.75rem;
  font-weight: 650;
  line-height: 1;
  padding: 0.7rem 0.9rem;
  transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.landing-hero-filters a:hover {
  transform: translateY(-1px);
}

.landing-partners-label {
  align-items: center;
  display: flex;
  font-size: 0.72rem;
  font-weight: 700;
  gap: 0.65rem;
  letter-spacing: 0.04em;
  margin: 0 auto 1.25rem;
  max-width: 1280px;
  padding: 0 1.5rem;
}

.landing-partners-label span {
  background: var(--landing-red);
  border-radius: 9999px;
  box-shadow: 0 0 0 4px rgba(237, 28, 36, 0.13);
  height: 0.45rem;
  width: 0.45rem;
}

.landing-partners-mask {
  mask-image: linear-gradient(to right, transparent, #000 4rem, #000 calc(100% - 4rem), transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, #000 4rem, #000 calc(100% - 4rem), transparent);
}

.landing-partner-card {
  border-style: solid;
  border-width: 1px;
  border-radius: 1.35rem;
  height: 10.75rem;
  margin: 0 0.45rem;
  width: 14.75rem;
}

.landing-partner-card img {
  transition: filter 200ms ease, opacity 200ms ease, transform 200ms ease;
}

.landing-partner-card:hover img {
  transform: scale(1.035);
}

.landing-offer-heading,
.landing-impact-heading {
  margin-left: auto;
  margin-right: auto;
  max-width: 820px;
  text-align: center;
}

.landing-section-kicker {
  color: #ff6565;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.5;
}

.landing-offer-heading h2,
.landing-impact-heading h2 {
  color: #f8f8f9;
  font-size: clamp(2.7rem, 6vw, 5.25rem);
  font-weight: 820;
  letter-spacing: -0.06em;
  line-height: 0.98;
  margin-top: 1.35rem;
  text-wrap: balance;
}

.landing-offer-heading > p:last-child,
.landing-impact-heading > p:last-child {
  color: var(--landing-muted);
  font-size: clamp(0.98rem, 1.5vw, 1.15rem);
  line-height: 1.7;
  margin: 1.5rem auto 0;
  max-width: 680px;
}

.landing-offer-stage {
  border: 1px solid var(--landing-border);
  border-radius: 2.25rem;
  box-shadow: 0 0 0 0.75rem rgba(255, 255, 255, 0.025);
}

#what-we-offer [data-offer-caption-target] {
  color: var(--landing-muted) !important;
  margin-top: 1.2rem;
}

#what-we-offer .offer-proof-card {
  background: var(--landing-surface) !important;
  border-color: var(--landing-border) !important;
  border-radius: 1rem;
  box-shadow: none;
  color: #f7f7f8;
  transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease;
}

#what-we-offer .offer-proof-card:hover:not(.is-active) {
  background: #202127 !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  box-shadow: none;
  transform: translateY(-2px);
}

#what-we-offer .offer-proof-card.is-active {
  background: linear-gradient(145deg, #e3262d, #b90e14) !important;
  border-color: transparent !important;
  box-shadow: none;
}

#what-we-offer .offer-proof-card > p:first-child {
  color: #ff6f72 !important;
}

#what-we-offer .offer-proof-card.is-active > p:first-child {
  color: rgba(255, 255, 255, 0.72) !important;
}

#what-we-offer .offer-proof-card h3 {
  color: #fff !important;
}

#what-we-offer .offer-proof-card > p:last-child {
  color: rgba(255, 255, 255, 0.58) !important;
}

#what-we-offer .offer-proof-card.is-active > p:last-child {
  color: rgba(255, 255, 255, 0.8) !important;
}

#what-we-offer .offer-proof-card-title {
  min-height: auto;
}

#what-we-offer .offer-step:not(.is-active) {
  background: var(--landing-surface) !important;
  border-color: var(--landing-border) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

#what-we-offer .offer-step.is-active {
  background: var(--landing-red-dark) !important;
  border-color: var(--landing-red-dark) !important;
  box-shadow: none;
}

.landing-impact-section {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.landing-stats-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(3rem, 7vw, 6rem);
}

.landing-stat-card {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid var(--landing-border);
  border-radius: 1.1rem;
  display: flex;
  flex-direction: column;
  min-height: 12rem;
  min-width: 0;
  padding: clamp(1.25rem, 2.4vw, 2rem);
  transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease;
}

.landing-stat-card:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.23);
  transform: translateY(-3px);
}

.landing-stat-card-accent {
  background: linear-gradient(145deg, #e3262d, #b90e14);
  border-color: transparent;
}

.landing-stat-card-accent:hover {
  background: linear-gradient(145deg, #ef3037, #c51218);
  border-color: transparent;
}

.landing-stat-index {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.1em;
}

.landing-stat-card strong {
  color: #fff;
  font-size: clamp(2.8rem, 5vw, 4.7rem);
  font-variant-numeric: tabular-nums;
  font-weight: 820;
  letter-spacing: -0.055em;
  line-height: 1;
  margin-top: auto;
  max-width: 100%;
  white-space: nowrap;
}

.landing-stat-card > p {
  color: rgba(255, 255, 255, 0.56);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.4;
  margin-top: 0.65rem;
}

.landing-stat-card-accent .landing-stat-index,
.landing-stat-card-accent > p {
  color: rgba(255, 255, 255, 0.8);
}

.landing-signoff {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
  padding: clamp(5rem, 10vw, 9rem) 1.25rem 0;
}

.landing-signoff-top {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1280px;
}

@media (min-width: 768px) {
  .landing-signoff-top {
    width: calc(100% - 1.5rem);
  }
}

.landing-signoff-kicker {
  color: #ff6565;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.15em;
}

.landing-signoff-top h2 {
  color: #f8f8f9;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-weight: 750;
  letter-spacing: -0.045em;
  line-height: 1.05;
  margin-top: 0.75rem;
}

.landing-signoff-top h2 > span,
.landing-signoff-description > span {
  display: block;
}

.landing-signoff-top h2 > span {
  white-space: nowrap;
}

.landing-signoff-description {
  color: var(--landing-muted);
  font-size: clamp(0.92rem, 1.35vw, 1.05rem);
  letter-spacing: 0;
  line-height: 1.55;
  margin-top: 1.35rem;
}

.landing-signoff-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.landing-signoff-links a {
  align-items: center;
  border: 1px solid var(--landing-border);
  border-radius: 9999px;
  color: rgba(255, 255, 255, 0.72);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 650;
  gap: 0.5rem;
  justify-content: center;
  min-height: 2.65rem;
  padding: 0.65rem 0.9rem;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.landing-signoff-links svg {
  height: 1.05rem;
  width: 1.05rem;
}

.landing-signoff-links a:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.3);
  color: #fff;
}

.landing-signoff-logo {
  margin: clamp(5rem, 10vw, 9rem) -1.25rem 0;
  overflow: hidden;
}

.landing-signoff-logo-image {
  display: block;
  height: auto;
  left: 50%;
  max-width: none;
  position: relative;
  transform: translateX(-50%);
  width: max(100%, 44rem);
}

.landing-job-search-submit:focus-visible,
.landing-hero-filters a:focus-visible,
.landing-signoff-links a:focus-visible {
  outline: 3px solid rgba(255, 110, 110, 0.7);
  outline-offset: 3px;
}

/* The landing hero starts underneath the fixed header so its canvas is the
   header's backdrop instead of the layout's default white top padding. */
body:is([data-current-path="/"], [data-current-path="/student"]) #main-wrapper > main {
  padding-top: 0 !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] {
  background: transparent !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] [data-landing-header-shell] {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

@media (min-width: 1024px) {

  .katchup-landing .hero-animate {
    animation: landingHeroFadeUp 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: calc(0.08s + (var(--delay, 0) * 0.075s));
    opacity: 0;
    transform: translate3d(0, 24px, 0);
  }

  #what-we-offer [data-offer-sticky] {
    align-items: center;
    column-gap: clamp(2rem, 5vw, 5rem);
    display: grid !important;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.72fr);
  }

  #what-we-offer [data-offer-card-window] {
    display: block !important;
    margin: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  #what-we-offer [data-offer-card-strip] {
    display: grid !important;
    gap: 0.75rem !important;
  }

  #what-we-offer .offer-proof-card {
    flex: none;
    min-height: 0 !important;
    padding: 1.35rem !important;
    width: 100%;
  }

  #what-we-offer .offer-proof-card h3 {
    font-size: 1.05rem !important;
    line-height: 1.3;
    margin-top: 0.45rem !important;
  }

  #what-we-offer .offer-proof-card > p:last-child {
    font-size: 0.76rem !important;
    line-height: 1.5;
    margin-top: 0.45rem !important;
  }

  .landing-stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@keyframes landingHeroFadeUp {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .landing-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .landing-job-search {
    border-radius: 1.1rem;
    gap: 0.55rem;
    margin-top: 1.8rem;
    padding: 0.45rem;
  }

  .landing-job-search-icon {
    height: 1.3rem;
    margin-left: 0.4rem;
    width: 1.3rem;
  }

  .landing-job-search-input {
    font-size: 0.88rem;
  }

  .landing-job-search-submit {
    border-radius: 0.75rem;
    height: 3rem;
    width: 3rem;
  }

  .landing-partners-label {
    font-size: 0.63rem;
  }

  .landing-partners-mask {
    mask-image: linear-gradient(to right, transparent, #000 1.5rem, #000 calc(100% - 1.5rem), transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, #000 1.5rem, #000 calc(100% - 1.5rem), transparent);
  }

  .landing-partner-card {
    border-radius: 1rem;
    height: 7.5rem;
    margin: 0 0.32rem;
    width: 10rem;
  }

  .landing-offer-heading,
  .landing-impact-heading {
    text-align: left;
  }

  .landing-offer-heading > p:last-child,
  .landing-impact-heading > p:last-child {
    margin-left: 0;
  }

  .landing-stat-card {
    min-height: 10rem;
    padding: 1.05rem;
  }

  .landing-stat-card strong {
    font-size: clamp(2.3rem, 12vw, 3.4rem);
  }

  .landing-signoff-top {
    align-items: flex-start;
    flex-direction: column;
  }

  .landing-signoff-logo {
    margin-top: 5rem;
  }

  /* The desktop wordmark deliberately grows past a minimum width for impact.
     On phones that minimum would crop both ends, so fit the full SVG inside
     the viewport with a small breathing margin instead. */
  .landing-signoff-logo-image {
    left: auto;
    margin-inline: auto;
    max-width: 100%;
    transform: none;
    width: calc(100% - 2rem);
  }
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer {
  border-top-style: solid;
  border-top-width: 1px;
}

/* 2026 light career-network composition ---------------------------------
   The landing page uses white as its trust-building base and reserves the
   KATCHUP red for navigation, emphasis, and conversion points. Keep the
   active palette and visual treatments consolidated in this section. */
.katchup-landing {
  --landing-canvas: #fcfbfb;
  --landing-surface: #ffffff;
  --landing-surface-raised: #ffffff;
  --landing-border: rgba(24, 25, 30, 0.11);
  --landing-muted: #686b73;
  --landing-red: #ed1c24;
  --landing-red-dark: #d9161e;
  background: var(--landing-canvas);
  color: #17181c;
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
}

.katchup-landing .landing-hero {
  background:
    radial-gradient(ellipse 45% 38% at 50% 39%, rgba(237, 28, 36, 0.075), transparent 72%),
    radial-gradient(ellipse 34% 30% at 75% 24%, rgba(255, 191, 194, 0.11), transparent 74%),
    linear-gradient(180deg, #ffffff 0%, #fffdfd 62%, #fcfbfb 100%);
  color: #17181c;
}

.katchup-landing .landing-hero-glow {
  background:
    radial-gradient(ellipse 42% 32% at 51% 39%, rgba(237, 28, 36, 0.085), transparent 73%),
    radial-gradient(ellipse 32% 28% at 31% 47%, rgba(255, 222, 224, 0.18), transparent 76%);
  filter: blur(18px);
  inset: -4%;
  opacity: 1;
}

.katchup-landing .landing-hero-vignette {
  background:
    linear-gradient(to bottom, rgba(255, 255, 255, 0.3), transparent 24%, transparent 78%, rgba(252, 251, 251, 0.96) 100%),
    radial-gradient(ellipse at center, transparent 50%, rgba(255, 255, 255, 0.3) 100%);
}

.katchup-landing .landing-hero-content {
  min-height: calc(100vh - 3rem);
  min-height: calc(100dvh - 3rem);
  padding-bottom: clamp(4.5rem, 8vh, 7rem);
  padding-top: clamp(7rem, 13vh, 10.5rem);
}

.katchup-landing .landing-hero-title {
  color: #17181c;
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Narrow", sans-serif;
  font-size: clamp(4.6rem, 9.4vw, 9.2rem);
  font-stretch: condensed;
  font-weight: 900;
  letter-spacing: 0.005em;
  line-height: 0.9;
  margin-top: clamp(1rem, 3vh, 2.5rem);
}

.katchup-landing .landing-hero-title > span {
  display: block;
  white-space: nowrap;
}

.katchup-landing .landing-hero-title-subline {
  height: 0.9em;
  font-size: 1em;
  letter-spacing: 0.005em;
  line-height: 0.9;
  margin-top: 0.025em;
  overflow: hidden;
  position: relative;
}

.katchup-landing [data-hero-rotating-title] {
  --hero-title-scale: 1;
  display: inline-block;
  left: 50%;
  opacity: 1;
  position: absolute;
  top: 0;
  transform: translate3d(-50%, 0, 0) scaleX(var(--hero-title-scale));
  transform-origin: center center;
  transition:
    transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.34s ease;
  white-space: nowrap;
  will-change: transform, opacity;
}

.katchup-landing [data-hero-rotating-title].is-leaving {
  opacity: 0;
  transform: translate3d(-50%, -58%, 0) scaleX(var(--hero-title-scale));
}

.katchup-landing [data-hero-rotating-title].is-entering {
  opacity: 0;
  transform: translate3d(-50%, 58%, 0) scaleX(var(--hero-title-scale));
  transition: none;
}

.katchup-landing .landing-hero-apostrophe {
  display: inline-block;
  margin-left: 0.04em;
  margin-right: 0.015em;
}

.katchup-landing .landing-hero-title em {
  color: var(--landing-red);
  font-style: normal;
}

.katchup-landing .landing-hero-trust {
  color: #676a72;
  margin-top: clamp(1.5rem, 3.5vh, 2.35rem);
}

.katchup-landing .landing-hero-trust strong {
  color: #17181c;
}

.katchup-landing .landing-job-search {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(29, 30, 35, 0.17);
  box-shadow:
    0 22px 50px rgba(42, 27, 28, 0.075),
    0 2px 7px rgba(17, 24, 39, 0.035);
  margin-top: clamp(2rem, 4.5vh, 3rem);
}

.katchup-landing .landing-job-search:focus-within {
  border-color: rgba(237, 28, 36, 0.34);
  box-shadow:
    0 26px 56px rgba(42, 27, 28, 0.095),
    0 0 0 4px rgba(237, 28, 36, 0.075);
}

.katchup-landing .landing-job-search-submit {
  background: #f1f1f3;
  color: #42444b;
}

.katchup-landing .landing-job-search-submit:hover {
  background: var(--landing-red);
  color: #fff;
}

.katchup-landing .landing-hero-filters a {
  background: rgba(255, 255, 255, 0.7);
  border-color: rgba(24, 25, 30, 0.16);
  color: #2d2f35;
}

.katchup-landing .landing-hero-filters a:hover {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.34);
  color: #17181c;
}

.katchup-landing .landing-partners {
  background: linear-gradient(to bottom, transparent, rgba(255, 252, 252, 0.86) 22%, #fcfbfb 78%);
}

.katchup-landing .landing-partners-label {
  color: #3e4046;
}

.katchup-landing .landing-partner-card {
  background: rgba(255, 255, 255, 0.94);
  border-color: rgba(24, 25, 30, 0.055);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.68) inset,
    0 7px 22px -18px rgba(37, 24, 25, 0.24);
}

.katchup-landing .landing-partner-card img {
  filter: grayscale(1) contrast(0.92);
  opacity: 0.58;
}

.katchup-landing .landing-partner-card:hover img {
  filter: grayscale(0) contrast(1);
  opacity: 1;
}

.katchup-landing :is(.landing-offer-section, .landing-impact-section, .landing-signoff) {
  background: #fcfbfb;
  color: #17181c;
}

.katchup-landing .landing-offer-section {
  background:
    radial-gradient(ellipse 55% 31% at 50% 13%, rgba(237, 28, 36, 0.045), transparent 76%),
    #fcfbfb;
}

.katchup-landing :is(.landing-offer-heading, .landing-impact-heading) h2 {
  color: #111216;
}

.katchup-landing .landing-section-kicker {
  color: var(--landing-red);
}

.katchup-landing :is(.landing-offer-heading, .landing-impact-heading) > p:last-child {
  color: var(--landing-muted);
}

/* Four small product windows communicate the full network before the
   interactive media explorer asks the visitor to choose a route. */
.landing-offer-overview {
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(24, 25, 30, 0.08);
  border-radius: 2rem;
  box-shadow:
    0 26px 60px rgba(49, 30, 31, 0.055),
    0 2px 8px rgba(17, 24, 39, 0.025);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 0;
  overflow: hidden;
  padding: 1.05rem 0;
}

.landing-network-bridge {
  margin: clamp(1.4rem, 2.8vw, 2.25rem) auto clamp(6rem, 11vw, 10rem);
  max-width: min(100%, 78rem);
}

.landing-network-bridge-axis {
  align-items: center;
  display: grid;
  gap: clamp(0.65rem, 1.15vw, 1rem);
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.landing-network-bridge-side {
  align-items: center;
  display: flex;
  gap: clamp(0.65rem, 1.15vw, 1rem);
  min-width: 0;
}

.landing-network-bridge-label {
  color: #686b72;
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.16em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.landing-network-bridge-line {
  background-image: repeating-linear-gradient(
    to right,
    rgba(237, 28, 36, 0.22) 0,
    rgba(237, 28, 36, 0.22) 4px,
    transparent 4px,
    transparent 9px
  );
  flex: 1 1 auto;
  height: 1px;
  min-width: 1rem;
  position: relative;
}

.landing-network-bridge-line::before,
.landing-network-bridge-line::after {
  background: var(--landing-red);
  border: 3px solid #fcfbfb;
  border-radius: 9999px;
  content: "";
  height: 0.68rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 0.68rem;
}

.landing-network-bridge-line-left::before {
  left: -0.2rem;
}

.landing-network-bridge-line-left::after,
.landing-network-bridge-line-right::before {
  display: none;
}

.landing-network-bridge-line-right::after {
  right: -0.2rem;
}

.landing-network-bridge-hub {
  align-items: center;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(237, 28, 36, 0.12);
  border-radius: 9999px;
  box-shadow:
    0 0 0 0.75rem rgba(237, 28, 36, 0.035),
    0 14px 34px rgba(49, 30, 31, 0.09);
  display: inline-flex;
  height: 5.25rem;
  justify-content: center;
  position: relative;
  width: 5.25rem;
}

.landing-network-bridge-hub::after {
  border: 1px solid rgba(237, 28, 36, 0.08);
  border-radius: inherit;
  content: "";
  inset: -1.35rem;
  pointer-events: none;
  position: absolute;
}

.landing-network-bridge-hub img {
  height: 3.1rem;
  object-fit: contain;
  width: 3.1rem;
}

.landing-network-bridge-copy {
  color: #73767d;
  font-size: clamp(0.9rem, 1.2vw, 1.02rem);
  line-height: 1.65;
  margin: 1.65rem auto 0;
  max-width: 49rem;
  text-align: center;
}

.landing-network-bridge-copy strong {
  color: var(--landing-red);
  font-weight: 780;
}

.landing-offer-overview-item {
  border-right: 1px solid rgba(24, 25, 30, 0.075);
  min-width: 0;
  padding: 0.4rem clamp(0.38rem, 0.7vw, 0.68rem) 0.65rem;
}

.landing-offer-overview-item:last-child {
  border-right: 0;
}

.landing-offer-overview-heading {
  align-items: center;
  display: flex;
  min-width: 0;
}

.landing-offer-overview-heading h3 {
  color: #17181c;
  font-size: 1.08rem;
  font-weight: 780;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.landing-offer-overview-heading p {
  color: #73767d;
  font-size: 0.73rem;
  line-height: 1.35;
  margin-top: 0.24rem;
}

.landing-overview-preview {
  background: #fff;
  border: 1px solid rgba(24, 25, 30, 0.08);
  border-radius: 0.9rem;
  box-shadow: 0 8px 22px rgba(17, 24, 39, 0.045);
  height: 13.5rem;
  margin-top: 0.8rem;
  overflow: hidden;
  padding: 0.85rem;
}

.landing-overview-preview-event {
  background:
    linear-gradient(180deg, transparent, rgba(5, 7, 10, 0.86)),
    radial-gradient(circle at 28% 30%, #6d7077, #24262b 52%, #121317 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  isolation: isolate;
  justify-content: flex-end;
  position: relative;
}

.landing-overview-preview-event > img {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
  z-index: -2;
}

.landing-overview-preview-event::after {
  background: linear-gradient(180deg, rgba(8, 9, 12, 0.04) 18%, rgba(8, 9, 12, 0.82) 100%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.landing-overview-preview-event > div {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
}

.landing-overview-preview-event span {
  color: #ff696f;
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.landing-overview-preview-event strong {
  font-size: 0.78rem;
  line-height: 1.15;
  margin-top: 0.35rem;
}

.landing-overview-preview-event small {
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.54rem;
  margin-top: 0.55rem;
}

.landing-overview-card-preview {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  padding: 0;
}

/* These previews deliberately keep the product cards in their mobile form at
   every breakpoint. They are static product snapshots, rather than another
   navigation surface competing with the explorer directly below. */
.landing-overview-preview[data-landing-real-card-preview] {
  align-items: center;
  height: 13.5rem;
  overflow: hidden;
}

.landing-overview-preview[data-landing-real-card-preview] > [data-campaign-card],
.landing-overview-preview[data-landing-real-card-preview] > [data-job-card-id] {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  width: 100%;
}

.landing-overview-preview[data-landing-real-card-preview] > [data-campaign-card] {
  height: 100%;
}

.landing-overview-preview[data-landing-real-card-preview] > [data-job-card-id] {
  height: 100%;
}

.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-mobile-layout] {
  flex-direction: row;
  height: 100%;
  min-height: 0;
}

.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-poster] {
  aspect-ratio: auto;
  height: 100%;
  min-height: 0;
  width: 7rem;
}

.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-summary] {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0.75rem;
}

.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-mobile-date],
.landing-overview-preview[data-landing-real-card-preview] .campaign-dday-badge.md\:hidden {
  display: flex;
}

.landing-overview-preview[data-landing-real-card-preview] .campaign-dday-badge.hidden.md\:inline-flex,
.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-poster] > span:last-child {
  display: none;
}

.landing-overview-preview[data-landing-product-preview="projects"][data-landing-real-card-preview] [data-campaign-card-status-badges] {
  display: none;
}

.landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-summary] > h3 {
  font-size: 0.9375rem;
  font-weight: 700;
}

.landing-overview-preview[data-landing-real-card-preview] [data-job-card-link] {
  height: 100%;
}

.landing-overview-real-project-list,
.landing-overview-real-club-list {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.55rem;
  height: 100%;
  min-height: 0;
  width: 100%;
}

.landing-overview-real-project-list > [data-campaign-card] {
  flex: 1 1 0;
  height: auto;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  width: 100%;
}

.landing-overview-real-project-list > [data-campaign-card] > a {
  height: 100%;
}

.landing-overview-preview[data-landing-real-card-preview] .landing-overview-real-project-list [data-campaign-card-poster] {
  aspect-ratio: 4 / 5;
  width: 5.125rem;
}

.landing-overview-real-project-list [data-campaign-card-summary] {
  overflow: hidden;
}

.landing-overview-real-project-list [data-campaign-card-attribution] {
  min-width: 0;
}

.landing-overview-real-project-list [data-campaign-card-attribution-label] {
  font-size: 0.52rem;
}

.landing-overview-real-project-list [data-campaign-card-attribution-identity] {
  margin-top: 0.15rem;
}

.landing-overview-real-project-list [data-campaign-card-summary] > h3 {
  -webkit-line-clamp: 1;
}

.landing-overview-real-club-list > a {
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden;
}

.landing-overview-preview [data-landing-static-card],
.landing-overview-preview [data-landing-static-card]:hover,
.landing-overview-preview [data-landing-static-card]:active {
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.05);
  cursor: default;
  transform: none;
}

.landing-overview-preview [data-card-display="mobile-static"] > .campaign-bookmark-btn {
  background: transparent;
  border-radius: 0.75rem;
  box-shadow: none;
  color: rgb(55 65 81);
  display: inline-flex;
  height: 2.5rem;
  right: 0.5rem;
  top: 0.5rem;
  width: 2.5rem;
}

.landing-overview-real-club-list [data-landing-static-card]:hover,
.landing-overview-real-club-list [data-landing-static-card]:active {
  background: #fff;
  border-color: rgb(243 244 246);
}

.landing-overview-project-card {
  background: #fff;
  border: 1px solid #e7e7e9;
  border-radius: 0.68rem;
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: 40% minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

.landing-overview-project-poster {
  background: linear-gradient(145deg, #f3f4f6, #e7e8eb);
  min-width: 0;
  overflow: hidden;
  position: relative;
}

.landing-overview-project-poster > img {
  height: 100%;
  object-fit: cover;
  object-position: top;
  width: 100%;
}

.landing-overview-project-poster-fallback {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  padding: 0.65rem;
}

.landing-overview-project-poster-fallback img {
  height: auto;
  max-width: 88%;
  opacity: 0.48;
  width: auto;
}

.landing-overview-project-content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0.58rem;
}

.landing-overview-project-title {
  color: #1f2025;
  display: -webkit-box;
  font-size: 0.67rem;
  font-weight: 760;
  line-height: 1.28;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.landing-overview-project-attribution {
  margin-top: auto;
  min-width: 0;
}

.landing-overview-project-attribution > small {
  color: #7f8188;
  display: block;
  font-size: 0.38rem;
  font-weight: 720;
  letter-spacing: 0.08em;
  line-height: 1.2;
}

.landing-overview-project-attribution > div,
.landing-overview-job-company,
.landing-overview-list-row {
  align-items: center;
  display: flex;
  min-width: 0;
}

.landing-overview-project-attribution > div {
  gap: 0.38rem;
  margin-top: 0.3rem;
}

.landing-overview-project-attribution > div > span:last-child {
  color: #575960;
  font-size: 0.48rem;
  font-weight: 680;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.landing-overview-project-attribution .landing-overview-entity-logo {
  height: 1.45rem;
  width: 1.45rem;
}

.landing-overview-project-footer,
.landing-overview-job-footer {
  align-items: center;
  border-top: 1px solid #efeff0;
  display: flex;
  justify-content: space-between;
  margin-top: 0.42rem;
  padding-top: 0.38rem;
}

.landing-overview-project-footer > span {
  color: var(--landing-red);
  font-size: 0.44rem;
  font-weight: 720;
}

.landing-overview-entity-logo {
  align-items: center;
  background: #f6f6f7;
  border: 1px solid #ececee;
  border-radius: 0.48rem;
  color: var(--landing-red);
  display: inline-flex;
  flex: 0 0 auto;
  height: 1.9rem;
  justify-content: center;
  overflow: hidden;
  width: 1.9rem;
}

.landing-overview-entity-logo img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.landing-overview-entity-logo b {
  font-size: 0.63rem;
  font-weight: 820;
}

.landing-overview-entity-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
}

.landing-overview-entity-copy strong {
  color: #232429;
  display: -webkit-box;
  font-size: 0.6rem;
  font-weight: 750;
  line-height: 1.18;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.landing-overview-entity-copy em {
  color: #888a91;
  display: block;
  font-size: 0.46rem;
  font-style: normal;
  line-height: 1.25;
  margin-top: 0.15rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.landing-overview-row-arrow {
  color: #787a81;
  flex: 0 0 auto;
  height: 0.78rem;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 0.78rem;
}

.landing-overview-job-card {
  background: #fff;
  border: 1px solid #e7e7e9;
  border-radius: 0.68rem;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  padding: 0.62rem;
}

.landing-overview-job-company {
  gap: 0.48rem;
}

.landing-overview-job-company .landing-overview-entity-logo {
  height: 2.15rem;
  width: 2.15rem;
}

.landing-overview-bookmark {
  color: #b0b2b8;
  flex: 0 0 auto;
  height: 0.9rem;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  width: 0.9rem;
}

.landing-overview-job-title {
  color: #202126;
  display: -webkit-box;
  font-size: 0.72rem;
  font-weight: 760;
  line-height: 1.25;
  margin-top: 0.5rem;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.landing-overview-job-meta {
  align-items: center;
  display: flex;
  margin-top: 0.3rem;
  min-width: 0;
  overflow: hidden;
}

.landing-overview-job-meta span {
  color: #878990;
  flex: 0 0 auto;
  font-size: 0.43rem;
  white-space: nowrap;
}

.landing-overview-job-meta span + span::before {
  color: #c9cacf;
  content: "·";
  margin: 0 0.25rem;
}

.landing-overview-job-meta .is-pay {
  color: #26935a;
  font-weight: 700;
}

.landing-overview-job-footer {
  margin-top: auto;
}

.landing-overview-job-footer > span {
  background: #ecfdf3;
  border: 1px solid #d1fae5;
  border-radius: 9999px;
  color: #248354;
  font-size: 0.4rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.22rem 0.38rem;
}

.landing-overview-list {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.38rem;
  justify-content: stretch;
  min-height: 0;
  overflow: hidden;
}

.landing-overview-list-row {
  background: #fff;
  border: 1px solid #e9e9eb;
  border-radius: 0.6rem;
  flex: 1 1 0;
  gap: 0.42rem;
  min-height: 0;
  padding: 0.42rem;
}

.landing-overview-list-row .landing-overview-entity-logo {
  height: 1.8rem;
  width: 1.8rem;
}

.landing-overview-club-title {
  align-items: center;
  display: flex;
  gap: 0.3rem;
  min-width: 0;
}

.landing-overview-club-title strong {
  flex: 1 1 auto;
  min-width: 0;
}

.landing-overview-club-title small {
  background: #fff7ed;
  border: 1px solid #ffedd5;
  border-radius: 9999px;
  color: #ea580c;
  flex: 0 0 auto;
  font-size: 0.34rem;
  font-weight: 720;
  line-height: 1;
  padding: 0.18rem 0.28rem;
}

.landing-overview-preview-clubs .landing-overview-entity-copy {
  overflow: hidden;
}

.landing-offer-detail-column {
  min-width: 0;
}

.landing-offer-detail[aria-hidden="true"] {
  display: none;
}

.landing-offer-detail {
  color: #17181c;
}

.landing-offer-detail-heading {
  min-width: 0;
}

.landing-offer-detail-index {
  color: #94969c;
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  letter-spacing: 0.05em;
  margin-bottom: 2.2rem;
}

.landing-offer-detail h3 {
  color: #111216;
  font-size: clamp(2.4rem, 4vw, 4.25rem);
  font-weight: 820;
  letter-spacing: -0.055em;
  line-height: 1.02;
  margin-top: 0;
  text-wrap: balance;
}

.landing-offer-title-line {
  display: block;
}

.landing-offer-detail-description {
  color: #70737a;
  font-size: clamp(0.94rem, 1.25vw, 1.08rem);
  line-height: 1.65;
  margin-top: 1.6rem;
}

.landing-offer-detail-action {
  align-items: center;
  background: var(--landing-red);
  border-radius: 0.7rem;
  color: #fff;
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 750;
  gap: 0.85rem;
  margin-top: 2.2rem;
  min-height: 3.35rem;
  padding: 0 1.35rem;
  transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.landing-offer-detail-action:hover {
  background: var(--landing-red-dark);
  box-shadow: 0 13px 28px rgba(217, 22, 30, 0.17);
  transform: translateY(-2px);
}

#what-we-offer [data-offer-caption-target] {
  color: #74777e !important;
  text-align: center;
}

#what-we-offer .offer-step:not(.is-active) {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(24, 25, 30, 0.13) !important;
  color: #5f6269 !important;
}

#what-we-offer .offer-step.is-active {
  background: var(--landing-red) !important;
  border-color: var(--landing-red) !important;
}

/* Impact — left editorial message and right data surface. The selectors also
   support the legacy flat markup while the split wrapper is server-rendered. */
.katchup-landing .landing-impact-section {
  background:
    radial-gradient(ellipse 42% 42% at 84% 47%, rgba(237, 28, 36, 0.055), transparent 76%),
    #fcfbfb;
  border-top: 1px solid rgba(24, 25, 30, 0.055);
}

.landing-impact-layout {
  align-items: center;
  display: grid;
  gap: clamp(2.5rem, 4vw, 4rem);
  grid-template-columns: minmax(400px, 0.72fr) minmax(0, 1.35fr);
}

.landing-impact-copy-column {
  min-width: 0;
}

.landing-impact-layout .landing-impact-heading {
  margin: 0;
  max-width: 32rem;
  text-align: left;
}

.landing-impact-layout .landing-impact-heading h2 {
  font-size: clamp(3.15rem, 3.8vw, 4.25rem);
}

.katchup-landing .landing-signoff-top h2 {
  font-size: clamp(3.15rem, 3.8vw, 4.25rem);
  font-weight: 820;
  letter-spacing: -0.06em;
  line-height: 0.98;
}

.landing-impact-layout .landing-impact-heading h2 > span {
  display: block;
  white-space: nowrap;
}

.landing-impact-layout .landing-impact-heading > p:not(.landing-section-kicker) {
  color: #71747b;
  line-height: 1.65;
  margin: 1.5rem 0 0;
}

.landing-impact-panel {
  background:
    radial-gradient(ellipse 42% 54% at 100% 100%, rgba(237, 28, 36, 0.07), transparent 72%),
    radial-gradient(ellipse 28% 32% at 78% 0%, rgba(237, 28, 36, 0.022), transparent 78%),
    linear-gradient(145deg, #fff 0%, #fff 58%, #fffdfd 76%, #fdf9f9 100%);
  border: 1px solid rgba(24, 25, 30, 0.075);
  border-radius: 2rem;
  box-shadow:
    0 28px 65px rgba(49, 30, 31, 0.065),
    0 18px 42px rgba(237, 28, 36, 0.025);
  min-width: 0;
  overflow: hidden;
  padding: clamp(1.25rem, 2.4vw, 2.25rem);
}

.katchup-landing .landing-stats-grid {
  gap: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(3rem, 7vw, 6rem);
}

.landing-impact-panel .landing-stats-grid {
  margin-top: 0;
}

.katchup-landing .landing-stat-card {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0;
  border-right: 1px solid rgba(24, 25, 30, 0.09);
  min-height: 17rem;
  padding: clamp(1rem, 2.2vw, 1.8rem);
  text-align: center;
}

.katchup-landing .landing-stat-card:last-child {
  border-right: 0;
}

.katchup-landing .landing-stat-card:hover {
  background: rgba(237, 28, 36, 0.018);
  border-color: rgba(24, 25, 30, 0.09);
  transform: none;
}

.katchup-landing .landing-stat-card-accent,
.katchup-landing .landing-stat-card-accent:hover {
  background: transparent;
  border-color: rgba(24, 25, 30, 0.09);
}

.katchup-landing .landing-stat-index {
  color: #a2a4a9;
}

.katchup-landing .landing-stat-icon {
  align-items: center;
  background: rgba(237, 28, 36, 0.075);
  border: 1px solid rgba(237, 28, 36, 0.08);
  border-radius: 9999px;
  color: var(--landing-red);
  display: inline-flex;
  flex: 0 0 auto;
  height: 3.25rem;
  justify-content: center;
  margin-top: 1.2rem;
  width: 3.25rem;
}

.katchup-landing .landing-stat-icon svg {
  height: 1.55rem;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 1.55rem;
}

.katchup-landing .landing-stat-card-accent .landing-stat-index {
  color: var(--landing-red);
}

.katchup-landing .landing-stat-card-accent .landing-stat-icon {
  background: rgba(237, 28, 36, 0.11);
  border-color: rgba(237, 28, 36, 0.14);
}

.katchup-landing .landing-stat-card strong {
  color: #111216;
  font-size: clamp(2.25rem, 3vw, 3.35rem);
  margin-top: auto;
}

.katchup-landing .landing-stat-card:last-child strong {
  color: var(--landing-red);
}

.katchup-landing .landing-stat-card > p,
.katchup-landing .landing-stat-card-accent > p {
  color: #62656c;
}

.landing-impact-trust {
  margin-top: 2rem;
  max-width: 31rem;
}

.landing-impact-trust > p {
  color: #85878d;
  font-size: 0.7rem;
  font-weight: 650;
  letter-spacing: 0.015em;
  margin: 0 0 0.9rem;
}

.landing-impact-trust-logos {
  align-items: center;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-impact-trust-logo {
  align-items: center;
  display: flex;
  height: 2.6rem;
  justify-content: flex-start;
  min-width: 0;
}

.landing-impact-trust-logo img {
  filter: grayscale(1);
  height: 100%;
  max-width: 100%;
  mix-blend-mode: multiply;
  object-fit: contain;
  object-position: left center;
  opacity: 0.48;
  width: 100%;
}

.landing-impact-track {
  background: none;
  height: 4.5rem;
  margin: 0.25rem 0 0;
  position: relative;
}

.landing-impact-track svg {
  height: 100%;
  inset: 0;
  overflow: visible;
  position: absolute;
  width: 100%;
}

.landing-impact-track span {
  background: var(--landing-red);
  border: 4px solid #fff;
  border-radius: 9999px;
  height: 0.9rem;
  position: absolute;
  top: 80.555%;
  transform: translate(-50%, -50%);
  width: 0.9rem;
}

.landing-impact-track span:nth-of-type(1) { left: 12.5%; }
.landing-impact-track span:nth-of-type(2) { left: 37.5%; }
.landing-impact-track span:nth-of-type(3) { left: 62.5%; }
.landing-impact-track span:nth-of-type(4) { left: 87.5%; }

.katchup-landing .landing-signoff {
  background:
    radial-gradient(ellipse 42% 32% at 60% 20%, rgba(237, 28, 36, 0.035), transparent 78%),
    #fff;
  border-top-color: rgba(24, 25, 30, 0.075);
}

.katchup-landing .landing-signoff-top {
  align-items: center;
}

.katchup-landing .landing-signoff-kicker {
  color: var(--landing-red);
}

.katchup-landing .landing-signoff-description {
  color: #73767d;
}

.katchup-landing .landing-signoff-browse > p {
  color: #202127;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0;
  margin-bottom: 0.8rem;
}

.katchup-landing .landing-signoff-top h2 {
  color: #111216;
}

.katchup-landing .landing-signoff-links a {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(24, 25, 30, 0.15);
  color: #26282d;
}

.katchup-landing .landing-signoff-links a:hover {
  background: #fff;
  border-color: rgba(237, 28, 36, 0.32);
  color: #111216;
}

.katchup-landing .landing-signoff-logo {
  border-bottom: 1px solid rgba(24, 25, 30, 0.08);
  border-top: 1px solid rgba(24, 25, 30, 0.08);
  padding: clamp(2.25rem, 4vw, 4rem) 0;
}

/* Give the three editorial sections a little more room on wide desktops
   without changing the established tablet and mobile rhythm. */
@media (min-width: 1280px) {
  .katchup-landing .landing-offer-shell {
    max-width: 88rem;
  }

  .katchup-landing .landing-impact-shell {
    max-width: 90rem;
  }

  .katchup-landing .landing-signoff-top {
    max-width: 86rem;
  }
}

/* The expanded header shares the hero's white canvas. Scrolling still hands
   control back to the existing compact white floating shell. */
body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] .landing-primary-nav-link {
  color: #22242a !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] .landing-primary-nav-link:hover {
  color: var(--landing-red, #ed1c24) !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] #desktop-biz-btn {
  background: rgba(255, 255, 255, 0.74) !important;
  box-shadow: inset 0 0 0 1px rgba(24, 25, 30, 0.16);
  color: #22242a !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] #desktop-biz-btn:hover {
  background: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(237, 28, 36, 0.28);
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] :is(#header-notification-bell, #mobile-notification-bell) svg {
  color: #22242a !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) #main-header[data-landing-header-state="expanded"] #mobile-notification-bell:hover {
  background: rgba(24, 25, 30, 0.055) !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer {
  background: #fff !important;
  border-top-color: rgba(24, 25, 30, 0.08);
  color: #70737a !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer h3 {
  color: #18191d !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer .border-gray-700 {
  border-color: #e5e7eb !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer a:hover {
  color: #17181c !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer [data-footer-social-links] a {
  border-color: #d4d6da !important;
  color: #4f535b !important;
}

body:is([data-current-path="/"], [data-current-path="/student"]) footer [data-footer-social-links] a:hover {
  border-color: rgba(237, 28, 36, 0.38) !important;
  color: var(--landing-red) !important;
}

@media (min-width: 1024px) {
  #what-we-offer [data-offer-sticky] {
    align-items: center;
    column-gap: clamp(1.5rem, 3.2vw, 3.8rem);
    display: grid !important;
    grid-template-columns: minmax(112px, 0.34fr) minmax(250px, 0.72fr) minmax(0, 1.5fr);
  }

  #what-we-offer [data-offer-sticky] > * {
    margin-top: 0 !important;
  }

  #what-we-offer .landing-offer-media-column {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
  }

  #what-we-offer .landing-offer-detail-column {
    grid-column: 2;
    grid-row: 1;
  }

  #what-we-offer [data-offer-card-window] {
    align-self: stretch;
    display: flex !important;
    grid-column: 1;
    grid-row: 1;
    overflow: visible !important;
  }

  #what-we-offer [data-offer-card-strip] {
    align-content: center;
    display: grid !important;
    gap: 0 !important;
    min-height: 100%;
    padding: 0.5rem 0;
    position: relative;
    width: 100%;
  }

  #what-we-offer [data-offer-card-strip]::before {
    background: #dedfe2;
    content: "";
    left: 0.42rem;
    position: absolute;
    top: 13%;
    bottom: 13%;
    width: 1px;
  }

  #what-we-offer .offer-proof-card {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
    color: #85878d;
    display: flex;
    font-size: 0.94rem;
    font-weight: 650;
    gap: 0.85rem;
    justify-content: flex-start;
    min-height: 4.25rem !important;
    padding: 0.5rem 0 !important;
    position: relative;
    text-align: left;
    transform: none !important;
    width: 100%;
  }

  #what-we-offer .offer-proof-card:hover:not(.is-active) {
    background: transparent !important;
    border: 0 !important;
    color: #36383e;
    transform: none !important;
  }

  #what-we-offer .offer-proof-card.is-active {
    background: transparent !important;
    border: 0 !important;
    color: #17181c;
  }

  #what-we-offer .offer-proof-card-dot {
    background: #dedfe2;
    border: 3px solid #fcfbfb;
    border-radius: 9999px;
    flex: 0 0 auto;
    height: 0.9rem;
    position: relative;
    width: 0.9rem;
    z-index: 1;
  }

  #what-we-offer .offer-proof-card.is-active .offer-proof-card-dot {
    background: var(--landing-red);
  }

  #what-we-offer .landing-offer-stage {
    background: #fff;
    border-color: rgba(24, 25, 30, 0.13);
    border-radius: 2rem;
    box-shadow:
      0 24px 55px rgba(49, 30, 31, 0.075),
      0 0 0 0.55rem rgba(255, 255, 255, 0.64);
  }

  .landing-offer-detail h3 {
    font-size: clamp(2.45rem, 3.35vw, 4rem);
  }
}

@media (max-width: 1023px) {
  #what-we-offer [data-offer-sticky] {
    display: grid !important;
    gap: 0.9rem;
    grid-template-areas:
      "offer-tabs"
      "offer-heading"
      "offer-media"
      "offer-caption"
      "offer-action";
    grid-template-columns: minmax(0, 1fr);
  }

  #what-we-offer .landing-offer-media-column,
  #what-we-offer .landing-offer-detail-column,
  #what-we-offer .landing-offer-detail.is-active {
    display: contents;
  }

  #what-we-offer [data-offer-step-nav] {
    grid-area: offer-tabs;
    margin: 0 !important;
  }

  #what-we-offer .landing-offer-detail-heading {
    grid-area: offer-heading;
    margin-top: 0.2rem;
    text-align: left;
  }

  #what-we-offer .landing-offer-detail h3 {
    font-size: clamp(1.8rem, 5vw, 2.35rem);
    line-height: 1.04;
    margin-top: 0;
  }

  #what-we-offer .landing-offer-detail-index,
  #what-we-offer .landing-offer-detail-description {
    display: none;
  }

  #what-we-offer [data-offer-stage] {
    grid-area: offer-media;
  }

  #what-we-offer [data-offer-caption-target] {
    grid-area: offer-caption;
    margin: 0 !important;
    text-align: left;
  }

  #what-we-offer .landing-offer-detail-action {
    grid-area: offer-action;
    justify-self: start;
    margin-top: 0.15rem;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .landing-offer-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .landing-offer-overview-item:nth-child(2) {
    border-right: 0;
  }

  .landing-offer-overview-item:nth-child(-n+2) {
    border-bottom: 1px solid rgba(24, 25, 30, 0.075);
    padding-bottom: 1.5rem;
  }

  .landing-offer-overview-item:nth-child(n+3) {
    padding-top: 1.5rem;
  }

  .landing-offer-detail-column {
    margin-top: 2.5rem;
  }

  .landing-impact-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  #what-we-offer [data-offer-stage] {
    /* The mobile stage intentionally has no visible outer card, so it should
       not crop the active Project card's top and bottom border/shadow. */
    contain: layout style !important;
    overflow: visible !important;
  }

  #offer-panel-projects .offer-project-carousel,
  #offer-panel-jobs .offer-instagram-embed-shell,
  #offer-panel-clubs .offer-club-shelf {
    inset: 0 !important;
  }

  .katchup-landing .landing-hero {
    /* Chrome on iOS changes `dvh` while its native toolbar animates. Because
       the hero sits above every landing section, that height change otherwise
       shifts the entire document even when the hero is far off-screen. */
    min-height: 100vh;
    min-height: 100svh;
  }

  .katchup-landing .landing-hero-content {
    min-height: calc(100vh - 2rem);
    min-height: calc(100svh - 2rem);
    padding-bottom: 4.5rem;
    padding-top: 6.25rem;
  }

  .katchup-landing .landing-hero-title {
    font-size: clamp(3.05rem, 15vw, 5rem);
    line-height: 0.92;
    max-width: calc(100% + 1.25rem);
    width: calc(100% + 1.25rem);
  }

  .katchup-landing .landing-hero-title-subline {
    font-size: 1em;
  }

  .katchup-landing .landing-hero-trust {
    display: none;
  }

  .katchup-landing .landing-hero-filters {
    flex-wrap: nowrap;
    gap: 0.3rem;
    width: 100%;
  }

  .katchup-landing .landing-hero-filters a {
    flex: 0 1 auto;
    font-size: clamp(0.6rem, 2.6vw, 0.7rem);
    padding: 0.62rem clamp(0.42rem, 1.8vw, 0.68rem);
    white-space: nowrap;
  }

  .katchup-landing .landing-job-search {
    box-shadow: 0 14px 34px rgba(42, 27, 28, 0.07);
  }

  .katchup-landing .landing-offer-heading {
    margin-bottom: 1.75rem;
  }

  .landing-offer-overview {
    display: none;
  }

  .landing-network-bridge {
    margin-bottom: 5rem;
    margin-top: 0.75rem;
  }

  .landing-network-bridge-axis {
    gap: 0.45rem;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  .landing-network-bridge-side {
    gap: 0.45rem;
  }

  .landing-network-bridge-label {
    font-size: 0.58rem;
    letter-spacing: 0.1em;
  }

  .landing-network-bridge-hub {
    box-shadow:
      0 0 0 0.5rem rgba(237, 28, 36, 0.035),
      0 10px 24px rgba(49, 30, 31, 0.08);
    height: 3.8rem;
    width: 3.8rem;
  }

  .landing-network-bridge-hub::after {
    inset: -0.85rem;
  }

  .landing-network-bridge-hub img {
    height: 2.25rem;
    width: 2.25rem;
  }

  .landing-network-bridge-copy {
    font-size: 0.78rem;
    line-height: 1.6;
    margin-top: 1.35rem;
    max-width: 20rem;
  }

  .landing-offer-overview-item {
    border-bottom: 1px solid rgba(24, 25, 30, 0.075);
    border-right: 0;
    padding: 0.85rem 0.5rem 1rem;
  }

  .landing-offer-overview-item:last-child {
    border-bottom: 0;
  }

  .landing-offer-overview-heading h3 {
    font-size: 0.94rem;
  }

  .landing-offer-overview-heading p {
    font-size: 0.62rem;
  }

  .landing-overview-preview {
    height: 13rem;
    margin-top: 0.8rem;
    padding: 0.65rem;
  }

  .landing-overview-card-preview {
    padding: 0;
  }

  .landing-overview-preview[data-landing-real-card-preview] {
    height: 13rem;
  }

  .landing-overview-preview[data-landing-real-card-preview] [data-campaign-card-poster] {
    width: 7rem;
  }

  .landing-overview-real-project-list,
  .landing-overview-real-club-list {
    gap: 0.4rem;
  }

  .landing-overview-real-club-list > a {
    padding: 0.65rem;
  }

  .landing-overview-real-club-list > a > div {
    gap: 0.5rem;
  }

  .landing-overview-real-club-list > a img,
  .landing-overview-real-club-list > a > div > div:first-child {
    height: 2.25rem;
    width: 2.25rem;
  }

  .landing-overview-project-card {
    grid-template-columns: 38% minmax(0, 1fr);
  }

  .landing-overview-project-content {
    padding: 0.4rem;
  }

  .landing-overview-project-title {
    font-size: 0.54rem;
  }

  .landing-overview-project-attribution > small {
    font-size: 0.3rem;
  }

  .landing-overview-project-attribution > div {
    gap: 0.25rem;
    margin-top: 0.2rem;
  }

  .landing-overview-project-attribution .landing-overview-entity-logo {
    height: 1.15rem;
    width: 1.15rem;
  }

  .landing-overview-project-attribution > div > span:last-child {
    font-size: 0.38rem;
  }

  .landing-overview-project-footer,
  .landing-overview-job-footer {
    margin-top: 0.3rem;
    padding-top: 0.28rem;
  }

  .landing-overview-project-footer > span {
    font-size: 0.35rem;
  }

  .landing-overview-job-card {
    padding: 0.44rem;
  }

  .landing-overview-job-company {
    gap: 0.32rem;
  }

  .landing-overview-job-company .landing-overview-entity-logo {
    height: 1.55rem;
    width: 1.55rem;
  }

  .landing-overview-job-title {
    font-size: 0.57rem;
    margin-top: 0.35rem;
  }

  .landing-overview-job-meta {
    margin-top: 0.2rem;
  }

  .landing-overview-job-meta span {
    font-size: 0.34rem;
  }

  .landing-overview-job-meta span:nth-child(n+3) {
    display: none;
  }

  .landing-overview-job-footer > span {
    font-size: 0.32rem;
    padding: 0.18rem 0.28rem;
  }

  .landing-overview-list-row {
    gap: 0.3rem;
    padding: 0.3rem;
  }

  .landing-overview-list-row .landing-overview-entity-logo {
    height: 1.35rem;
    width: 1.35rem;
  }

  .landing-overview-entity-copy strong {
    font-size: 0.52rem;
  }

  .landing-overview-entity-copy em {
    font-size: 0.39rem;
  }

  .landing-overview-club-title small {
    display: none;
  }

  .landing-offer-detail-column {
    margin-top: 0;
    padding: 0;
  }

  #what-we-offer .landing-offer-detail-heading {
    margin-bottom: 0.15rem;
    margin-top: 0.05rem;
    text-align: center;
  }

  .landing-offer-detail-index {
    margin-bottom: 1.3rem;
  }

  .landing-offer-detail h3 {
    font-size: clamp(1.65rem, 7.5vw, 2rem);
    letter-spacing: -0.035em;
    line-height: 1.08;
    margin-top: 0;
  }

  .landing-offer-detail-action {
    width: 100%;
    justify-content: center;
  }

  .landing-impact-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .landing-impact-copy-column {
    display: contents;
  }

  .landing-impact-layout .landing-impact-heading,
  .katchup-landing .landing-impact-heading {
    order: 1;
    text-align: left;
  }

  .landing-impact-layout .landing-impact-heading h2 {
    font-size: clamp(2.45rem, 12vw, 3.15rem);
  }

  .katchup-landing .landing-signoff-top h2 {
    font-size: clamp(2.45rem, 12vw, 3.15rem);
  }

  .landing-impact-panel {
    border-radius: 1.35rem;
    order: 2;
    padding: 0.7rem;
  }

  .katchup-landing .landing-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .katchup-landing .landing-stat-card {
    border-bottom: 1px solid rgba(24, 25, 30, 0.085);
    min-height: 13.5rem;
    padding: 1rem 0.7rem;
  }

  .katchup-landing .landing-stat-card:nth-child(2) {
    border-right: 0;
  }

  .katchup-landing .landing-stat-card:nth-child(n+3) {
    border-bottom: 0;
  }

  .katchup-landing .landing-stat-card strong {
    font-size: clamp(1.85rem, 9vw, 3rem);
    margin-top: 0.7rem;
  }

  .katchup-landing .landing-stat-icon {
    height: 2.7rem;
    margin-top: 0.85rem;
    width: 2.7rem;
  }

  .katchup-landing .landing-stat-icon svg {
    height: 1.3rem;
    width: 1.3rem;
  }

  .landing-impact-trust {
    margin-top: -0.35rem;
    max-width: none;
    order: 3;
    text-align: center;
    width: 100%;
  }

  .landing-impact-trust-logos {
    gap: clamp(0.45rem, 2.5vw, 0.8rem);
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: none;
    width: 100%;
  }

  .landing-impact-trust-logo {
    height: 2.1rem;
    justify-content: center;
  }

  .landing-impact-trust-logo img {
    object-position: center;
  }

  .landing-impact-track {
    display: none;
  }

  .katchup-landing .landing-signoff {
    padding-top: 5.5rem;
  }

  .katchup-landing .landing-signoff-top {
    align-items: flex-start;
  }

  .katchup-landing .landing-signoff-logo {
    margin-top: 4rem;
    padding: 1.8rem 0;
  }
}

@media (max-width: 399px) {
  .landing-offer-overview {
    grid-template-columns: minmax(0, 1fr);
  }

  .landing-offer-overview-item,
  .landing-offer-overview-item:nth-child(n+3) {
    border-bottom: 1px solid rgba(24, 25, 30, 0.075);
    border-right: 0;
  }

  .landing-offer-overview-item:last-child {
    border-bottom: 0;
  }
}

/* Respect reduced-motion preference — no animation at all */
/* The shared mobile header still mounts the legacy light icon for dark
   landing pages. This landing is intentionally light, so pin the black/red
   mark here as a page-level rule (also avoids a stale compiled stylesheet
   briefly revealing the white mark during Turbo restores). */
@media (max-width: 1023px) {
  body:is([data-current-path="/"], [data-current-path="/student"])
    #main-header[data-landing-header-state="expanded"]
    [data-landing-header-logo-compact] {
    opacity: 1 !important;
  }

  body:is([data-current-path="/"], [data-current-path="/student"])
    #main-header[data-landing-header-state="expanded"]
    [data-landing-header-logo-compact-light] {
    opacity: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .katchup-landing .hero-animate {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .student-partner-marquee {
    animation: none !important;
    transform: none !important;
  }
  .student-partner-marquee-track[aria-hidden="true"] {
    display: none;
  }
  .katchup-landing [data-hero-rotating-title] {
    opacity: 1 !important;
    transform: translate3d(-50%, 0, 0) scaleX(var(--hero-title-scale)) !important;
    transition: none !important;
  }
  .landing-job-search,
  .landing-job-search-submit,
  .landing-hero-filters a,
  .landing-partner-card img,
  .landing-stat-card,
  .landing-signoff-links a,
  .offer-animate {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .offer-project-clip {
    transition: none !important;
  }
  [data-offer-event-slide] {
    transition: none !important;
  }
  .offer-instagram-carousel {
    scroll-behavior: auto !important;
  }
  .offer-instagram-post-card {
    transition: none !important;
  }
  #offer-panel-clubs .offer-club-shelf-card {
    transition: none !important;
  }
}