/* WHY MEDIONE presentation. All rules are isolated to this section. */
#support.partner-story-track { height: auto; }
#support .partner-story-sticky {
  position: relative;
  top: auto;
  height: auto;
  min-height: calc(100svh - var(--header-height));
  overflow: visible;
  padding: 22px 0;
  background:
    radial-gradient(ellipse at 15% 65%, rgba(214, 234, 255, .4), transparent 52%),
    linear-gradient(160deg, #FBFDFF, #F5F9FD);
}

#support .partner-story-layout { margin-top: 28px; }
#support .partner-story-main {
  height: calc(clamp(380px, calc(100svh - 390px), 560px) + 100px);
  min-height: 0;
  border-radius: 32px;
  border: 1px solid rgba(80, 140, 210, .14);
  box-shadow: 0 20px 60px rgba(50, 100, 160, .1);
  background: rgba(255, 255, 255, .98);
}

#support .partner-story-visual {
  flex: 0 0 37%;
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  background:
    radial-gradient(ellipse at 65% 30%, rgba(114, 167, 255, .22), transparent 65%),
    linear-gradient(145deg, #F7FBFF, #EAF3FF);
  border-right: 1px solid rgba(80, 140, 210, .08);
}
#support .partner-story-visual::before {
  content: "";
  position: absolute;
  inset: 16px;
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 24px;
  pointer-events: none;
}
#support .partner-story-visual[data-active-step="product-education"] {
  background:
    radial-gradient(ellipse at 30% 30%, rgba(114, 143, 244, .2), transparent 65%),
    linear-gradient(145deg, #F8FAFF, #E9EEFF);
}
#support .partner-story-visual[data-active-step="sales-support"] {
  background:
    radial-gradient(ellipse at 75% 60%, rgba(72, 185, 217, .18), transparent 65%),
    linear-gradient(145deg, #F6FBFF, #E5F7FA);
}
#support .partner-story-visual[data-active-step="partnership"] {
  background:
    radial-gradient(ellipse at 75% 65%, rgba(67, 196, 179, .16), transparent 60%),
    linear-gradient(145deg, #F6FAFF, #EAF4FC);
}
#support .partner-story-visual-heading {
  position: relative;
  flex-shrink: 0;
  padding: 32px 28px 0;
  text-align: left;
}
#support .partner-story-artwork {
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 0 18px;
}
#support .support-art {
  position: relative;
  width: 100%;
  height: 100%;
  max-height: 470px;
}
#support .support-art-shadow { filter: drop-shadow(0 12px 14px rgba(49, 99, 168, .12)); }

#support .partner-story-text {
  min-width: 0;
  min-height: 0;
  padding: 30px 32px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  transition: none;
}
#support .partner-story-copy {
  grid-area: 1 / 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  visibility: hidden;
  pointer-events: none;
}
#support .partner-story-copy.is-active {
  visibility: visible;
  pointer-events: auto;
}
#support .partner-story-label {
  flex-shrink: 0;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .12em;
  color: #3978E8;
}
#support .partner-story-title {
  flex-shrink: 0;
  margin-top: 8px;
  color: #133B64;
  font-size: clamp(25px, 2.1vw, 30px);
  line-height: 1.3;
  letter-spacing: -.045em;
  word-break: keep-all;
}
#support .partner-story-desc {
  flex: 0 0 auto;
  max-width: 520px;
  margin: 0;
  padding: 0;
  overflow: visible;
  display: block;
  -webkit-line-clamp: unset;
  color: #62758A;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  word-break: keep-all;
  overflow-wrap: break-word;
}
#support .partner-story-desc p + p { margin-top: 1em; }
#support .partner-story-quote {
  flex-shrink: 0;
  min-height: 3.7em;
  margin: 18px 0 0;
  padding: 13px 0 0 14px;
  border-top: 1px solid #E5EDF6;
  position: relative;
  color: #3978DC;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -.035em;
  word-break: keep-all;
}
#support .partner-story-quote::before {
  content: "";
  position: absolute;
  top: 18px;
  bottom: 7px;
  left: 0;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(#3978F6, #A8D1F7);
}

#support .partner-story-nav { min-width: 0; gap: 14px; }
#support .partner-nav-card {
  --support-nav-start: #3675E8;
  --support-nav-end: #6E88EE;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 86px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(80, 120, 170, .1);
  background: rgba(248, 250, 253, .9);
  color: #6F7F95;
  font-size: 15px;
  line-height: 1.4;
  transform: none;
}
#support .partner-nav-card[data-step="product-education"] {
  --support-nav-start: #496FE8;
  --support-nav-end: #788EF0;
}
#support .partner-nav-card[data-step="sales-support"] {
  --support-nav-start: #2F7DDD;
  --support-nav-end: #4BA9D7;
}
#support .partner-nav-card[data-step="partnership"] {
  --support-nav-start: #3978E4;
  --support-nav-end: #58ACC5;
}
#support .partner-nav-icon {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  height: 42px;
  border-radius: 13px;
  background: #EDF4FC;
  color: #709CD7;
}
#support .partner-nav-icon svg { width: 23px; height: 23px; }
#support .partner-nav-copy { display: flex; flex-direction: column; gap: 4px; }
#support .partner-nav-number { font-size: 11px; font-weight: 500; letter-spacing: .14em; opacity: .8; }
#support .partner-nav-card:hover { background: #EEF4FC; transform: none; }
#support .partner-nav-card:focus-visible { outline: 3px solid #86B3F6; outline-offset: 4px; }
#support .partner-nav-card.is-active,
#support .partner-nav-card.is-active:hover {
  background: linear-gradient(135deg, var(--support-nav-start), var(--support-nav-end));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 12px 30px rgba(55, 105, 220, .2);
  transform: none;
}
#support .partner-nav-card.is-active .partner-nav-icon {
  background: rgba(255, 255, 255, .18);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}
#support .partner-nav-card.is-active::after {
  content: "";
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  margin-left: auto;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: rotate(45deg);
}

@media (min-width: 1025px) and (max-height: 820px) {
  #support .partner-story-sticky { padding: 16px 0; }
  #support .partner-story-layout { margin-top: 20px; }
  #support .partner-story-main { height: calc(clamp(340px, calc(100svh - 370px), 440px) + 100px); }
  #support .partner-story-text { padding: 22px 28px; }
  #support .partner-story-title { font-size: 28px; }
  #support .partner-story-quote { font-size: 17px; margin-top: 12px; }
  #support .partner-nav-card { min-height: 76px; }
}

@media (max-width: 1024px) {
  #support .partner-story-sticky { min-height: 0; padding: 56px 0; }
  #support .partner-story-layout { gap: 14px; margin-top: 18px; }
  #support .partner-story-main {
    flex-direction: row;
    height: auto;
    border-radius: 28px;
  }
  #support .partner-story-visual { flex: 0 0 36%; }
  #support .partner-story-text { padding: 24px; }
  #support .partner-story-visual-heading { padding: 28px 24px 0; }
  #support .partner-story-title { font-size: 26px; }
  #support .partner-story-quote { font-size: 17px; }
  #support .partner-story-nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }
  #support .partner-nav-card { min-height: 76px; gap: 9px; padding: 12px; font-size: 13px; }
  #support .partner-nav-icon { flex-basis: 32px; height: 36px; border-radius: 10px; }
  #support .partner-nav-icon svg { width: 21px; height: 21px; }
  #support .partner-nav-card.is-active::after { display: none; }
}

@media (max-width: 767px) {
  #support .partner-story-sticky { padding: 48px 0; }
  #support .partner-story-layout { gap: 10px; margin-top: 14px; }
  #support .partner-story-main {
    flex-direction: column;
    height: auto;
    border-radius: 24px;
  }
  #support .partner-story-visual {
    flex: none;
    border-right: 0;
    border-bottom: 1px solid rgba(80, 140, 210, .08);
  }
  #support .partner-story-visual::before { inset: 8px; border-radius: 18px; }
  #support .partner-story-visual-heading { padding: 26px 26px 0; }
  #support .partner-story-artwork { flex: none; height: 260px; padding: 4px 0 14px; }
  #support .support-art { width: 100%; max-height: none; }
  #support .partner-story-text { padding: 26px 22px; }
  #support .partner-story-label { font-size: 11px; }
  #support .partner-story-title { font-size: 24px; margin-top: 4px; }
  #support .partner-story-desc { font-size: 14px; line-height: 1.8; }
  #support .partner-story-quote { font-size: 15px; min-height: 3.6em; margin-top: 10px; padding-top: 10px; }
  #support .partner-story-quote::before { top: 14px; }
  #support .partner-story-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #support .partner-nav-card { min-height: 58px; padding: 8px 10px; border-radius: 13px; font-size: 12px; }
  #support .partner-nav-copy { gap: 1px; }
  #support .partner-nav-number { font-size: 10px; }
  #support .partner-nav-icon { flex-basis: 32px; height: 32px; }
}

/* The section follows normal page flow; no pinned viewport can clip copy. */
#support .partner-story-visual,
#support .partner-story-text { transition: none; }
#support .partner-story-visual.is-entering,
#support .partner-story-text.is-entering {
  opacity: 1;
  transform: none;
  animation: partner-support-enter 300ms var(--ease);
}
@keyframes partner-support-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1024px) and (max-height: 760px) {
  #support .partner-story-heading .section-sub { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  #support .partner-story-visual.is-entering,
  #support .partner-story-text.is-entering { animation: none; }
  #support .partner-nav-card { transition: none; }
}