/* =====================================================================
   Our Journey — lively layout (loaded only on /our-journey)
   Palette: navy #102b68, blue #1597ed, deep blue #0d6fbd, yellow #ffd84d,
   pastels sky #bfe0fb, mint #b7ebc9, butter #fde68a, pink #ffc9d6,
   lavender #dcd6ff. Every selector is scoped under .inh-story by the
   build step, so nothing here can leak into other pages.
   ===================================================================== */

@keyframes jn-bob {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -9px; }
}
@keyframes jn-mark {
  from { background-size: 0% 100%; }
  to { background-size: 100% 100%; }
}
@keyframes jn-beat {
  0%, 100% { transform: scale(1); }
  14% { transform: scale(1.25); }
  28% { transform: scale(1); }
  42% { transform: scale(1.18); }
  70% { transform: scale(1); }
}
.inh-story .jn-pill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 18px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid #d3e4fb;
  box-shadow: 0 3px 0 #d3e4fb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #0d6fbd;
}
.inh-story .jn-pill i { color: #f5b800; letter-spacing: 0; }
.inh-story .jn-pill--yellow {
  background: #ffd84d;
  border-color: #ffd84d;
  box-shadow: none;
  color: #102b68;
}
.inh-story .jn-pill--yellow i { color: #102b68; }
.inh-story .jn-marker {
  padding: 0 0.08em;
  background-image: linear-gradient(transparent 58%, #ffd84d 58%, #ffd84d 92%, transparent 92%);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  animation: jn-mark 0.9s 0.5s ease-out both;
}
.inh-story .jn-h2 {
  margin-top: 14px;
  color: #102b68;
  text-wrap: balance;
}
.inh-story .jn-photo {
  position: relative;
  margin: 0;
  width: 100%;
  max-width: 540px;
  justify-self: center;
  padding: 14px 14px 18px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 24px 50px rgba(16, 43, 104, 0.14);
  rotate: -2deg;
}
.inh-story .jn-photo img:not(.jn-closing__mascot):not(.jn-closing__clap) {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
}
.inh-story .jn-photo__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1000 / 664;
  border-radius: 6px;
  overflow: hidden;
}
.inh-story .jn-photo__stage video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 6px;
}
.inh-story .jn-photo figcaption {
  margin-top: 12px;
  text-align: center;
  font-family: "Caveat", cursive;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.2;
  color: #102b68;
}
.inh-story .jn-photo figcaption i { color: #ff8a3d; font-size: 0.8em; }
.inh-story .jn-tape {
  position: absolute;
  top: -13px;
  z-index: 2;
  width: 96px;
  height: 28px;
  box-shadow: 0 2px 4px rgba(16, 43, 104, 0.1);
}
.inh-story .jn-tape--l { left: 9%; background: rgba(255, 216, 77, 0.8); transform: rotate(-8deg); }
.inh-story .jn-tape--r { right: 9%; background: rgba(191, 224, 251, 0.9); transform: rotate(7deg); }
.inh-story .jn-hero {
  position: relative;
  overflow: hidden;
  padding: 64px 0 78px;
  text-align: center;
  background:
    radial-gradient(780px 400px at 50% 0%, #eaf5ff 0%, rgba(255, 255, 255, 0) 72%),
    #fff;
}
.inh-story .jn-hero .st-wrap { position: relative; z-index: 1; }
.inh-story .jn-hero__title {
  margin: 20px 0 0;
  font-size: clamp(42px, 7.6vw, 80px);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -0.02em;
  color: #102b68;
}
.inh-story .jn-hero__lead {
  max-width: 540px;
  margin: 20px auto 0;
  font-size: clamp(17px, 2vw, 21px);
  font-weight: 600;
  line-height: 1.6;
  color: #4f6180;
}
.inh-story .jn-hero__stage {
  position: relative;
  max-width: 920px;
  margin: 58px auto 0;
}
.inh-story .jn-hero__photo {
  margin: 0;
  overflow: hidden;
  line-height: 0;
  background: #fff;
  border: 6px solid #fff;
  border-radius: 30px;
  box-shadow: 0 26px 60px rgba(16, 43, 104, 0.18), 0 0 0 2px #d3e4fb;
}
.inh-story .jn-hero__photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px;
}
.inh-story .jn-sticker {
  position: absolute;
  z-index: 3;
  padding: 12px 20px;
  border-radius: 18px;
  font-family: "Caveat", cursive;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  color: #102b68;
  box-shadow: 0 12px 26px rgba(16, 43, 104, 0.2);
  animation: jn-bob 5s ease-in-out infinite;
}
.inh-story .jn-sticker i { font-size: 0.65em; color: #f5b800; }
.inh-story .jn-sticker--yellow { right: -18px; top: -28px; background: #ffe27a; rotate: 3deg; }
.inh-story .jn-sticker--blue { left: -18px; bottom: -24px; background: #cfe8ff; rotate: -3deg; animation-delay: 1.4s; }
.inh-story .jn-hero__mascot {
  position: absolute;
  right: -14px;
  bottom: -34px;
  z-index: 3;
  width: 96px;
  height: auto;
  filter: drop-shadow(0 10px 14px rgba(16, 43, 104, 0.25));
  animation: jn-bob 4s 0.6s ease-in-out infinite;
}
.inh-story .jn-hero__hands {
  position: absolute;
  left: -34px;
  top: -62px;
  z-index: 3;
  width: 124px;
  height: auto;
  rotate: -8deg;
  filter: drop-shadow(0 10px 14px rgba(16, 43, 104, 0.2));
  animation: jn-bob 4.6s 0.3s ease-in-out infinite;
}
.inh-story .jn-crew {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 62px;
  padding: 8px 22px 8px 12px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid #e3edfb;
  box-shadow: 0 4px 0 #e3edfb;
  color: #102b68;
  text-decoration: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.inh-story .jn-crew:hover,
.inh-story .jn-crew:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 7px 0 #e3edfb;
  outline: none;
}
.inh-story .jn-crew__faces { display: flex; }
.inh-story .jn-crew__faces img {
  width: 46px;
  height: 46px;
  margin-left: -12px;
  border: 3px solid #fff;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 2px 6px rgba(16, 43, 104, 0.18);
  transition: transform 0.2s ease;
}
.inh-story .jn-crew__faces img:first-child { margin-left: 0; }
.inh-story .jn-crew:hover .jn-crew__faces img:nth-child(odd) { transform: translateY(-4px); }
.inh-story .jn-crew:hover .jn-crew__faces img:nth-child(even) { transform: translateY(2px); }
.inh-story .jn-crew__names {
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
}
.inh-story .jn-crew__names i { margin: 0 7px; font-style: normal; color: #f5b800; }
.inh-story .jn-begin__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 68px;
  align-items: center;
}
.inh-story .jn-begin__text { min-width: 0; }
.inh-story .jn-steps {
  display: grid;
  gap: 14px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}
.inh-story .jn-step {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 14px 24px 14px 14px;
  border-radius: 22px;
  background: #fff;
  border: 2px solid #e3edfb;
  box-shadow: 0 4px 0 #e3edfb;
}
.inh-story .jn-step p {
  margin: 0;
  font-size: 16.5px;
  line-height: 1.7;
  color: #4f6180;
}
.inh-story .jn-step__img {
  display: block;
  width: 84px;
  height: 84px;
  object-fit: contain;
  filter: drop-shadow(0 6px 8px rgba(16, 43, 104, 0.12));
}
.inh-story .jn-quote {
  position: relative;
  margin: 24px 0 0 22px;
  padding: 22px 28px 22px 72px;
  border-radius: 26px;
  background: linear-gradient(135deg, #1597ed 0%, #0d6fbd 100%);
  box-shadow: 0 16px 34px rgba(13, 111, 189, 0.3);
  color: #fff;
  rotate: -1deg;
}
.inh-story .jn-quote i {
  position: absolute;
  left: 24px;
  top: 22px;
  font-size: 30px;
  color: #ffd84d;
}
.inh-story .jn-quote p {
  margin: 0;
  font-size: clamp(17px, 1.8vw, 20px);
  font-weight: 800;
  line-height: 1.45;
}
.inh-story .jn-surprise__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(0, 0.72fr);
  gap: 40px;
  align-items: center;
  padding: 56px 56px 48px;
  overflow: hidden;
  border-radius: 38px;
  background: linear-gradient(135deg, #1597ed 0%, #0d6fbd 100%);
  box-shadow: 0 30px 60px rgba(13, 111, 189, 0.3);
  color: #fff;
}
.inh-story .jn-surprise__ring {
  position: absolute;
  border-radius: 50%;
  border: 26px solid rgba(255, 255, 255, 0.08);
  pointer-events: none;
}
.inh-story .jn-surprise__ring--a { width: 300px; height: 300px; right: -90px; top: -110px; }
.inh-story .jn-surprise__ring--b { width: 200px; height: 200px; left: -70px; bottom: -90px; }
.inh-story .jn-surprise__body,
.inh-story .jn-surprise__side { position: relative; z-index: 1; min-width: 0; }
.inh-story .jn-surprise__title {
  margin: 20px 0 0;
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 900;
  line-height: 1.18;
  color: #fff;
  text-wrap: balance;
}
.inh-story .jn-surprise__text {
  margin: 18px 0 0;
  font-size: 18px;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.94);
}
.inh-story .jn-surprise__text strong {
  padding: 2px 12px;
  border-radius: 999px;
  background: #ffd84d;
  color: #102b68;
  font-weight: 800;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.inh-story .jn-surprise__text strong i { font-size: 0.85em; }
.inh-story .jn-surprise__side {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.inh-story .jn-speech {
  position: relative;
  margin: 0;
  padding: 24px 28px;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 16px 30px rgba(16, 43, 104, 0.25);
  text-align: center;
  font-size: clamp(17px, 1.8vw, 21px);
  font-weight: 900;
  line-height: 1.4;
  color: #102b68;
}
.inh-story .jn-speech::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -14px;
  margin-left: -14px;
  border: 14px solid transparent;
  border-bottom: 0;
  border-top-color: #fff;
}
.inh-story .jn-surprise__mascot {
  width: 210px;
  height: auto;
  margin-top: 18px;
  filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.22));
  animation: jn-bob 4.5s ease-in-out infinite;
}
.inh-story .jn-head { text-align: center; }
.inh-story .jn-head .jn-h2 { margin-top: 18px; }
.inh-story .jn-members {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 100px 22px;
  margin-top: 104px;
}
.inh-story .jn-member {
  --c: #bfe0fb;
  --t: #e6f3fe;
  grid-column: span 2;
  position: relative;
  padding: 0 24px 26px;
  border-radius: 30px;
  border: 2px solid var(--c);
  background: linear-gradient(180deg, var(--t) 0%, #fff 60%);
  box-shadow: 0 6px 0 var(--c);
  text-align: center;
  transition: transform 0.25s ease, rotate 0.25s ease;
}
.inh-story .jn-member:nth-child(4) { grid-column: 2 / span 2; }
.inh-story .jn-member:nth-child(5) { grid-column: 4 / span 2; }
.inh-story .jn-member:nth-child(odd) { rotate: -0.6deg; }
.inh-story .jn-member:nth-child(even) { rotate: 0.6deg; }
.inh-story .jn-member:hover { rotate: 0deg; transform: translateY(-8px); }
.inh-story .jn-member--pink { --c: #ffc9d6; --t: #fff0f3; }
.inh-story .jn-member--mint { --c: #b7ebc9; --t: #eafaf0; }
.inh-story .jn-member--butter { --c: #fde68a; --t: #fff8dc; }
.inh-story .jn-member--lav { --c: #dcd6ff; --t: #f3f1ff; }
.inh-story .jn-member__photo {
  width: 136px;
  height: 136px;
  margin: -68px auto 0;
  overflow: hidden;
  border-radius: 50%;
  border: 6px solid #fff;
  background: var(--c);
  box-shadow: 0 0 0 5px var(--c), 0 12px 22px rgba(16, 43, 104, 0.16);
}
.inh-story .jn-member__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inh-story .jn-member__name {
  display: inline-block;
  margin: 16px 0 0;
  padding: 0 8px;
  font-family: "Caveat", cursive;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.1;
  color: #0d6fbd;
  background-image: linear-gradient(transparent 62%, var(--c) 62%);
}
.inh-story .jn-member__quote {
  margin: 12px 0 0;
  font-size: 15.5px;
  line-height: 1.65;
  color: #4f6180;
}
.inh-story .jn-member__tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}
.inh-story .jn-member__tags li {
  padding: 5px 12px;
  border-radius: 999px;
  border: 2px solid var(--c);
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  color: #102b68;
}
.inh-story .jn-dots { display: none; }
.inh-story .jn-signoff {
  display: flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  max-width: 100%;
  margin: 70px auto 0;
  padding: 14px 28px;
  border-radius: 999px;
  background: #ffd84d;
  box-shadow: 0 12px 26px rgba(255, 216, 77, 0.5);
  font-size: clamp(17px, 2.2vw, 22px);
  font-weight: 900;
  color: #102b68;
}
.inh-story .jn-signoff i {
  color: #ff5c7a;
  animation: jn-beat 1.8s ease-in-out infinite;
}
.inh-story .jn-closing { text-align: center; }
.inh-story .jn-closing__title {
  max-width: 980px;
  margin: 0 auto;
  font-size: clamp(30px, 4.3vw, 52px);
  font-weight: 900;
  line-height: 1.18;
  color: #102b68;
  text-wrap: balance;
}
.inh-story .jn-closing__lead {
  max-width: 660px;
  margin: 24px auto 0;
  font-size: clamp(17px, 1.9vw, 20px);
  font-weight: 600;
  line-height: 1.75;
  color: #4f6180;
}
.inh-story .jn-photo--wide {
  max-width: 640px;
  margin: 58px auto 0;
  rotate: 1.2deg;
}
.inh-story .jn-closing__mascot {
  position: absolute;
  right: -52px;
  bottom: -38px;
  z-index: 3;
  width: 140px;
  height: auto;
  filter: drop-shadow(0 10px 14px rgba(16, 43, 104, 0.25));
  animation: jn-bob 4.2s ease-in-out infinite;
}
.inh-story .jn-trail { margin-top: 56px; }
.inh-story .jn-tabs {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.inh-story .jn-tab {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 5px 22px 5px 7px;
  border-radius: 999px;
  border: 2px solid #d3e4fb;
  background: #fff;
  box-shadow: 0 4px 0 #d3e4fb;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #102b68;
  cursor: pointer;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.inh-story .jn-tab:hover { transform: translateY(-2px); }
.inh-story .jn-tab.is-on {
  background: #ffd84d;
  border-color: #f1c21b;
  box-shadow: 0 4px 0 #f1c21b;
}
.inh-story .jn-tab__ico {
  display: block;
  width: 46px;
  height: 46px;
  object-fit: contain;
}
.inh-story .jn-rail-wrap { position: relative; margin-top: 18px; }
.inh-story .jn-rail {
  --h: 300px;
  display: flex;
  align-items: center;
  gap: 24px;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  padding: 34px max(20px, calc(50vw - 560px)) 46px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scroll-padding-inline: max(20px, calc(50vw - 560px));
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  cursor: grab;
  position: relative;
}
.inh-story .jn-rail::-webkit-scrollbar { display: none; }
.inh-story .jn-rail.is-few { --h: 380px; }
.inh-story .jn-rail::before,
.inh-story .jn-rail::after { content: ""; flex: 0 0 0; margin: 0 auto; }
.inh-story .jn-shot[hidden] { display: none; }
.inh-story .jn-rail.is-swap .jn-shot { animation: jn-pop 0.45s cubic-bezier(0.22, 1, 0.36, 1) both; }
.inh-story .jn-rail.is-swap .jn-shot[data-n="2"] { animation-delay: 0.06s; }
.inh-story .jn-rail.is-swap .jn-shot[data-n="3"] { animation-delay: 0.12s; }
.inh-story .jn-rail.is-swap .jn-shot[data-n="4"] { animation-delay: 0.18s; }
@keyframes jn-pop {
  from { opacity: 0; translate: 0 18px; scale: 0.94; }
  to { opacity: 1; translate: 0 0; scale: 1; }
}
.inh-story .jn-rail.is-drag { cursor: grabbing; scroll-snap-type: none; }
.inh-story .jn-rail.is-drag .jn-shot { pointer-events: none; }
.inh-story .jn-shot {
  position: relative;
  flex: 0 0 auto;
  width: min(calc(var(--ar) * var(--h)), 84vw);
  margin: 0;
  padding: 8px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 30px rgba(16, 43, 104, 0.14);
  scroll-snap-align: center;
  transition: transform 0.25s ease, rotate 0.25s ease, box-shadow 0.25s ease;
}
.inh-story .jn-shot img {
  display: block;
  width: 100%;
  aspect-ratio: var(--ar);
  object-fit: cover;
  border-radius: 4px;
  -webkit-user-drag: none;
  user-select: none;
}
.inh-story .jn-shot__cap {
  margin: 8px 2px 2px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  font-weight: 700;
  font-style: italic;
  line-height: 1.2;
  text-align: center;
  color: #102b68;
}
.inh-story .jn-shot[data-n="1"],
.inh-story .jn-shot[data-n="3"] { rotate: -1.4deg; }
.inh-story .jn-shot[data-n="2"],
.inh-story .jn-shot[data-n="4"] { rotate: 1.2deg; }
.inh-story .jn-shot[data-n="3"] { rotate: 0.5deg; }
.inh-story .jn-shot[data-n="1"]::before,
.inh-story .jn-shot[data-n="4"]::before {
  content: "";
  position: absolute;
  top: -11px;
  left: 50%;
  z-index: 2;
  width: 70px;
  height: 22px;
  margin-left: -35px;
  background: rgba(255, 216, 77, 0.8);
  box-shadow: 0 2px 4px rgba(16, 43, 104, 0.1);
  transform: rotate(-4deg);
}
.inh-story .jn-shot:hover {
  z-index: 3;
  rotate: 0deg;
  transform: scale(1.04);
  box-shadow: 0 22px 40px rgba(16, 43, 104, 0.22);
}
.inh-story .jn-rail-nav.is-off { visibility: hidden; }
.inh-story .jn-rail-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 4px;
}
.inh-story .jn-arrow {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 50%;
  border: 2px solid #d3e4fb;
  background: #fff;
  box-shadow: 0 4px 0 #d3e4fb;
  font-size: 16px;
  color: #102b68;
  cursor: pointer;
  transition: transform 0.2s ease, background 0.2s ease, opacity 0.2s ease;
}
.inh-story .jn-arrow:hover { transform: translateY(-2px); background: #ffd84d; }
.inh-story .jn-arrow:disabled { opacity: 0.35; pointer-events: none; }
.inh-story .jn-progress {
  width: min(240px, 46vw);
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #cfe0f7;
}
.inh-story .jn-progress i {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 999px;
  background: #1597ed;
  transform-origin: left center;
  transform: scaleX(0.2);
  transition: transform 0.15s linear;
}
.inh-story .jn-closing__clap {
  position: absolute;
  left: -64px;
  top: -52px;
  z-index: 3;
  width: 124px;
  height: auto;
  rotate: -8deg;
  filter: drop-shadow(0 10px 14px rgba(16, 43, 104, 0.25));
  animation: jn-bob 4.8s 0.4s ease-in-out infinite;
}
@media (max-width: 991px) {
.inh-story .jn-sticker--yellow { right: 10px; }
.inh-story .jn-sticker--blue { left: 10px; }
.inh-story .jn-hero__hands { left: 6px; top: -54px; }
.inh-story .jn-hero__mascot { right: 4px; }
.inh-story .jn-begin__grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
.inh-story .jn-photo { max-width: 500px; }
.inh-story .jn-surprise__card {
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
    padding: 44px 34px;
  }
.inh-story .jn-members {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 96px 20px;
  }
.inh-story .jn-member,
.inh-story .jn-member:nth-child(4),
.inh-story .jn-member:nth-child(5) { grid-column: auto; }
.inh-story .jn-member:nth-child(5) {
    grid-column: 1 / -1;
    justify-self: center;
    width: calc(50% - 10px);
  }

}
@media (max-width: 767px) {
.inh-story .jn-hero { padding: 44px 0 60px; }
.inh-story .jn-hero__stage { margin-top: 46px; }
.inh-story .jn-hero__photo { border-width: 4px; border-radius: 22px; }
.inh-story .jn-hero__photo img { border-radius: 18px; }
.inh-story .jn-sticker { max-width: 58%; padding: 8px 13px; font-size: 18px; border-radius: 14px; }
.inh-story .jn-sticker--yellow { right: 4px; top: -36px; }
.inh-story .jn-sticker--blue { left: 4px; bottom: -22px; }
.inh-story .jn-hero__mascot { right: -2px; bottom: -34px; width: 64px; }
.inh-story .jn-hero__hands { left: -6px; top: -46px; width: 72px; }
.inh-story .jn-crew {
    flex-direction: column;
    gap: 8px;
    margin-top: 52px;
    padding: 12px 22px 12px;
    border-radius: 26px;
  }
.inh-story .jn-crew__names { font-size: 14px; }
.inh-story .jn-step { grid-template-columns: 66px minmax(0, 1fr); gap: 12px; padding: 12px 16px 12px 10px; }
.inh-story .jn-step__img { width: 66px; height: 66px; }
.inh-story .jn-step p { font-size: 15.5px; line-height: 1.65; }
.inh-story .jn-quote { margin-left: 8px; padding: 18px 20px 18px 58px; }
.inh-story .jn-quote i { left: 18px; top: 18px; font-size: 24px; }
.inh-story .jn-photo figcaption { font-size: 22px; }
.inh-story .jn-surprise__card { padding: 34px 22px 30px; border-radius: 28px; gap: 28px; }
.inh-story .jn-surprise__text { font-size: 16.5px; }
.inh-story .jn-speech { padding: 18px 20px; }
.inh-story .jn-surprise__mascot { width: 160px; margin-top: 14px; }
.inh-story .jn-members {
    display: flex;
    gap: 16px;
    margin: 0 -20px;
    padding: 96px 20px 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 20px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
.inh-story .jn-members::-webkit-scrollbar { display: none; }
.inh-story .jn-member,
.inh-story .jn-member:nth-child(5) {
    flex: 0 0 82%;
    width: auto;
    scroll-snap-align: center;
    rotate: none;
  }
.inh-story .jn-member:hover { transform: none; }
.inh-story .jn-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
  }
.inh-story .jn-dots span {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #cfe0f7;
    transition: width 0.25s ease, background 0.25s ease;
  }
.inh-story .jn-dots span.is-on { width: 26px; background: #1597ed; }
.inh-story .jn-signoff { margin-top: 44px; padding: 12px 22px; }
.inh-story .jn-rail.is-few { --h: 270px; }
.inh-story .jn-rail { --h: 220px; gap: 16px; padding-top: 30px; padding-bottom: 38px; }
.inh-story .jn-tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 10px;
    margin: 0 -20px;
    padding: 4px 20px 10px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 20px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
.inh-story .jn-tabs::-webkit-scrollbar { display: none; }
.inh-story .jn-tab { flex: 0 0 auto; font-size: 12px; padding-right: 16px; white-space: nowrap; scroll-snap-align: start; }
.inh-story .jn-tab__ico { width: 38px; height: 38px; }
.inh-story .jn-shot__cap { font-size: 13px; margin-top: 6px; }
.inh-story .jn-arrow { width: 44px; height: 44px; }
.inh-story .jn-photo--wide { margin-top: 46px; }
.inh-story .jn-closing__mascot { right: -10px; bottom: -64px; width: 96px; }
.inh-story .jn-photo--wide figcaption { font-size: 20px; padding-right: 26px; }
.inh-story .jn-photo--wide { margin-bottom: 26px; }
.inh-story .jn-closing__cta { margin-top: 44px; }

}
@media (max-width: 360px) {
.inh-story .jn-members { margin: 0 -16px; padding-left: 16px; padding-right: 16px; scroll-padding-inline: 16px; }
.inh-story .jn-sticker { font-size: 17px; }

}
@media (prefers-reduced-motion: reduce) {
.inh-story .jn-sticker,
.inh-story .jn-hero__mascot,
.inh-story .jn-hero__hands,
.inh-story .jn-surprise__mascot,
.inh-story .jn-closing__mascot,
.inh-story .jn-closing__clap,
.inh-story .jn-hero__hands,
.inh-story .jn-signoff i,
.inh-story .jn-marker { animation: none; }
.inh-story .jn-member,
.inh-story .jn-shot,
.inh-story .jn-crew,
.inh-story .jn-crew__faces img { transition: none; }

}


